Subject: [PATCH] Built motion from commit a9fb64cc6defd8fb3a5cc199221f878e91c0e969. Version 3.0.0-alpha

From: Vito Macchia <[email-masked]>
Date: Tue, 10 Nov 2020 18:00:50 +0100

---
 apidoc/api_project.js                              |    2 +-
 apidoc/api_project.json                            |    2 +-
 package.json                                       |    6 +-
 public/18-391b2e065f03d1ffb431.js                  |    2 +-
 public/app-0f22f03a610f164a4a25.js                 |   21 -
 public/app-0f22f03a610f164a4a25.js.map             |    1 -
 public/app-7dc16afb7a5557c9968d.js                 |   21 +
 public/app-7dc16afb7a5557c9968d.js.map             |    1 +
 public/index.html                                  |    2 +-
 public/runtime-472ac7a6568b98562237.js             |    2 +-
 public/service-worker.js                           |    2 +-
 public/service-worker.js.map                       |    2 +-
 .../hotdesk/dialog.html/dialog-[chunkhash].html    |   39 -
 .../auth/services/hotdesk/dialog.html/dialog.html  |   39 +
 .../dialog.html/dialog-[chunkhash].html            |   71 -
 .../advanced-search/dialog.html/dialog.html        |   71 +
 .../ms-advanced-search-[chunkhash].html            |  320 --
 .../ms-advanced-search.html                        |  320 ++
 .../ms-click-to-call-[chunkhash].html              |   62 -
 .../ms-click-to-call.html/ms-click-to-call.html    |   62 +
 .../ms-dual-multiselect-[chunkhash].html           |  111 -
 .../ms-dual-multiselect.html                       |  111 +
 .../ms-font-family-[chunkhash].html                |    5 -
 .../ms-font-family.html/ms-font-family.html        |    5 +
 .../ms-info-bar.html/ms-info-bar-[chunkhash].html  |   11 -
 .../ms-info-bar/ms-info-bar.html/ms-info-bar.html  |   11 +
 .../ms-material-color-picker-[chunkhash].html      |   86 -
 .../ms-material-color-picker.html                  |   86 +
 .../horizontal.html/horizontal-[chunkhash].html    |   50 -
 .../templates/horizontal.html/horizontal.html      |   50 +
 .../vertical.html/vertical-[chunkhash].html        |   37 -
 .../templates/vertical.html/vertical.html          |   37 +
 .../ms-phonebar.html/ms-phonebar-[chunkhash].html  |   15 -
 .../ms-phonebar/ms-phonebar.html/ms-phonebar.html  |   15 +
 .../prefix/dialog.html/dialog-[chunkhash].html     |   59 -
 .../ms-phonebar/prefix/dialog.html/dialog.html     |   59 +
 .../record/dialog.html/dialog-[chunkhash].html     |   83 -
 .../ms-phonebar/record/dialog.html/dialog.html     |   83 +
 .../dialog.html/dialog-[chunkhash].html            |   58 -
 .../referAttended/dialog.html/dialog.html          |   58 +
 .../settings.html/settings-[chunkhash].html        |  270 --
 .../settings/settings.html/settings.html           |  270 ++
 .../ms-quick-filter-[chunkhash].html               |   93 -
 .../ms-quick-filter.html/ms-quick-filter.html      |   93 +
 .../ms-search-bar-[chunkhash].html                 |   74 -
 .../ms-search-bar.html/ms-search-bar.html          |   74 +
 .../ms-shortcuts-[chunkhash].html                  |  119 -
 .../ms-shortcuts.html/ms-shortcuts.html            |  119 +
 .../horizontal.html/horizontal-[chunkhash].html    |   88 -
 .../horizontal/horizontal.html/horizontal.html     |   88 +
 .../vertical-step-[chunkhash].html                 |   71 -
 .../step/vertical-step.html/vertical-step.html     |   71 +
 .../vertical.html/vertical-[chunkhash].html        |    4 -
 .../templates/vertical/vertical.html/vertical.html |    4 +
 .../ms-tab-scroll-[chunkhash].html                 |   25 -
 .../ms-tab-scroll.html/ms-tab-scroll.html          |   25 +
 .../ms-timezone.html/ms-timezone-[chunkhash].html  |    6 -
 .../ms-timezone/ms-timezone.html/ms-timezone.html  |    6 +
 .../ms-widget-engine-[chunkhash].html              |   98 -
 .../ms-widget-engine.html/ms-widget-engine.html    |   98 +
 .../content-only-[chunkhash].html                  |    8 -
 .../layouts/content-only.html/content-only.html    |    8 +
 .../content-with-toolbar-[chunkhash].html          |   26 -
 .../content-with-toolbar.html                      |   26 +
 .../horizontal-navigation-[chunkhash].html         |   44 -
 .../horizontal-navigation.html                     |   44 +
 ...navigation-fullwidth-toolbar-2-[chunkhash].html |   41 -
 .../vertical-navigation-fullwidth-toolbar-2.html   |   41 +
 ...l-navigation-fullwidth-toolbar-[chunkhash].html |   41 -
 .../vertical-navigation-fullwidth-toolbar.html     |   41 +
 .../vertical-navigation-[chunkhash].html           |   39 -
 .../vertical-navigation.html                       |   39 +
 .../theme-options-[chunkhash].html                 |   76 -
 .../theme-options.html/theme-options.html          |   76 +
 .../404/error-404.html/error-404-[chunkhash].html  |   27 -
 .../errors/404/error-404.html/error-404.html       |   27 +
 .../500/error-500.html/error-500-[chunkhash].html  |   54 -
 .../errors/500/error-500.html/error-500.html       |   54 +
 .../footer.html/footer-[chunkhash].html            |   15 -
 .../vertical-navigation/footer.html/footer.html    |   15 +
 .../forgot/forgot.html/forgot-[chunkhash].html     |   74 -
 .../src/js/modules/forgot/forgot.html/forgot.html  |   74 +
 .../header.html/header-[chunkhash].html            |    8 -
 .../vertical-navigation/header.html/header.html    |    8 +
 .../login/login.html/login-[chunkhash].html        |  115 -
 public/src/js/modules/login/login.html/login.html  |  115 +
 .../create/dialog.html/dialog-[chunkhash].html     |  155 -
 .../create/dialog.html/dialog.html                 |  155 +
 .../extractedReports-[chunkhash].html              |  363 --
 .../extractedReports.html/extractedReports.html    |  363 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  295 --
 .../views/metrics/create/dialog.html/dialog.html   |  295 ++
 .../metrics/metrics.html/metrics-[chunkhash].html  |  309 --
 .../views/metrics/metrics.html/metrics.html        |  309 ++
 .../copy/dialog.html/dialog-[chunkhash].html       |  102 -
 .../views/reports/copy/dialog.html/dialog.html     |  102 +
 .../create/dialog.html/dialog-[chunkhash].html     |  250 --
 .../views/reports/create/dialog.html/dialog.html   |  250 ++
 .../edit/field/dialog.html/dialog-[chunkhash].html |  278 --
 .../reports/edit/field/dialog.html/dialog.html     |  278 ++
 .../reports/edit/view.html/view-[chunkhash].html   |  488 ---
 .../views/reports/edit/view.html/view.html         |  488 +++
 .../preview/dialog.html/dialog-[chunkhash].html    |  127 -
 .../views/reports/preview/dialog.html/dialog.html  |  127 +
 .../reports/reports.html/reports-[chunkhash].html  |  344 --
 .../views/reports/reports.html/reports.html        |  344 ++
 .../run/dialog.html/dialog-[chunkhash].html        |  254 --
 .../views/reports/run/dialog.html/dialog.html      |  254 ++
 .../run/web/dialog.html/dialog-[chunkhash].html    |  132 -
 .../views/reports/run/web/dialog.html/dialog.html  |  132 +
 .../create/dialog.html/dialog-[chunkhash].html     |  172 -
 .../views/odbcs/create/dialog.html/dialog.html     |  172 +
 .../views/odbcs/odbcs.html/odbcs-[chunkhash].html  |  314 --
 .../callysquare/views/odbcs/odbcs.html/odbcs.html  |  314 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  163 -
 .../views/projects/create/dialog.html/dialog.html  |  163 +
 .../dialog/dialog.html/dialog-[chunkhash].html     |  266 --
 .../projects/edit/dialog/dialog.html/dialog.html   |  266 ++
 .../edit/edit/edit.html/edit-[chunkhash].html      |   86 -
 .../views/projects/edit/edit/edit.html/edit.html   |   86 +
 .../import/import.html/import-[chunkhash].html     |  104 -
 .../projects/edit/import/import.html/import.html   |  104 +
 .../edit/info/info.html/info-[chunkhash].html      |   91 -
 .../views/projects/edit/info/info.html/info.html   |   91 +
 .../edit/open/open.html/open-[chunkhash].html      |  105 -
 .../views/projects/edit/open/open.html/open.html   |  105 +
 .../saveAs/saveAs.html/saveAs-[chunkhash].html     |  101 -
 .../projects/edit/saveAs/saveAs.html/saveAs.html   |  101 +
 .../projects/edit/view.html/view-[chunkhash].html  |   55 -
 .../views/projects/edit/view.html/view.html        |   55 +
 .../projects.html/projects-[chunkhash].html        |  289 --
 .../views/projects/projects.html/projects.html     |  289 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  134 -
 .../create/dialog.html/dialog.html                 |  134 +
 .../squareRecordings-[chunkhash].html              |  332 --
 .../squareRecordings.html/squareRecordings.html    |  332 ++
 .../chatQueues.html/chatQueues-[chunkhash].html    |  332 --
 .../chatQueues/chatQueues.html/chatQueues.html     |  332 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  217 -
 .../chatQueues/create/dialog.html/dialog.html      |  217 +
 .../agentadd.html/agentadd-[chunkhash].html        |   44 -
 .../edit/agentadd/agentadd.html/agentadd.html      |   44 +
 .../teamadd/teamadd.html/teamadd-[chunkhash].html  |   44 -
 .../edit/teamadd/teamadd.html/teamadd.html         |   44 +
 .../edit/view.html/view-[chunkhash].html           |  218 -
 .../chat/views/chatQueues/edit/view.html/view.html |  218 +
 .../chatWebsites-[chunkhash].html                  |  364 --
 .../chatWebsites.html/chatWebsites.html            |  364 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  297 --
 .../chatWebsites/create/dialog.html/dialog.html    |  297 ++
 .../agentadd.html/agentadd-[chunkhash].html        |   44 -
 .../edit/agentadd/agentadd.html/agentadd.html      |   44 +
 .../apps/agent/dialog.html/dialog-[chunkhash].html |  148 -
 .../edit/apps/agent/dialog.html/dialog.html        |  148 +
 .../amazonlex/dialog.html/dialog-[chunkhash].html  |  202 -
 .../edit/apps/amazonlex/dialog.html/dialog.html    |  202 +
 .../autoreply/dialog.html/dialog-[chunkhash].html  |  123 -
 .../edit/apps/autoreply/dialog.html/dialog.html    |  123 +
 .../apps/close/dialog.html/dialog-[chunkhash].html |  106 -
 .../edit/apps/close/dialog.html/dialog.html        |  106 +
 .../dialogflow/dialog.html/dialog-[chunkhash].html |  172 -
 .../edit/apps/dialogflow/dialog.html/dialog.html   |  172 +
 .../gotoif/dialog.html/dialog-[chunkhash].html     |  166 -
 .../edit/apps/gotoif/dialog.html/dialog.html       |  166 +
 .../apps/gotop/dialog.html/dialog-[chunkhash].html |  114 -
 .../edit/apps/gotop/dialog.html/dialog.html        |  114 +
 .../interval/dialog.html/dialog-[chunkhash].html   |  313 --
 .../edit/apps/interval/dialog.html/dialog.html     |  313 ++
 .../apps/noop/dialog.html/dialog-[chunkhash].html  |  105 -
 .../edit/apps/noop/dialog.html/dialog.html         |  105 +
 .../apps/queue/dialog.html/dialog-[chunkhash].html |  148 -
 .../edit/apps/queue/dialog.html/dialog.html        |  148 +
 .../system/dialog.html/dialog-[chunkhash].html     |  133 -
 .../edit/apps/system/dialog.html/dialog.html       |  133 +
 .../apps/tag/dialog.html/dialog-[chunkhash].html   |  111 -
 .../edit/apps/tag/dialog.html/dialog.html          |  111 +
 .../dialog.html/dialog-[chunkhash].html            |  173 -
 .../edit/chatCannedAnswers/dialog.html/dialog.html |  173 +
 .../dialog.html/dialog-[chunkhash].html            |   18 -
 .../edit/offlineMessages/dialog.html/dialog.html   |   18 +
 .../proactive/dialog.html/dialog-[chunkhash].html  |  214 -
 .../edit/proactive/dialog.html/dialog.html         |  214 +
 .../edit/view.html/view-[chunkhash].html           | 4540 --------------------
 .../views/chatWebsites/edit/view.html/view.html    | 4540 ++++++++++++++++++++
 .../agents/view.html/view-[chunkhash].html         |  517 ---
 .../chat/views/realtime/agents/view.html/view.html |  517 +++
 .../queues/view.html/view-[chunkhash].html         |  110 -
 .../chat/views/realtime/queues/view.html/view.html |  110 +
 .../realtime.html/realtime-[chunkhash].html        |   26 -
 .../views/realtime/realtime.html/realtime.html     |   26 +
 .../companies.html/companies-[chunkhash].html      |  310 --
 .../views/companies/companies.html/companies.html  |  310 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  303 --
 .../views/companies/create/dialog.html/dialog.html |  303 ++
 .../companies/edit/view.html/view-[chunkhash].html |  540 ---
 .../views/companies/edit/view.html/view.html       |  540 +++
 .../contacts.html/contacts-[chunkhash].html        |  475 --
 .../views/contacts/contacts.html/contacts.html     |  475 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  335 --
 .../views/contacts/create/dialog.html/dialog.html  |  335 ++
 .../duplicate/dialog.html/dialog-[chunkhash].html  |  103 -
 .../contacts/duplicate/dialog.html/dialog.html     |  103 +
 .../contacts/edit/view.html/view-[chunkhash].html  | 1114 -----
 .../views/contacts/edit/view.html/view.html        | 1114 +++++
 .../import/import.html/import-[chunkhash].html     |  343 --
 .../views/contacts/import/import.html/import.html  |  343 ++
 .../merge/dialog.html/dialog-[chunkhash].html      |   97 -
 .../views/contacts/merge/dialog.html/dialog.html   |   97 +
 .../create/dialog.html/dialog-[chunkhash].html     |  274 --
 .../create/dialog.html/dialog.html                 |  274 ++
 .../globalCustomFields-[chunkhash].html            |  317 --
 .../globalCustomFields.html                        |  317 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  150 -
 .../views/lists/create/dialog.html/dialog.html     |  150 +
 .../agentadd.html/agentadd-[chunkhash].html        |   40 -
 .../edit/agentadd/agentadd.html/agentadd.html      |   40 +
 .../dialog.html/dialog-[chunkhash].html            |  269 --
 .../edit/customFields/dialog.html/dialog.html      |  269 ++
 .../lists/edit/view.html/view-[chunkhash].html     |  628 ---
 .../views/lists/edit/view.html/view.html           |  628 +++
 .../views/lists/lists.html/lists-[chunkhash].html  |  330 --
 .../views/lists/lists.html/lists.html              |  330 ++
 .../custom/custom.html/custom-[chunkhash].html     |   44 -
 .../views/custom/custom.html/custom.html           |   44 +
 .../agent.general-[chunkhash].html                 |  139 -
 .../agent/agent.general.html/agent.general.html    |  139 +
 .../dispose/dialog.html/dialog-[chunkhash].html    |  285 --
 .../agent/contact/dispose/dialog.html/dialog.html  |  285 ++
 .../selection/dialog.html/dialog-[chunkhash].html  |  122 -
 .../contact/selection/dialog.html/dialog.html      |  122 +
 .../dispose/dialog.html/dialog-[chunkhash].html    |  157 -
 .../home/abandoned/dispose/dialog.html/dialog.html |  157 +
 .../details/dialog.html/dialog-[chunkhash].html    |  140 -
 .../home/voice/details/dialog.html/dialog.html     |  140 +
 ...ent.general.interaction.dialog-[chunkhash].html |    7 -
 .../agent.general.interaction.dialog.html          |    7 +
 .../composeFax/dialog.html/dialog-[chunkhash].html |  110 -
 .../interaction/composeFax/dialog.html/dialog.html |  110 +
 .../dialog.html/dialog-[chunkhash].html            |  348 --
 .../composeMail/dialog.html/dialog.html            |  348 ++
 .../dialog.html/dialog-[chunkhash].html            |  140 -
 .../composeOpenchannel/dialog.html/dialog.html     |  140 +
 .../composeSms/dialog.html/dialog-[chunkhash].html |  138 -
 .../interaction/composeSms/dialog.html/dialog.html |  138 +
 .../dialog.html/dialog-[chunkhash].html            |  140 -
 .../composeWhatsapp/dialog.html/dialog.html        |  140 +
 .../dispose/dialog.html/dialog-[chunkhash].html    |  233 -
 .../interaction/dispose/dialog.html/dialog.html    |  233 +
 .../tag/dialog.html/dialog-[chunkhash].html        |  104 -
 .../agent/interaction/tag/dialog.html/dialog.html  |  104 +
 .../transfer/dialog.html/dialog-[chunkhash].html   |  146 -
 .../interaction/transfer/dialog.html/dialog.html   |  146 +
 .../user.general.chat-[chunkhash].html             |  642 ---
 .../user.general.chat.html/user.general.chat.html  |  642 +++
 .../user.general.dialer-[chunkhash].html           |  802 ----
 .../user.general.dialer.html                       |  802 ++++
 .../user.general.fax-[chunkhash].html              |  517 ---
 .../user.general.fax.html/user.general.fax.html    |  517 +++
 .../user.general.mail-[chunkhash].html             |  517 ---
 .../user.general.mail.html/user.general.mail.html  |  517 +++
 .../user.general.openchannel-[chunkhash].html      |  517 ---
 .../user.general.openchannel.html                  |  517 +++
 .../user.general.sms-[chunkhash].html              |  517 ---
 .../user.general.sms.html/user.general.sms.html    |  517 +++
 .../user.general-[chunkhash].html                  |  100 -
 .../user/user.general.html/user.general.html       |  100 +
 .../user.general.whatsapp-[chunkhash].html         |  517 ---
 .../user.general.whatsapp.html                     |  517 +++
 .../create/dialog.html/dialog-[chunkhash].html     |  249 --
 .../faxAccounts/create/dialog.html/dialog.html     |  249 ++
 .../agentadd.html/agentadd-[chunkhash].html        |   44 -
 .../edit/agentadd/agentadd.html/agentadd.html      |   44 +
 .../apps/agent/dialog.html/dialog-[chunkhash].html |  148 -
 .../edit/apps/agent/dialog.html/dialog.html        |  148 +
 .../apps/close/dialog.html/dialog-[chunkhash].html |  106 -
 .../edit/apps/close/dialog.html/dialog.html        |  106 +
 .../gotoif/dialog.html/dialog-[chunkhash].html     |  166 -
 .../edit/apps/gotoif/dialog.html/dialog.html       |  166 +
 .../apps/gotop/dialog.html/dialog-[chunkhash].html |  114 -
 .../edit/apps/gotop/dialog.html/dialog.html        |  114 +
 .../interval/dialog.html/dialog-[chunkhash].html   |  313 --
 .../edit/apps/interval/dialog.html/dialog.html     |  313 ++
 .../apps/noop/dialog.html/dialog-[chunkhash].html  |  105 -
 .../edit/apps/noop/dialog.html/dialog.html         |  105 +
 .../apps/queue/dialog.html/dialog-[chunkhash].html |  148 -
 .../edit/apps/queue/dialog.html/dialog.html        |  148 +
 .../system/dialog.html/dialog-[chunkhash].html     |  133 -
 .../edit/apps/system/dialog.html/dialog.html       |  133 +
 .../apps/tag/dialog.html/dialog-[chunkhash].html   |  111 -
 .../edit/apps/tag/dialog.html/dialog.html          |  111 +
 .../edit/view.html/view-[chunkhash].html           | 1634 -------
 .../fax/views/faxAccounts/edit/view.html/view.html | 1634 +++++++
 .../faxAccounts.html/faxAccounts-[chunkhash].html  |  361 --
 .../faxAccounts/faxAccounts.html/faxAccounts.html  |  361 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  217 -
 .../views/faxQueues/create/dialog.html/dialog.html |  217 +
 .../agentadd.html/agentadd-[chunkhash].html        |   40 -
 .../edit/agentadd/agentadd.html/agentadd.html      |   40 +
 .../teamadd/teamadd.html/teamadd-[chunkhash].html  |   40 -
 .../edit/teamadd/teamadd.html/teamadd.html         |   40 +
 .../faxQueues/edit/view.html/view-[chunkhash].html |  214 -
 .../fax/views/faxQueues/edit/view.html/view.html   |  214 +
 .../faxQueues.html/faxQueues-[chunkhash].html      |  332 --
 .../views/faxQueues/faxQueues.html/faxQueues.html  |  332 ++
 .../accounts/view.html/view-[chunkhash].html       |  116 -
 .../views/realtime/accounts/view.html/view.html    |  116 +
 .../agents/view.html/view-[chunkhash].html         |  515 ---
 .../fax/views/realtime/agents/view.html/view.html  |  515 +++
 .../queues/view.html/view-[chunkhash].html         |  110 -
 .../fax/views/realtime/queues/view.html/view.html  |  110 +
 .../realtime.html/realtime-[chunkhash].html        |   36 -
 .../fax/views/realtime/realtime.html/realtime.html |   36 +
 .../trunks/view.html/view-[chunkhash].html         |  111 -
 .../fax/views/realtime/trunks/view.html/view.html  |  111 +
 .../views/about/about.html/about-[chunkhash].html  |  190 -
 .../apps/help/views/about/about.html/about.html    |  190 +
 .../create/dialog.html/dialog-[chunkhash].html     |  306 --
 .../deskAccounts/create/dialog.html/dialog.html    |  306 ++
 .../deskAccounts-[chunkhash].html                  |  320 --
 .../deskAccounts.html/deskAccounts.html            |  320 ++
 .../dialog.html/dialog-[chunkhash].html            |  180 -
 .../edit/configurations/dialog.html/dialog.html    |  180 +
 .../edit/item/dialog.html/dialog-[chunkhash].html  |  478 --
 .../deskAccounts/edit/item/dialog.html/dialog.html |  478 ++
 .../edit/view.html/view-[chunkhash].html           | 1003 -----
 .../views/deskAccounts/edit/view.html/view.html    | 1003 +++++
 .../create/dialog.html/dialog-[chunkhash].html     |  329 --
 .../create/dialog.html/dialog.html                 |  329 ++
 .../dynamics365Accounts-[chunkhash].html           |  325 --
 .../dynamics365Accounts.html                       |  325 ++
 .../dialog.html/dialog-[chunkhash].html            |  214 -
 .../edit/configurations/dialog.html/dialog.html    |  214 +
 .../edit/item/dialog.html/dialog-[chunkhash].html  |  478 --
 .../edit/item/dialog.html/dialog.html              |  478 ++
 .../edit/view.html/view-[chunkhash].html           |  993 -----
 .../dynamics365Accounts/edit/view.html/view.html   |  993 +++++
 .../create/dialog.html/dialog-[chunkhash].html     |  254 --
 .../create/dialog.html/dialog.html                 |  254 ++
 .../dialog.html/dialog-[chunkhash].html            |  187 -
 .../edit/configurations/dialog.html/dialog.html    |  187 +
 .../edit/item/dialog.html/dialog-[chunkhash].html  |  478 --
 .../edit/item/dialog.html/dialog.html              |  478 ++
 .../edit/view.html/view-[chunkhash].html           |  943 ----
 .../freshdeskAccounts/edit/view.html/view.html     |  943 ++++
 .../freshdeskAccounts-[chunkhash].html             |  323 --
 .../freshdeskAccounts.html/freshdeskAccounts.html  |  323 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  254 --
 .../create/dialog.html/dialog.html                 |  254 ++
 .../dialog.html/dialog-[chunkhash].html            |  187 -
 .../edit/configurations/dialog.html/dialog.html    |  187 +
 .../edit/item/dialog.html/dialog-[chunkhash].html  |  478 --
 .../edit/item/dialog.html/dialog.html              |  478 ++
 .../edit/view.html/view-[chunkhash].html           |  729 ----
 .../freshsalesAccounts/edit/view.html/view.html    |  729 ++++
 .../freshsalesAccounts-[chunkhash].html            |  323 --
 .../freshsalesAccounts.html                        |  323 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  349 --
 .../create/dialog.html/dialog.html                 |  349 ++
 .../dialog.html/dialog-[chunkhash].html            |  214 -
 .../edit/configurations/dialog.html/dialog.html    |  214 +
 .../edit/item/dialog.html/dialog-[chunkhash].html  |  478 --
 .../edit/item/dialog.html/dialog.html              |  478 ++
 .../edit/view.html/view-[chunkhash].html           | 1059 -----
 .../salesforceAccounts/edit/view.html/view.html    | 1059 +++++
 .../salesforceAccounts-[chunkhash].html            |  323 --
 .../salesforceAccounts.html                        |  323 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  289 --
 .../create/dialog.html/dialog.html                 |  289 ++
 .../dialog.html/dialog-[chunkhash].html            |  187 -
 .../edit/configurations/dialog.html/dialog.html    |  187 +
 .../edit/item/dialog.html/dialog-[chunkhash].html  |  478 --
 .../edit/item/dialog.html/dialog.html              |  478 ++
 .../edit/view.html/view-[chunkhash].html           |  762 ----
 .../servicenowAccounts/edit/view.html/view.html    |  762 ++++
 .../servicenowAccounts-[chunkhash].html            |  335 --
 .../servicenowAccounts.html                        |  335 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  260 --
 .../create/dialog.html/dialog.html                 |  260 ++
 .../dialog.html/dialog-[chunkhash].html            |  187 -
 .../edit/configurations/dialog.html/dialog.html    |  187 +
 .../edit/item/dialog.html/dialog-[chunkhash].html  |  478 --
 .../edit/item/dialog.html/dialog.html              |  478 ++
 .../edit/view.html/view-[chunkhash].html           |  925 ----
 .../sugarcrmAccounts/edit/view.html/view.html      |  925 ++++
 .../sugarcrmAccounts-[chunkhash].html              |  323 --
 .../sugarcrmAccounts.html/sugarcrmAccounts.html    |  323 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  256 --
 .../vtigerAccounts/create/dialog.html/dialog.html  |  256 ++
 .../dialog.html/dialog-[chunkhash].html            |  183 -
 .../edit/configurations/dialog.html/dialog.html    |  183 +
 .../edit/item/dialog.html/dialog-[chunkhash].html  |  478 --
 .../edit/item/dialog.html/dialog.html              |  478 ++
 .../edit/view.html/view-[chunkhash].html           |  920 ----
 .../views/vtigerAccounts/edit/view.html/view.html  |  920 ++++
 .../vtigerAccounts-[chunkhash].html                |  320 --
 .../vtigerAccounts.html/vtigerAccounts.html        |  320 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  332 --
 .../zendeskAccounts/create/dialog.html/dialog.html |  332 ++
 .../edit/item/dialog.html/dialog-[chunkhash].html  |  478 --
 .../edit/item/dialog.html/dialog.html              |  478 ++
 .../edit/view.html/view-[chunkhash].html           | 1031 -----
 .../views/zendeskAccounts/edit/view.html/view.html | 1031 +++++
 .../dialog.html/dialog-[chunkhash].html            |  183 -
 .../zendeskConfigurations/dialog.html/dialog.html  |  183 +
 .../zendeskAccounts-[chunkhash].html               |  320 --
 .../zendeskAccounts.html/zendeskAccounts.html      |  320 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  296 --
 .../zohoAccounts/create/dialog.html/dialog.html    |  296 ++
 .../dialog.html/dialog-[chunkhash].html            |  180 -
 .../edit/configurations/dialog.html/dialog.html    |  180 +
 .../edit/item/dialog.html/dialog-[chunkhash].html  |  478 --
 .../zohoAccounts/edit/item/dialog.html/dialog.html |  478 ++
 .../edit/view.html/view-[chunkhash].html           | 1037 -----
 .../views/zohoAccounts/edit/view.html/view.html    | 1037 +++++
 .../zohoAccounts-[chunkhash].html                  |  320 --
 .../zohoAccounts.html/zohoAccounts.html            |  320 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  164 -
 .../views/projects/create/dialog.html/dialog.html  |  164 +
 .../edit/clone/clone.html/clone-[chunkhash].html   |  109 -
 .../projects/edit/clone/clone.html/clone.html      |  109 +
 .../sessions/dialog.html/dialog-[chunkhash].html   |   76 -
 .../projects/edit/sessions/dialog.html/dialog.html |   76 +
 .../projects/edit/view.html/view-[chunkhash].html  |  509 ---
 .../views/projects/edit/view.html/view.html        |  509 +++
 .../projects.html/projects-[chunkhash].html        |  331 --
 .../views/projects/projects.html/projects.html     |  331 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  419 --
 .../mailAccounts/create/dialog.html/dialog.html    |  419 ++
 .../agentadd.html/agentadd-[chunkhash].html        |   44 -
 .../edit/agentadd/agentadd.html/agentadd.html      |   44 +
 .../apps/agent/dialog.html/dialog-[chunkhash].html |  148 -
 .../edit/apps/agent/dialog.html/dialog.html        |  148 +
 .../autoreply/dialog.html/dialog-[chunkhash].html  |  115 -
 .../edit/apps/autoreply/dialog.html/dialog.html    |  115 +
 .../apps/close/dialog.html/dialog-[chunkhash].html |  106 -
 .../edit/apps/close/dialog.html/dialog.html        |  106 +
 .../gotoif/dialog.html/dialog-[chunkhash].html     |  166 -
 .../edit/apps/gotoif/dialog.html/dialog.html       |  166 +
 .../apps/gotop/dialog.html/dialog-[chunkhash].html |  114 -
 .../edit/apps/gotop/dialog.html/dialog.html        |  114 +
 .../interval/dialog.html/dialog-[chunkhash].html   |  313 --
 .../edit/apps/interval/dialog.html/dialog.html     |  313 ++
 .../apps/noop/dialog.html/dialog-[chunkhash].html  |  105 -
 .../edit/apps/noop/dialog.html/dialog.html         |  105 +
 .../apps/queue/dialog.html/dialog-[chunkhash].html |  148 -
 .../edit/apps/queue/dialog.html/dialog.html        |  148 +
 .../system/dialog.html/dialog-[chunkhash].html     |  133 -
 .../edit/apps/system/dialog.html/dialog.html       |  133 +
 .../apps/tag/dialog.html/dialog-[chunkhash].html   |  111 -
 .../edit/apps/tag/dialog.html/dialog.html          |  111 +
 .../dialog.html/dialog-[chunkhash].html            |  161 -
 .../edit/mailCannedAnswers/dialog.html/dialog.html |  161 +
 .../edit/view.html/view-[chunkhash].html           | 2131 ---------
 .../views/mailAccounts/edit/view.html/view.html    | 2131 +++++++++
 .../mailAccounts-[chunkhash].html                  |  380 --
 .../mailAccounts.html/mailAccounts.html            |  380 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  217 -
 .../mailQueues/create/dialog.html/dialog.html      |  217 +
 .../agentadd.html/agentadd-[chunkhash].html        |   44 -
 .../edit/agentadd/agentadd.html/agentadd.html      |   44 +
 .../teamadd/teamadd.html/teamadd-[chunkhash].html  |   44 -
 .../edit/teamadd/teamadd.html/teamadd.html         |   44 +
 .../edit/view.html/view-[chunkhash].html           |  218 -
 .../mail/views/mailQueues/edit/view.html/view.html |  218 +
 .../mailQueues.html/mailQueues-[chunkhash].html    |  332 --
 .../mailQueues/mailQueues.html/mailQueues.html     |  332 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  152 -
 .../mailSubtatuses/create/dialog.html/dialog.html  |  152 +
 .../mailSubtatuses-[chunkhash].html                |  299 --
 .../mailSubtatuses.html/mailSubtatuses.html        |  299 ++
 .../accounts/view.html/view-[chunkhash].html       |  190 -
 .../views/realtime/accounts/view.html/view.html    |  190 +
 .../agents/view.html/view-[chunkhash].html         |  517 ---
 .../mail/views/realtime/agents/view.html/view.html |  517 +++
 .../queues/view.html/view-[chunkhash].html         |  110 -
 .../mail/views/realtime/queues/view.html/view.html |  110 +
 .../realtime.html/realtime-[chunkhash].html        |   31 -
 .../views/realtime/realtime.html/realtime.html     |   31 +
 .../create/dialog.html/dialog-[chunkhash].html     |  325 --
 .../views/plugins/create/dialog.html/dialog.html   |  325 ++
 .../plugins/edit/view.html/view-[chunkhash].html   |  316 --
 .../views/plugins/edit/view.html/view.html         |  316 ++
 .../plugins/plugins.html/plugins-[chunkhash].html  |  407 --
 .../views/plugins/plugins.html/plugins.html        |  407 ++
 .../upload/dialog.html/dialog-[chunkhash].html     |  102 -
 .../views/plugins/upload/dialog.html/dialog.html   |  102 +
 .../create/dialog.html/dialog-[chunkhash].html     |  316 --
 .../ivrCampaigns/create/dialog.html/dialog.html    |  316 ++
 .../blacklistadd-[chunkhash].html                  |   60 -
 .../blacklistadd.html/blacklistadd.html            |   60 +
 .../edit/clone/clone.html/clone-[chunkhash].html   |  109 -
 .../ivrCampaigns/edit/clone/clone.html/clone.html  |  109 +
 .../hoppers/dialog.html/dialog-[chunkhash].html    |  196 -
 .../edit/hoppers/dialog.html/dialog.html           |  196 +
 .../listadd/listadd.html/listadd-[chunkhash].html  |   60 -
 .../edit/listadd/listadd.html/listadd.html         |   60 +
 .../resetlist.html/resetlist-[chunkhash].html      |   84 -
 .../edit/resetlist/resetlist.html/resetlist.html   |   84 +
 .../edit/view.html/view-[chunkhash].html           | 3103 -------------
 .../views/ivrCampaigns/edit/view.html/view.html    | 3103 +++++++++++++
 .../ivrCampaigns-[chunkhash].html                  |  374 --
 .../ivrCampaigns.html/ivrCampaigns.html            |  374 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  494 ---
 .../queueCampaigns/create/dialog.html/dialog.html  |  494 +++
 .../agentadd.html/agentadd-[chunkhash].html        |   72 -
 .../edit/agentadd/agentadd.html/agentadd.html      |   72 +
 .../blacklistadd-[chunkhash].html                  |   60 -
 .../blacklistadd.html/blacklistadd.html            |   60 +
 .../edit/clone/clone.html/clone-[chunkhash].html   |  114 -
 .../edit/clone/clone.html/clone.html               |  114 +
 .../hoppers/dialog.html/dialog-[chunkhash].html    |  225 -
 .../edit/hoppers/dialog.html/dialog.html           |  225 +
 .../listadd/listadd.html/listadd-[chunkhash].html  |   60 -
 .../edit/listadd/listadd.html/listadd.html         |   60 +
 .../resetlist.html/resetlist-[chunkhash].html      |   84 -
 .../edit/resetlist/resetlist.html/resetlist.html   |   84 +
 .../teamadd/teamadd.html/teamadd-[chunkhash].html  |   70 -
 .../edit/teamadd/teamadd.html/teamadd.html         |   70 +
 .../edit/view.html/view-[chunkhash].html           | 4423 -------------------
 .../views/queueCampaigns/edit/view.html/view.html  | 4423 +++++++++++++++++++
 .../queueCampaigns-[chunkhash].html                |  409 --
 .../queueCampaigns.html/queueCampaigns.html        |  409 ++
 .../abandonedcalls/view.html/view-[chunkhash].html |  162 -
 .../realtime/abandonedcalls/view.html/view.html    |  162 +
 .../agents/view.html/view-[chunkhash].html         |  519 ---
 .../views/realtime/agents/view.html/view.html      |  519 +++
 .../ivr_campaigns/view.html/view-[chunkhash].html  |  124 -
 .../realtime/ivr_campaigns/view.html/view.html     |  124 +
 .../queue_calls/view.html/view-[chunkhash].html    |  139 -
 .../views/realtime/queue_calls/view.html/view.html |  139 +
 .../queue_params/view.html/view-[chunkhash].html   |  119 -
 .../realtime/queue_params/view.html/view.html      |  119 +
 .../predictive/dialog.html/dialog-[chunkhash].html |  233 -
 .../queues/predictive/dialog.html/dialog.html      |  233 +
 .../queues/view.html/view-[chunkhash].html         |  165 -
 .../views/realtime/queues/view.html/view.html      |  165 +
 .../realtime.html/realtime-[chunkhash].html        |   48 -
 .../views/realtime/realtime.html/realtime.html     |   48 +
 .../create/dialog.html/dialog-[chunkhash].html     |  242 --
 .../create/dialog.html/dialog.html                 |  242 ++
 .../agentadd.html/agentadd-[chunkhash].html        |   46 -
 .../edit/agentadd/agentadd.html/agentadd.html      |   46 +
 .../apps/agent/dialog.html/dialog-[chunkhash].html |  152 -
 .../edit/apps/agent/dialog.html/dialog.html        |  152 +
 .../autoreply/dialog.html/dialog-[chunkhash].html  |  126 -
 .../edit/apps/autoreply/dialog.html/dialog.html    |  126 +
 .../apps/close/dialog.html/dialog-[chunkhash].html |  109 -
 .../edit/apps/close/dialog.html/dialog.html        |  109 +
 .../gotoif/dialog.html/dialog-[chunkhash].html     |  169 -
 .../edit/apps/gotoif/dialog.html/dialog.html       |  169 +
 .../apps/gotop/dialog.html/dialog-[chunkhash].html |  117 -
 .../edit/apps/gotop/dialog.html/dialog.html        |  117 +
 .../interval/dialog.html/dialog-[chunkhash].html   |  313 --
 .../edit/apps/interval/dialog.html/dialog.html     |  313 ++
 .../apps/noop/dialog.html/dialog-[chunkhash].html  |  108 -
 .../edit/apps/noop/dialog.html/dialog.html         |  108 +
 .../apps/queue/dialog.html/dialog-[chunkhash].html |  152 -
 .../edit/apps/queue/dialog.html/dialog.html        |  152 +
 .../system/dialog.html/dialog-[chunkhash].html     |  136 -
 .../edit/apps/system/dialog.html/dialog.html       |  136 +
 .../apps/tag/dialog.html/dialog-[chunkhash].html   |  114 -
 .../edit/apps/tag/dialog.html/dialog.html          |  114 +
 .../dialog.html/dialog-[chunkhash].html            |  178 -
 .../dialog.html/dialog.html                        |  178 +
 .../edit/view.html/view-[chunkhash].html           | 1701 --------
 .../openchannelAccounts/edit/view.html/view.html   | 1701 ++++++++
 .../openchannelAccounts-[chunkhash].html           |  357 --
 .../openchannelAccounts.html                       |  357 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  223 -
 .../create/dialog.html/dialog.html                 |  223 +
 .../agentadd.html/agentadd-[chunkhash].html        |   46 -
 .../edit/agentadd/agentadd.html/agentadd.html      |   46 +
 .../teamadd/teamadd.html/teamadd-[chunkhash].html  |   44 -
 .../edit/teamadd/teamadd.html/teamadd.html         |   44 +
 .../edit/view.html/view-[chunkhash].html           |  228 -
 .../openchannelQueues/edit/view.html/view.html     |  228 +
 .../openchannelQueues-[chunkhash].html             |  339 --
 .../openchannelQueues.html/openchannelQueues.html  |  339 ++
 .../agents/view.html/view-[chunkhash].html         |  517 ---
 .../views/realtime/agents/view.html/view.html      |  517 +++
 .../queues/view.html/view-[chunkhash].html         |  114 -
 .../views/realtime/queues/view.html/view.html      |  114 +
 .../realtime.html/realtime-[chunkhash].html        |   26 -
 .../views/realtime/realtime.html/realtime.html     |   26 +
 .../plugin/plugin.html/plugin-[chunkhash].html     |   10 -
 .../plugins/views/plugin/plugin.html/plugin.html   |   10 +
 .../cloudProviders-[chunkhash].html                |  293 --
 .../cloudProviders.html/cloudProviders.html        |  293 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  199 -
 .../cloudProviders/create/dialog.html/dialog.html  |  199 +
 .../customizations-[chunkhash].html                |  511 ---
 .../customizations.html/customizations.html        |  511 +++
 .../generals.html/generals-[chunkhash].html        |  872 ----
 .../views/generals/generals.html/generals.html     |  872 ++++
 .../license/license.html/license-[chunkhash].html  |  490 ---
 .../views/license/license.html/license.html        |  490 +++
 .../request/dialog.html/dialog-[chunkhash].html    |  306 --
 .../views/license/request/dialog.html/dialog.html  |  306 ++
 .../update/dialog.html/dialog-[chunkhash].html     |  102 -
 .../views/license/update/dialog.html/dialog.html   |  102 +
 .../create/dialog.html/dialog-[chunkhash].html     |  263 --
 .../views/networks/create/dialog.html/dialog.html  |  263 ++
 .../networks.html/networks-[chunkhash].html        |  303 --
 .../views/networks/networks.html/networks.html     |  303 ++
 .../views/smtps/smtps.html/smtps-[chunkhash].html  |  291 --
 .../settings/views/smtps/smtps.html/smtps.html     |  291 ++
 .../system/system.html/system-[chunkhash].html     |  491 ---
 .../settings/views/system/system.html/system.html  |  491 +++
 .../update/dialog.html/dialog-[chunkhash].html     |   78 -
 .../views/updates/update/dialog.html/dialog.html   |   78 +
 .../updates/updates.html/updates-[chunkhash].html  |  141 -
 .../views/updates/updates.html/updates.html        |  141 +
 .../agents/view.html/view-[chunkhash].html         |  515 ---
 .../sms/views/realtime/agents/view.html/view.html  |  515 +++
 .../queues/view.html/view-[chunkhash].html         |  110 -
 .../sms/views/realtime/queues/view.html/view.html  |  110 +
 .../realtime.html/realtime-[chunkhash].html        |   26 -
 .../sms/views/realtime/realtime.html/realtime.html |   26 +
 .../create/dialog.html/dialog-[chunkhash].html     |  482 ---
 .../smsAccounts/create/dialog.html/dialog.html     |  482 +++
 .../agentadd.html/agentadd-[chunkhash].html        |   44 -
 .../edit/agentadd/agentadd.html/agentadd.html      |   44 +
 .../apps/agent/dialog.html/dialog-[chunkhash].html |  148 -
 .../edit/apps/agent/dialog.html/dialog.html        |  148 +
 .../amazonlex/dialog.html/dialog-[chunkhash].html  |  208 -
 .../edit/apps/amazonlex/dialog.html/dialog.html    |  208 +
 .../autoreply/dialog.html/dialog-[chunkhash].html  |  123 -
 .../edit/apps/autoreply/dialog.html/dialog.html    |  123 +
 .../apps/close/dialog.html/dialog-[chunkhash].html |  106 -
 .../edit/apps/close/dialog.html/dialog.html        |  106 +
 .../dialogflow/dialog.html/dialog-[chunkhash].html |  178 -
 .../edit/apps/dialogflow/dialog.html/dialog.html   |  178 +
 .../gotoif/dialog.html/dialog-[chunkhash].html     |  166 -
 .../edit/apps/gotoif/dialog.html/dialog.html       |  166 +
 .../apps/gotop/dialog.html/dialog-[chunkhash].html |  114 -
 .../edit/apps/gotop/dialog.html/dialog.html        |  114 +
 .../interval/dialog.html/dialog-[chunkhash].html   |  313 --
 .../edit/apps/interval/dialog.html/dialog.html     |  313 ++
 .../apps/noop/dialog.html/dialog-[chunkhash].html  |  105 -
 .../edit/apps/noop/dialog.html/dialog.html         |  105 +
 .../apps/queue/dialog.html/dialog-[chunkhash].html |  148 -
 .../edit/apps/queue/dialog.html/dialog.html        |  148 +
 .../system/dialog.html/dialog-[chunkhash].html     |  133 -
 .../edit/apps/system/dialog.html/dialog.html       |  133 +
 .../apps/tag/dialog.html/dialog-[chunkhash].html   |  111 -
 .../edit/apps/tag/dialog.html/dialog.html          |  111 +
 .../dialog.html/dialog-[chunkhash].html            |  173 -
 .../edit/smsCannedAnswers/dialog.html/dialog.html  |  173 +
 .../edit/view.html/view-[chunkhash].html           | 1975 ---------
 .../sms/views/smsAccounts/edit/view.html/view.html | 1975 +++++++++
 .../smsAccounts.html/smsAccounts-[chunkhash].html  |  358 --
 .../smsAccounts/smsAccounts.html/smsAccounts.html  |  358 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  217 -
 .../views/smsQueues/create/dialog.html/dialog.html |  217 +
 .../agentadd.html/agentadd-[chunkhash].html        |   40 -
 .../edit/agentadd/agentadd.html/agentadd.html      |   40 +
 .../teamadd/teamadd.html/teamadd-[chunkhash].html  |   40 -
 .../edit/teamadd/teamadd.html/teamadd.html         |   40 +
 .../smsQueues/edit/view.html/view-[chunkhash].html |  214 -
 .../sms/views/smsQueues/edit/view.html/view.html   |  214 +
 .../smsQueues.html/smsQueues-[chunkhash].html      |  332 --
 .../views/smsQueues/smsQueues.html/smsQueues.html  |  332 ++
 .../agents/agents.html/agents-[chunkhash].html     |  374 --
 .../staff/views/agents/agents.html/agents.html     |  374 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  366 --
 .../views/agents/create/dialog.html/dialog.html    |  366 ++
 .../changepassword-[chunkhash].html                |  158 -
 .../changepassword.html/changepassword.html        |  158 +
 .../queueadd.html/queueadd-[chunkhash].html        |   66 -
 .../edit/queueadd/queueadd.html/queueadd.html      |   66 +
 .../teamadd/teamadd.html/teamadd-[chunkhash].html  |   40 -
 .../agents/edit/teamadd/teamadd.html/teamadd.html  |   40 +
 .../agents/edit/view.html/view-[chunkhash].html    | 1795 --------
 .../staff/views/agents/edit/view.html/view.html    | 1795 ++++++++
 .../create/dialog.html/dialog-[chunkhash].html     |  148 -
 .../views/teams/create/dialog.html/dialog.html     |  148 +
 .../agentadd.html/agentadd-[chunkhash].html        |   40 -
 .../edit/agentadd/agentadd.html/agentadd.html      |   40 +
 .../views/teams/teams.html/teams-[chunkhash].html  |  302 --
 .../apps/staff/views/teams/teams.html/teams.html   |  302 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  301 --
 .../telephones/create/dialog.html/dialog.html      |  301 ++
 .../changepassword-[chunkhash].html                |  158 -
 .../changepassword.html/changepassword.html        |  158 +
 .../edit/view.html/view-[chunkhash].html           |  518 ---
 .../views/telephones/edit/view.html/view.html      |  518 +++
 .../telephones.html/telephones-[chunkhash].html    |  309 --
 .../telephones/telephones.html/telephones.html     |  309 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  185 -
 .../userProfiles/create/dialog.html/dialog.html    |  185 +
 .../edit/clone/clone.html/clone-[chunkhash].html   |  152 -
 .../userProfiles/edit/clone/clone.html/clone.html  |  152 +
 .../permissionsmanage-[chunkhash].html             |  190 -
 .../permissionsmanage.html/permissionsmanage.html  |  190 +
 .../edit/view.html/view-[chunkhash].html           |  267 --
 .../views/userProfiles/edit/view.html/view.html    |  267 ++
 .../userProfiles-[chunkhash].html                  |  266 --
 .../userProfiles.html/userProfiles.html            |  266 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  336 --
 .../views/users/create/dialog.html/dialog.html     |  336 ++
 .../apikeymanager-[chunkhash].html                 |   53 -
 .../apikeymanager.html/apikeymanager.html          |   53 +
 .../changepassword-[chunkhash].html                |  158 -
 .../changepassword.html/changepassword.html        |  158 +
 .../users/edit/view.html/view-[chunkhash].html     |  772 ----
 .../staff/views/users/edit/view.html/view.html     |  772 ++++
 .../views/users/users.html/users-[chunkhash].html  |  360 --
 .../apps/staff/views/users/users.html/users.html   |  360 ++
 .../cannedAnswers-[chunkhash].html                 |  309 --
 .../cannedAnswers.html/cannedAnswers.html          |  309 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  180 -
 .../cannedAnswers/create/dialog.html/dialog.html   |  180 +
 .../create/dialog.html/dialog-[chunkhash].html     |  152 -
 .../create/dialog.html/dialog.html                 |  152 +
 .../customDashboards-[chunkhash].html              |  324 --
 .../customDashboards.html/customDashboards.html    |  324 ++
 .../edit/clone/clone.html/clone-[chunkhash].html   |   99 -
 .../edit/clone/clone.html/clone.html               |   99 +
 .../dashboard/dialog.html/dialog-[chunkhash].html  |  682 ---
 .../edit/dashboard/dialog.html/dialog.html         |  682 +++
 .../edit/view.html/view-[chunkhash].html           |  209 -
 .../customDashboards/edit/view.html/view.html      |  209 +
 .../treeReports.html/treeReports-[chunkhash].html  |  125 -
 .../reports/treeReports.html/treeReports.html      |  125 +
 .../create/dialog.html/dialog-[chunkhash].html     |  208 -
 .../dispositions/create/dialog.html/dialog.html    |  208 +
 .../dispositions-[chunkhash].html                  |  329 --
 .../dispositions.html/dispositions.html            |  329 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  152 -
 .../views/intervals/create/dialog.html/dialog.html |  152 +
 .../interval/dialog.html/dialog-[chunkhash].html   |  337 --
 .../edit/apps/interval/dialog.html/dialog.html     |  337 ++
 .../intervals/edit/view.html/view-[chunkhash].html |  318 --
 .../tools/views/intervals/edit/view.html/view.html |  318 ++
 .../intervals.html/intervals-[chunkhash].html      |  297 --
 .../views/intervals/intervals.html/intervals.html  |  297 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  148 -
 .../views/pauses/create/dialog.html/dialog.html    |  148 +
 .../pauses/pauses.html/pauses-[chunkhash].html     |  297 --
 .../tools/views/pauses/pauses.html/pauses.html     |  297 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  478 --
 .../views/schedules/create/dialog.html/dialog.html |  478 ++
 .../treeReports.html/treeReports-[chunkhash].html  |  125 -
 .../reports/treeReports.html/treeReports.html      |  125 +
 .../schedules.html/schedules-[chunkhash].html      |  339 --
 .../views/schedules/schedules.html/schedules.html  |  339 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  148 -
 .../views/sounds/create/dialog.html/dialog.html    |  148 +
 .../sounds/sounds.html/sounds-[chunkhash].html     |  314 --
 .../tools/views/sounds/sounds.html/sounds.html     |  314 ++
 .../upload/dialog.html/dialog-[chunkhash].html     |  102 -
 .../views/sounds/upload/dialog.html/dialog.html    |  102 +
 .../create/dialog.html/dialog-[chunkhash].html     |  161 -
 .../views/tags/create/dialog.html/dialog.html      |  161 +
 .../views/tags/tags.html/tags-[chunkhash].html     |  303 --
 .../main/apps/tools/views/tags/tags.html/tags.html |  303 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  162 -
 .../views/templates/create/dialog.html/dialog.html |  162 +
 .../templates.html/templates-[chunkhash].html      |  297 --
 .../views/templates/templates.html/templates.html  |  297 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  165 -
 .../views/triggers/create/dialog.html/dialog.html  |  165 +
 .../create/dialog.html/dialog-[chunkhash].html     |  922 ----
 .../edit/actions/create/dialog.html/dialog.html    |  922 ++++
 .../create/dialog.html/dialog-[chunkhash].html     |  333 --
 .../allconditions/create/dialog.html/dialog.html   |  333 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  461 --
 .../anyconditions/create/dialog.html/dialog.html   |  461 ++
 .../triggers/edit/view.html/view-[chunkhash].html  |  179 -
 .../tools/views/triggers/edit/view.html/view.html  |  179 +
 .../triggers.html/triggers-[chunkhash].html        |  279 --
 .../views/triggers/triggers.html/triggers.html     |  279 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  246 --
 .../views/trunks/create/dialog.html/dialog.html    |  246 ++
 .../edit/clone/clone.html/clone-[chunkhash].html   |  114 -
 .../views/trunks/edit/clone/clone.html/clone.html  |  114 +
 .../trunks/edit/view.html/view-[chunkhash].html    |  942 ----
 .../tools/views/trunks/edit/view.html/view.html    |  942 ++++
 .../trunks/trunks.html/trunks-[chunkhash].html     |  352 --
 .../tools/views/trunks/trunks.html/trunks.html     |  352 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  152 -
 .../views/variables/create/dialog.html/dialog.html |  152 +
 .../variables.html/variables-[chunkhash].html      |  297 --
 .../views/variables/variables.html/variables.html  |  297 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  169 -
 .../create/dialog.html/dialog.html                 |  169 +
 .../partialViews/play.html/play-[chunkhash].html   |  120 -
 .../partialViews/play.html/play.html               |  120 +
 .../screenRecordings-[chunkhash].html              |  343 --
 .../screenRecordings.html/screenRecordings.html    |  343 ++
 .../chanSpies.html/chanSpies-[chunkhash].html      |  333 --
 .../views/chanSpies/chanSpies.html/chanSpies.html  |  333 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  286 --
 .../views/chanSpies/create/dialog.html/dialog.html |  286 ++
 .../contexts.html/contexts-[chunkhash].html        |  297 --
 .../views/contexts/contexts.html/contexts.html     |  297 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  152 -
 .../views/contexts/create/dialog.html/dialog.html  |  152 +
 .../create/dialog.html/dialog-[chunkhash].html     |  174 -
 .../inboundroutes/create/dialog.html/dialog.html   |  174 +
 .../apps/agi/dialog.html/dialog-[chunkhash].html   |  111 -
 .../edit/apps/agi/dialog.html/dialog.html          |  111 +
 .../custom/dialog.html/dialog-[chunkhash].html     |  127 -
 .../edit/apps/custom/dialog.html/dialog.html       |  127 +
 .../apps/dial/dialog.html/dialog-[chunkhash].html  |  177 -
 .../edit/apps/dial/dialog.html/dialog.html         |  177 +
 .../dialog.html/dialog-[chunkhash].html            |  204 -
 .../edit/apps/externaldial/dialog.html/dialog.html |  204 +
 .../apps/goto/dialog.html/dialog-[chunkhash].html  |  155 -
 .../edit/apps/goto/dialog.html/dialog.html         |  155 +
 .../hangup/dialog.html/dialog-[chunkhash].html     |  140 -
 .../edit/apps/hangup/dialog.html/dialog.html       |  140 +
 .../dialog.html/dialog-[chunkhash].html            |  182 -
 .../edit/apps/internaldial/dialog.html/dialog.html |  182 +
 .../interval/dialog.html/dialog-[chunkhash].html   |  313 --
 .../edit/apps/interval/dialog.html/dialog.html     |  313 ++
 .../playback/dialog.html/dialog-[chunkhash].html   |  140 -
 .../edit/apps/playback/dialog.html/dialog.html     |  140 +
 .../apps/queue/dialog.html/dialog-[chunkhash].html |  330 --
 .../edit/apps/queue/dialog.html/dialog.html        |  330 ++
 .../ringgroup/dialog.html/dialog-[chunkhash].html  |  183 -
 .../edit/apps/ringgroup/dialog.html/dialog.html    |  183 +
 .../apps/set/dialog.html/dialog-[chunkhash].html   |  133 -
 .../edit/apps/set/dialog.html/dialog.html          |  133 +
 .../voicemail/dialog.html/dialog-[chunkhash].html  |  132 -
 .../edit/apps/voicemail/dialog.html/dialog.html    |  132 +
 .../edit/view.html/view-[chunkhash].html           |  403 --
 .../views/inboundroutes/edit/view.html/view.html   |  403 ++
 .../inboundroutes-[chunkhash].html                 |  299 --
 .../inboundroutes.html/inboundroutes.html          |  299 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  174 -
 .../internalroutes/create/dialog.html/dialog.html  |  174 +
 .../apps/agi/dialog.html/dialog-[chunkhash].html   |  111 -
 .../edit/apps/agi/dialog.html/dialog.html          |  111 +
 .../custom/dialog.html/dialog-[chunkhash].html     |  127 -
 .../edit/apps/custom/dialog.html/dialog.html       |  127 +
 .../apps/dial/dialog.html/dialog-[chunkhash].html  |  177 -
 .../edit/apps/dial/dialog.html/dialog.html         |  177 +
 .../dialog.html/dialog-[chunkhash].html            |  203 -
 .../edit/apps/externaldial/dialog.html/dialog.html |  203 +
 .../apps/goto/dialog.html/dialog-[chunkhash].html  |  155 -
 .../edit/apps/goto/dialog.html/dialog.html         |  155 +
 .../hangup/dialog.html/dialog-[chunkhash].html     |  140 -
 .../edit/apps/hangup/dialog.html/dialog.html       |  140 +
 .../dialog.html/dialog-[chunkhash].html            |  182 -
 .../edit/apps/internaldial/dialog.html/dialog.html |  182 +
 .../interval/dialog.html/dialog-[chunkhash].html   |  313 --
 .../edit/apps/interval/dialog.html/dialog.html     |  313 ++
 .../playback/dialog.html/dialog-[chunkhash].html   |  140 -
 .../edit/apps/playback/dialog.html/dialog.html     |  140 +
 .../apps/queue/dialog.html/dialog-[chunkhash].html |  330 --
 .../edit/apps/queue/dialog.html/dialog.html        |  330 ++
 .../ringgroup/dialog.html/dialog-[chunkhash].html  |  183 -
 .../edit/apps/ringgroup/dialog.html/dialog.html    |  183 +
 .../apps/set/dialog.html/dialog-[chunkhash].html   |  133 -
 .../edit/apps/set/dialog.html/dialog.html          |  133 +
 .../voicemail/dialog.html/dialog-[chunkhash].html  |  132 -
 .../edit/apps/voicemail/dialog.html/dialog.html    |  132 +
 .../edit/view.html/view-[chunkhash].html           |  403 --
 .../views/internalroutes/edit/view.html/view.html  |  403 ++
 .../internalroutes-[chunkhash].html                |  299 --
 .../internalroutes.html/internalroutes.html        |  299 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  230 -
 .../musiconholds/create/dialog.html/dialog.html    |  230 +
 .../mohSounds/dialog.html/dialog-[chunkhash].html  |  132 -
 .../edit/mohSounds/dialog.html/dialog.html         |  132 +
 .../edit/view.html/view-[chunkhash].html           |  377 --
 .../views/musiconholds/edit/view.html/view.html    |  377 ++
 .../musiconholds-[chunkhash].html                  |  311 --
 .../musiconholds.html/musiconholds.html            |  311 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  227 -
 .../outboundroutes/create/dialog.html/dialog.html  |  227 +
 .../custom/dialog.html/dialog-[chunkhash].html     |  127 -
 .../edit/apps/custom/dialog.html/dialog.html       |  127 +
 .../interval/dialog.html/dialog-[chunkhash].html   |  313 --
 .../edit/apps/interval/dialog.html/dialog.html     |  313 ++
 .../dialog.html/dialog-[chunkhash].html            |  252 --
 .../edit/apps/outbounddial/dialog.html/dialog.html |  252 ++
 .../edit/view.html/view-[chunkhash].html           |  460 --
 .../views/outboundroutes/edit/view.html/view.html  |  460 ++
 .../outboundroutes-[chunkhash].html                |  299 --
 .../outboundroutes.html/outboundroutes.html        |  299 ++
 .../abandonedcalls/view.html/view-[chunkhash].html |  151 -
 .../realtime/abandonedcalls/view.html/view.html    |  151 +
 .../agents/view.html/view-[chunkhash].html         |  517 ---
 .../views/realtime/agents/view.html/view.html      |  517 +++
 .../outbound_calls/view.html/view-[chunkhash].html |   88 -
 .../realtime/outbound_calls/view.html/view.html    |   88 +
 .../queue_calls/view.html/view-[chunkhash].html    |  135 -
 .../views/realtime/queue_calls/view.html/view.html |  135 +
 .../queue_params/view.html/view-[chunkhash].html   |  100 -
 .../realtime/queue_params/view.html/view.html      |  100 +
 .../queues/view.html/view-[chunkhash].html         |  116 -
 .../views/realtime/queues/view.html/view.html      |  116 +
 .../realtime.html/realtime-[chunkhash].html        |   56 -
 .../views/realtime/realtime.html/realtime.html     |   56 +
 .../telephones/view.html/view-[chunkhash].html     |   84 -
 .../views/realtime/telephones/view.html/view.html  |   84 +
 .../trunks/view.html/view-[chunkhash].html         |  111 -
 .../views/realtime/trunks/view.html/view.html      |  111 +
 .../create/dialog.html/dialog-[chunkhash].html     |  216 -
 .../voicePrefixes/create/dialog.html/dialog.html   |  216 +
 .../agentadd.html/agentadd-[chunkhash].html        |   44 -
 .../edit/agentadd/agentadd.html/agentadd.html      |   44 +
 .../voicePrefixes-[chunkhash].html                 |  329 --
 .../voicePrefixes.html/voicePrefixes.html          |  329 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  185 -
 .../voiceQueues/create/dialog.html/dialog.html     |  185 +
 .../agentadd.html/agentadd-[chunkhash].html        |   66 -
 .../edit/agentadd/agentadd.html/agentadd.html      |   66 +
 .../teamadd/teamadd.html/teamadd-[chunkhash].html  |   66 -
 .../edit/teamadd/teamadd.html/teamadd.html         |   66 +
 .../edit/view.html/view-[chunkhash].html           | 1628 -------
 .../views/voiceQueues/edit/view.html/view.html     | 1628 +++++++
 .../voiceQueues.html/voiceQueues-[chunkhash].html  |  342 --
 .../voiceQueues/voiceQueues.html/voiceQueues.html  |  342 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  169 -
 .../voiceRecordings/create/dialog.html/dialog.html |  169 +
 .../edit/view.html/view-[chunkhash].html           |  571 ---
 .../views/voiceRecordings/edit/view.html/view.html |  571 +++
 .../voiceRecordings-[chunkhash].html               |  541 ---
 .../voiceRecordings.html/voiceRecordings.html      |  541 +++
 .../create/dialog.html/dialog-[chunkhash].html     |  255 --
 .../voicemails/create/dialog.html/dialog.html      |  255 ++
 .../edit/view.html/view-[chunkhash].html           |  635 ---
 .../views/voicemails/edit/view.html/view.html      |  635 +++
 .../voicemails.html/voicemails-[chunkhash].html    |  307 --
 .../voicemails/voicemails.html/voicemails.html     |  307 ++
 .../agents/view.html/view-[chunkhash].html         |  517 ---
 .../views/realtime/agents/view.html/view.html      |  517 +++
 .../queues/view.html/view-[chunkhash].html         |  112 -
 .../views/realtime/queues/view.html/view.html      |  112 +
 .../realtime.html/realtime-[chunkhash].html        |   26 -
 .../views/realtime/realtime.html/realtime.html     |   26 +
 .../create/dialog.html/dialog-[chunkhash].html     |  331 --
 .../create/dialog.html/dialog.html                 |  331 ++
 .../agentadd.html/agentadd-[chunkhash].html        |   46 -
 .../edit/agentadd/agentadd.html/agentadd.html      |   46 +
 .../apps/agent/dialog.html/dialog-[chunkhash].html |  149 -
 .../edit/apps/agent/dialog.html/dialog.html        |  149 +
 .../amazonlex/dialog.html/dialog-[chunkhash].html  |  208 -
 .../edit/apps/amazonlex/dialog.html/dialog.html    |  208 +
 .../autoreply/dialog.html/dialog-[chunkhash].html  |  123 -
 .../edit/apps/autoreply/dialog.html/dialog.html    |  123 +
 .../apps/close/dialog.html/dialog-[chunkhash].html |  106 -
 .../edit/apps/close/dialog.html/dialog.html        |  106 +
 .../dialogflow/dialog.html/dialog-[chunkhash].html |  178 -
 .../edit/apps/dialogflow/dialog.html/dialog.html   |  178 +
 .../gotoif/dialog.html/dialog-[chunkhash].html     |  166 -
 .../edit/apps/gotoif/dialog.html/dialog.html       |  166 +
 .../apps/gotop/dialog.html/dialog-[chunkhash].html |  114 -
 .../edit/apps/gotop/dialog.html/dialog.html        |  114 +
 .../interval/dialog.html/dialog-[chunkhash].html   |  313 --
 .../edit/apps/interval/dialog.html/dialog.html     |  313 ++
 .../apps/noop/dialog.html/dialog-[chunkhash].html  |  105 -
 .../edit/apps/noop/dialog.html/dialog.html         |  105 +
 .../apps/queue/dialog.html/dialog-[chunkhash].html |  149 -
 .../edit/apps/queue/dialog.html/dialog.html        |  149 +
 .../system/dialog.html/dialog-[chunkhash].html     |  133 -
 .../edit/apps/system/dialog.html/dialog.html       |  133 +
 .../apps/tag/dialog.html/dialog-[chunkhash].html   |  111 -
 .../edit/apps/tag/dialog.html/dialog.html          |  111 +
 .../edit/view.html/view-[chunkhash].html           | 1757 --------
 .../whatsappAccounts/edit/view.html/view.html      | 1757 ++++++++
 .../dialog.html/dialog-[chunkhash].html            |  178 -
 .../whatsappCannedAnswers/dialog.html/dialog.html  |  178 +
 .../whatsappAccounts-[chunkhash].html              |  367 --
 .../whatsappAccounts.html/whatsappAccounts.html    |  367 ++
 .../create/dialog.html/dialog-[chunkhash].html     |  223 -
 .../whatsappQueues/create/dialog.html/dialog.html  |  223 +
 .../agentadd.html/agentadd-[chunkhash].html        |   46 -
 .../edit/agentadd/agentadd.html/agentadd.html      |   46 +
 .../teamadd/teamadd.html/teamadd-[chunkhash].html  |   44 -
 .../edit/teamadd/teamadd.html/teamadd.html         |   44 +
 .../edit/view.html/view-[chunkhash].html           |  224 -
 .../views/whatsappQueues/edit/view.html/view.html  |  224 +
 .../whatsappQueues-[chunkhash].html                |  336 --
 .../whatsappQueues.html/whatsappQueues.html        |  336 ++
 .../navigation.html/navigation-[chunkhash].html    |    3 -
 .../navigation.html/navigation.html                |    3 +
 .../navigation.html/navigation-[chunkhash].html    |    5 -
 .../navigation.html/navigation.html                |    5 +
 .../navigation.html/navigation-[chunkhash].html    |   26 -
 .../navigation.html/navigation.html                |   26 +
 .../quick-panel.html/quick-panel-[chunkhash].html  |   64 -
 .../quick-panel/quick-panel.html/quick-panel.html  |   64 +
 .../create/dialog.html/dialog-[chunkhash].html     |  148 -
 .../tabs/groups/create/dialog.html/dialog.html     |  148 +
 .../info/dialog.html/dialog-[chunkhash].html       |   50 -
 .../tabs/groups/info/dialog.html/dialog.html       |   50 +
 .../reset/reset.html/reset-[chunkhash].html        |   88 -
 public/src/js/modules/reset/reset.html/reset.html  |   88 +
 .../changepassword-[chunkhash].html                |  162 -
 .../changepassword.html/changepassword.html        |  162 +
 .../toolbar.html/toolbar-[chunkhash].html          |  357 --
 .../vertical-navigation/toolbar.html/toolbar.html  |  357 ++
 .../preview/dialog.html/dialog-[chunkhash].html    |  138 -
 .../toolbar/preview/dialog.html/dialog.html        |  138 +
 server/api/action/action.attributes.js             |    2 +-
 server/api/action/action.controller.js             |    2 +-
 server/api/action/action.model.js                  |    2 +-
 server/api/action/index.js                         |    2 +-
 .../analyticCustomReport.attributes.js             |    2 +-
 .../analyticCustomReport.controller.js             |    2 +-
 .../analyticCustomReport.model.js                  |    2 +-
 server/api/analyticCustomReport/index.js           |    2 +-
 .../analyticDefaultReport.attributes.js            |    2 +-
 .../analyticDefaultReport.controller.js            |    2 +-
 .../analyticDefaultReport.model.js                 |    2 +-
 server/api/analyticDefaultReport/index.js          |    2 +-
 .../analyticExtractedReport.attributes.js          |    2 +-
 .../analyticExtractedReport.controller.js          |    2 +-
 .../analyticExtractedReport.model.js               |    2 +-
 server/api/analyticExtractedReport/index.js        |    2 +-
 .../analyticFieldReport.attributes.js              |    2 +-
 .../analyticFieldReport.controller.js              |    2 +-
 .../analyticFieldReport.model.js                   |    2 +-
 server/api/analyticFieldReport/index.js            |    2 +-
 .../analyticMetric/analyticMetric.attributes.js    |    2 +-
 .../analyticMetric/analyticMetric.controller.js    |    2 +-
 server/api/analyticMetric/analyticMetric.model.js  |    2 +-
 server/api/analyticMetric/index.js                 |    2 +-
 .../analyticTreeReport.attributes.js               |    2 +-
 .../analyticTreeReport.controller.js               |    2 +-
 .../analyticTreeReport/analyticTreeReport.model.js |    2 +-
 server/api/analyticTreeReport/index.js             |    2 +-
 server/api/attachment/attachment.attributes.js     |    2 +-
 server/api/attachment/attachment.controller.js     |    2 +-
 server/api/attachment/attachment.model.js          |    2 +-
 server/api/attachment/attachment.rpc.js            |    2 +-
 server/api/attachment/index.js                     |    2 +-
 server/api/authGoogle/authGoogle.controller.js     |    2 +-
 server/api/authGoogle/index.js                     |    2 +-
 server/api/authLocal/authLocal.controller.js       |    2 +-
 server/api/authLocal/index.js                      |    2 +-
 server/api/automation/automation.attributes.js     |    2 +-
 server/api/automation/automation.controller.js     |    2 +-
 server/api/automation/automation.model.js          |    2 +-
 server/api/automation/index.js                     |    2 +-
 server/api/campaign/campaign.attributes.js         |    2 +-
 server/api/campaign/campaign.controller.js         |    2 +-
 server/api/campaign/campaign.model.js              |    2 +-
 server/api/campaign/campaign.rpc.js                |    2 +-
 server/api/campaign/index.js                       |    2 +-
 server/api/cannedAnswer/cannedAnswer.attributes.js |    2 +-
 server/api/cannedAnswer/cannedAnswer.controller.js |    2 +-
 server/api/cannedAnswer/cannedAnswer.model.js      |    2 +-
 server/api/cannedAnswer/index.js                   |    2 +-
 server/api/cdr/cdr.attributes.js                   |    2 +-
 server/api/cdr/cdr.controller.js                   |    2 +-
 server/api/cdr/cdr.model.js                        |    2 +-
 server/api/cdr/index.js                            |    2 +-
 .../chatApplication/chatApplication.attributes.js  |    2 +-
 .../chatApplication/chatApplication.controller.js  |    2 +-
 .../api/chatApplication/chatApplication.model.js   |    2 +-
 server/api/chatApplication/index.js                |    2 +-
 server/api/chatGroup/chatGroup.attributes.js       |    2 +-
 server/api/chatGroup/chatGroup.controller.js       |    2 +-
 server/api/chatGroup/chatGroup.events.js           |    2 +-
 server/api/chatGroup/chatGroup.model.js            |    2 +-
 server/api/chatGroup/chatGroup.rpc.js              |    2 +-
 server/api/chatGroup/chatGroup.socket.js           |    2 +-
 server/api/chatGroup/index.js                      |    2 +-
 .../chatInteraction/chatInteraction.attributes.js  |    2 +-
 .../chatInteraction/chatInteraction.controller.js  |    2 +-
 .../api/chatInteraction/chatInteraction.events.js  |    2 +-
 .../api/chatInteraction/chatInteraction.model.js   |    2 +-
 server/api/chatInteraction/chatInteraction.rpc.js  |    2 +-
 .../api/chatInteraction/chatInteraction.socket.js  |    2 +-
 server/api/chatInteraction/index.js                |    2 +-
 .../chatInternalMessage.attributes.js              |    2 +-
 .../chatInternalMessage.controller.js              |    2 +-
 .../chatInternalMessage.events.js                  |    2 +-
 .../chatInternalMessage.model.js                   |    2 +-
 .../chatInternalMessage/chatInternalMessage.rpc.js |    2 +-
 .../chatInternalMessage.socket.js                  |    2 +-
 server/api/chatInternalMessage/index.js            |    2 +-
 server/api/chatMessage/chatMessage.attributes.js   |    2 +-
 server/api/chatMessage/chatMessage.controller.js   |    2 +-
 server/api/chatMessage/chatMessage.events.js       |    2 +-
 server/api/chatMessage/chatMessage.model.js        |    2 +-
 server/api/chatMessage/chatMessage.rpc.js          |    2 +-
 server/api/chatMessage/chatMessage.socket.js       |    2 +-
 server/api/chatMessage/index.js                    |    2 +-
 .../chatOfflineMessage.attributes.js               |    2 +-
 .../chatOfflineMessage.controller.js               |    2 +-
 .../chatOfflineMessage/chatOfflineMessage.model.js |    2 +-
 server/api/chatOfflineMessage/index.js             |    2 +-
 .../chatProactiveAction.attributes.js              |    2 +-
 .../chatProactiveAction.controller.js              |    2 +-
 .../chatProactiveAction.model.js                   |    2 +-
 server/api/chatProactiveAction/index.js            |    2 +-
 server/api/chatQueue/chatQueue.attributes.js       |    2 +-
 server/api/chatQueue/chatQueue.controller.js       |    2 +-
 server/api/chatQueue/chatQueue.events.js           |    2 +-
 server/api/chatQueue/chatQueue.model.js            |    2 +-
 server/api/chatQueue/chatQueue.rpc.js              |    2 +-
 server/api/chatQueue/chatQueue.socket.js           |    2 +-
 server/api/chatQueue/index.js                      |    2 +-
 .../chatQueueReport/chatQueueReport.attributes.js  |    2 +-
 .../chatQueueReport/chatQueueReport.controller.js  |    2 +-
 .../api/chatQueueReport/chatQueueReport.model.js   |    2 +-
 server/api/chatQueueReport/chatQueueReport.rpc.js  |    2 +-
 server/api/chatQueueReport/index.js                |    2 +-
 .../chatTransferReport.attributes.js               |    2 +-
 .../chatTransferReport.controller.js               |    2 +-
 .../chatTransferReport/chatTransferReport.model.js |    2 +-
 server/api/chatTransferReport/index.js             |    2 +-
 server/api/chatWebsite/chatWebsite.attributes.js   |    2 +-
 server/api/chatWebsite/chatWebsite.controller.js   |    2 +-
 server/api/chatWebsite/chatWebsite.events.js       |    2 +-
 server/api/chatWebsite/chatWebsite.model.js        |    2 +-
 server/api/chatWebsite/chatWebsite.rpc.js          |    2 +-
 server/api/chatWebsite/chatWebsite.socket.js       |    2 +-
 server/api/chatWebsite/index.js                    |    2 +-
 .../api/cloudProvider/cloudProvider.attributes.js  |    2 +-
 .../api/cloudProvider/cloudProvider.controller.js  |    2 +-
 server/api/cloudProvider/cloudProvider.model.js    |    2 +-
 server/api/cloudProvider/index.js                  |    2 +-
 server/api/cmCompany/cmCompany.attributes.js       |    2 +-
 server/api/cmCompany/cmCompany.controller.js       |    2 +-
 server/api/cmCompany/cmCompany.model.js            |    2 +-
 server/api/cmCompany/index.js                      |    2 +-
 server/api/cmContact/cmContact.attributes.js       |    2 +-
 server/api/cmContact/cmContact.controller.js       |    2 +-
 server/api/cmContact/cmContact.events.js           |    2 +-
 server/api/cmContact/cmContact.model.js            |    2 +-
 server/api/cmContact/cmContact.rpc.js              |    2 +-
 server/api/cmContact/cmContact.socket.js           |    2 +-
 server/api/cmContact/index.js                      |    2 +-
 .../api/cmCustomField/cmCustomField.attributes.js  |    2 +-
 .../api/cmCustomField/cmCustomField.controller.js  |    2 +-
 server/api/cmCustomField/cmCustomField.model.js    |    2 +-
 server/api/cmCustomField/index.js                  |    2 +-
 server/api/cmHopper/cmHopper.attributes.js         |    2 +-
 server/api/cmHopper/cmHopper.controller.js         |    2 +-
 server/api/cmHopper/cmHopper.model.js              |    2 +-
 server/api/cmHopper/cmHopper.rpc.js                |    2 +-
 server/api/cmHopper/index.js                       |    2 +-
 .../api/cmHopperBlack/cmHopperBlack.attributes.js  |    2 +-
 .../api/cmHopperBlack/cmHopperBlack.controller.js  |    2 +-
 server/api/cmHopperBlack/cmHopperBlack.model.js    |    2 +-
 server/api/cmHopperBlack/cmHopperBlack.rpc.js      |    2 +-
 server/api/cmHopperBlack/index.js                  |    2 +-
 .../api/cmHopperFinal/cmHopperFinal.attributes.js  |    2 +-
 .../api/cmHopperFinal/cmHopperFinal.controller.js  |    2 +-
 server/api/cmHopperFinal/cmHopperFinal.model.js    |    2 +-
 server/api/cmHopperFinal/cmHopperFinal.rpc.js      |    2 +-
 server/api/cmHopperFinal/index.js                  |    2 +-
 .../cmHopperHistory/cmHopperHistory.attributes.js  |    2 +-
 .../cmHopperHistory/cmHopperHistory.controller.js  |    2 +-
 .../api/cmHopperHistory/cmHopperHistory.model.js   |    2 +-
 server/api/cmHopperHistory/cmHopperHistory.rpc.js  |    2 +-
 server/api/cmHopperHistory/index.js                |    2 +-
 server/api/cmList/cmList.attributes.js             |    2 +-
 server/api/cmList/cmList.controller.js             |    2 +-
 server/api/cmList/cmList.events.js                 |    2 +-
 server/api/cmList/cmList.model.js                  |    2 +-
 server/api/cmList/cmList.rpc.js                    |    2 +-
 server/api/cmList/cmList.socket.js                 |    2 +-
 server/api/cmList/index.js                         |    2 +-
 server/api/condition/condition.attributes.js       |    2 +-
 server/api/condition/condition.controller.js       |    2 +-
 server/api/condition/condition.model.js            |    2 +-
 server/api/condition/index.js                      |    2 +-
 server/api/dashboard/dashboard.attributes.js       |    2 +-
 server/api/dashboard/dashboard.controller.js       |    2 +-
 server/api/dashboard/dashboard.events.js           |    2 +-
 server/api/dashboard/dashboard.model.js            |    2 +-
 server/api/dashboard/dashboard.rpc.js              |    2 +-
 server/api/dashboard/dashboard.socket.js           |    2 +-
 server/api/dashboard/index.js                      |    2 +-
 .../api/dashboardItem/dashboardItem.attributes.js  |    2 +-
 .../api/dashboardItem/dashboardItem.controller.js  |    2 +-
 server/api/dashboardItem/dashboardItem.events.js   |    2 +-
 server/api/dashboardItem/dashboardItem.model.js    |    2 +-
 server/api/dashboardItem/dashboardItem.rpc.js      |    2 +-
 server/api/dashboardItem/dashboardItem.socket.js   |    2 +-
 server/api/dashboardItem/index.js                  |    2 +-
 server/api/disposition/disposition.attributes.js   |    2 +-
 server/api/disposition/disposition.controller.js   |    2 +-
 server/api/disposition/disposition.model.js        |    2 +-
 server/api/disposition/index.js                    |    2 +-
 server/api/faxAccount/faxAccount.attributes.js     |    2 +-
 server/api/faxAccount/faxAccount.controller.js     |    2 +-
 server/api/faxAccount/faxAccount.events.js         |    2 +-
 server/api/faxAccount/faxAccount.model.js          |    2 +-
 server/api/faxAccount/faxAccount.rpc.js            |    2 +-
 server/api/faxAccount/faxAccount.socket.js         |    2 +-
 server/api/faxAccount/index.js                     |    2 +-
 .../faxApplication/faxApplication.attributes.js    |    2 +-
 .../faxApplication/faxApplication.controller.js    |    2 +-
 server/api/faxApplication/faxApplication.model.js  |    2 +-
 server/api/faxApplication/faxApplication.rpc.js    |    2 +-
 server/api/faxApplication/index.js                 |    2 +-
 .../faxInteraction/faxInteraction.attributes.js    |    2 +-
 .../faxInteraction/faxInteraction.controller.js    |    2 +-
 server/api/faxInteraction/faxInteraction.events.js |    2 +-
 server/api/faxInteraction/faxInteraction.model.js  |    2 +-
 server/api/faxInteraction/faxInteraction.rpc.js    |    2 +-
 server/api/faxInteraction/faxInteraction.socket.js |    2 +-
 server/api/faxInteraction/index.js                 |    2 +-
 server/api/faxMessage/faxMessage.attributes.js     |    2 +-
 server/api/faxMessage/faxMessage.controller.js     |    2 +-
 server/api/faxMessage/faxMessage.events.js         |    2 +-
 server/api/faxMessage/faxMessage.model.js          |    2 +-
 server/api/faxMessage/faxMessage.rpc.js            |    2 +-
 server/api/faxMessage/faxMessage.socket.js         |    2 +-
 server/api/faxMessage/index.js                     |    2 +-
 server/api/faxQueue/faxQueue.attributes.js         |    2 +-
 server/api/faxQueue/faxQueue.controller.js         |    2 +-
 server/api/faxQueue/faxQueue.events.js             |    2 +-
 server/api/faxQueue/faxQueue.model.js              |    2 +-
 server/api/faxQueue/faxQueue.rpc.js                |    2 +-
 server/api/faxQueue/faxQueue.socket.js             |    2 +-
 server/api/faxQueue/index.js                       |    2 +-
 .../faxQueueReport/faxQueueReport.attributes.js    |    2 +-
 .../faxQueueReport/faxQueueReport.controller.js    |    2 +-
 server/api/faxQueueReport/faxQueueReport.model.js  |    2 +-
 server/api/faxQueueReport/faxQueueReport.rpc.js    |    2 +-
 server/api/faxQueueReport/index.js                 |    2 +-
 .../faxTransferReport.attributes.js                |    2 +-
 .../faxTransferReport.controller.js                |    2 +-
 .../faxTransferReport/faxTransferReport.model.js   |    2 +-
 server/api/faxTransferReport/index.js              |    2 +-
 server/api/intDeskAccount/index.js                 |    2 +-
 .../intDeskAccount/intDeskAccount.attributes.js    |    2 +-
 .../intDeskAccount/intDeskAccount.controller.js    |    2 +-
 server/api/intDeskAccount/intDeskAccount.model.js  |    2 +-
 server/api/intDeskAccount/intDeskAccount.rpc.js    |    2 +-
 server/api/intDeskConfiguration/index.js           |    2 +-
 .../intDeskConfiguration.attributes.js             |    2 +-
 .../intDeskConfiguration.controller.js             |    2 +-
 .../intDeskConfiguration.model.js                  |    2 +-
 server/api/intDeskField/index.js                   |    2 +-
 server/api/intDeskField/intDeskField.attributes.js |    2 +-
 server/api/intDeskField/intDeskField.controller.js |    2 +-
 server/api/intDeskField/intDeskField.model.js      |    2 +-
 server/api/intDynamics365Account/index.js          |    2 +-
 .../intDynamics365Account.attributes.js            |    2 +-
 .../intDynamics365Account.controller.js            |    2 +-
 .../intDynamics365Account.model.js                 |    2 +-
 .../intDynamics365Account.rpc.js                   |    2 +-
 server/api/intDynamics365Configuration/index.js    |    2 +-
 .../intDynamics365Configuration.attributes.js      |    2 +-
 .../intDynamics365Configuration.controller.js      |    2 +-
 .../intDynamics365Configuration.model.js           |    2 +-
 server/api/intDynamics365Field/index.js            |    2 +-
 .../intDynamics365Field.attributes.js              |    2 +-
 .../intDynamics365Field.controller.js              |    2 +-
 .../intDynamics365Field.model.js                   |    2 +-
 server/api/intFreshdeskAccount/index.js            |    2 +-
 .../intFreshdeskAccount.attributes.js              |    2 +-
 .../intFreshdeskAccount.controller.js              |    2 +-
 .../intFreshdeskAccount.model.js                   |    2 +-
 .../intFreshdeskAccount/intFreshdeskAccount.rpc.js |    2 +-
 server/api/intFreshdeskConfiguration/index.js      |    2 +-
 .../intFreshdeskConfiguration.attributes.js        |    2 +-
 .../intFreshdeskConfiguration.controller.js        |    2 +-
 .../intFreshdeskConfiguration.model.js             |    2 +-
 server/api/intFreshdeskField/index.js              |    2 +-
 .../intFreshdeskField.attributes.js                |    2 +-
 .../intFreshdeskField.controller.js                |    2 +-
 .../intFreshdeskField/intFreshdeskField.model.js   |    2 +-
 server/api/intFreshsalesAccount/index.js           |    2 +-
 .../intFreshsalesAccount.attributes.js             |    2 +-
 .../intFreshsalesAccount.controller.js             |    2 +-
 .../intFreshsalesAccount.model.js                  |    2 +-
 .../intFreshsalesAccount.rpc.js                    |    2 +-
 server/api/intFreshsalesConfiguration/index.js     |    2 +-
 .../intFreshsalesConfiguration.attributes.js       |    2 +-
 .../intFreshsalesConfiguration.controller.js       |    2 +-
 .../intFreshsalesConfiguration.model.js            |    2 +-
 server/api/intFreshsalesField/index.js             |    2 +-
 .../intFreshsalesField.attributes.js               |    2 +-
 .../intFreshsalesField.controller.js               |    2 +-
 .../intFreshsalesField/intFreshsalesField.model.js |    2 +-
 server/api/intSalesforceAccount/index.js           |    2 +-
 .../intSalesforceAccount.attributes.js             |    2 +-
 .../intSalesforceAccount.controller.js             |    2 +-
 .../intSalesforceAccount.model.js                  |    2 +-
 .../intSalesforceAccount.rpc.js                    |    2 +-
 server/api/intSalesforceConfiguration/index.js     |    2 +-
 .../intSalesforceConfiguration.attributes.js       |    2 +-
 .../intSalesforceConfiguration.controller.js       |    2 +-
 .../intSalesforceConfiguration.model.js            |    2 +-
 server/api/intSalesforceField/index.js             |    2 +-
 .../intSalesforceField.attributes.js               |    2 +-
 .../intSalesforceField.controller.js               |    2 +-
 .../intSalesforceField/intSalesforceField.model.js |    2 +-
 server/api/intServicenowAccount/index.js           |    2 +-
 .../intServicenowAccount.attributes.js             |    2 +-
 .../intServicenowAccount.controller.js             |    2 +-
 .../intServicenowAccount.model.js                  |    2 +-
 .../intServicenowAccount.rpc.js                    |    2 +-
 server/api/intServicenowConfiguration/index.js     |    2 +-
 .../intServicenowConfiguration.attributes.js       |    2 +-
 .../intServicenowConfiguration.controller.js       |    2 +-
 .../intServicenowConfiguration.model.js            |    2 +-
 server/api/intServicenowField/index.js             |    2 +-
 .../intServicenowField.attributes.js               |    2 +-
 .../intServicenowField.controller.js               |    2 +-
 .../intServicenowField/intServicenowField.model.js |    2 +-
 server/api/intSugarcrmAccount/index.js             |    2 +-
 .../intSugarcrmAccount.attributes.js               |    2 +-
 .../intSugarcrmAccount.controller.js               |    2 +-
 .../intSugarcrmAccount/intSugarcrmAccount.model.js |    2 +-
 .../intSugarcrmAccount/intSugarcrmAccount.rpc.js   |    2 +-
 server/api/intSugarcrmConfiguration/index.js       |    2 +-
 .../intSugarcrmConfiguration.attributes.js         |    2 +-
 .../intSugarcrmConfiguration.controller.js         |    2 +-
 .../intSugarcrmConfiguration.model.js              |    2 +-
 server/api/intSugarcrmField/index.js               |    2 +-
 .../intSugarcrmField.attributes.js                 |    2 +-
 .../intSugarcrmField.controller.js                 |    2 +-
 .../api/intSugarcrmField/intSugarcrmField.model.js |    2 +-
 server/api/intVtigerAccount/index.js               |    2 +-
 .../intVtigerAccount.attributes.js                 |    2 +-
 .../intVtigerAccount.controller.js                 |    2 +-
 .../api/intVtigerAccount/intVtigerAccount.model.js |    2 +-
 .../api/intVtigerAccount/intVtigerAccount.rpc.js   |    2 +-
 server/api/intVtigerConfiguration/index.js         |    2 +-
 .../intVtigerConfiguration.attributes.js           |    2 +-
 .../intVtigerConfiguration.controller.js           |    2 +-
 .../intVtigerConfiguration.model.js                |    2 +-
 server/api/intVtigerField/index.js                 |    2 +-
 .../intVtigerField/intVtigerField.attributes.js    |    2 +-
 .../intVtigerField/intVtigerField.controller.js    |    2 +-
 server/api/intVtigerField/intVtigerField.model.js  |    2 +-
 server/api/intZendeskAccount/index.js              |    2 +-
 .../intZendeskAccount.attributes.js                |    2 +-
 .../intZendeskAccount.controller.js                |    2 +-
 .../intZendeskAccount/intZendeskAccount.model.js   |    2 +-
 .../api/intZendeskAccount/intZendeskAccount.rpc.js |    2 +-
 server/api/intZendeskConfiguration/index.js        |    2 +-
 .../intZendeskConfiguration.attributes.js          |    2 +-
 .../intZendeskConfiguration.controller.js          |    2 +-
 .../intZendeskConfiguration.model.js               |    2 +-
 server/api/intZendeskField/index.js                |    2 +-
 .../intZendeskField/intZendeskField.attributes.js  |    2 +-
 .../intZendeskField/intZendeskField.controller.js  |    2 +-
 .../api/intZendeskField/intZendeskField.model.js   |    2 +-
 server/api/intZohoAccount/index.js                 |    2 +-
 .../intZohoAccount/intZohoAccount.attributes.js    |    2 +-
 .../intZohoAccount/intZohoAccount.controller.js    |    2 +-
 server/api/intZohoAccount/intZohoAccount.model.js  |    2 +-
 server/api/intZohoAccount/intZohoAccount.rpc.js    |    2 +-
 server/api/intZohoConfiguration/index.js           |    2 +-
 .../intZohoConfiguration.attributes.js             |    2 +-
 .../intZohoConfiguration.controller.js             |    2 +-
 .../intZohoConfiguration.model.js                  |    2 +-
 server/api/intZohoField/index.js                   |    2 +-
 server/api/intZohoField/intZohoField.attributes.js |    2 +-
 server/api/intZohoField/intZohoField.controller.js |    2 +-
 server/api/intZohoField/intZohoField.model.js      |    2 +-
 server/api/integration/index.js                    |    2 +-
 server/api/integration/integration.attributes.js   |    2 +-
 server/api/integration/integration.controller.js   |    2 +-
 server/api/integration/integration.model.js        |    2 +-
 server/api/integrationReport/index.js              |    2 +-
 .../integrationReport.attributes.js                |    2 +-
 .../integrationReport.controller.js                |    2 +-
 .../integrationReport/integrationReport.model.js   |    2 +-
 server/api/interval/index.js                       |    2 +-
 server/api/interval/interval.attributes.js         |    2 +-
 server/api/interval/interval.controller.js         |    2 +-
 server/api/interval/interval.model.js              |    2 +-
 server/api/interval/interval.rpc.js                |    2 +-
 server/api/jira/index.js                           |    2 +-
 server/api/jira/jira.controller.js                 |    2 +-
 server/api/jscriptyAnswerReport/index.js           |    2 +-
 .../jscriptyAnswerReport.attributes.js             |    2 +-
 .../jscriptyAnswerReport.controller.js             |    2 +-
 .../jscriptyAnswerReport.model.js                  |    2 +-
 server/api/jscriptyProject/index.js                |    2 +-
 .../jscriptyProject/jscriptyProject.attributes.js  |    2 +-
 .../jscriptyProject/jscriptyProject.controller.js  |    2 +-
 .../api/jscriptyProject/jscriptyProject.model.js   |    2 +-
 server/api/jscriptyQuestionReport/index.js         |    2 +-
 .../jscriptyQuestionReport.attributes.js           |    2 +-
 .../jscriptyQuestionReport.controller.js           |    2 +-
 .../jscriptyQuestionReport.model.js                |    2 +-
 server/api/jscriptySessionReport/index.js          |    2 +-
 .../jscriptySessionReport.attributes.js            |    2 +-
 .../jscriptySessionReport.controller.js            |    2 +-
 .../jscriptySessionReport.model.js                 |    2 +-
 server/api/license/index.js                        |    2 +-
 server/api/license/license.attributes.js           |    2 +-
 server/api/license/license.controller.js           |    2 +-
 server/api/license/license.model.js                |    2 +-
 server/api/mailAccount/index.js                    |    2 +-
 server/api/mailAccount/mailAccount.attributes.js   |    2 +-
 server/api/mailAccount/mailAccount.controller.js   |    2 +-
 server/api/mailAccount/mailAccount.events.js       |    2 +-
 server/api/mailAccount/mailAccount.model.js        |    2 +-
 server/api/mailAccount/mailAccount.rpc.js          |    2 +-
 server/api/mailAccount/mailAccount.socket.js       |    2 +-
 server/api/mailApplication/index.js                |    2 +-
 .../mailApplication/mailApplication.attributes.js  |    2 +-
 .../mailApplication/mailApplication.controller.js  |    2 +-
 .../api/mailApplication/mailApplication.model.js   |    2 +-
 server/api/mailApplication/mailApplication.rpc.js  |    2 +-
 server/api/mailInteraction/index.js                |    2 +-
 .../mailInteraction/mailInteraction.attributes.js  |    2 +-
 .../mailInteraction/mailInteraction.controller.js  |    2 +-
 .../api/mailInteraction/mailInteraction.events.js  |    2 +-
 .../api/mailInteraction/mailInteraction.model.js   |    2 +-
 server/api/mailInteraction/mailInteraction.rpc.js  |    2 +-
 .../api/mailInteraction/mailInteraction.socket.js  |    2 +-
 server/api/mailMessage/index.js                    |    2 +-
 server/api/mailMessage/mailMessage.attributes.js   |    2 +-
 server/api/mailMessage/mailMessage.controller.js   |    2 +-
 server/api/mailMessage/mailMessage.events.js       |    2 +-
 server/api/mailMessage/mailMessage.model.js        |    2 +-
 server/api/mailMessage/mailMessage.rpc.js          |    2 +-
 server/api/mailMessage/mailMessage.socket.js       |    2 +-
 server/api/mailQueue/index.js                      |    2 +-
 server/api/mailQueue/mailQueue.attributes.js       |    2 +-
 server/api/mailQueue/mailQueue.controller.js       |    2 +-
 server/api/mailQueue/mailQueue.events.js           |    2 +-
 server/api/mailQueue/mailQueue.model.js            |    2 +-
 server/api/mailQueue/mailQueue.rpc.js              |    2 +-
 server/api/mailQueue/mailQueue.socket.js           |    2 +-
 server/api/mailQueueReport/index.js                |    2 +-
 .../mailQueueReport/mailQueueReport.attributes.js  |    2 +-
 .../mailQueueReport/mailQueueReport.controller.js  |    2 +-
 .../api/mailQueueReport/mailQueueReport.model.js   |    2 +-
 server/api/mailQueueReport/mailQueueReport.rpc.js  |    2 +-
 server/api/mailServerIn/index.js                   |    2 +-
 server/api/mailServerIn/mailServerIn.attributes.js |    2 +-
 server/api/mailServerIn/mailServerIn.model.js      |    2 +-
 server/api/mailServerIn/mailServerIn.rpc.js        |    2 +-
 server/api/mailServerOut/index.js                  |    2 +-
 .../api/mailServerOut/mailServerOut.attributes.js  |    2 +-
 .../api/mailServerOut/mailServerOut.controller.js  |    2 +-
 server/api/mailServerOut/mailServerOut.model.js    |    2 +-
 server/api/mailSubstatus/index.js                  |    2 +-
 .../api/mailSubstatus/mailSubstatus.attributes.js  |    2 +-
 .../api/mailSubstatus/mailSubstatus.controller.js  |    2 +-
 server/api/mailSubstatus/mailSubstatus.model.js    |    2 +-
 server/api/mailTransferReport/index.js             |    2 +-
 .../mailTransferReport.attributes.js               |    2 +-
 .../mailTransferReport.controller.js               |    2 +-
 .../mailTransferReport/mailTransferReport.model.js |    2 +-
 server/api/memberReport/index.js                   |    2 +-
 server/api/memberReport/memberReport.attributes.js |    2 +-
 server/api/memberReport/memberReport.controller.js |    2 +-
 server/api/memberReport/memberReport.model.js      |    2 +-
 server/api/memberReport/memberReport.rpc.js        |    2 +-
 server/api/migration/index.js                      |    2 +-
 server/api/migration/migration.attributes.js       |    2 +-
 server/api/migration/migration.controller.js       |    2 +-
 server/api/migration/migration.model.js            |    2 +-
 server/api/network/index.js                        |    2 +-
 server/api/network/network.attributes.js           |    2 +-
 server/api/network/network.controller.js           |    2 +-
 server/api/network/network.model.js                |    2 +-
 server/api/notification/index.js                   |    2 +-
 server/api/notification/notification.attributes.js |    2 +-
 server/api/notification/notification.controller.js |    2 +-
 server/api/notification/notification.events.js     |    2 +-
 server/api/notification/notification.model.js      |    2 +-
 server/api/notification/notification.rpc.js        |    2 +-
 server/api/notification/notification.socket.js     |    2 +-
 server/api/openchannelAccount/index.js             |    2 +-
 .../openchannelAccount.attributes.js               |    2 +-
 .../openchannelAccount.controller.js               |    2 +-
 .../openchannelAccount.events.js                   |    2 +-
 .../openchannelAccount/openchannelAccount.model.js |    2 +-
 .../openchannelAccount/openchannelAccount.rpc.js   |    2 +-
 .../openchannelAccount.socket.js                   |    2 +-
 server/api/openchannelApplication/index.js         |    2 +-
 .../openchannelApplication.attributes.js           |    2 +-
 .../openchannelApplication.controller.js           |    2 +-
 .../openchannelApplication.model.js                |    2 +-
 .../openchannelApplication.rpc.js                  |    2 +-
 server/api/openchannelInteraction/index.js         |    2 +-
 .../openchannelInteraction.attributes.js           |    2 +-
 .../openchannelInteraction.controller.js           |    2 +-
 .../openchannelInteraction.events.js               |    2 +-
 .../openchannelInteraction.model.js                |    2 +-
 .../openchannelInteraction.rpc.js                  |    2 +-
 .../openchannelInteraction.socket.js               |    2 +-
 server/api/openchannelMessage/index.js             |    2 +-
 .../openchannelMessage.attributes.js               |    2 +-
 .../openchannelMessage.controller.js               |    2 +-
 .../openchannelMessage.events.js                   |    2 +-
 .../openchannelMessage/openchannelMessage.model.js |    2 +-
 .../openchannelMessage/openchannelMessage.rpc.js   |    2 +-
 .../openchannelMessage.socket.js                   |    2 +-
 server/api/openchannelQueue/index.js               |    2 +-
 .../openchannelQueue.attributes.js                 |    2 +-
 .../openchannelQueue.controller.js                 |    2 +-
 .../openchannelQueue/openchannelQueue.events.js    |    2 +-
 .../api/openchannelQueue/openchannelQueue.model.js |    2 +-
 .../api/openchannelQueue/openchannelQueue.rpc.js   |    2 +-
 .../openchannelQueue/openchannelQueue.socket.js    |    2 +-
 server/api/openchannelQueueReport/index.js         |    2 +-
 .../openchannelQueueReport.attributes.js           |    2 +-
 .../openchannelQueueReport.controller.js           |    2 +-
 .../openchannelQueueReport.model.js                |    2 +-
 .../openchannelQueueReport.rpc.js                  |    2 +-
 server/api/openchannelTransferReport/index.js      |    2 +-
 .../openchannelTransferReport.attributes.js        |    2 +-
 .../openchannelTransferReport.controller.js        |    2 +-
 .../openchannelTransferReport.model.js             |    2 +-
 server/api/pause/index.js                          |    2 +-
 server/api/pause/pause.attributes.js               |    2 +-
 server/api/pause/pause.controller.js               |    2 +-
 server/api/pause/pause.model.js                    |    2 +-
 server/api/pause/pause.rpc.js                      |    2 +-
 server/api/plugin/index.js                         |    2 +-
 server/api/plugin/plugin.attributes.js             |    2 +-
 server/api/plugin/plugin.controller.js             |    2 +-
 server/api/plugin/plugin.events.js                 |    2 +-
 server/api/plugin/plugin.model.js                  |    2 +-
 server/api/plugin/plugin.rpc.js                    |    2 +-
 server/api/plugin/plugin.socket.js                 |    2 +-
 server/api/pm2/index.js                            |    2 +-
 server/api/pm2/pm2.controller.js                   |    2 +-
 server/api/reportAgentPreview/index.js             |    2 +-
 .../reportAgentPreview.attributes.js               |    2 +-
 .../reportAgentPreview/reportAgentPreview.model.js |    2 +-
 .../reportAgentPreview/reportAgentPreview.rpc.js   |    2 +-
 server/api/rpc/index.js                            |    2 +-
 server/api/rpc/rpc.controller.js                   |    2 +-
 server/api/schedule/index.js                       |    2 +-
 server/api/schedule/schedule.attributes.js         |    2 +-
 server/api/schedule/schedule.controller.js         |    2 +-
 server/api/schedule/schedule.model.js              |    2 +-
 server/api/screenRecording/index.js                |    2 +-
 .../screenRecording/screenRecording.attributes.js  |    2 +-
 .../screenRecording/screenRecording.controller.js  |    2 +-
 .../api/screenRecording/screenRecording.model.js   |    2 +-
 server/api/setting/index.js                        |    2 +-
 server/api/setting/setting.attributes.js           |    2 +-
 server/api/setting/setting.controller.js           |    2 +-
 server/api/setting/setting.model.js                |    2 +-
 server/api/smsAccount/index.js                     |    2 +-
 server/api/smsAccount/smsAccount.attributes.js     |    2 +-
 server/api/smsAccount/smsAccount.controller.js     |    2 +-
 server/api/smsAccount/smsAccount.events.js         |    2 +-
 server/api/smsAccount/smsAccount.model.js          |    2 +-
 server/api/smsAccount/smsAccount.rpc.js            |    2 +-
 server/api/smsAccount/smsAccount.socket.js         |    2 +-
 server/api/smsApplication/index.js                 |    2 +-
 .../smsApplication/smsApplication.attributes.js    |    2 +-
 .../smsApplication/smsApplication.controller.js    |    2 +-
 server/api/smsApplication/smsApplication.model.js  |    2 +-
 server/api/smsInteraction/index.js                 |    2 +-
 .../smsInteraction/smsInteraction.attributes.js    |    2 +-
 .../smsInteraction/smsInteraction.controller.js    |    2 +-
 server/api/smsInteraction/smsInteraction.events.js |    2 +-
 server/api/smsInteraction/smsInteraction.model.js  |    2 +-
 server/api/smsInteraction/smsInteraction.rpc.js    |    2 +-
 server/api/smsInteraction/smsInteraction.socket.js |    2 +-
 server/api/smsMessage/index.js                     |    2 +-
 server/api/smsMessage/smsMessage.attributes.js     |    2 +-
 server/api/smsMessage/smsMessage.controller.js     |    2 +-
 server/api/smsMessage/smsMessage.events.js         |    2 +-
 server/api/smsMessage/smsMessage.model.js          |    2 +-
 server/api/smsMessage/smsMessage.rpc.js            |    2 +-
 server/api/smsMessage/smsMessage.socket.js         |    2 +-
 server/api/smsQueue/index.js                       |    2 +-
 server/api/smsQueue/smsQueue.attributes.js         |    2 +-
 server/api/smsQueue/smsQueue.controller.js         |    2 +-
 server/api/smsQueue/smsQueue.events.js             |    2 +-
 server/api/smsQueue/smsQueue.model.js              |    2 +-
 server/api/smsQueue/smsQueue.rpc.js                |    2 +-
 server/api/smsQueue/smsQueue.socket.js             |    2 +-
 server/api/smsQueueReport/index.js                 |    2 +-
 .../smsQueueReport/smsQueueReport.attributes.js    |    2 +-
 .../smsQueueReport/smsQueueReport.controller.js    |    2 +-
 server/api/smsQueueReport/smsQueueReport.model.js  |    2 +-
 server/api/smsQueueReport/smsQueueReport.rpc.js    |    2 +-
 server/api/smsTransferReport/index.js              |    2 +-
 .../smsTransferReport.attributes.js                |    2 +-
 .../smsTransferReport.controller.js                |    2 +-
 .../smsTransferReport/smsTransferReport.model.js   |    2 +-
 server/api/sound/index.js                          |    2 +-
 server/api/sound/sound.attributes.js               |    2 +-
 server/api/sound/sound.controller.js               |    2 +-
 server/api/sound/sound.model.js                    |    2 +-
 server/api/sound/sound.rpc.js                      |    2 +-
 server/api/squareMessage/index.js                  |    2 +-
 .../api/squareMessage/squareMessage.attributes.js  |    2 +-
 .../api/squareMessage/squareMessage.controller.js  |    2 +-
 server/api/squareMessage/squareMessage.model.js    |    2 +-
 server/api/squareMessage/squareMessage.rpc.js      |    2 +-
 server/api/squareOdbc/index.js                     |    2 +-
 server/api/squareOdbc/squareOdbc.attributes.js     |    2 +-
 server/api/squareOdbc/squareOdbc.controller.js     |    2 +-
 server/api/squareOdbc/squareOdbc.model.js          |    2 +-
 server/api/squareOdbc/squareOdbc.rpc.js            |    2 +-
 server/api/squareProject/index.js                  |    2 +-
 .../api/squareProject/squareProject.attributes.js  |    2 +-
 .../api/squareProject/squareProject.controller.js  |    2 +-
 server/api/squareProject/squareProject.events.js   |    2 +-
 server/api/squareProject/squareProject.model.js    |    2 +-
 server/api/squareProject/squareProject.rpc.js      |    2 +-
 server/api/squareProject/squareProject.socket.js   |    2 +-
 server/api/squareRecording/index.js                |    2 +-
 .../squareRecording/squareRecording.attributes.js  |    2 +-
 .../squareRecording/squareRecording.controller.js  |    2 +-
 .../api/squareRecording/squareRecording.model.js   |    2 +-
 server/api/squareRecording/squareRecording.rpc.js  |    2 +-
 server/api/squareReport/index.js                   |    2 +-
 server/api/squareReport/squareReport.attributes.js |    2 +-
 server/api/squareReport/squareReport.controller.js |    2 +-
 server/api/squareReport/squareReport.model.js      |    2 +-
 server/api/squareReport/squareReport.rpc.js        |    2 +-
 server/api/squareReportDetail/index.js             |    2 +-
 .../squareReportDetail.attributes.js               |    2 +-
 .../squareReportDetail.controller.js               |    2 +-
 .../squareReportDetail/squareReportDetail.model.js |    2 +-
 .../squareReportDetail/squareReportDetail.rpc.js   |    2 +-
 server/api/system/index.js                         |    2 +-
 server/api/system/system.controller.js             |    2 +-
 server/api/tag/index.js                            |    2 +-
 server/api/tag/tag.attributes.js                   |    2 +-
 server/api/tag/tag.controller.js                   |    2 +-
 server/api/tag/tag.model.js                        |    2 +-
 server/api/team/index.js                           |    2 +-
 server/api/team/team.attributes.js                 |    2 +-
 server/api/team/team.controller.js                 |    2 +-
 server/api/team/team.events.js                     |    2 +-
 server/api/team/team.model.js                      |    2 +-
 server/api/team/team.rpc.js                        |    2 +-
 server/api/team/team.socket.js                     |    2 +-
 server/api/template/index.js                       |    2 +-
 server/api/template/template.attributes.js         |    2 +-
 server/api/template/template.controller.js         |    2 +-
 server/api/template/template.model.js              |    2 +-
 server/api/template/template.rpc.js                |    2 +-
 server/api/trigger/index.js                        |    2 +-
 server/api/trigger/trigger.attributes.js           |    2 +-
 server/api/trigger/trigger.controller.js           |    2 +-
 server/api/trigger/trigger.model.js                |    2 +-
 server/api/trigger/trigger.rpc.js                  |    2 +-
 server/api/trunk/index.js                          |    2 +-
 server/api/trunk/trunk.attributes.js               |    2 +-
 server/api/trunk/trunk.controller.js               |    2 +-
 server/api/trunk/trunk.model.js                    |    2 +-
 server/api/trunk/trunk.rpc.js                      |    2 +-
 server/api/user/index.js                           |    2 +-
 server/api/user/user.attributes.js                 |    2 +-
 server/api/user/user.controller.js                 |    2 +-
 server/api/user/user.events.js                     |    2 +-
 server/api/user/user.model.js                      |    2 +-
 server/api/user/user.rpc.js                        |    2 +-
 server/api/user/user.socket.js                     |    2 +-
 server/api/userChatQueue/index.js                  |    2 +-
 .../api/userChatQueue/userChatQueue.attributes.js  |    2 +-
 server/api/userChatQueue/userChatQueue.model.js    |    2 +-
 server/api/userFaxQueue/index.js                   |    2 +-
 server/api/userFaxQueue/userFaxQueue.attributes.js |    2 +-
 server/api/userFaxQueue/userFaxQueue.model.js      |    2 +-
 server/api/userMailQueue/index.js                  |    2 +-
 .../api/userMailQueue/userMailQueue.attributes.js  |    2 +-
 server/api/userMailQueue/userMailQueue.model.js    |    2 +-
 server/api/userOpenchannelQueue/index.js           |    2 +-
 .../userOpenchannelQueue.attributes.js             |    2 +-
 .../userOpenchannelQueue.model.js                  |    2 +-
 server/api/userProfile/index.js                    |    2 +-
 server/api/userProfile/userProfile.attributes.js   |    2 +-
 server/api/userProfile/userProfile.controller.js   |    2 +-
 server/api/userProfile/userProfile.events.js       |    2 +-
 server/api/userProfile/userProfile.model.js        |    2 +-
 server/api/userProfile/userProfile.rpc.js          |    2 +-
 server/api/userProfile/userProfile.socket.js       |    2 +-
 server/api/userProfileResource/index.js            |    2 +-
 .../userProfileResource.attributes.js              |    2 +-
 .../userProfileResource.controller.js              |    2 +-
 .../userProfileResource.model.js                   |    2 +-
 server/api/userProfileSection/index.js             |    2 +-
 .../userProfileSection.attributes.js               |    2 +-
 .../userProfileSection.controller.js               |    2 +-
 .../userProfileSection/userProfileSection.model.js |    2 +-
 server/api/userSmsQueue/index.js                   |    2 +-
 server/api/userSmsQueue/userSmsQueue.attributes.js |    2 +-
 server/api/userSmsQueue/userSmsQueue.model.js      |    2 +-
 server/api/userVoiceQueue/index.js                 |    2 +-
 .../userVoiceQueue/userVoiceQueue.attributes.js    |    2 +-
 server/api/userVoiceQueue/userVoiceQueue.model.js  |    2 +-
 server/api/userVoiceQueueRt/index.js               |    2 +-
 .../userVoiceQueueRt.attributes.js                 |    2 +-
 .../userVoiceQueueRt/userVoiceQueueRt.events.js    |    2 +-
 .../api/userVoiceQueueRt/userVoiceQueueRt.model.js |    2 +-
 .../api/userVoiceQueueRt/userVoiceQueueRt.rpc.js   |    2 +-
 .../userVoiceQueueRt/userVoiceQueueRt.socket.js    |    2 +-
 server/api/userWhatsappQueue/index.js              |    2 +-
 .../userWhatsappQueue.attributes.js                |    2 +-
 .../userWhatsappQueue/userWhatsappQueue.model.js   |    2 +-
 server/api/variable/index.js                       |    2 +-
 server/api/variable/variable.attributes.js         |    2 +-
 server/api/variable/variable.controller.js         |    2 +-
 server/api/variable/variable.model.js              |    2 +-
 server/api/variable/variable.rpc.js                |    2 +-
 server/api/version/index.js                        |    2 +-
 server/api/version/version.controller.js           |    2 +-
 server/api/voiceAgentReport/index.js               |    2 +-
 .../voiceAgentReport.attributes.js                 |    2 +-
 .../voiceAgentReport.controller.js                 |    2 +-
 .../api/voiceAgentReport/voiceAgentReport.model.js |    2 +-
 .../api/voiceAgentReport/voiceAgentReport.rpc.js   |    2 +-
 server/api/voiceCallReport/index.js                |    2 +-
 .../voiceCallReport/voiceCallReport.attributes.js  |    2 +-
 .../voiceCallReport/voiceCallReport.controller.js  |    2 +-
 .../api/voiceCallReport/voiceCallReport.model.js   |    2 +-
 server/api/voiceCallReport/voiceCallReport.rpc.js  |    2 +-
 server/api/voiceChanSpy/index.js                   |    2 +-
 server/api/voiceChanSpy/voiceChanSpy.attributes.js |    2 +-
 server/api/voiceChanSpy/voiceChanSpy.controller.js |    2 +-
 server/api/voiceChanSpy/voiceChanSpy.model.js      |    2 +-
 server/api/voiceContext/index.js                   |    2 +-
 server/api/voiceContext/voiceContext.attributes.js |    2 +-
 server/api/voiceContext/voiceContext.controller.js |    2 +-
 server/api/voiceContext/voiceContext.model.js      |    2 +-
 server/api/voiceDialReport/index.js                |    2 +-
 .../voiceDialReport/voiceDialReport.attributes.js  |    2 +-
 .../voiceDialReport/voiceDialReport.controller.js  |    2 +-
 .../api/voiceDialReport/voiceDialReport.model.js   |    2 +-
 server/api/voiceDialReport/voiceDialReport.rpc.js  |    2 +-
 server/api/voiceExtension/index.js                 |    2 +-
 .../voiceExtension/voiceExtension.attributes.js    |    2 +-
 .../voiceExtension/voiceExtension.controller.js    |    2 +-
 server/api/voiceExtension/voiceExtension.events.js |    2 +-
 server/api/voiceExtension/voiceExtension.model.js  |    2 +-
 server/api/voiceExtension/voiceExtension.rpc.js    |    2 +-
 server/api/voiceExtension/voiceExtension.socket.js |    2 +-
 server/api/voiceMail/index.js                      |    2 +-
 server/api/voiceMail/voiceMail.attributes.js       |    2 +-
 server/api/voiceMail/voiceMail.controller.js       |    2 +-
 server/api/voiceMail/voiceMail.model.js            |    2 +-
 server/api/voiceMailMessage/index.js               |    2 +-
 .../voiceMailMessage.attributes.js                 |    2 +-
 .../voiceMailMessage.controller.js                 |    2 +-
 .../api/voiceMailMessage/voiceMailMessage.model.js |    2 +-
 server/api/voiceMusicOnHold/index.js               |    2 +-
 .../voiceMusicOnHold.attributes.js                 |    2 +-
 .../voiceMusicOnHold.controller.js                 |    2 +-
 .../api/voiceMusicOnHold/voiceMusicOnHold.model.js |    2 +-
 server/api/voicePrefix/index.js                    |    2 +-
 server/api/voicePrefix/voicePrefix.attributes.js   |    2 +-
 server/api/voicePrefix/voicePrefix.controller.js   |    2 +-
 server/api/voicePrefix/voicePrefix.events.js       |    2 +-
 server/api/voicePrefix/voicePrefix.model.js        |    2 +-
 server/api/voicePrefix/voicePrefix.rpc.js          |    2 +-
 server/api/voicePrefix/voicePrefix.socket.js       |    2 +-
 server/api/voiceQueue/index.js                     |    2 +-
 server/api/voiceQueue/voiceQueue.attributes.js     |    2 +-
 server/api/voiceQueue/voiceQueue.controller.js     |    2 +-
 server/api/voiceQueue/voiceQueue.events.js         |    2 +-
 server/api/voiceQueue/voiceQueue.model.js          |    2 +-
 server/api/voiceQueue/voiceQueue.rpc.js            |    2 +-
 server/api/voiceQueue/voiceQueue.socket.js         |    2 +-
 server/api/voiceQueueReport/index.js               |    2 +-
 .../voiceQueueReport.attributes.js                 |    2 +-
 .../voiceQueueReport.controller.js                 |    2 +-
 .../voiceQueueReport/voiceQueueReport.events.js    |    2 +-
 .../api/voiceQueueReport/voiceQueueReport.model.js |    2 +-
 .../api/voiceQueueReport/voiceQueueReport.rpc.js   |    2 +-
 .../voiceQueueReport/voiceQueueReport.socket.js    |    2 +-
 server/api/voiceQueuesLog/index.js                 |    2 +-
 .../voiceQueuesLog/voiceQueuesLog.attributes.js    |    2 +-
 .../voiceQueuesLog/voiceQueuesLog.controller.js    |    2 +-
 server/api/voiceQueuesLog/voiceQueuesLog.model.js  |    2 +-
 server/api/voiceRecording/index.js                 |    2 +-
 .../voiceRecording/voiceRecording.attributes.js    |    2 +-
 .../voiceRecording/voiceRecording.controller.js    |    2 +-
 server/api/voiceRecording/voiceRecording.model.js  |    2 +-
 server/api/voiceRecording/voiceRecording.rpc.js    |    2 +-
 server/api/voiceTransferReport/index.js            |    2 +-
 .../voiceTransferReport.attributes.js              |    2 +-
 .../voiceTransferReport.controller.js              |    2 +-
 .../voiceTransferReport.model.js                   |    2 +-
 .../voiceTransferReport/voiceTransferReport.rpc.js |    2 +-
 server/api/webbar/index.js                         |    2 +-
 server/api/webbar/webbar.controller.js             |    2 +-
 server/api/whatsappAccount/index.js                |    2 +-
 .../whatsappAccount/whatsappAccount.attributes.js  |    2 +-
 .../whatsappAccount/whatsappAccount.controller.js  |    2 +-
 .../api/whatsappAccount/whatsappAccount.events.js  |    2 +-
 .../api/whatsappAccount/whatsappAccount.model.js   |    2 +-
 server/api/whatsappAccount/whatsappAccount.rpc.js  |    2 +-
 .../api/whatsappAccount/whatsappAccount.socket.js  |    2 +-
 server/api/whatsappApplication/index.js            |    2 +-
 .../whatsappApplication.attributes.js              |    2 +-
 .../whatsappApplication.controller.js              |    2 +-
 .../whatsappApplication.model.js                   |    2 +-
 server/api/whatsappInteraction/index.js            |    2 +-
 .../whatsappInteraction.attributes.js              |    2 +-
 .../whatsappInteraction.controller.js              |    2 +-
 .../whatsappInteraction.events.js                  |    2 +-
 .../whatsappInteraction.model.js                   |    2 +-
 .../whatsappInteraction/whatsappInteraction.rpc.js |    2 +-
 .../whatsappInteraction.socket.js                  |    2 +-
 server/api/whatsappMessage/index.js                |    2 +-
 .../whatsappMessage/whatsappMessage.attributes.js  |    2 +-
 .../whatsappMessage/whatsappMessage.controller.js  |    2 +-
 .../api/whatsappMessage/whatsappMessage.events.js  |    2 +-
 .../api/whatsappMessage/whatsappMessage.model.js   |    2 +-
 server/api/whatsappMessage/whatsappMessage.rpc.js  |    2 +-
 .../api/whatsappMessage/whatsappMessage.socket.js  |    2 +-
 server/api/whatsappQueue/index.js                  |    2 +-
 .../api/whatsappQueue/whatsappQueue.attributes.js  |    2 +-
 .../api/whatsappQueue/whatsappQueue.controller.js  |    2 +-
 server/api/whatsappQueue/whatsappQueue.events.js   |    2 +-
 server/api/whatsappQueue/whatsappQueue.model.js    |    2 +-
 server/api/whatsappQueue/whatsappQueue.rpc.js      |    2 +-
 server/api/whatsappQueue/whatsappQueue.socket.js   |    2 +-
 server/api/whatsappQueueReport/index.js            |    2 +-
 .../whatsappQueueReport.attributes.js              |    2 +-
 .../whatsappQueueReport.controller.js              |    2 +-
 .../whatsappQueueReport.model.js                   |    2 +-
 .../whatsappQueueReport/whatsappQueueReport.rpc.js |    2 +-
 server/api/whatsappTransferReport/index.js         |    2 +-
 .../whatsappTransferReport.attributes.js           |    2 +-
 .../whatsappTransferReport.controller.js           |    2 +-
 .../whatsappTransferReport.model.js                |    2 +-
 server/app.js                                      |    2 +-
 server/components/auth/service.js                  |    2 +-
 .../components/encryptor/create-cypher-fallback.js |    2 +-
 server/components/encryptor/index.js               |    2 +-
 server/components/export/csv.js                    |    2 +-
 server/components/export/pdf.js                    |    2 +-
 server/components/export/xlsx.js                   |    2 +-
 server/components/extensions/rewrite.js            |    2 +-
 server/components/import/cm/csv.js                 |    2 +-
 server/components/import/cm/csv2.js                |    2 +-
 server/components/integrations/configuration.js    |    2 +-
 server/components/interaction/service.js           |    2 +-
 server/components/license/service.js               |    2 +-
 server/components/parsers/advancedSearch.js        |    2 +-
 server/components/parsers/qs.js                    |    2 +-
 server/config/config.service.js                    |    2 +-
 server/config/environment/development.js           |    2 +-
 server/config/environment/index.js                 |    2 +-
 server/config/environment/shared.js                |    2 +-
 server/config/environment/test.js                  |    2 +-
 server/config/express.js                           |    2 +-
 server/config/license/hardware.js                  |    2 +-
 server/config/license/index.js                     |    2 +-
 server/config/license/util.js                      |    2 +-
 server/config/local.env.js                         |    2 +-
 server/config/logger.js                            |    2 +-
 server/config/pm2/config.js                        |    2 +-
 server/config/pm2/index.js                         |    2 +-
 server/config/schedule/chat.js                     |    2 +-
 server/config/schedule/index.js                    |    2 +-
 server/config/schedule/transcribe.js               |    2 +-
 server/config/seedContact.js                       |    2 +-
 server/config/seedDB/analyticReports.js            |    2 +-
 server/config/seedDB/analyticTreeReports.js        |    2 +-
 server/config/seedDB/chanspy.js                    |    2 +-
 server/config/seedDB/companies.js                  |    2 +-
 server/config/seedDB/contacts.js                   |    2 +-
 server/config/seedDB/dispositions.js               |    2 +-
 server/config/seedDB/index.js                      |    2 +-
 server/config/seedDB/intervals.js                  |    2 +-
 server/config/seedDB/jscriptyProjects.js           |    2 +-
 server/config/seedDB/lists.js                      |    2 +-
 server/config/seedDB/mailAccounts.js               |    2 +-
 server/config/seedDB/mailSubstatuses.js            |    2 +-
 server/config/seedDB/migrations.js                 |    2 +-
 server/config/seedDB/pauses.js                     |    2 +-
 server/config/seedDB/report/default.js             |    2 +-
 server/config/seedDB/report/fields.js              |    2 +-
 server/config/seedDB/report/index.js               |    2 +-
 server/config/seedDB/sounds.js                     |    2 +-
 server/config/seedDB/squareOdbc.js                 |    2 +-
 server/config/seedDB/squareProjects.js             |    2 +-
 server/config/seedDB/tags.js                       |    2 +-
 server/config/seedDB/teams.js                      |    2 +-
 server/config/seedDB/tree/index.js                 |    2 +-
 server/config/seedDB/trunks.js                     |    2 +-
 server/config/seedDB/userProfiles.js               |    2 +-
 server/config/seedDB/users.js                      |    2 +-
 server/config/seedDB/variables.js                  |    2 +-
 server/config/seedDB/voiceContexts.js              |    2 +-
 server/config/seedDB/voiceExtensions.js            |    2 +-
 server/config/seedDB/voiceMusicOnHold.js           |    2 +-
 server/config/seedDB/voiceQueues.js                |    2 +-
 server/config/seedUsers.js                         |    2 +-
 server/config/socketio.js                          |    2 +-
 server/config/triggers/index.js                    |    2 +-
 server/config/utils.js                             |    2 +-
 server/errors/index.js                             |    2 +-
 server/globals.js                                  |    2 +-
 server/migrations/2.0.12.js                        |    2 +-
 server/migrations/2.0.13.js                        |    2 +-
 server/migrations/2.0.14.js                        |    2 +-
 server/migrations/2.0.15.js                        |    2 +-
 server/migrations/2.0.16.js                        |    2 +-
 server/migrations/2.0.17.js                        |    2 +-
 server/migrations/2.0.18.js                        |    2 +-
 server/migrations/2.0.19.js                        |    2 +-
 server/migrations/2.0.20.js                        |    2 +-
 server/migrations/2.0.21.js                        |    2 +-
 server/migrations/2.0.22.js                        |    2 +-
 server/migrations/2.0.23.js                        |    2 +-
 server/migrations/2.0.24.js                        |    2 +-
 server/migrations/2.0.25.js                        |    2 +-
 server/migrations/2.0.26.js                        |    2 +-
 server/migrations/2.0.27.js                        |    2 +-
 server/migrations/2.0.28.js                        |    2 +-
 server/migrations/2.0.29.js                        |    2 +-
 server/migrations/2.0.30.js                        |    2 +-
 server/migrations/2.0.31.js                        |    2 +-
 server/migrations/2.0.32.js                        |    2 +-
 server/migrations/2.0.33.js                        |    2 +-
 server/migrations/2.0.34.js                        |    2 +-
 server/migrations/2.0.35.js                        |    2 +-
 server/migrations/2.0.36.js                        |    2 +-
 server/migrations/2.0.37.js                        |    2 +-
 server/migrations/2.0.38.js                        |    2 +-
 server/migrations/2.0.39.js                        |    2 +-
 server/migrations/2.0.40.js                        |    2 +-
 server/migrations/2.0.41.js                        |    2 +-
 server/migrations/2.0.42.js                        |    2 +-
 server/migrations/2.0.43.js                        |    2 +-
 server/migrations/2.0.44.js                        |    2 +-
 server/migrations/2.0.45.js                        |    2 +-
 server/migrations/2.0.46.js                        |    2 +-
 server/migrations/2.0.47.js                        |    2 +-
 server/migrations/2.0.48.js                        |    2 +-
 server/migrations/2.0.49.js                        |    2 +-
 server/migrations/2.0.50.js                        |    2 +-
 server/migrations/2.0.51.js                        |    2 +-
 server/migrations/2.0.52.js                        |    2 +-
 server/migrations/2.0.53.js                        |    2 +-
 server/migrations/2.0.54.js                        |    2 +-
 server/migrations/2.0.55.js                        |    2 +-
 server/migrations/2.0.56.js                        |    2 +-
 server/migrations/2.0.57.js                        |    2 +-
 server/migrations/2.0.58.js                        |    2 +-
 server/migrations/2.0.59.js                        |    2 +-
 server/migrations/2.0.60.js                        |    2 +-
 server/migrations/2.0.61.js                        |    2 +-
 server/migrations/2.0.62.js                        |    2 +-
 server/migrations/2.0.63.js                        |    2 +-
 server/migrations/2.0.64.js                        |    2 +-
 server/migrations/2.0.65.js                        |    2 +-
 server/migrations/2.0.66.js                        |    2 +-
 server/migrations/2.0.67.js                        |    2 +-
 server/migrations/2.0.68.js                        |    2 +-
 server/migrations/2.0.69.js                        |    2 +-
 server/migrations/2.0.70.js                        |    2 +-
 server/migrations/2.0.71.js                        |    2 +-
 server/migrations/2.0.72.js                        |    2 +-
 server/migrations/2.0.73.js                        |    2 +-
 server/migrations/2.0.74.js                        |    2 +-
 server/migrations/2.0.75.js                        |    2 +-
 server/migrations/2.0.76.js                        |    2 +-
 server/migrations/2.0.77.js                        |    2 +-
 server/migrations/2.0.78.js                        |    2 +-
 server/migrations/2.0.79.js                        |    2 +-
 server/migrations/2.0.80.js                        |    2 +-
 server/migrations/2.0.81.js                        |    2 +-
 server/migrations/2.0.82.js                        |    2 +-
 server/migrations/2.0.83.js                        |    2 +-
 server/migrations/2.0.84.js                        |    2 +-
 server/migrations/2.1.0.js                         |    2 +-
 server/migrations/2.2.0.js                         |    2 +-
 server/migrations/2.2.1.js                         |    2 +-
 server/migrations/2.2.2.js                         |    2 +-
 server/migrations/2.2.3.js                         |    2 +-
 server/migrations/2.2.4.js                         |    2 +-
 server/migrations/2.2.5.js                         |    2 +-
 server/migrations/2.2.6.js                         |    2 +-
 server/migrations/2.3.0.js                         |    2 +-
 server/migrations/2.3.1.js                         |    2 +-
 server/migrations/2.3.10.js                        |    2 +-
 server/migrations/2.3.2.js                         |    2 +-
 server/migrations/2.3.3.js                         |    2 +-
 server/migrations/2.3.4.js                         |    2 +-
 server/migrations/2.3.5.js                         |    2 +-
 server/migrations/2.3.6.js                         |    2 +-
 server/migrations/2.3.7.js                         |    2 +-
 server/migrations/2.3.8.js                         |    2 +-
 server/migrations/2.3.9.js                         |    2 +-
 server/migrations/2.3.91.js                        |    2 +-
 server/migrations/2.3.92.js                        |    2 +-
 server/migrations/2.3.93.js                        |    2 +-
 server/migrations/2.3.94.js                        |    2 +-
 server/migrations/2.3.95.js                        |    2 +-
 server/migrations/2.3.96.js                        |    2 +-
 server/migrations/2.3.97.js                        |    2 +-
 server/migrations/2.3.98.js                        |    2 +-
 server/migrations/2.4.0.js                         |    2 +-
 server/migrations/2.4.1.js                         |    2 +-
 server/migrations/2.4.10.js                        |    2 +-
 server/migrations/2.4.11.js                        |    2 +-
 server/migrations/2.4.12.js                        |    2 +-
 server/migrations/2.4.13.js                        |    2 +-
 server/migrations/2.4.14.js                        |    2 +-
 server/migrations/2.4.15.js                        |    2 +-
 server/migrations/2.4.16.js                        |    2 +-
 server/migrations/2.4.17.js                        |    2 +-
 server/migrations/2.4.18.js                        |    2 +-
 server/migrations/2.4.19.js                        |    2 +-
 server/migrations/2.4.2.js                         |    2 +-
 server/migrations/2.4.20.js                        |    2 +-
 server/migrations/2.4.21.js                        |    2 +-
 server/migrations/2.4.3.js                         |    2 +-
 server/migrations/2.4.4.js                         |    2 +-
 server/migrations/2.4.5.js                         |    2 +-
 server/migrations/2.4.6.js                         |    2 +-
 server/migrations/2.4.7.js                         |    2 +-
 server/migrations/2.4.8.js                         |    2 +-
 server/migrations/2.4.9.js                         |    2 +-
 server/migrations/2.5.0.js                         |    2 +-
 server/migrations/2.5.1.js                         |    2 +-
 server/migrations/2.5.2.js                         |    2 +-
 server/migrations/2.5.3.js                         |    2 +-
 server/migrations/2.5.4.js                         |    2 +-
 server/migrations/2.5.5.js                         |    2 +-
 server/migrations/2.5.6.js                         |    2 +-
 server/migrations/3.0.0-alpha.js                   |    2 +-
 server/mysqldb/index.js                            |    2 +-
 server/rediscache/index.js                         |    2 +-
 server/routes.js                                   |    2 +-
 server/rpc/index.js                                |    2 +-
 server/services/agi/channel.js                     |    2 +-
 server/services/agi/error.js                       |    2 +-
 server/services/agi/graph/index.js                 |    2 +-
 server/services/agi/index.js                       |    2 +-
 server/services/agi/mailRpc/index.js               |    2 +-
 server/services/agi/reply.js                       |    2 +-
 server/services/agi/rpc/index.js                   |    2 +-
 server/services/agi/scripts/aws/index.js           |    2 +-
 server/services/agi/scripts/aws/lex/index.js       |    2 +-
 server/services/agi/scripts/aws/lex/lib/api.js     |    2 +-
 server/services/agi/scripts/aws/polly/index.js     |    2 +-
 server/services/agi/scripts/aws/polly/lib/api.js   |    2 +-
 server/services/agi/scripts/google/asr/index.js    |    2 +-
 server/services/agi/scripts/google/asr/lib/api.js  |    2 +-
 server/services/agi/scripts/google/index.js        |    2 +-
 server/services/agi/scripts/index.js               |    2 +-
 server/services/agi/scripts/sestek/index.js        |    2 +-
 server/services/agi/scripts/sestek/nda/index.js    |    2 +-
 server/services/agi/scripts/tilde/asr/index.js     |    2 +-
 server/services/agi/scripts/tilde/asr/lib/api.js   |    2 +-
 server/services/agi/scripts/tilde/index.js         |    2 +-
 server/services/agi/server.js                      |    2 +-
 server/services/agi/vertices.js                    |    2 +-
 server/services/ami/acw/index.js                   |    2 +-
 server/services/ami/ami.js                         |    2 +-
 server/services/ami/client.js                      |    2 +-
 server/services/ami/dialer/action.js               |    2 +-
 server/services/ami/dialer/agentComplete.js        |    2 +-
 server/services/ami/dialer/final.js                |    2 +-
 server/services/ami/dialer/hangup.js               |    2 +-
 server/services/ami/dialer/history.js              |    2 +-
 server/services/ami/dialer/index.js                |    2 +-
 server/services/ami/dialer/queueCallerAbandon.js   |    2 +-
 server/services/ami/fax/action.js                  |    2 +-
 server/services/ami/fax/index.js                   |    2 +-
 server/services/ami/fax/rpcDb.js                   |    2 +-
 server/services/ami/fax/util/gs.js                 |    2 +-
 server/services/ami/fax/util/util.js               |    2 +-
 server/services/ami/index.js                       |    2 +-
 server/services/ami/model/agent.js                 |    2 +-
 server/services/ami/model/campaign.js              |    2 +-
 server/services/ami/model/channel.js               |    2 +-
 server/services/ami/model/deskAccount.js           |    2 +-
 server/services/ami/model/dynamics365Account.js    |    2 +-
 server/services/ami/model/faxAccount.js            |    2 +-
 server/services/ami/model/freshdeskAccount.js      |    2 +-
 server/services/ami/model/freshsalesAccount.js     |    2 +-
 server/services/ami/model/queueReport.js           |    2 +-
 server/services/ami/model/salesforceAccount.js     |    2 +-
 server/services/ami/model/servicenowAccount.js     |    2 +-
 server/services/ami/model/sugarcrmAccount.js       |    2 +-
 server/services/ami/model/telephone.js             |    2 +-
 server/services/ami/model/template.js              |    2 +-
 server/services/ami/model/trigger.js               |    2 +-
 server/services/ami/model/trunk.js                 |    2 +-
 server/services/ami/model/voiceExtension.js        |    2 +-
 server/services/ami/model/voiceQueue.js            |    2 +-
 server/services/ami/model/vtigerAccount.js         |    2 +-
 server/services/ami/model/zendeskAccount.js        |    2 +-
 server/services/ami/model/zohoAccount.js           |    2 +-
 server/services/ami/preview/action.js              |    2 +-
 server/services/ami/preview/index.js               |    2 +-
 server/services/ami/preview/rpcDb.js               |    2 +-
 server/services/ami/preview/util/util.js           |    2 +-
 server/services/ami/properties.js                  |    2 +-
 server/services/ami/realtime/index.js              |    2 +-
 server/services/ami/report/index.js                |    2 +-
 server/services/ami/report/userReport.js           |    2 +-
 server/services/ami/report/voiceAgentReport.js     |    2 +-
 server/services/ami/report/voiceCallReport.js      |    2 +-
 server/services/ami/report/voiceDialReport.js      |    2 +-
 server/services/ami/report/voiceQueueReport.js     |    2 +-
 server/services/ami/rpc/agentReportPreview.js      |    2 +-
 server/services/ami/rpc/attachment.js              |    2 +-
 server/services/ami/rpc/campaign.js                |    2 +-
 server/services/ami/rpc/cmContact.js               |    2 +-
 server/services/ami/rpc/cmHopper.js                |    2 +-
 server/services/ami/rpc/cmHopperBlack.js           |    2 +-
 server/services/ami/rpc/cmHopperFinal.js           |    2 +-
 server/services/ami/rpc/cmHopperHistory.js         |    2 +-
 server/services/ami/rpc/faxAccount.js              |    2 +-
 server/services/ami/rpc/faxMessage.js              |    2 +-
 server/services/ami/rpc/integrations/desk.js       |    2 +-
 .../services/ami/rpc/integrations/dynamics365.js   |    2 +-
 server/services/ami/rpc/integrations/freshdesk.js  |    2 +-
 server/services/ami/rpc/integrations/freshsales.js |    2 +-
 server/services/ami/rpc/integrations/salesforce.js |    2 +-
 server/services/ami/rpc/integrations/servicenow.js |    2 +-
 server/services/ami/rpc/integrations/sugarcrm.js   |    2 +-
 server/services/ami/rpc/integrations/vtiger.js     |    2 +-
 server/services/ami/rpc/integrations/zendesk.js    |    2 +-
 server/services/ami/rpc/integrations/zoho.js       |    2 +-
 server/services/ami/rpc/memberReport.js            |    2 +-
 server/services/ami/rpc/template.js                |    2 +-
 server/services/ami/rpc/trigger.js                 |    2 +-
 server/services/ami/rpc/trunk.js                   |    2 +-
 server/services/ami/rpc/user.js                    |    2 +-
 server/services/ami/rpc/voiceAgentReport.js        |    2 +-
 server/services/ami/rpc/voiceCallReport.js         |    2 +-
 server/services/ami/rpc/voiceDialReport.js         |    2 +-
 server/services/ami/rpc/voiceExtension.js          |    2 +-
 server/services/ami/rpc/voiceQueue.js              |    2 +-
 server/services/ami/rpc/voiceQueueReport.js        |    2 +-
 server/services/ami/rpc/voiceQueueRt.js            |    2 +-
 server/services/ami/rpc/voiceRecording.js          |    2 +-
 server/services/ami/rpc/voiceTransferReport.js     |    2 +-
 server/services/ami/server/index.js                |    2 +-
 server/services/ami/trigger/cmContact/index.js     |    2 +-
 server/services/ami/trigger/index.js               |    2 +-
 server/services/ami/trigger/integration/desk.js    |    2 +-
 .../ami/trigger/integration/dynamics365.js         |    2 +-
 .../services/ami/trigger/integration/freshdesk.js  |    2 +-
 .../services/ami/trigger/integration/freshsales.js |    2 +-
 server/services/ami/trigger/integration/index.js   |    2 +-
 .../services/ami/trigger/integration/salesforce.js |    2 +-
 .../services/ami/trigger/integration/servicenow.js |    2 +-
 .../services/ami/trigger/integration/sugarcrm.js   |    2 +-
 server/services/ami/trigger/integration/util.js    |    2 +-
 server/services/ami/trigger/integration/vtiger.js  |    2 +-
 server/services/ami/trigger/integration/zendesk.js |    2 +-
 server/services/ami/trigger/integration/zoho.js    |    2 +-
 server/services/ami/trigger/script/index.js        |    2 +-
 server/services/ami/trigger/urlforward/index.js    |    2 +-
 server/services/email/client.js                    |    2 +-
 server/services/email/index.js                     |    2 +-
 server/services/email/lib/email.js                 |    2 +-
 server/services/email/lib/imap.js                  |    2 +-
 server/services/email/lib/smtp.js                  |    2 +-
 server/services/email/lib/utils.js                 |    2 +-
 server/services/email/model/mailAccount.js         |    2 +-
 server/services/email/realtime/index.js            |    2 +-
 server/services/email/rpc/mailAccount.js           |    2 +-
 server/services/email/server/index.js              |    2 +-
 server/services/express/index.js                   |    2 +-
 server/services/routing/client.js                  |    2 +-
 server/services/routing/index.js                   |    2 +-
 server/services/routing/lib/rule-engine.js         |    2 +-
 server/services/routing/mailRpc/index.js           |    2 +-
 server/services/routing/model/agent.js             |    2 +-
 server/services/routing/model/chatQueue.js         |    2 +-
 server/services/routing/model/faxQueue.js          |    2 +-
 server/services/routing/model/interval.js          |    2 +-
 server/services/routing/model/mailQueue.js         |    2 +-
 server/services/routing/model/openchannelQueue.js  |    2 +-
 server/services/routing/model/smsQueue.js          |    2 +-
 server/services/routing/model/whatsappQueue.js     |    2 +-
 server/services/routing/realtime/index.js          |    2 +-
 server/services/routing/rpc/chatInteraction.js     |    2 +-
 server/services/routing/rpc/chatMessage.js         |    2 +-
 server/services/routing/rpc/chatQueue.js           |    2 +-
 server/services/routing/rpc/chatQueueReport.js     |    2 +-
 server/services/routing/rpc/faxInteraction.js      |    2 +-
 server/services/routing/rpc/faxMessage.js          |    2 +-
 server/services/routing/rpc/faxQueue.js            |    2 +-
 server/services/routing/rpc/faxQueueReport.js      |    2 +-
 server/services/routing/rpc/interval.js            |    2 +-
 server/services/routing/rpc/mailInteraction.js     |    2 +-
 server/services/routing/rpc/mailMessage.js         |    2 +-
 server/services/routing/rpc/mailQueue.js           |    2 +-
 server/services/routing/rpc/mailQueueReport.js     |    2 +-
 .../services/routing/rpc/openchannelInteraction.js |    2 +-
 server/services/routing/rpc/openchannelMessage.js  |    2 +-
 server/services/routing/rpc/openchannelQueue.js    |    2 +-
 .../services/routing/rpc/openchannelQueueReport.js |    2 +-
 server/services/routing/rpc/smsInteraction.js      |    2 +-
 server/services/routing/rpc/smsMessage.js          |    2 +-
 server/services/routing/rpc/smsQueue.js            |    2 +-
 server/services/routing/rpc/smsQueueReport.js      |    2 +-
 server/services/routing/rpc/user.js                |    2 +-
 server/services/routing/rpc/whatsappInteraction.js |    2 +-
 server/services/routing/rpc/whatsappMessage.js     |    2 +-
 server/services/routing/rpc/whatsappQueue.js       |    2 +-
 server/services/routing/rpc/whatsappQueueReport.js |    2 +-
 .../services/routing/server/applications/agent.js  |    2 +-
 .../routing/server/applications/amazonlex.js       |    2 +-
 .../routing/server/applications/autoreply.js       |    2 +-
 .../services/routing/server/applications/close.js  |    2 +-
 .../routing/server/applications/dialogflow.js      |    2 +-
 .../services/routing/server/applications/gotoif.js |    2 +-
 .../services/routing/server/applications/gotop.js  |    2 +-
 .../routing/server/applications/message.js         |    2 +-
 .../services/routing/server/applications/noop.js   |    2 +-
 .../services/routing/server/applications/queue.js  |    2 +-
 .../routing/server/applications/strategy/agent.js  |    2 +-
 .../server/applications/strategy/beepall.js        |    2 +-
 .../routing/server/applications/strategy/index.js  |    2 +-
 .../server/applications/strategy/rrmemory.js       |    2 +-
 .../routing/server/applications/strategy/util.js   |    2 +-
 .../services/routing/server/applications/system.js |    2 +-
 server/services/routing/server/applications/tag.js |    2 +-
 .../services/routing/server/applications/utils.js  |    2 +-
 server/services/routing/server/index.js            |    2 +-
 server/services/routing/server/interval.js         |    2 +-
 server/services/xdr/agents.controller.js           |    2 +-
 server/services/xdr/calls.controller.js            |    2 +-
 server/services/xdr/core.controller.js             |    2 +-
 server/services/xdr/dials.controller.js            |    2 +-
 server/services/xdr/index.js                       |    2 +-
 server/services/xdr/members.controller.js          |    2 +-
 server/services/xdr/queues.controller.js           |    2 +-
 server/services/xdr/recordings.controller.js       |    2 +-
 server/services/xdr/transfers.controller.js        |    2 +-
 server/services/xdr/utils.js                       |    2 +-
 server/utils/build-info.js                         |    2 +-
 snippets/chat_v3.0.0-alpha/index.html              |    2 +-
 2228 files changed, 137991 insertions(+), 137991 deletions(-)
 delete mode 100644 public/app-0f22f03a610f164a4a25.js
 delete mode 100644 public/app-0f22f03a610f164a4a25.js.map
 create mode 100644 public/app-7dc16afb7a5557c9968d.js
 create mode 100644 public/app-7dc16afb7a5557c9968d.js.map
 delete mode 100644 public/src/js/modules/auth/services/hotdesk/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/auth/services/hotdesk/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/core/dialogs/advanced-search/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/core/dialogs/advanced-search/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/core/directives/ms-advanced-search/ms-advanced-search.html/ms-advanced-search-[chunkhash].html
 create mode 100644 public/src/js/modules/core/directives/ms-advanced-search/ms-advanced-search.html/ms-advanced-search.html
 delete mode 100644 public/src/js/modules/core/directives/ms-click-to-call/ms-click-to-call.html/ms-click-to-call-[chunkhash].html
 create mode 100644 public/src/js/modules/core/directives/ms-click-to-call/ms-click-to-call.html/ms-click-to-call.html
 delete mode 100644 public/src/js/modules/core/directives/ms-dual-multiselect/ms-dual-multiselect.html/ms-dual-multiselect-[chunkhash].html
 create mode 100644 public/src/js/modules/core/directives/ms-dual-multiselect/ms-dual-multiselect.html/ms-dual-multiselect.html
 delete mode 100644 public/src/js/modules/core/directives/ms-font-family/ms-font-family.html/ms-font-family-[chunkhash].html
 create mode 100644 public/src/js/modules/core/directives/ms-font-family/ms-font-family.html/ms-font-family.html
 delete mode 100644 public/src/js/modules/core/directives/ms-info-bar/ms-info-bar.html/ms-info-bar-[chunkhash].html
 create mode 100644 public/src/js/modules/core/directives/ms-info-bar/ms-info-bar.html/ms-info-bar.html
 delete mode 100644 public/src/js/modules/core/directives/ms-material-color-picker/ms-material-color-picker.html/ms-material-color-picker-[chunkhash].html
 create mode 100644 public/src/js/modules/core/directives/ms-material-color-picker/ms-material-color-picker.html/ms-material-color-picker.html
 delete mode 100644 public/src/js/modules/core/directives/ms-navigation/templates/horizontal.html/horizontal-[chunkhash].html
 create mode 100644 public/src/js/modules/core/directives/ms-navigation/templates/horizontal.html/horizontal.html
 delete mode 100644 public/src/js/modules/core/directives/ms-navigation/templates/vertical.html/vertical-[chunkhash].html
 create mode 100644 public/src/js/modules/core/directives/ms-navigation/templates/vertical.html/vertical.html
 delete mode 100644 public/src/js/modules/core/directives/ms-phonebar/ms-phonebar.html/ms-phonebar-[chunkhash].html
 create mode 100644 public/src/js/modules/core/directives/ms-phonebar/ms-phonebar.html/ms-phonebar.html
 delete mode 100644 public/src/js/modules/core/directives/ms-phonebar/prefix/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/core/directives/ms-phonebar/prefix/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/core/directives/ms-phonebar/record/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/core/directives/ms-phonebar/record/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/core/directives/ms-phonebar/referAttended/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/core/directives/ms-phonebar/referAttended/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/core/directives/ms-phonebar/settings/settings.html/settings-[chunkhash].html
 create mode 100644 public/src/js/modules/core/directives/ms-phonebar/settings/settings.html/settings.html
 delete mode 100644 public/src/js/modules/core/directives/ms-quick-filter/ms-quick-filter.html/ms-quick-filter-[chunkhash].html
 create mode 100644 public/src/js/modules/core/directives/ms-quick-filter/ms-quick-filter.html/ms-quick-filter.html
 delete mode 100644 public/src/js/modules/core/directives/ms-search-bar/ms-search-bar.html/ms-search-bar-[chunkhash].html
 create mode 100644 public/src/js/modules/core/directives/ms-search-bar/ms-search-bar.html/ms-search-bar.html
 delete mode 100644 public/src/js/modules/core/directives/ms-shortcuts/ms-shortcuts.html/ms-shortcuts-[chunkhash].html
 create mode 100644 public/src/js/modules/core/directives/ms-shortcuts/ms-shortcuts.html/ms-shortcuts.html
 delete mode 100644 public/src/js/modules/core/directives/ms-stepper/templates/horizontal/horizontal.html/horizontal-[chunkhash].html
 create mode 100644 public/src/js/modules/core/directives/ms-stepper/templates/horizontal/horizontal.html/horizontal.html
 delete mode 100644 public/src/js/modules/core/directives/ms-stepper/templates/vertical/step/vertical-step.html/vertical-step-[chunkhash].html
 create mode 100644 public/src/js/modules/core/directives/ms-stepper/templates/vertical/step/vertical-step.html/vertical-step.html
 delete mode 100644 public/src/js/modules/core/directives/ms-stepper/templates/vertical/vertical.html/vertical-[chunkhash].html
 create mode 100644 public/src/js/modules/core/directives/ms-stepper/templates/vertical/vertical.html/vertical.html
 delete mode 100644 public/src/js/modules/core/directives/ms-tab-scroll/ms-tab-scroll.html/ms-tab-scroll-[chunkhash].html
 create mode 100644 public/src/js/modules/core/directives/ms-tab-scroll/ms-tab-scroll.html/ms-tab-scroll.html
 delete mode 100644 public/src/js/modules/core/directives/ms-timezone/ms-timezone.html/ms-timezone-[chunkhash].html
 create mode 100644 public/src/js/modules/core/directives/ms-timezone/ms-timezone.html/ms-timezone.html
 delete mode 100644 public/src/js/modules/core/directives/ms-widget-engine/ms-widget-engine.html/ms-widget-engine-[chunkhash].html
 create mode 100644 public/src/js/modules/core/directives/ms-widget-engine/ms-widget-engine.html/ms-widget-engine.html
 delete mode 100644 public/src/js/modules/core/layouts/content-only.html/content-only-[chunkhash].html
 create mode 100644 public/src/js/modules/core/layouts/content-only.html/content-only.html
 delete mode 100644 public/src/js/modules/core/layouts/content-with-toolbar.html/content-with-toolbar-[chunkhash].html
 create mode 100644 public/src/js/modules/core/layouts/content-with-toolbar.html/content-with-toolbar.html
 delete mode 100644 public/src/js/modules/core/layouts/horizontal-navigation.html/horizontal-navigation-[chunkhash].html
 create mode 100644 public/src/js/modules/core/layouts/horizontal-navigation.html/horizontal-navigation.html
 delete mode 100644 public/src/js/modules/core/layouts/vertical-navigation-fullwidth-toolbar-2.html/vertical-navigation-fullwidth-toolbar-2-[chunkhash].html
 create mode 100644 public/src/js/modules/core/layouts/vertical-navigation-fullwidth-toolbar-2.html/vertical-navigation-fullwidth-toolbar-2.html
 delete mode 100644 public/src/js/modules/core/layouts/vertical-navigation-fullwidth-toolbar.html/vertical-navigation-fullwidth-toolbar-[chunkhash].html
 create mode 100644 public/src/js/modules/core/layouts/vertical-navigation-fullwidth-toolbar.html/vertical-navigation-fullwidth-toolbar.html
 delete mode 100644 public/src/js/modules/core/layouts/vertical-navigation.html/vertical-navigation-[chunkhash].html
 create mode 100644 public/src/js/modules/core/layouts/vertical-navigation.html/vertical-navigation.html
 delete mode 100644 public/src/js/modules/core/theme-options/theme-options.html/theme-options-[chunkhash].html
 create mode 100644 public/src/js/modules/core/theme-options/theme-options.html/theme-options.html
 delete mode 100644 public/src/js/modules/errors/404/error-404.html/error-404-[chunkhash].html
 create mode 100644 public/src/js/modules/errors/404/error-404.html/error-404.html
 delete mode 100644 public/src/js/modules/errors/500/error-500.html/error-500-[chunkhash].html
 create mode 100644 public/src/js/modules/errors/500/error-500.html/error-500.html
 delete mode 100644 public/src/js/modules/footer/layouts/vertical-navigation/footer.html/footer-[chunkhash].html
 create mode 100644 public/src/js/modules/footer/layouts/vertical-navigation/footer.html/footer.html
 delete mode 100644 public/src/js/modules/forgot/forgot.html/forgot-[chunkhash].html
 create mode 100644 public/src/js/modules/forgot/forgot.html/forgot.html
 delete mode 100644 public/src/js/modules/header/layouts/vertical-navigation/header.html/header-[chunkhash].html
 create mode 100644 public/src/js/modules/header/layouts/vertical-navigation/header.html/header.html
 delete mode 100644 public/src/js/modules/login/login.html/login-[chunkhash].html
 create mode 100644 public/src/js/modules/login/login.html/login.html
 delete mode 100644 public/src/js/modules/main/apps/analytics/views/extractedReports/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/analytics/views/extractedReports/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/analytics/views/extractedReports/extractedReports.html/extractedReports-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/analytics/views/extractedReports/extractedReports.html/extractedReports.html
 delete mode 100644 public/src/js/modules/main/apps/analytics/views/metrics/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/analytics/views/metrics/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/analytics/views/metrics/metrics.html/metrics-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/analytics/views/metrics/metrics.html/metrics.html
 delete mode 100644 public/src/js/modules/main/apps/analytics/views/reports/copy/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/analytics/views/reports/copy/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/analytics/views/reports/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/analytics/views/reports/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/analytics/views/reports/edit/field/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/analytics/views/reports/edit/field/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/analytics/views/reports/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/analytics/views/reports/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/analytics/views/reports/preview/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/analytics/views/reports/preview/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/analytics/views/reports/reports.html/reports-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/analytics/views/reports/reports.html/reports.html
 delete mode 100644 public/src/js/modules/main/apps/analytics/views/reports/run/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/analytics/views/reports/run/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/analytics/views/reports/run/web/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/analytics/views/reports/run/web/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/callysquare/views/odbcs/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/callysquare/views/odbcs/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/callysquare/views/odbcs/odbcs.html/odbcs-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/callysquare/views/odbcs/odbcs.html/odbcs.html
 delete mode 100644 public/src/js/modules/main/apps/callysquare/views/projects/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/callysquare/views/projects/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/callysquare/views/projects/edit/dialog/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/callysquare/views/projects/edit/dialog/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/callysquare/views/projects/edit/edit/edit.html/edit-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/callysquare/views/projects/edit/edit/edit.html/edit.html
 delete mode 100644 public/src/js/modules/main/apps/callysquare/views/projects/edit/import/import.html/import-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/callysquare/views/projects/edit/import/import.html/import.html
 delete mode 100644 public/src/js/modules/main/apps/callysquare/views/projects/edit/info/info.html/info-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/callysquare/views/projects/edit/info/info.html/info.html
 delete mode 100644 public/src/js/modules/main/apps/callysquare/views/projects/edit/open/open.html/open-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/callysquare/views/projects/edit/open/open.html/open.html
 delete mode 100644 public/src/js/modules/main/apps/callysquare/views/projects/edit/saveAs/saveAs.html/saveAs-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/callysquare/views/projects/edit/saveAs/saveAs.html/saveAs.html
 delete mode 100644 public/src/js/modules/main/apps/callysquare/views/projects/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/callysquare/views/projects/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/callysquare/views/projects/projects.html/projects-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/callysquare/views/projects/projects.html/projects.html
 delete mode 100644 public/src/js/modules/main/apps/callysquare/views/squareRecordings/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/callysquare/views/squareRecordings/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/callysquare/views/squareRecordings/squareRecordings.html/squareRecordings-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/callysquare/views/squareRecordings/squareRecordings.html/squareRecordings.html
 delete mode 100644 public/src/js/modules/main/apps/chat/views/chatQueues/chatQueues.html/chatQueues-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/chat/views/chatQueues/chatQueues.html/chatQueues.html
 delete mode 100644 public/src/js/modules/main/apps/chat/views/chatQueues/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/chat/views/chatQueues/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/chat/views/chatQueues/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/chat/views/chatQueues/edit/agentadd/agentadd.html/agentadd.html
 delete mode 100644 public/src/js/modules/main/apps/chat/views/chatQueues/edit/teamadd/teamadd.html/teamadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/chat/views/chatQueues/edit/teamadd/teamadd.html/teamadd.html
 delete mode 100644 public/src/js/modules/main/apps/chat/views/chatQueues/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/chat/views/chatQueues/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/chatWebsites.html/chatWebsites-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/chatWebsites.html/chatWebsites.html
 delete mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/agentadd/agentadd.html/agentadd.html
 delete mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/agent/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/agent/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/amazonlex/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/amazonlex/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/autoreply/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/autoreply/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/close/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/close/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/dialogflow/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/dialogflow/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/gotoif/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/gotoif/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/gotop/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/gotop/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/interval/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/interval/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/noop/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/noop/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/queue/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/queue/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/system/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/system/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/tag/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/tag/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/chatCannedAnswers/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/chatCannedAnswers/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/offlineMessages/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/offlineMessages/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/proactive/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/proactive/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/chat/views/chatWebsites/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/chat/views/realtime/agents/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/chat/views/realtime/agents/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/chat/views/realtime/queues/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/chat/views/realtime/queues/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/chat/views/realtime/realtime.html/realtime-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/chat/views/realtime/realtime.html/realtime.html
 delete mode 100644 public/src/js/modules/main/apps/contactmanager/views/companies/companies.html/companies-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/contactmanager/views/companies/companies.html/companies.html
 delete mode 100644 public/src/js/modules/main/apps/contactmanager/views/companies/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/contactmanager/views/companies/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/contactmanager/views/companies/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/contactmanager/views/companies/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/contactmanager/views/contacts/contacts.html/contacts-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/contactmanager/views/contacts/contacts.html/contacts.html
 delete mode 100644 public/src/js/modules/main/apps/contactmanager/views/contacts/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/contactmanager/views/contacts/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/contactmanager/views/contacts/duplicate/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/contactmanager/views/contacts/duplicate/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/contactmanager/views/contacts/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/contactmanager/views/contacts/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/contactmanager/views/contacts/import/import.html/import-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/contactmanager/views/contacts/import/import.html/import.html
 delete mode 100644 public/src/js/modules/main/apps/contactmanager/views/contacts/merge/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/contactmanager/views/contacts/merge/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/contactmanager/views/globalCustomFields/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/contactmanager/views/globalCustomFields/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/contactmanager/views/globalCustomFields/globalCustomFields.html/globalCustomFields-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/contactmanager/views/globalCustomFields/globalCustomFields.html/globalCustomFields.html
 delete mode 100644 public/src/js/modules/main/apps/contactmanager/views/lists/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/contactmanager/views/lists/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/contactmanager/views/lists/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/contactmanager/views/lists/edit/agentadd/agentadd.html/agentadd.html
 delete mode 100644 public/src/js/modules/main/apps/contactmanager/views/lists/edit/customFields/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/contactmanager/views/lists/edit/customFields/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/contactmanager/views/lists/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/contactmanager/views/lists/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/contactmanager/views/lists/lists.html/lists-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/contactmanager/views/lists/lists.html/lists.html
 delete mode 100644 public/src/js/modules/main/apps/dashboards/views/custom/custom.html/custom-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/dashboards/views/custom/custom.html/custom.html
 delete mode 100644 public/src/js/modules/main/apps/dashboards/views/general/agent/agent.general.html/agent.general-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/dashboards/views/general/agent/agent.general.html/agent.general.html
 delete mode 100644 public/src/js/modules/main/apps/dashboards/views/general/agent/contact/dispose/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/dashboards/views/general/agent/contact/dispose/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/dashboards/views/general/agent/contact/selection/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/dashboards/views/general/agent/contact/selection/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/dashboards/views/general/agent/home/abandoned/dispose/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/dashboards/views/general/agent/home/abandoned/dispose/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/dashboards/views/general/agent/home/voice/details/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/dashboards/views/general/agent/home/voice/details/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/agent.general.interaction.dialog.html/agent.general.interaction.dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/agent.general.interaction.dialog.html/agent.general.interaction.dialog.html
 delete mode 100644 public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeFax/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeFax/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeMail/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeMail/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeOpenchannel/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeOpenchannel/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeSms/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeSms/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeWhatsapp/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeWhatsapp/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/dispose/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/dispose/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/tag/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/tag/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/transfer/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/transfer/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/dashboards/views/general/user/chat/user.general.chat.html/user.general.chat-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/dashboards/views/general/user/chat/user.general.chat.html/user.general.chat.html
 delete mode 100644 public/src/js/modules/main/apps/dashboards/views/general/user/dialer/user.general.dialer.html/user.general.dialer-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/dashboards/views/general/user/dialer/user.general.dialer.html/user.general.dialer.html
 delete mode 100644 public/src/js/modules/main/apps/dashboards/views/general/user/fax/user.general.fax.html/user.general.fax-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/dashboards/views/general/user/fax/user.general.fax.html/user.general.fax.html
 delete mode 100644 public/src/js/modules/main/apps/dashboards/views/general/user/mail/user.general.mail.html/user.general.mail-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/dashboards/views/general/user/mail/user.general.mail.html/user.general.mail.html
 delete mode 100644 public/src/js/modules/main/apps/dashboards/views/general/user/openchannel/user.general.openchannel.html/user.general.openchannel-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/dashboards/views/general/user/openchannel/user.general.openchannel.html/user.general.openchannel.html
 delete mode 100644 public/src/js/modules/main/apps/dashboards/views/general/user/sms/user.general.sms.html/user.general.sms-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/dashboards/views/general/user/sms/user.general.sms.html/user.general.sms.html
 delete mode 100644 public/src/js/modules/main/apps/dashboards/views/general/user/user.general.html/user.general-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/dashboards/views/general/user/user.general.html/user.general.html
 delete mode 100644 public/src/js/modules/main/apps/dashboards/views/general/user/whatsapp/user.general.whatsapp.html/user.general.whatsapp-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/dashboards/views/general/user/whatsapp/user.general.whatsapp.html/user.general.whatsapp.html
 delete mode 100644 public/src/js/modules/main/apps/fax/views/faxAccounts/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/fax/views/faxAccounts/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/fax/views/faxAccounts/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/fax/views/faxAccounts/edit/agentadd/agentadd.html/agentadd.html
 delete mode 100644 public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/agent/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/agent/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/close/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/close/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/gotoif/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/gotoif/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/gotop/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/gotop/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/interval/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/interval/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/noop/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/noop/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/queue/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/queue/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/system/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/system/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/tag/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/tag/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/fax/views/faxAccounts/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/fax/views/faxAccounts/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/fax/views/faxAccounts/faxAccounts.html/faxAccounts-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/fax/views/faxAccounts/faxAccounts.html/faxAccounts.html
 delete mode 100644 public/src/js/modules/main/apps/fax/views/faxQueues/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/fax/views/faxQueues/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/fax/views/faxQueues/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/fax/views/faxQueues/edit/agentadd/agentadd.html/agentadd.html
 delete mode 100644 public/src/js/modules/main/apps/fax/views/faxQueues/edit/teamadd/teamadd.html/teamadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/fax/views/faxQueues/edit/teamadd/teamadd.html/teamadd.html
 delete mode 100644 public/src/js/modules/main/apps/fax/views/faxQueues/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/fax/views/faxQueues/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/fax/views/faxQueues/faxQueues.html/faxQueues-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/fax/views/faxQueues/faxQueues.html/faxQueues.html
 delete mode 100644 public/src/js/modules/main/apps/fax/views/realtime/accounts/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/fax/views/realtime/accounts/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/fax/views/realtime/agents/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/fax/views/realtime/agents/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/fax/views/realtime/queues/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/fax/views/realtime/queues/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/fax/views/realtime/realtime.html/realtime-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/fax/views/realtime/realtime.html/realtime.html
 delete mode 100644 public/src/js/modules/main/apps/fax/views/realtime/trunks/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/fax/views/realtime/trunks/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/help/views/about/about.html/about-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/help/views/about/about.html/about.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/deskAccounts/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/deskAccounts/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/deskAccounts/deskAccounts.html/deskAccounts-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/deskAccounts/deskAccounts.html/deskAccounts.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/deskAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/deskAccounts/edit/configurations/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/deskAccounts/edit/item/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/deskAccounts/edit/item/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/deskAccounts/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/deskAccounts/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/dynamics365Accounts.html/dynamics365Accounts-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/dynamics365Accounts.html/dynamics365Accounts.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/edit/configurations/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/edit/configurations/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/edit/item/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/edit/item/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/edit/configurations/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/edit/item/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/edit/item/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/freshdeskAccounts.html/freshdeskAccounts-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/freshdeskAccounts.html/freshdeskAccounts.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/edit/configurations/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/edit/item/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/edit/item/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/freshsalesAccounts.html/freshsalesAccounts-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/freshsalesAccounts.html/freshsalesAccounts.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/salesforceAccounts/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/salesforceAccounts/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/salesforceAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/salesforceAccounts/edit/configurations/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/salesforceAccounts/edit/item/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/salesforceAccounts/edit/item/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/salesforceAccounts/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/salesforceAccounts/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/salesforceAccounts/salesforceAccounts.html/salesforceAccounts-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/salesforceAccounts/salesforceAccounts.html/salesforceAccounts.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/servicenowAccounts/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/servicenowAccounts/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/servicenowAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/servicenowAccounts/edit/configurations/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/servicenowAccounts/edit/item/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/servicenowAccounts/edit/item/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/servicenowAccounts/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/servicenowAccounts/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/servicenowAccounts/servicenowAccounts.html/servicenowAccounts-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/servicenowAccounts/servicenowAccounts.html/servicenowAccounts.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/edit/configurations/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/edit/item/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/edit/item/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/sugarcrmAccounts.html/sugarcrmAccounts-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/sugarcrmAccounts.html/sugarcrmAccounts.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/vtigerAccounts/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/vtigerAccounts/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/vtigerAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/vtigerAccounts/edit/configurations/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/vtigerAccounts/edit/item/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/vtigerAccounts/edit/item/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/vtigerAccounts/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/vtigerAccounts/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/vtigerAccounts/vtigerAccounts.html/vtigerAccounts-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/vtigerAccounts/vtigerAccounts.html/vtigerAccounts.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/zendeskAccounts/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/zendeskAccounts/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/zendeskAccounts/edit/item/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/zendeskAccounts/edit/item/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/zendeskAccounts/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/zendeskAccounts/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/zendeskAccounts/edit/zendeskConfigurations/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/zendeskAccounts/edit/zendeskConfigurations/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/zendeskAccounts/zendeskAccounts.html/zendeskAccounts-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/zendeskAccounts/zendeskAccounts.html/zendeskAccounts.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/zohoAccounts/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/zohoAccounts/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/zohoAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/zohoAccounts/edit/configurations/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/zohoAccounts/edit/item/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/zohoAccounts/edit/item/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/zohoAccounts/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/zohoAccounts/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/integrations/views/zohoAccounts/zohoAccounts.html/zohoAccounts-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/integrations/views/zohoAccounts/zohoAccounts.html/zohoAccounts.html
 delete mode 100644 public/src/js/modules/main/apps/jscripty/views/projects/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/jscripty/views/projects/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/jscripty/views/projects/edit/clone/clone.html/clone-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/jscripty/views/projects/edit/clone/clone.html/clone.html
 delete mode 100644 public/src/js/modules/main/apps/jscripty/views/projects/edit/sessions/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/jscripty/views/projects/edit/sessions/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/jscripty/views/projects/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/jscripty/views/projects/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/jscripty/views/projects/projects.html/projects-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/jscripty/views/projects/projects.html/projects.html
 delete mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/edit/agentadd/agentadd.html/agentadd.html
 delete mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/agent/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/agent/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/autoreply/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/autoreply/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/close/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/close/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/gotoif/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/gotoif/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/gotop/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/gotop/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/interval/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/interval/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/noop/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/noop/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/queue/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/queue/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/system/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/system/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/tag/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/tag/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/edit/mailCannedAnswers/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/edit/mailCannedAnswers/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/mailAccounts.html/mailAccounts-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/mail/views/mailAccounts/mailAccounts.html/mailAccounts.html
 delete mode 100644 public/src/js/modules/main/apps/mail/views/mailQueues/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/mail/views/mailQueues/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/mail/views/mailQueues/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/mail/views/mailQueues/edit/agentadd/agentadd.html/agentadd.html
 delete mode 100644 public/src/js/modules/main/apps/mail/views/mailQueues/edit/teamadd/teamadd.html/teamadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/mail/views/mailQueues/edit/teamadd/teamadd.html/teamadd.html
 delete mode 100644 public/src/js/modules/main/apps/mail/views/mailQueues/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/mail/views/mailQueues/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/mail/views/mailQueues/mailQueues.html/mailQueues-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/mail/views/mailQueues/mailQueues.html/mailQueues.html
 delete mode 100644 public/src/js/modules/main/apps/mail/views/mailSubtatuses/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/mail/views/mailSubtatuses/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/mail/views/mailSubtatuses/mailSubtatuses.html/mailSubtatuses-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/mail/views/mailSubtatuses/mailSubtatuses.html/mailSubtatuses.html
 delete mode 100644 public/src/js/modules/main/apps/mail/views/realtime/accounts/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/mail/views/realtime/accounts/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/mail/views/realtime/agents/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/mail/views/realtime/agents/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/mail/views/realtime/queues/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/mail/views/realtime/queues/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/mail/views/realtime/realtime.html/realtime-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/mail/views/realtime/realtime.html/realtime.html
 delete mode 100644 public/src/js/modules/main/apps/marketplace/views/plugins/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/marketplace/views/plugins/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/marketplace/views/plugins/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/marketplace/views/plugins/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/marketplace/views/plugins/plugins.html/plugins-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/marketplace/views/plugins/plugins.html/plugins.html
 delete mode 100644 public/src/js/modules/main/apps/marketplace/views/plugins/upload/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/marketplace/views/plugins/upload/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/blacklistadd/blacklistadd.html/blacklistadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/blacklistadd/blacklistadd.html/blacklistadd.html
 delete mode 100644 public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/clone/clone.html/clone-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/clone/clone.html/clone.html
 delete mode 100644 public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/hoppers/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/hoppers/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/listadd/listadd.html/listadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/listadd/listadd.html/listadd.html
 delete mode 100644 public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/resetlist/resetlist.html/resetlist-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/resetlist/resetlist.html/resetlist.html
 delete mode 100644 public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/ivrCampaigns.html/ivrCampaigns-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/ivrCampaigns.html/ivrCampaigns.html
 delete mode 100644 public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/agentadd/agentadd.html/agentadd.html
 delete mode 100644 public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/blacklistadd/blacklistadd.html/blacklistadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/blacklistadd/blacklistadd.html/blacklistadd.html
 delete mode 100644 public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/clone/clone.html/clone-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/clone/clone.html/clone.html
 delete mode 100644 public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/hoppers/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/hoppers/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/listadd/listadd.html/listadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/listadd/listadd.html/listadd.html
 delete mode 100644 public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/resetlist/resetlist.html/resetlist-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/resetlist/resetlist.html/resetlist.html
 delete mode 100644 public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/teamadd/teamadd.html/teamadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/teamadd/teamadd.html/teamadd.html
 delete mode 100644 public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/queueCampaigns.html/queueCampaigns-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/queueCampaigns.html/queueCampaigns.html
 delete mode 100644 public/src/js/modules/main/apps/motiondialer/views/realtime/abandonedcalls/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/motiondialer/views/realtime/abandonedcalls/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/motiondialer/views/realtime/agents/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/motiondialer/views/realtime/agents/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/motiondialer/views/realtime/ivr_campaigns/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/motiondialer/views/realtime/ivr_campaigns/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/motiondialer/views/realtime/queue_calls/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/motiondialer/views/realtime/queue_calls/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/motiondialer/views/realtime/queue_params/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/motiondialer/views/realtime/queue_params/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/motiondialer/views/realtime/queues/predictive/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/motiondialer/views/realtime/queues/predictive/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/motiondialer/views/realtime/queues/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/motiondialer/views/realtime/queues/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/motiondialer/views/realtime/realtime.html/realtime-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/motiondialer/views/realtime/realtime.html/realtime.html
 delete mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/agentadd/agentadd.html/agentadd.html
 delete mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/agent/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/agent/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/autoreply/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/autoreply/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/close/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/close/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/gotoif/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/gotoif/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/gotop/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/gotop/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/interval/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/interval/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/noop/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/noop/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/queue/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/queue/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/system/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/system/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/tag/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/tag/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/openchannelCannedAnswers/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/openchannelCannedAnswers/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/openchannelAccounts.html/openchannelAccounts-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/openchannelAccounts.html/openchannelAccounts.html
 delete mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelQueues/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelQueues/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelQueues/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelQueues/edit/agentadd/agentadd.html/agentadd.html
 delete mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelQueues/edit/teamadd/teamadd.html/teamadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelQueues/edit/teamadd/teamadd.html/teamadd.html
 delete mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelQueues/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelQueues/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelQueues/openchannelQueues.html/openchannelQueues-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/openchannel/views/openchannelQueues/openchannelQueues.html/openchannelQueues.html
 delete mode 100644 public/src/js/modules/main/apps/openchannel/views/realtime/agents/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/openchannel/views/realtime/agents/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/openchannel/views/realtime/queues/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/openchannel/views/realtime/queues/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/openchannel/views/realtime/realtime.html/realtime-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/openchannel/views/realtime/realtime.html/realtime.html
 delete mode 100644 public/src/js/modules/main/apps/plugins/views/plugin/plugin.html/plugin-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/plugins/views/plugin/plugin.html/plugin.html
 delete mode 100644 public/src/js/modules/main/apps/settings/views/cloudProviders/cloudProviders.html/cloudProviders-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/settings/views/cloudProviders/cloudProviders.html/cloudProviders.html
 delete mode 100644 public/src/js/modules/main/apps/settings/views/cloudProviders/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/settings/views/cloudProviders/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/settings/views/customizations/customizations.html/customizations-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/settings/views/customizations/customizations.html/customizations.html
 delete mode 100644 public/src/js/modules/main/apps/settings/views/generals/generals.html/generals-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/settings/views/generals/generals.html/generals.html
 delete mode 100644 public/src/js/modules/main/apps/settings/views/license/license.html/license-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/settings/views/license/license.html/license.html
 delete mode 100644 public/src/js/modules/main/apps/settings/views/license/request/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/settings/views/license/request/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/settings/views/license/update/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/settings/views/license/update/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/settings/views/networks/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/settings/views/networks/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/settings/views/networks/networks.html/networks-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/settings/views/networks/networks.html/networks.html
 delete mode 100644 public/src/js/modules/main/apps/settings/views/smtps/smtps.html/smtps-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/settings/views/smtps/smtps.html/smtps.html
 delete mode 100644 public/src/js/modules/main/apps/settings/views/system/system.html/system-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/settings/views/system/system.html/system.html
 delete mode 100644 public/src/js/modules/main/apps/settings/views/updates/update/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/settings/views/updates/update/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/settings/views/updates/updates.html/updates-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/settings/views/updates/updates.html/updates.html
 delete mode 100644 public/src/js/modules/main/apps/sms/views/realtime/agents/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/sms/views/realtime/agents/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/sms/views/realtime/queues/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/sms/views/realtime/queues/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/sms/views/realtime/realtime.html/realtime-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/sms/views/realtime/realtime.html/realtime.html
 delete mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/agentadd/agentadd.html/agentadd.html
 delete mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/agent/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/agent/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/amazonlex/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/amazonlex/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/autoreply/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/autoreply/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/close/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/close/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/dialogflow/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/dialogflow/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/gotoif/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/gotoif/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/gotop/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/gotop/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/interval/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/interval/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/noop/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/noop/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/queue/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/queue/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/system/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/system/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/tag/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/tag/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/smsCannedAnswers/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/smsCannedAnswers/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/smsAccounts.html/smsAccounts-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/sms/views/smsAccounts/smsAccounts.html/smsAccounts.html
 delete mode 100644 public/src/js/modules/main/apps/sms/views/smsQueues/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/sms/views/smsQueues/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/sms/views/smsQueues/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/sms/views/smsQueues/edit/agentadd/agentadd.html/agentadd.html
 delete mode 100644 public/src/js/modules/main/apps/sms/views/smsQueues/edit/teamadd/teamadd.html/teamadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/sms/views/smsQueues/edit/teamadd/teamadd.html/teamadd.html
 delete mode 100644 public/src/js/modules/main/apps/sms/views/smsQueues/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/sms/views/smsQueues/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/sms/views/smsQueues/smsQueues.html/smsQueues-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/sms/views/smsQueues/smsQueues.html/smsQueues.html
 delete mode 100644 public/src/js/modules/main/apps/staff/views/agents/agents.html/agents-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/staff/views/agents/agents.html/agents.html
 delete mode 100644 public/src/js/modules/main/apps/staff/views/agents/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/staff/views/agents/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/staff/views/agents/edit/changepassword/changepassword.html/changepassword-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/staff/views/agents/edit/changepassword/changepassword.html/changepassword.html
 delete mode 100644 public/src/js/modules/main/apps/staff/views/agents/edit/queueadd/queueadd.html/queueadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/staff/views/agents/edit/queueadd/queueadd.html/queueadd.html
 delete mode 100644 public/src/js/modules/main/apps/staff/views/agents/edit/teamadd/teamadd.html/teamadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/staff/views/agents/edit/teamadd/teamadd.html/teamadd.html
 delete mode 100644 public/src/js/modules/main/apps/staff/views/agents/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/staff/views/agents/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/staff/views/teams/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/staff/views/teams/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/staff/views/teams/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/staff/views/teams/edit/agentadd/agentadd.html/agentadd.html
 delete mode 100644 public/src/js/modules/main/apps/staff/views/teams/teams.html/teams-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/staff/views/teams/teams.html/teams.html
 delete mode 100644 public/src/js/modules/main/apps/staff/views/telephones/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/staff/views/telephones/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/staff/views/telephones/edit/changepassword/changepassword.html/changepassword-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/staff/views/telephones/edit/changepassword/changepassword.html/changepassword.html
 delete mode 100644 public/src/js/modules/main/apps/staff/views/telephones/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/staff/views/telephones/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/staff/views/telephones/telephones.html/telephones-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/staff/views/telephones/telephones.html/telephones.html
 delete mode 100644 public/src/js/modules/main/apps/staff/views/userProfiles/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/staff/views/userProfiles/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/staff/views/userProfiles/edit/clone/clone.html/clone-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/staff/views/userProfiles/edit/clone/clone.html/clone.html
 delete mode 100644 public/src/js/modules/main/apps/staff/views/userProfiles/edit/permissionsmanage/permissionsmanage.html/permissionsmanage-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/staff/views/userProfiles/edit/permissionsmanage/permissionsmanage.html/permissionsmanage.html
 delete mode 100644 public/src/js/modules/main/apps/staff/views/userProfiles/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/staff/views/userProfiles/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/staff/views/userProfiles/userProfiles.html/userProfiles-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/staff/views/userProfiles/userProfiles.html/userProfiles.html
 delete mode 100644 public/src/js/modules/main/apps/staff/views/users/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/staff/views/users/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/staff/views/users/edit/apikeymanager/apikeymanager.html/apikeymanager-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/staff/views/users/edit/apikeymanager/apikeymanager.html/apikeymanager.html
 delete mode 100644 public/src/js/modules/main/apps/staff/views/users/edit/changepassword/changepassword.html/changepassword-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/staff/views/users/edit/changepassword/changepassword.html/changepassword.html
 delete mode 100644 public/src/js/modules/main/apps/staff/views/users/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/staff/views/users/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/staff/views/users/users.html/users-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/staff/views/users/users.html/users.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/cannedAnswers/cannedAnswers.html/cannedAnswers-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/cannedAnswers/cannedAnswers.html/cannedAnswers.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/cannedAnswers/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/cannedAnswers/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/customDashboards/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/customDashboards/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/customDashboards/customDashboards.html/customDashboards-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/customDashboards/customDashboards.html/customDashboards.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/customDashboards/edit/clone/clone.html/clone-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/customDashboards/edit/clone/clone.html/clone.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/customDashboards/edit/dashboard/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/customDashboards/edit/dashboard/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/customDashboards/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/customDashboards/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/customDashboards/partialViews/reports/treeReports.html/treeReports-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/customDashboards/partialViews/reports/treeReports.html/treeReports.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/dispositions/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/dispositions/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/dispositions/dispositions.html/dispositions-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/dispositions/dispositions.html/dispositions.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/intervals/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/intervals/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/intervals/edit/apps/interval/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/intervals/edit/apps/interval/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/intervals/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/intervals/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/intervals/intervals.html/intervals-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/intervals/intervals.html/intervals.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/pauses/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/pauses/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/pauses/pauses.html/pauses-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/pauses/pauses.html/pauses.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/schedules/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/schedules/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/schedules/partialViews/reports/treeReports.html/treeReports-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/schedules/partialViews/reports/treeReports.html/treeReports.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/schedules/schedules.html/schedules-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/schedules/schedules.html/schedules.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/sounds/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/sounds/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/sounds/sounds.html/sounds-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/sounds/sounds.html/sounds.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/sounds/upload/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/sounds/upload/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/tags/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/tags/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/tags/tags.html/tags-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/tags/tags.html/tags.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/templates/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/templates/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/templates/templates.html/templates-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/templates/templates.html/templates.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/triggers/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/triggers/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/triggers/edit/actions/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/triggers/edit/actions/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/triggers/edit/allconditions/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/triggers/edit/allconditions/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/triggers/edit/anyconditions/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/triggers/edit/anyconditions/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/triggers/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/triggers/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/triggers/triggers.html/triggers-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/triggers/triggers.html/triggers.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/trunks/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/trunks/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/trunks/edit/clone/clone.html/clone-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/trunks/edit/clone/clone.html/clone.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/trunks/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/trunks/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/trunks/trunks.html/trunks-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/trunks/trunks.html/trunks.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/variables/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/variables/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/tools/views/variables/variables.html/variables-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/tools/views/variables/variables.html/variables.html
 delete mode 100644 public/src/js/modules/main/apps/video/views/screenRecordings/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/video/views/screenRecordings/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/video/views/screenRecordings/partialViews/play.html/play-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/video/views/screenRecordings/partialViews/play.html/play.html
 delete mode 100644 public/src/js/modules/main/apps/video/views/screenRecordings/screenRecordings.html/screenRecordings-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/video/views/screenRecordings/screenRecordings.html/screenRecordings.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/chanSpies/chanSpies.html/chanSpies-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/chanSpies/chanSpies.html/chanSpies.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/chanSpies/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/chanSpies/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/contexts/contexts.html/contexts-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/contexts/contexts.html/contexts.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/contexts/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/contexts/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/agi/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/agi/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/custom/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/custom/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/dial/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/dial/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/externaldial/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/externaldial/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/goto/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/goto/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/hangup/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/hangup/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/internaldial/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/internaldial/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/interval/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/interval/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/playback/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/playback/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/queue/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/queue/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/ringgroup/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/ringgroup/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/set/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/set/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/voicemail/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/voicemail/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/inboundroutes.html/inboundroutes-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/inboundroutes/inboundroutes.html/inboundroutes.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/agi/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/agi/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/custom/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/custom/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/dial/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/dial/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/externaldial/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/externaldial/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/goto/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/goto/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/hangup/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/hangup/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/internaldial/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/internaldial/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/interval/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/interval/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/playback/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/playback/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/queue/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/queue/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/ringgroup/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/ringgroup/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/set/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/set/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/voicemail/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/voicemail/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/internalroutes.html/internalroutes-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/internalroutes/internalroutes.html/internalroutes.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/musiconholds/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/musiconholds/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/musiconholds/edit/mohSounds/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/musiconholds/edit/mohSounds/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/musiconholds/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/musiconholds/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/musiconholds/musiconholds.html/musiconholds-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/musiconholds/musiconholds.html/musiconholds.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/outboundroutes/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/outboundroutes/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/outboundroutes/edit/apps/custom/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/outboundroutes/edit/apps/custom/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/outboundroutes/edit/apps/interval/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/outboundroutes/edit/apps/interval/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/outboundroutes/edit/apps/outbounddial/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/outboundroutes/edit/apps/outbounddial/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/outboundroutes/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/outboundroutes/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/outboundroutes/outboundroutes.html/outboundroutes-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/outboundroutes/outboundroutes.html/outboundroutes.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/realtime/abandonedcalls/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/realtime/abandonedcalls/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/realtime/agents/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/realtime/agents/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/realtime/outbound_calls/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/realtime/outbound_calls/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/realtime/queue_calls/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/realtime/queue_calls/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/realtime/queue_params/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/realtime/queue_params/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/realtime/queues/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/realtime/queues/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/realtime/realtime.html/realtime-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/realtime/realtime.html/realtime.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/realtime/telephones/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/realtime/telephones/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/realtime/trunks/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/realtime/trunks/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/voicePrefixes/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/voicePrefixes/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/voicePrefixes/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/voicePrefixes/edit/agentadd/agentadd.html/agentadd.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/voicePrefixes/voicePrefixes.html/voicePrefixes-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/voicePrefixes/voicePrefixes.html/voicePrefixes.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/voiceQueues/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/voiceQueues/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/voiceQueues/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/voiceQueues/edit/agentadd/agentadd.html/agentadd.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/voiceQueues/edit/teamadd/teamadd.html/teamadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/voiceQueues/edit/teamadd/teamadd.html/teamadd.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/voiceQueues/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/voiceQueues/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/voiceQueues/voiceQueues.html/voiceQueues-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/voiceQueues/voiceQueues.html/voiceQueues.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/voiceRecordings/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/voiceRecordings/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/voiceRecordings/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/voiceRecordings/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/voiceRecordings/voiceRecordings.html/voiceRecordings-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/voiceRecordings/voiceRecordings.html/voiceRecordings.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/voicemails/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/voicemails/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/voicemails/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/voicemails/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/voice/views/voicemails/voicemails.html/voicemails-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/voice/views/voicemails/voicemails.html/voicemails.html
 delete mode 100644 public/src/js/modules/main/apps/whatsapp/views/realtime/agents/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/whatsapp/views/realtime/agents/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/whatsapp/views/realtime/queues/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/whatsapp/views/realtime/queues/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/whatsapp/views/realtime/realtime.html/realtime-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/whatsapp/views/realtime/realtime.html/realtime.html
 delete mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/agentadd/agentadd.html/agentadd.html
 delete mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/agent/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/agent/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/amazonlex/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/amazonlex/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/autoreply/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/autoreply/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/close/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/close/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/dialogflow/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/dialogflow/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/gotoif/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/gotoif/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/gotop/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/gotop/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/interval/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/interval/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/noop/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/noop/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/queue/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/queue/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/system/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/system/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/tag/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/tag/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/whatsappCannedAnswers/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/whatsappCannedAnswers/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/whatsappAccounts.html/whatsappAccounts-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/whatsappAccounts.html/whatsappAccounts.html
 delete mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/edit/agentadd/agentadd.html/agentadd.html
 delete mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/edit/teamadd/teamadd.html/teamadd-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/edit/teamadd/teamadd.html/teamadd.html
 delete mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/edit/view.html/view-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/edit/view.html/view.html
 delete mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/whatsappQueues.html/whatsappQueues-[chunkhash].html
 create mode 100644 public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/whatsappQueues.html/whatsappQueues.html
 delete mode 100644 public/src/js/modules/navigation/layouts/horizontal-navigation/navigation.html/navigation-[chunkhash].html
 create mode 100644 public/src/js/modules/navigation/layouts/horizontal-navigation/navigation.html/navigation.html
 delete mode 100644 public/src/js/modules/navigation/layouts/vertical-navigation-fullwidth-toolbar-2/navigation.html/navigation-[chunkhash].html
 create mode 100644 public/src/js/modules/navigation/layouts/vertical-navigation-fullwidth-toolbar-2/navigation.html/navigation.html
 delete mode 100644 public/src/js/modules/navigation/layouts/vertical-navigation/navigation.html/navigation-[chunkhash].html
 create mode 100644 public/src/js/modules/navigation/layouts/vertical-navigation/navigation.html/navigation.html
 delete mode 100644 public/src/js/modules/quick-panel/quick-panel.html/quick-panel-[chunkhash].html
 create mode 100644 public/src/js/modules/quick-panel/quick-panel.html/quick-panel.html
 delete mode 100644 public/src/js/modules/quick-panel/tabs/groups/create/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/quick-panel/tabs/groups/create/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/quick-panel/tabs/groups/info/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/quick-panel/tabs/groups/info/dialog.html/dialog.html
 delete mode 100644 public/src/js/modules/reset/reset.html/reset-[chunkhash].html
 create mode 100644 public/src/js/modules/reset/reset.html/reset.html
 delete mode 100644 public/src/js/modules/toolbar/changepassword/changepassword.html/changepassword-[chunkhash].html
 create mode 100644 public/src/js/modules/toolbar/changepassword/changepassword.html/changepassword.html
 delete mode 100644 public/src/js/modules/toolbar/layouts/vertical-navigation/toolbar.html/toolbar-[chunkhash].html
 create mode 100644 public/src/js/modules/toolbar/layouts/vertical-navigation/toolbar.html/toolbar.html
 delete mode 100644 public/src/js/modules/toolbar/preview/dialog.html/dialog-[chunkhash].html
 create mode 100644 public/src/js/modules/toolbar/preview/dialog.html/dialog.html

diff --git a/apidoc/api_project.js b/apidoc/api_project.js
index d0ebd5d..071a459 100644
--- a/apidoc/api_project.js
+++ b/apidoc/api_project.js
@@ -17,7 +17,7 @@ define({
   "apidoc": "0.3.0",
   "generator": {
     "name": "apidoc",
-    "time": "2020-11-10T16:44:10.101Z",
+    "time": "2020-11-10T16:57:23.116Z",
     "url": "https://apidocjs.com",
     "version": "0.25.0"
   }
diff --git a/apidoc/api_project.json b/apidoc/api_project.json
index a75ee18..aa39b17 100644
--- a/apidoc/api_project.json
+++ b/apidoc/api_project.json
@@ -17,7 +17,7 @@
   "apidoc": "0.3.0",
   "generator": {
     "name": "apidoc",
-    "time": "2020-11-10T16:44:10.101Z",
+    "time": "2020-11-10T16:57:23.116Z",
     "url": "https://apidocjs.com",
     "version": "0.25.0"
   }
diff --git a/package.json b/package.json
index 47aad5f..7b66a5f 100644
--- a/package.json
+++ b/package.json
@@ -116,10 +116,10 @@
     "zip-dir": "^1.0.2"
   },
   "xcally": {
-    "shortHash": "ded3365",
+    "shortHash": "a9fb64c",
     "branch": "develop",
     "tag": "",
-    "committedOn": "2020-11-10T16:42:00.000Z",
-    "buildDate": "2020-11-10T16:47:07.923Z"
+    "committedOn": "2020-11-10T16:57:06.000Z",
+    "buildDate": "2020-11-10T17:00:20.374Z"
   }
 }
diff --git a/public/18-391b2e065f03d1ffb431.js b/public/18-391b2e065f03d1ffb431.js
index 2b61dff..fbcf72d 100644
--- a/public/18-391b2e065f03d1ffb431.js
+++ b/public/18-391b2e065f03d1ffb431.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/public/app-0f22f03a610f164a4a25.js b/public/app-0f22f03a610f164a4a25.js
deleted file mode 100644
index 4b94873..0000000
--- a/public/app-0f22f03a610f164a4a25.js
+++ /dev/null
@@ -1,21 +0,0 @@
-/*!
- * @license
- * *************************************************************************
- * *                                                                       *
- * * xCALLY Motion -  The Omnichannel Contact Center                       *
- * * Copyright (c) Xenialab s.r.l. All Rights Reserved                     *
- * *                                                                       *
- * *************************************************************************
- * *                                                                       *
- * * Email: [email-masked]                                                *
- * * Website: https://www.xcally.com                                       *
- * *                                                                       *
- * *************************************************************************
- * *                                                                       *
- * * The SOFTWARE PRODUCT is protected by copyright laws and international *
- * * copyright treaties, as well as other intellectual property laws and   *
- * * treaties. The SOFTWARE PRODUCT is licensed, not sold. 		        *
- * *                                                                       *
- * *************************************************************************
- */
\ No newline at end of file
diff --git a/public/app-0f22f03a610f164a4a25.js.map b/public/app-0f22f03a610f164a4a25.js.map
deleted file mode 100644
index afe9eac..0000000
--- a/public/app-0f22f03a610f164a4a25.js.map
+++ /dev/null
@@ -1 +0,0 @@
\ No newline at end of file
diff --git a/public/app-7dc16afb7a5557c9968d.js b/public/app-7dc16afb7a5557c9968d.js
new file mode 100644
index 0000000..1a95b68
--- /dev/null
+++ b/public/app-7dc16afb7a5557c9968d.js
@@ -0,0 +1,21 @@
+/*!
+ * @license
+ * *************************************************************************
+ * *                                                                       *
+ * * xCALLY Motion -  The Omnichannel Contact Center                       *
+ * * Copyright (c) Xenialab s.r.l. All Rights Reserved                     *
+ * *                                                                       *
+ * *************************************************************************
+ * *                                                                       *
+ * * Email: [email-masked]                                                *
+ * * Website: https://www.xcally.com                                       *
+ * *                                                                       *
+ * *************************************************************************
+ * *                                                                       *
+ * * The SOFTWARE PRODUCT is protected by copyright laws and international *
+ * * copyright treaties, as well as other intellectual property laws and   *
+ * * treaties. The SOFTWARE PRODUCT is licensed, not sold. 		        *
+ * *                                                                       *
+ * *************************************************************************
+ */
\ No newline at end of file
diff --git a/public/app-7dc16afb7a5557c9968d.js.map b/public/app-7dc16afb7a5557c9968d.js.map
new file mode 100644
index 0000000..325ebcd
--- /dev/null
+++ b/public/app-7dc16afb7a5557c9968d.js.map
@@ -0,0 +1 @@
\ No newline at end of file
diff --git a/public/index.html b/public/index.html
index 9ea9958..bd23e76 100644
--- a/public/index.html
+++ b/public/index.html
@@ -4,4 +4,4 @@
       <a href="http://browsehappy.com/">upgrade your browser</a> to improve your
       experience.
     </p>
\ No newline at end of file
\ No newline at end of file
diff --git a/public/runtime-472ac7a6568b98562237.js b/public/runtime-472ac7a6568b98562237.js
index a0b4022..d5116d2 100644
--- a/public/runtime-472ac7a6568b98562237.js
+++ b/public/runtime-472ac7a6568b98562237.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/public/service-worker.js b/public/service-worker.js
index bd94bdc..2e8b118 100644
--- a/public/service-worker.js
+++ b/public/service-worker.js
@@ -1,2 +1,2 @@
 //# sourceMappingURL=service-worker.js.map
\ No newline at end of file
diff --git a/public/service-worker.js.map b/public/service-worker.js.map
index cdac588..43230ed 100644
--- a/public/service-worker.js.map
+++ b/public/service-worker.js.map
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/public/src/js/modules/auth/services/hotdesk/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/auth/services/hotdesk/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 41a10d6..0000000
--- a/public/src/js/modules/auth/services/hotdesk/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,39 +0,0 @@
-<md-dialog aria-label="Telephone">
-  <form ng-cloak>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <div flex>
-          <span class="title" translate="LOGIN.TELEPHONES">Telephones</span>
-        </div>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content>
-      <md-select ng-model="vm.name" placeholder="Select a telephone">
-        <md-option
-          value="{{telephone.name}}"
-          ng-repeat="telephone in vm.telephones.rows"
-          >{{telephone.fullname}}</md-option
-        >
-      </md-select>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row">
-      <md-button
-        ng-click="vm.closeDialog(vm.name)"
-        class="send-button md-accent md-raised"
-        aria-label="call"
-        ng-disabled="!vm.name"
-      >
-        <span translate="LOGIN.SELECT">SELECT</span>
-      </md-button>
-      <!-- <md-button ng-click="vm.closeDialog()" class="send-button md-accent md-raised" aria-label="cancel">
-                <span translate="LOGIN.CANCEL">Cancel</span>
-            </md-button> -->
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/auth/services/hotdesk/dialog.html/dialog.html b/public/src/js/modules/auth/services/hotdesk/dialog.html/dialog.html
new file mode 100644
index 0000000..41a10d6
--- /dev/null
+++ b/public/src/js/modules/auth/services/hotdesk/dialog.html/dialog.html
@@ -0,0 +1,39 @@
+<md-dialog aria-label="Telephone">
+  <form ng-cloak>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <div flex>
+          <span class="title" translate="LOGIN.TELEPHONES">Telephones</span>
+        </div>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content>
+      <md-select ng-model="vm.name" placeholder="Select a telephone">
+        <md-option
+          value="{{telephone.name}}"
+          ng-repeat="telephone in vm.telephones.rows"
+          >{{telephone.fullname}}</md-option
+        >
+      </md-select>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row">
+      <md-button
+        ng-click="vm.closeDialog(vm.name)"
+        class="send-button md-accent md-raised"
+        aria-label="call"
+        ng-disabled="!vm.name"
+      >
+        <span translate="LOGIN.SELECT">SELECT</span>
+      </md-button>
+      <!-- <md-button ng-click="vm.closeDialog()" class="send-button md-accent md-raised" aria-label="cancel">
+                <span translate="LOGIN.CANCEL">Cancel</span>
+            </md-button> -->
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/core/dialogs/advanced-search/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/core/dialogs/advanced-search/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 636a968..0000000
--- a/public/src/js/modules/core/dialogs/advanced-search/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,71 +0,0 @@
-<md-dialog
-  class="advanced-search-dialog"
-  aria-label="Advanced search"
-  flex="70"
-  ng-init="vm.onInit()"
->
-  <form ng-cloak>
-    <md-toolbar
-      class="advanced-search-dialog-header"
-      ng-class="{{ 'vm.toolbarColor' }} + '-bg'"
-    >
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <div flex>
-          <span class="title" translate="DASHBOARDS.ADVANCED_SEARCH"></span>
-        </div>
-        <div layout="row" layout-align="end center">
-          <md-button
-            class="md-icon-button no-margin no-padding"
-            ng-click="vm.minimize()"
-          >
-            <md-icon
-              class="no-margin"
-              md-font-icon="icon-window-minimize"
-              aria-label="Minimize dialog"
-            ></md-icon>
-          </md-button>
-          <md-button
-            class="md-icon-button no-margin no-padding"
-            ng-click="vm.close()"
-          >
-            <md-icon
-              class="no-margin"
-              md-font-icon="icon-window-close"
-              aria-label="Close dialog"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content>
-      <ms-advanced-search
-        options="vm.searchOptions"
-        clear-filter="vm.clearConditions()"
-      ></ms-advanced-search>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row">
-      <md-button
-        class="md-primary md-raised"
-        aria-label="Clear"
-        ng-disabled="vm.searchOptions.conditions.length === 0"
-        translate="DASHBOARDS.CLEAR"
-        translate-attr-aria-label="DASHBOARDS.CLEAR"
-        ng-click="vm.clearConditions()"
-      ></md-button>
-      <md-button
-        class="md-primary md-accent md-raised"
-        aria-label="Apply"
-        ng-disabled="vm.searchOptions.conditions.length === 0"
-        translate="DASHBOARDS.APPLY"
-        translate-attr-aria-label="DASHBOARDS.APPLY"
-        ng-click="vm.applyFilter()"
-      ></md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/core/dialogs/advanced-search/dialog.html/dialog.html b/public/src/js/modules/core/dialogs/advanced-search/dialog.html/dialog.html
new file mode 100644
index 0000000..636a968
--- /dev/null
+++ b/public/src/js/modules/core/dialogs/advanced-search/dialog.html/dialog.html
@@ -0,0 +1,71 @@
+<md-dialog
+  class="advanced-search-dialog"
+  aria-label="Advanced search"
+  flex="70"
+  ng-init="vm.onInit()"
+>
+  <form ng-cloak>
+    <md-toolbar
+      class="advanced-search-dialog-header"
+      ng-class="{{ 'vm.toolbarColor' }} + '-bg'"
+    >
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <div flex>
+          <span class="title" translate="DASHBOARDS.ADVANCED_SEARCH"></span>
+        </div>
+        <div layout="row" layout-align="end center">
+          <md-button
+            class="md-icon-button no-margin no-padding"
+            ng-click="vm.minimize()"
+          >
+            <md-icon
+              class="no-margin"
+              md-font-icon="icon-window-minimize"
+              aria-label="Minimize dialog"
+            ></md-icon>
+          </md-button>
+          <md-button
+            class="md-icon-button no-margin no-padding"
+            ng-click="vm.close()"
+          >
+            <md-icon
+              class="no-margin"
+              md-font-icon="icon-window-close"
+              aria-label="Close dialog"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content>
+      <ms-advanced-search
+        options="vm.searchOptions"
+        clear-filter="vm.clearConditions()"
+      ></ms-advanced-search>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row">
+      <md-button
+        class="md-primary md-raised"
+        aria-label="Clear"
+        ng-disabled="vm.searchOptions.conditions.length === 0"
+        translate="DASHBOARDS.CLEAR"
+        translate-attr-aria-label="DASHBOARDS.CLEAR"
+        ng-click="vm.clearConditions()"
+      ></md-button>
+      <md-button
+        class="md-primary md-accent md-raised"
+        aria-label="Apply"
+        ng-disabled="vm.searchOptions.conditions.length === 0"
+        translate="DASHBOARDS.APPLY"
+        translate-attr-aria-label="DASHBOARDS.APPLY"
+        ng-click="vm.applyFilter()"
+      ></md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/core/directives/ms-advanced-search/ms-advanced-search.html/ms-advanced-search-[chunkhash].html b/public/src/js/modules/core/directives/ms-advanced-search/ms-advanced-search.html/ms-advanced-search-[chunkhash].html
deleted file mode 100644
index 964ce37..0000000
--- a/public/src/js/modules/core/directives/ms-advanced-search/ms-advanced-search.html/ms-advanced-search-[chunkhash].html
+++ /dev/null
@@ -1,320 +0,0 @@
-<div layout="column" class="advanced-search-container" flex>
-  <div layout-margin>
-    <md-radio-group
-      ng-model="vm.options.matchType"
-      class="md-primary"
-      layout="row"
-    >
-      <md-radio-button value="$and" class="md-primary"
-        >{{ 'DASHBOARDS.MEET_ALL_CONDITIONS' | translate }}
-      </md-radio-button>
-      <md-radio-button value="$or"
-        >{{ 'DASHBOARDS.MEET_ANY_CONDITIONS' | translate }}</md-radio-button
-      >
-    </md-radio-group>
-  </div>
-
-  <!-- ACTIVE CONDITIONS -->
-  <div
-    layout="row"
-    ng-if="vm.options.conditions.length > 0"
-    class="advanced-search-conditions"
-  >
-    <md-list>
-      <md-list-item>
-        <md-chips
-          ng-model="vm.options.conditions"
-          class="advanced-search-chips"
-          readonly="true"
-          md-removable="true"
-          md-on-remove="vm.removeCondition()"
-        >
-          <md-chip-template ms-chip-color="{{ $chip.style }}">
-            <md-menu
-              md-offset="50 0"
-              ng-class="{'no-click': vm.pendingCondition}"
-            >
-              <span>
-                <p class="filter-text">{{ $chip.name }}</p>
-                <em ng-show="$chip.operator" class="text-lowercase"
-                  >{{ $chip.operator }}</em
-                >
-                <strong>{{ $chip.displayValue }}</strong>
-                <em ng-show="$chip.displayEndValue" class="text-lowercase"
-                  >{{ 'DASHBOARDS.AND' | translate }}</em
-                >
-                <strong>{{ $chip.displayEndValue }}</strong>
-              </span>
-              <md-menu-content width="2" class="md-dense">
-                <md-menu-item ng-hide="$chip.disabled">
-                  <md-button ng-click="vm.editCondition($chip)"
-                    >Edit
-                  </md-button>
-                </md-menu-item>
-                <md-menu-item>
-                  <md-button ng-click="vm.setConditionStatus($chip)">
-                    {{ $chip.disabled ? 'Enable' : 'Disable' }}
-                  </md-button>
-                </md-menu-item>
-              </md-menu-content>
-            </md-menu>
-          </md-chip-template>
-          <button type="button" md-chip-remove class="md-primary remove-filter">
-            <md-icon
-              md-font-icon="icon-cancel"
-              aria-label="Remove Filter"
-            ></md-icon>
-          </button>
-        </md-chips>
-      </md-list-item>
-    </md-list>
-  </div>
-
-  <!-- FILTERS -->
-  <div layout="row">
-    <div layout="row" class="advanced-search-bar" layout-margin flex>
-      <!-- FIELD -->
-      <md-input-container flex="35">
-        <md-icon md-font-icon="icon-filter-variant"></md-icon>
-        <md-select
-          class="font-size-12"
-          ng-model="vm.selectedField"
-          ng-change="vm.onFieldChange()"
-          placeholder="{{ 'DASHBOARDS.SELECT_FIELD' | translate }}"
-          aria-label="Field"
-        >
-          <md-option ng-value="field" ng-repeat="field in vm.options.fields"
-            >{{ field.name }}</md-option
-          >
-        </md-select>
-      </md-input-container>
-
-      <!-- OPERATOR -->
-      <md-input-container flex="30">
-        <md-icon md-font-icon="icon-format-text"></md-icon>
-        <md-select
-          class="font-size-12"
-          ng-model="vm.selectedOperator"
-          ng-change="vm.onOperatorChange(oldValue)"
-          ng-focus="oldValue=vm.selectedOperator"
-          md-selected-text="vm.selectedOperator ? ('DASHBOARDS.' + vm.selectedOperator.translate | translate) : ('DASHBOARDS.SELECT_OPERATOR' | translate)"
-          ng-disabled="!vm.selectedField"
-          aria-label="Operator"
-        >
-          <md-option
-            ng-value="operator"
-            ng-repeat="operator in vm.availableOperators"
-            ng-selected="vm.autoSelectOperator"
-          >
-            <div layout="row" class="operators-list">
-              <span class="operator-symbol"> {{ operator.symbol }} </span>
-              <span>
-                {{ 'DASHBOARDS.' + operator.translate | translate }}
-              </span>
-            </div>
-          </md-option>
-        </md-select>
-      </md-input-container>
-
-      <!-- TEXT INPUT -->
-      <md-input-container
-        ng-if="!vm.selectedField.type || vm.selectedField.type === 'text'"
-        class="no-errors"
-        flex
-      >
-        <md-icon md-font-icon="icon-format-text"></md-icon>
-        <input
-          type="text"
-          aria-label="Value"
-          ng-model="vm.value"
-          ng-change="vm.onValueChange()"
-          ng-disabled="!vm.selectedField"
-          ng-keydown="$event.keyCode == 13 && vm.isValidCondition && vm.handleKeyboardAction()"
-          placeholder="{{ 'DASHBOARDS.VALUE' | translate }}"
-        />
-      </md-input-container>
-      <!-- NUMERIC INPUT -->
-      <div
-        ng-if="vm.selectedField.type === 'number'"
-        flex
-        layout="row"
-        layout-margin
-        class="no-margin"
-      >
-        <md-input-container class="no-errors" flex>
-          <md-icon md-font-icon="icon-numeric"></md-icon>
-          <input
-            type="number"
-            aria-label="Value"
-            ng-model="vm.value"
-            ng-change="vm.onValueChange()"
-            ng-disabled="!vm.selectedField"
-            min="0"
-            ng-keydown="$event.keyCode == 13 && vm.isValidCondition && vm.handleKeyboardAction()"
-            placeholder="{{ vm.selectedOperator.type === '$between' ? 'DASHBOARDS.STARTING_VALUE' : 'DASHBOARDS.VALUE' | translate }}"
-          />
-        </md-input-container>
-        <md-input-container
-          class="no-errors"
-          ng-if="vm.selectedOperator.type === '$between'"
-          ng-class="{'md-input-invalid': !vm.isValidRange}"
-          flex
-        >
-          <md-icon md-font-icon=" icon-numeric"> </md-icon>
-          <input
-            class="md-input"
-            type="number"
-            aria-label="Value"
-            ng-model="vm.endRangeValue"
-            ng-change="vm.checkRange()"
-            ng-disabled="!vm.value"
-            min="vm.value"
-            ng-keydown="$event.keyCode == 13 && vm.isValidCondition && vm.handleKeyboardAction()"
-            placeholder="{{ 'DASHBOARDS.ENDING_VALUE' | translate }}"
-          />
-          <div
-            ng-if="!vm.isValidRange"
-            class="md-input-message-animation md-input-messages-animation"
-          >
-            {{ ('DASHBOARDS.VALUE_RANGE_CHECK' | translate) + ' ' + vm.value }}
-          </div>
-        </md-input-container>
-      </div>
-      <!-- SELECT -->
-      <md-input-container ng-if="vm.selectedField.type === 'select'" flex>
-        <md-icon md-font-icon="icon-format-text"></md-icon>
-        <md-select
-          class="font-size-12"
-          ng-model="vm.value"
-          md-on-open="vm.getValues()"
-          ng-change="vm.onValueChange()"
-          ng-model-vm.options="{trackBy: '$value.id'}"
-          ng-keydown="$event.keyCode == 13 && vm.isValidCondition && vm.handleKeyboardAction()"
-          placeholder="{{ 'DASHBOARDS.VALUE' | translate }}"
-          aria-label="Value"
-        >
-          <md-option ng-value="item" ng-repeat="item in vm.selectedField.values"
-            >{{item.name}}
-          </md-option>
-        </md-select>
-      </md-input-container>
-      <!-- MULTISELECT -->
-      <md-input-container ng-if="vm.selectedField.type === 'multiselect'" flex>
-        <md-icon md-font-icon="icon-format-text"></md-icon>
-        <md-select
-          class="font-size-12"
-          multiple
-          ng-model="vm.value"
-          md-on-open="vm.getValues()"
-          ng-change="vm.onValueChange()"
-          ng-model-vm.options="{trackBy: '$value.id'}"
-          ng-keydown="$event.keyCode == 13 && vm.isValidCondition && vm.handleKeyboardAction()"
-          placeholder="{{ 'DASHBOARDS.VALUE' | translate }}"
-          aria-label="Value"
-        >
-          <md-option ng-value="item" ng-repeat="item in vm.selectedField.values"
-            >{{item.name}}
-          </md-option>
-        </md-select>
-      </md-input-container>
-      <!-- DATE INPUT -->
-      <div ng-if="vm.selectedField.type === 'date'" flex layout="row">
-        <mdp-date-picker
-          mdp-open-on-click
-          ng-model="vm.value"
-          ng-change="vm.onValueChange()"
-          mdp-max-date="vm.maxDateRange"
-          mdp-placeholder="{{ vm.selectedOperator.type === '$between' ? 'DASHBOARDS.STARTING_DATE' : 'DASHBOARDS.VALUE' | translate }}"
-          ng-keydown="$event.keyCode == 13 && vm.isValidCondition && vm.handleKeyboardAction()"
-          flex
-        >
-        </mdp-date-picker>
-        <mdp-date-picker
-          mdp-open-on-click
-          ng-if="vm.selectedOperator.type === '$between'"
-          ng-change="vm.checkRange()"
-          ng-model="vm.endRangeValue"
-          mdp-min-date="vm.minDateRange"
-          mdp-disabled="!vm.value"
-          mdp-placeholder="{{ 'DASHBOARDS.ENDING_DATE' | translate }}"
-          ng-keydown="$event.keyCode == 13 && vm.isValidCondition && vm.handleKeyboardAction()"
-          flex
-        >
-        </mdp-date-picker>
-      </div>
-      <!-- AUTOCOMPLETE -->
-      <div
-        layout="row"
-        layout-align="start start"
-        ng-if="vm.selectedField.type === 'autocomplete' && vm.selectedOperator.type != '$substring'"
-        class="autocomplete-input"
-        flex
-      >
-        <md-icon md-font-icon="icon-format-text"></md-icon>
-        <md-autocomplete
-          md-selected-item="vm.value"
-          md-selected-item-change="vm.onValueChange()"
-          md-items="item in vm.getValues()"
-          md-search-text="vm.searchText"
-          md-item-text="item.displayValue"
-          md-min-length="4"
-          md-no-cache="true"
-          md-floating-label="{{ 'DASHBOARDS.VALUE' | translate }}"
-          ng-keydown="$event.keyCode == 13 && vm.isValidCondition && vm.handleKeyboardAction()"
-          flex
-        >
-          <md-item-template>
-            <span md-highlight-text="vm.searchText" md-highlight-flags="i"
-              >{{item.displayValue}}</span
-            >
-          </md-item-template>
-        </md-autocomplete>
-      </div>
-      <md-input-container
-        ng-if="vm.selectedField.type === 'autocomplete' && vm.selectedOperator.type === '$substring'"
-        class="no-errors"
-        flex
-      >
-        <md-icon md-font-icon="icon-format-text"></md-icon>
-        <input
-          type="text"
-          aria-label="Value"
-          ng-model="vm.value"
-          ng-change="vm.onValueChange()"
-          ng-disabled="!vm.selectedField"
-          ng-keydown="$event.keyCode == 13 && vm.isValidCondition && vm.handleKeyboardAction()"
-          placeholder="{{ 'DASHBOARDS.VALUE' | translate }}"
-        />
-      </md-input-container>
-    </div>
-    <md-button
-      class="md-fab md-mini md-primary mt-20"
-      ng-if="!vm.pendingCondition"
-      ng-disabled="!vm.isValidCondition"
-      aria-label="Add filter"
-      ng-click="vm.addCondition()"
-      translate-attr-aria-label="DASHBOARDS.ADD"
-    >
-      <md-icon md-font-icon="icon-plus"></md-icon>
-    </md-button>
-    <md-button
-      class="md-fab md-mini mt-20"
-      ng-if="vm.pendingCondition"
-      ng-disabled="!vm.isValidCondition"
-      aria-label="Update filter"
-      ng-click="vm.updateCondition()"
-      translate-attr-aria-label="DASHBOARDS.UPDATE"
-    >
-      <md-icon md-font-icon="icon-check"></md-icon>
-    </md-button>
-    <md-button
-      class="md-fab md-mini md-primary mt-20"
-      ng-if="vm.pendingCondition"
-      aria-label="Cancel filter update"
-      ng-click="vm.cancelUpdateCondition()"
-      translate-attr-aria-label="DASHBOARDS.CANCEL"
-    >
-      <md-icon md-font-icon="icon-close"></md-icon>
-    </md-button>
-  </div>
-</div>
diff --git a/public/src/js/modules/core/directives/ms-advanced-search/ms-advanced-search.html/ms-advanced-search.html b/public/src/js/modules/core/directives/ms-advanced-search/ms-advanced-search.html/ms-advanced-search.html
new file mode 100644
index 0000000..964ce37
--- /dev/null
+++ b/public/src/js/modules/core/directives/ms-advanced-search/ms-advanced-search.html/ms-advanced-search.html
@@ -0,0 +1,320 @@
+<div layout="column" class="advanced-search-container" flex>
+  <div layout-margin>
+    <md-radio-group
+      ng-model="vm.options.matchType"
+      class="md-primary"
+      layout="row"
+    >
+      <md-radio-button value="$and" class="md-primary"
+        >{{ 'DASHBOARDS.MEET_ALL_CONDITIONS' | translate }}
+      </md-radio-button>
+      <md-radio-button value="$or"
+        >{{ 'DASHBOARDS.MEET_ANY_CONDITIONS' | translate }}</md-radio-button
+      >
+    </md-radio-group>
+  </div>
+
+  <!-- ACTIVE CONDITIONS -->
+  <div
+    layout="row"
+    ng-if="vm.options.conditions.length > 0"
+    class="advanced-search-conditions"
+  >
+    <md-list>
+      <md-list-item>
+        <md-chips
+          ng-model="vm.options.conditions"
+          class="advanced-search-chips"
+          readonly="true"
+          md-removable="true"
+          md-on-remove="vm.removeCondition()"
+        >
+          <md-chip-template ms-chip-color="{{ $chip.style }}">
+            <md-menu
+              md-offset="50 0"
+              ng-class="{'no-click': vm.pendingCondition}"
+            >
+              <span>
+                <p class="filter-text">{{ $chip.name }}</p>
+                <em ng-show="$chip.operator" class="text-lowercase"
+                  >{{ $chip.operator }}</em
+                >
+                <strong>{{ $chip.displayValue }}</strong>
+                <em ng-show="$chip.displayEndValue" class="text-lowercase"
+                  >{{ 'DASHBOARDS.AND' | translate }}</em
+                >
+                <strong>{{ $chip.displayEndValue }}</strong>
+              </span>
+              <md-menu-content width="2" class="md-dense">
+                <md-menu-item ng-hide="$chip.disabled">
+                  <md-button ng-click="vm.editCondition($chip)"
+                    >Edit
+                  </md-button>
+                </md-menu-item>
+                <md-menu-item>
+                  <md-button ng-click="vm.setConditionStatus($chip)">
+                    {{ $chip.disabled ? 'Enable' : 'Disable' }}
+                  </md-button>
+                </md-menu-item>
+              </md-menu-content>
+            </md-menu>
+          </md-chip-template>
+          <button type="button" md-chip-remove class="md-primary remove-filter">
+            <md-icon
+              md-font-icon="icon-cancel"
+              aria-label="Remove Filter"
+            ></md-icon>
+          </button>
+        </md-chips>
+      </md-list-item>
+    </md-list>
+  </div>
+
+  <!-- FILTERS -->
+  <div layout="row">
+    <div layout="row" class="advanced-search-bar" layout-margin flex>
+      <!-- FIELD -->
+      <md-input-container flex="35">
+        <md-icon md-font-icon="icon-filter-variant"></md-icon>
+        <md-select
+          class="font-size-12"
+          ng-model="vm.selectedField"
+          ng-change="vm.onFieldChange()"
+          placeholder="{{ 'DASHBOARDS.SELECT_FIELD' | translate }}"
+          aria-label="Field"
+        >
+          <md-option ng-value="field" ng-repeat="field in vm.options.fields"
+            >{{ field.name }}</md-option
+          >
+        </md-select>
+      </md-input-container>
+
+      <!-- OPERATOR -->
+      <md-input-container flex="30">
+        <md-icon md-font-icon="icon-format-text"></md-icon>
+        <md-select
+          class="font-size-12"
+          ng-model="vm.selectedOperator"
+          ng-change="vm.onOperatorChange(oldValue)"
+          ng-focus="oldValue=vm.selectedOperator"
+          md-selected-text="vm.selectedOperator ? ('DASHBOARDS.' + vm.selectedOperator.translate | translate) : ('DASHBOARDS.SELECT_OPERATOR' | translate)"
+          ng-disabled="!vm.selectedField"
+          aria-label="Operator"
+        >
+          <md-option
+            ng-value="operator"
+            ng-repeat="operator in vm.availableOperators"
+            ng-selected="vm.autoSelectOperator"
+          >
+            <div layout="row" class="operators-list">
+              <span class="operator-symbol"> {{ operator.symbol }} </span>
+              <span>
+                {{ 'DASHBOARDS.' + operator.translate | translate }}
+              </span>
+            </div>
+          </md-option>
+        </md-select>
+      </md-input-container>
+
+      <!-- TEXT INPUT -->
+      <md-input-container
+        ng-if="!vm.selectedField.type || vm.selectedField.type === 'text'"
+        class="no-errors"
+        flex
+      >
+        <md-icon md-font-icon="icon-format-text"></md-icon>
+        <input
+          type="text"
+          aria-label="Value"
+          ng-model="vm.value"
+          ng-change="vm.onValueChange()"
+          ng-disabled="!vm.selectedField"
+          ng-keydown="$event.keyCode == 13 && vm.isValidCondition && vm.handleKeyboardAction()"
+          placeholder="{{ 'DASHBOARDS.VALUE' | translate }}"
+        />
+      </md-input-container>
+      <!-- NUMERIC INPUT -->
+      <div
+        ng-if="vm.selectedField.type === 'number'"
+        flex
+        layout="row"
+        layout-margin
+        class="no-margin"
+      >
+        <md-input-container class="no-errors" flex>
+          <md-icon md-font-icon="icon-numeric"></md-icon>
+          <input
+            type="number"
+            aria-label="Value"
+            ng-model="vm.value"
+            ng-change="vm.onValueChange()"
+            ng-disabled="!vm.selectedField"
+            min="0"
+            ng-keydown="$event.keyCode == 13 && vm.isValidCondition && vm.handleKeyboardAction()"
+            placeholder="{{ vm.selectedOperator.type === '$between' ? 'DASHBOARDS.STARTING_VALUE' : 'DASHBOARDS.VALUE' | translate }}"
+          />
+        </md-input-container>
+        <md-input-container
+          class="no-errors"
+          ng-if="vm.selectedOperator.type === '$between'"
+          ng-class="{'md-input-invalid': !vm.isValidRange}"
+          flex
+        >
+          <md-icon md-font-icon=" icon-numeric"> </md-icon>
+          <input
+            class="md-input"
+            type="number"
+            aria-label="Value"
+            ng-model="vm.endRangeValue"
+            ng-change="vm.checkRange()"
+            ng-disabled="!vm.value"
+            min="vm.value"
+            ng-keydown="$event.keyCode == 13 && vm.isValidCondition && vm.handleKeyboardAction()"
+            placeholder="{{ 'DASHBOARDS.ENDING_VALUE' | translate }}"
+          />
+          <div
+            ng-if="!vm.isValidRange"
+            class="md-input-message-animation md-input-messages-animation"
+          >
+            {{ ('DASHBOARDS.VALUE_RANGE_CHECK' | translate) + ' ' + vm.value }}
+          </div>
+        </md-input-container>
+      </div>
+      <!-- SELECT -->
+      <md-input-container ng-if="vm.selectedField.type === 'select'" flex>
+        <md-icon md-font-icon="icon-format-text"></md-icon>
+        <md-select
+          class="font-size-12"
+          ng-model="vm.value"
+          md-on-open="vm.getValues()"
+          ng-change="vm.onValueChange()"
+          ng-model-vm.options="{trackBy: '$value.id'}"
+          ng-keydown="$event.keyCode == 13 && vm.isValidCondition && vm.handleKeyboardAction()"
+          placeholder="{{ 'DASHBOARDS.VALUE' | translate }}"
+          aria-label="Value"
+        >
+          <md-option ng-value="item" ng-repeat="item in vm.selectedField.values"
+            >{{item.name}}
+          </md-option>
+        </md-select>
+      </md-input-container>
+      <!-- MULTISELECT -->
+      <md-input-container ng-if="vm.selectedField.type === 'multiselect'" flex>
+        <md-icon md-font-icon="icon-format-text"></md-icon>
+        <md-select
+          class="font-size-12"
+          multiple
+          ng-model="vm.value"
+          md-on-open="vm.getValues()"
+          ng-change="vm.onValueChange()"
+          ng-model-vm.options="{trackBy: '$value.id'}"
+          ng-keydown="$event.keyCode == 13 && vm.isValidCondition && vm.handleKeyboardAction()"
+          placeholder="{{ 'DASHBOARDS.VALUE' | translate }}"
+          aria-label="Value"
+        >
+          <md-option ng-value="item" ng-repeat="item in vm.selectedField.values"
+            >{{item.name}}
+          </md-option>
+        </md-select>
+      </md-input-container>
+      <!-- DATE INPUT -->
+      <div ng-if="vm.selectedField.type === 'date'" flex layout="row">
+        <mdp-date-picker
+          mdp-open-on-click
+          ng-model="vm.value"
+          ng-change="vm.onValueChange()"
+          mdp-max-date="vm.maxDateRange"
+          mdp-placeholder="{{ vm.selectedOperator.type === '$between' ? 'DASHBOARDS.STARTING_DATE' : 'DASHBOARDS.VALUE' | translate }}"
+          ng-keydown="$event.keyCode == 13 && vm.isValidCondition && vm.handleKeyboardAction()"
+          flex
+        >
+        </mdp-date-picker>
+        <mdp-date-picker
+          mdp-open-on-click
+          ng-if="vm.selectedOperator.type === '$between'"
+          ng-change="vm.checkRange()"
+          ng-model="vm.endRangeValue"
+          mdp-min-date="vm.minDateRange"
+          mdp-disabled="!vm.value"
+          mdp-placeholder="{{ 'DASHBOARDS.ENDING_DATE' | translate }}"
+          ng-keydown="$event.keyCode == 13 && vm.isValidCondition && vm.handleKeyboardAction()"
+          flex
+        >
+        </mdp-date-picker>
+      </div>
+      <!-- AUTOCOMPLETE -->
+      <div
+        layout="row"
+        layout-align="start start"
+        ng-if="vm.selectedField.type === 'autocomplete' && vm.selectedOperator.type != '$substring'"
+        class="autocomplete-input"
+        flex
+      >
+        <md-icon md-font-icon="icon-format-text"></md-icon>
+        <md-autocomplete
+          md-selected-item="vm.value"
+          md-selected-item-change="vm.onValueChange()"
+          md-items="item in vm.getValues()"
+          md-search-text="vm.searchText"
+          md-item-text="item.displayValue"
+          md-min-length="4"
+          md-no-cache="true"
+          md-floating-label="{{ 'DASHBOARDS.VALUE' | translate }}"
+          ng-keydown="$event.keyCode == 13 && vm.isValidCondition && vm.handleKeyboardAction()"
+          flex
+        >
+          <md-item-template>
+            <span md-highlight-text="vm.searchText" md-highlight-flags="i"
+              >{{item.displayValue}}</span
+            >
+          </md-item-template>
+        </md-autocomplete>
+      </div>
+      <md-input-container
+        ng-if="vm.selectedField.type === 'autocomplete' && vm.selectedOperator.type === '$substring'"
+        class="no-errors"
+        flex
+      >
+        <md-icon md-font-icon="icon-format-text"></md-icon>
+        <input
+          type="text"
+          aria-label="Value"
+          ng-model="vm.value"
+          ng-change="vm.onValueChange()"
+          ng-disabled="!vm.selectedField"
+          ng-keydown="$event.keyCode == 13 && vm.isValidCondition && vm.handleKeyboardAction()"
+          placeholder="{{ 'DASHBOARDS.VALUE' | translate }}"
+        />
+      </md-input-container>
+    </div>
+    <md-button
+      class="md-fab md-mini md-primary mt-20"
+      ng-if="!vm.pendingCondition"
+      ng-disabled="!vm.isValidCondition"
+      aria-label="Add filter"
+      ng-click="vm.addCondition()"
+      translate-attr-aria-label="DASHBOARDS.ADD"
+    >
+      <md-icon md-font-icon="icon-plus"></md-icon>
+    </md-button>
+    <md-button
+      class="md-fab md-mini mt-20"
+      ng-if="vm.pendingCondition"
+      ng-disabled="!vm.isValidCondition"
+      aria-label="Update filter"
+      ng-click="vm.updateCondition()"
+      translate-attr-aria-label="DASHBOARDS.UPDATE"
+    >
+      <md-icon md-font-icon="icon-check"></md-icon>
+    </md-button>
+    <md-button
+      class="md-fab md-mini md-primary mt-20"
+      ng-if="vm.pendingCondition"
+      aria-label="Cancel filter update"
+      ng-click="vm.cancelUpdateCondition()"
+      translate-attr-aria-label="DASHBOARDS.CANCEL"
+    >
+      <md-icon md-font-icon="icon-close"></md-icon>
+    </md-button>
+  </div>
+</div>
diff --git a/public/src/js/modules/core/directives/ms-click-to-call/ms-click-to-call.html/ms-click-to-call-[chunkhash].html b/public/src/js/modules/core/directives/ms-click-to-call/ms-click-to-call.html/ms-click-to-call-[chunkhash].html
deleted file mode 100644
index 016d858..0000000
--- a/public/src/js/modules/core/directives/ms-click-to-call/ms-click-to-call.html/ms-click-to-call-[chunkhash].html
+++ /dev/null
@@ -1,62 +0,0 @@
-<section ng-if="type !== 'button'">
-  <span ng-if="!showMenu()">{{target}}</span>
-
-  <md-menu ng-if="showMenu()">
-    <a aria-label="Target" ng-click="$mdMenu.open($event)">
-      <span ng-if="prefix">{{prefix}}-</span>{{target}}
-    </a>
-
-    <md-menu-content width="2">
-      <md-menu-item>
-        <md-button ng-click="call(prefix ? prefix + target : target)">
-          {{'DASHBOARDS.CALL_NUMBER' | translate}} ({{prefix ? prefix + '-' +
-          target : target}})
-        </md-button>
-      </md-menu-item>
-      <md-menu-item>
-        <md-button ng-click="transfer(prefix ? prefix + target : target)">
-          {{'DASHBOARDS.TRANSFER_NUMBER' | translate}} ({{prefix ? prefix + '-'
-          + target : target}})
-        </md-button>
-      </md-menu-item>
-    </md-menu-content>
-  </md-menu>
-</section>
-
-<section ng-if="type === 'button'">
-  <md-button
-    ng-if="!showMenu()"
-    ng-disabled="true"
-    class="md-icon-button md-raised md-accent ng-scope md-ink-ripple"
-    title="NEW CALL"
-    aria-label="NEW CALL"
-  >
-    <md-icon md-font-icon="icon-phone"></md-icon>
-  </md-button>
-
-  <md-menu ng-if="showMenu()">
-    <md-button
-      class="md-icon-button md-raised md-accent ng-scope md-ink-ripple"
-      title="NEW CALL"
-      ng-click="$mdMenu.open($event)"
-      aria-label="NEW CALL"
-    >
-      <md-icon md-font-icon="icon-phone"></md-icon>
-    </md-button>
-
-    <md-menu-content width="2">
-      <md-menu-item>
-        <md-button ng-click="call(prefix ? prefix + target : target)">
-          {{'DASHBOARDS.CALL_NUMBER' | translate}} ({{prefix ? prefix + '-' +
-          target : target}})
-        </md-button>
-      </md-menu-item>
-      <md-menu-item>
-        <md-button ng-click="transfer(target)">
-          {{'DASHBOARDS.TRANSFER_NUMBER' | translate}} ({{prefix ? prefix + '-'
-          + target : target}})
-        </md-button>
-      </md-menu-item>
-    </md-menu-content>
-  </md-menu>
-</section>
diff --git a/public/src/js/modules/core/directives/ms-click-to-call/ms-click-to-call.html/ms-click-to-call.html b/public/src/js/modules/core/directives/ms-click-to-call/ms-click-to-call.html/ms-click-to-call.html
new file mode 100644
index 0000000..016d858
--- /dev/null
+++ b/public/src/js/modules/core/directives/ms-click-to-call/ms-click-to-call.html/ms-click-to-call.html
@@ -0,0 +1,62 @@
+<section ng-if="type !== 'button'">
+  <span ng-if="!showMenu()">{{target}}</span>
+
+  <md-menu ng-if="showMenu()">
+    <a aria-label="Target" ng-click="$mdMenu.open($event)">
+      <span ng-if="prefix">{{prefix}}-</span>{{target}}
+    </a>
+
+    <md-menu-content width="2">
+      <md-menu-item>
+        <md-button ng-click="call(prefix ? prefix + target : target)">
+          {{'DASHBOARDS.CALL_NUMBER' | translate}} ({{prefix ? prefix + '-' +
+          target : target}})
+        </md-button>
+      </md-menu-item>
+      <md-menu-item>
+        <md-button ng-click="transfer(prefix ? prefix + target : target)">
+          {{'DASHBOARDS.TRANSFER_NUMBER' | translate}} ({{prefix ? prefix + '-'
+          + target : target}})
+        </md-button>
+      </md-menu-item>
+    </md-menu-content>
+  </md-menu>
+</section>
+
+<section ng-if="type === 'button'">
+  <md-button
+    ng-if="!showMenu()"
+    ng-disabled="true"
+    class="md-icon-button md-raised md-accent ng-scope md-ink-ripple"
+    title="NEW CALL"
+    aria-label="NEW CALL"
+  >
+    <md-icon md-font-icon="icon-phone"></md-icon>
+  </md-button>
+
+  <md-menu ng-if="showMenu()">
+    <md-button
+      class="md-icon-button md-raised md-accent ng-scope md-ink-ripple"
+      title="NEW CALL"
+      ng-click="$mdMenu.open($event)"
+      aria-label="NEW CALL"
+    >
+      <md-icon md-font-icon="icon-phone"></md-icon>
+    </md-button>
+
+    <md-menu-content width="2">
+      <md-menu-item>
+        <md-button ng-click="call(prefix ? prefix + target : target)">
+          {{'DASHBOARDS.CALL_NUMBER' | translate}} ({{prefix ? prefix + '-' +
+          target : target}})
+        </md-button>
+      </md-menu-item>
+      <md-menu-item>
+        <md-button ng-click="transfer(target)">
+          {{'DASHBOARDS.TRANSFER_NUMBER' | translate}} ({{prefix ? prefix + '-'
+          + target : target}})
+        </md-button>
+      </md-menu-item>
+    </md-menu-content>
+  </md-menu>
+</section>
diff --git a/public/src/js/modules/core/directives/ms-dual-multiselect/ms-dual-multiselect.html/ms-dual-multiselect-[chunkhash].html b/public/src/js/modules/core/directives/ms-dual-multiselect/ms-dual-multiselect.html/ms-dual-multiselect-[chunkhash].html
deleted file mode 100644
index 10a5560..0000000
--- a/public/src/js/modules/core/directives/ms-dual-multiselect/ms-dual-multiselect.html/ms-dual-multiselect-[chunkhash].html
+++ /dev/null
@@ -1,111 +0,0 @@
-<div ng-cloak layout-gt-sm="row" layout="column">
-  <div flex-gt-sm="50" flex="45">
-    <md-input-container class="md-icon-float md-block margin-0">
-      <md-icon md-font-icon="icon-magnify" aria-label="swap"></md-icon>
-      <input
-        ng-model="query"
-        type="text"
-        placeholder="{{options.labelSearch || 'Search...'}}"
-      />
-    </md-input-container>
-    <md-content class="border h-300">
-      <md-list
-        class="md-dense no-padding"
-        layout-fill
-        layout-align="center center"
-      >
-        <md-list-item
-          class="md-3-line"
-          ng-class="options.readOnly ? 'read-only-mode' : ''"
-          ng-disabled="options.readOnly"
-          ng-repeat="item in options.items | filter: query | orderBy: options.orderBy"
-          ng-click="canTransfer(item, options, false)"
-        >
-          <div class="md-list-item-text" layout="column">
-            <h3 ng-if="options.line1">{{getLine(item, options.line1)}}</h3>
-            <h4 ng-if="options.line2">{{getLine(item, options.line2)}}</h4>
-            <p ng-if="options.line3">{{getLine(item, options.line3)}}</p>
-            <p class="ms-dual-multiselect-line-xs" ng-if="options.line4">
-              {{getLine(item, options.line4)}}
-            </p>
-          </div>
-          <md-icon
-            ng-show="!options.readOnly"
-            md-font-icon="icon-arrow-right-bold"
-            aria-label="swap"
-          ></md-icon>
-          <md-divider></md-divider>
-        </md-list-item>
-      </md-list>
-    </md-content>
-    <div class="margin-10" layout="row">
-      <span class="h4" flex
-        >{{options.labelAll || 'All Items'}} ({{options.items.length}})</span
-      >
-      <md-icon
-        ng-show="options.showSelectAndDeselectAll && !options.readOnly"
-        md-font-icon="icon-chevron-double-right"
-        aria-label="swap"
-        ng-click="transfer(options.items, options.selectedItems, -1, false)"
-      ></md-icon>
-    </div>
-  </div>
-
-  <div flex="10" layout="row" layout-align="center center">
-    <md-icon md-font-icon="icon-swap-horizontal" aria-label="swap"></md-icon>
-  </div>
-
-  <div flex-gt-sm="50" flex="45">
-    <md-input-container class="md-icon-float md-block margin-0">
-      <md-icon md-font-icon="icon-magnify" aria-label="swap"></md-icon>
-      <input
-        ng-model="selectedQuery"
-        type="text"
-        placeholder="{{options.labelSearch || 'Search...'}}"
-      />
-    </md-input-container>
-    <md-content class="border h-300">
-      <md-list
-        class="md-dense no-padding"
-        layout-fill
-        layout-align="center center"
-      >
-        <md-list-item
-          class="md-3-line"
-          ng-class="options.readOnly || !item.isValid ? 'read-only-mode' : ''"
-          ng-disabled="options.readOnly"
-          ng-repeat="item in options.selectedItems | filter: selectedQuery | orderBy: options.orderBy"
-          ng-click="canTransfer(item, options, true)"
-        >
-          <md-icon
-            ng-class="options.readOnly || !item.isValid ? 'hidden' : ''"
-            md-font-icon="icon-arrow-left-bold"
-            aria-label="swap"
-          ></md-icon>
-          <div class="md-list-item-text" layout="column">
-            <h3 ng-if="options.line1">{{getLine(item, options.line1)}}</h3>
-            <h4 ng-if="options.line2">{{getLine(item, options.line2)}}</h4>
-            <p ng-if="options.line3">{{getLine(item, options.line3)}}</p>
-            <p class="ms-dual-multiselect-line-xs" ng-if="options.line4">
-              {{getLine(item, options.line4)}}
-            </p>
-          </div>
-          <md-divider></md-divider>
-        </md-list-item>
-      </md-list>
-    </md-content>
-    <div class="margin-10" layout="row">
-      <md-icon
-        ng-show="options.showSelectAndDeselectAll && !options.readOnly"
-        md-font-icon="icon-chevron-double-left"
-        aria-label="swap"
-        flex
-        ng-click="transfer(options.selectedItems, options.items, -1, true)"
-      ></md-icon>
-      <span class="h4"
-        >{{options.labelSelected || 'Selected Items'}}
-        ({{options.selectedItems.length}})</span
-      >
-    </div>
-  </div>
-</div>
diff --git a/public/src/js/modules/core/directives/ms-dual-multiselect/ms-dual-multiselect.html/ms-dual-multiselect.html b/public/src/js/modules/core/directives/ms-dual-multiselect/ms-dual-multiselect.html/ms-dual-multiselect.html
new file mode 100644
index 0000000..10a5560
--- /dev/null
+++ b/public/src/js/modules/core/directives/ms-dual-multiselect/ms-dual-multiselect.html/ms-dual-multiselect.html
@@ -0,0 +1,111 @@
+<div ng-cloak layout-gt-sm="row" layout="column">
+  <div flex-gt-sm="50" flex="45">
+    <md-input-container class="md-icon-float md-block margin-0">
+      <md-icon md-font-icon="icon-magnify" aria-label="swap"></md-icon>
+      <input
+        ng-model="query"
+        type="text"
+        placeholder="{{options.labelSearch || 'Search...'}}"
+      />
+    </md-input-container>
+    <md-content class="border h-300">
+      <md-list
+        class="md-dense no-padding"
+        layout-fill
+        layout-align="center center"
+      >
+        <md-list-item
+          class="md-3-line"
+          ng-class="options.readOnly ? 'read-only-mode' : ''"
+          ng-disabled="options.readOnly"
+          ng-repeat="item in options.items | filter: query | orderBy: options.orderBy"
+          ng-click="canTransfer(item, options, false)"
+        >
+          <div class="md-list-item-text" layout="column">
+            <h3 ng-if="options.line1">{{getLine(item, options.line1)}}</h3>
+            <h4 ng-if="options.line2">{{getLine(item, options.line2)}}</h4>
+            <p ng-if="options.line3">{{getLine(item, options.line3)}}</p>
+            <p class="ms-dual-multiselect-line-xs" ng-if="options.line4">
+              {{getLine(item, options.line4)}}
+            </p>
+          </div>
+          <md-icon
+            ng-show="!options.readOnly"
+            md-font-icon="icon-arrow-right-bold"
+            aria-label="swap"
+          ></md-icon>
+          <md-divider></md-divider>
+        </md-list-item>
+      </md-list>
+    </md-content>
+    <div class="margin-10" layout="row">
+      <span class="h4" flex
+        >{{options.labelAll || 'All Items'}} ({{options.items.length}})</span
+      >
+      <md-icon
+        ng-show="options.showSelectAndDeselectAll && !options.readOnly"
+        md-font-icon="icon-chevron-double-right"
+        aria-label="swap"
+        ng-click="transfer(options.items, options.selectedItems, -1, false)"
+      ></md-icon>
+    </div>
+  </div>
+
+  <div flex="10" layout="row" layout-align="center center">
+    <md-icon md-font-icon="icon-swap-horizontal" aria-label="swap"></md-icon>
+  </div>
+
+  <div flex-gt-sm="50" flex="45">
+    <md-input-container class="md-icon-float md-block margin-0">
+      <md-icon md-font-icon="icon-magnify" aria-label="swap"></md-icon>
+      <input
+        ng-model="selectedQuery"
+        type="text"
+        placeholder="{{options.labelSearch || 'Search...'}}"
+      />
+    </md-input-container>
+    <md-content class="border h-300">
+      <md-list
+        class="md-dense no-padding"
+        layout-fill
+        layout-align="center center"
+      >
+        <md-list-item
+          class="md-3-line"
+          ng-class="options.readOnly || !item.isValid ? 'read-only-mode' : ''"
+          ng-disabled="options.readOnly"
+          ng-repeat="item in options.selectedItems | filter: selectedQuery | orderBy: options.orderBy"
+          ng-click="canTransfer(item, options, true)"
+        >
+          <md-icon
+            ng-class="options.readOnly || !item.isValid ? 'hidden' : ''"
+            md-font-icon="icon-arrow-left-bold"
+            aria-label="swap"
+          ></md-icon>
+          <div class="md-list-item-text" layout="column">
+            <h3 ng-if="options.line1">{{getLine(item, options.line1)}}</h3>
+            <h4 ng-if="options.line2">{{getLine(item, options.line2)}}</h4>
+            <p ng-if="options.line3">{{getLine(item, options.line3)}}</p>
+            <p class="ms-dual-multiselect-line-xs" ng-if="options.line4">
+              {{getLine(item, options.line4)}}
+            </p>
+          </div>
+          <md-divider></md-divider>
+        </md-list-item>
+      </md-list>
+    </md-content>
+    <div class="margin-10" layout="row">
+      <md-icon
+        ng-show="options.showSelectAndDeselectAll && !options.readOnly"
+        md-font-icon="icon-chevron-double-left"
+        aria-label="swap"
+        flex
+        ng-click="transfer(options.selectedItems, options.items, -1, true)"
+      ></md-icon>
+      <span class="h4"
+        >{{options.labelSelected || 'Selected Items'}}
+        ({{options.selectedItems.length}})</span
+      >
+    </div>
+  </div>
+</div>
diff --git a/public/src/js/modules/core/directives/ms-font-family/ms-font-family.html/ms-font-family-[chunkhash].html b/public/src/js/modules/core/directives/ms-font-family/ms-font-family.html/ms-font-family-[chunkhash].html
deleted file mode 100644
index 1ce82de..0000000
--- a/public/src/js/modules/core/directives/ms-font-family/ms-font-family.html/ms-font-family-[chunkhash].html
+++ /dev/null
@@ -1,5 +0,0 @@
-<md-select ng-model="ngModel" class="no-margin">
-  <md-option ng-repeat="font in fonts" ng-value="font.value"
-    ><span ng-style="{'font-family': font.value}">{{font.option}}</span>
-  </md-option>
-</md-select>
diff --git a/public/src/js/modules/core/directives/ms-font-family/ms-font-family.html/ms-font-family.html b/public/src/js/modules/core/directives/ms-font-family/ms-font-family.html/ms-font-family.html
new file mode 100644
index 0000000..1ce82de
--- /dev/null
+++ b/public/src/js/modules/core/directives/ms-font-family/ms-font-family.html/ms-font-family.html
@@ -0,0 +1,5 @@
+<md-select ng-model="ngModel" class="no-margin">
+  <md-option ng-repeat="font in fonts" ng-value="font.value"
+    ><span ng-style="{'font-family': font.value}">{{font.option}}</span>
+  </md-option>
+</md-select>
diff --git a/public/src/js/modules/core/directives/ms-info-bar/ms-info-bar.html/ms-info-bar-[chunkhash].html b/public/src/js/modules/core/directives/ms-info-bar/ms-info-bar.html/ms-info-bar-[chunkhash].html
deleted file mode 100644
index ca8f13c..0000000
--- a/public/src/js/modules/core/directives/ms-info-bar/ms-info-bar.html/ms-info-bar-[chunkhash].html
+++ /dev/null
@@ -1,11 +0,0 @@
-<div id="ms-info-bar" layout="row" layout-align="start center" flex>
-  <div id="ms-info-bar-message" ng-transclude flex></div>
-  <md-button
-    id="ms-info-bar-close"
-    class="md-icon-button"
-    aria-label="Close"
-    ng-click="removeInfoBar()"
-  >
-    <md-icon md-font-icon="icon-close s20"></md-icon>
-  </md-button>
-</div>
diff --git a/public/src/js/modules/core/directives/ms-info-bar/ms-info-bar.html/ms-info-bar.html b/public/src/js/modules/core/directives/ms-info-bar/ms-info-bar.html/ms-info-bar.html
new file mode 100644
index 0000000..ca8f13c
--- /dev/null
+++ b/public/src/js/modules/core/directives/ms-info-bar/ms-info-bar.html/ms-info-bar.html
@@ -0,0 +1,11 @@
+<div id="ms-info-bar" layout="row" layout-align="start center" flex>
+  <div id="ms-info-bar-message" ng-transclude flex></div>
+  <md-button
+    id="ms-info-bar-close"
+    class="md-icon-button"
+    aria-label="Close"
+    ng-click="removeInfoBar()"
+  >
+    <md-icon md-font-icon="icon-close s20"></md-icon>
+  </md-button>
+</div>
diff --git a/public/src/js/modules/core/directives/ms-material-color-picker/ms-material-color-picker.html/ms-material-color-picker-[chunkhash].html b/public/src/js/modules/core/directives/ms-material-color-picker/ms-material-color-picker.html/ms-material-color-picker-[chunkhash].html
deleted file mode 100644
index eda812d..0000000
--- a/public/src/js/modules/core/directives/ms-material-color-picker/ms-material-color-picker.html/ms-material-color-picker-[chunkhash].html
+++ /dev/null
@@ -1,86 +0,0 @@
-<md-menu md-position-mode="target-right target">
-  <div ng-click="$mdMenu.open($event)">
-    <ms-color-picker-button>
-      <md-button
-        aria-label="Row Color"
-        md-menu-origin
-        ng-click="$mdMenu.open($event)"
-        ng-class="vm.selectedColor.class"
-      >
-        <span ng-show="vm.selectedColor.palette">
-          {{vm.selectedColor.palette}} {{vm.selectedColor.hue}}
-        </span>
-        <span ng-show="!vm.selectedColor.palette"> Select Color </span>
-      </md-button>
-    </ms-color-picker-button>
-  </div>
-
-  <md-menu-content class="ms-material-color-picker-menu-content" layout-column>
-    <header
-      ng-class="vm.selectedColor.class || 'md-accent-bg'"
-      class="md-whiteframe-4dp"
-      layout="row"
-      layout-align="space-between center"
-    >
-      <md-button
-        md-prevent-menu-close
-        ng-click="vm.activateHueSelection(false,false)"
-        class="md-icon-button"
-        ng-class="{'hidden':!vm.selectedPalette}"
-        aria-label="Palette"
-      >
-        <md-icon md-font-icon="icon-arrow-left" class="s20"></md-icon>
-      </md-button>
-
-      <span ng-if="vm.selectedColor.palette">
-        {{vm.selectedColor.palette}} {{vm.selectedColor.hue}}
-      </span>
-
-      <span ng-if="!vm.selectedColor.palette"> Select Color </span>
-
-      <md-button
-        class="remove-color-button md-icon-button"
-        ng-click="vm.removeColor()"
-        aria-label="Remove Color"
-      >
-        <md-icon md-font-icon="icon-delete" class="s20"></md-icon>
-      </md-button>
-    </header>
-
-    <div class="colors" ms-scroll>
-      <div ng-show="!vm.selectedPalette" layout="row" layout-wrap>
-        <div
-          class="color"
-          ng-class="'md-'+palette+'-500-bg'"
-          ng-repeat="(palette, hues) in vm.palettes"
-          ng-click="vm.activateHueSelection(palette,hues)"
-          layout="row"
-          layout-align="start end"
-          md-prevent-menu-close
-          md-ink-ripple
-        >
-          <span class="label"> {{palette}} </span>
-        </div>
-      </div>
-
-      <div ng-show="vm.selectedPalette" layout="row" layout-wrap>
-        <div
-          class="color"
-          ng-class="'md-'+vm.selectedPalette+'-'+hue+'-bg'"
-          ng-repeat="(hue, values) in vm.selectedHues"
-          ng-click="vm.selectColor(vm.selectedPalette,hue)"
-          layout="row"
-          layout-align="start end"
-          md-ink-ripple
-        >
-          <span class="label"> {{hue}} </span>
-          <i
-            ng-if="vm.selectedPalette == vm.selectedColor.palette && hue == vm.selectedColor.hue"
-            class="s16 icon-check"
-          >
-          </i>
-        </div>
-      </div>
-    </div>
-  </md-menu-content>
-</md-menu>
diff --git a/public/src/js/modules/core/directives/ms-material-color-picker/ms-material-color-picker.html/ms-material-color-picker.html b/public/src/js/modules/core/directives/ms-material-color-picker/ms-material-color-picker.html/ms-material-color-picker.html
new file mode 100644
index 0000000..eda812d
--- /dev/null
+++ b/public/src/js/modules/core/directives/ms-material-color-picker/ms-material-color-picker.html/ms-material-color-picker.html
@@ -0,0 +1,86 @@
+<md-menu md-position-mode="target-right target">
+  <div ng-click="$mdMenu.open($event)">
+    <ms-color-picker-button>
+      <md-button
+        aria-label="Row Color"
+        md-menu-origin
+        ng-click="$mdMenu.open($event)"
+        ng-class="vm.selectedColor.class"
+      >
+        <span ng-show="vm.selectedColor.palette">
+          {{vm.selectedColor.palette}} {{vm.selectedColor.hue}}
+        </span>
+        <span ng-show="!vm.selectedColor.palette"> Select Color </span>
+      </md-button>
+    </ms-color-picker-button>
+  </div>
+
+  <md-menu-content class="ms-material-color-picker-menu-content" layout-column>
+    <header
+      ng-class="vm.selectedColor.class || 'md-accent-bg'"
+      class="md-whiteframe-4dp"
+      layout="row"
+      layout-align="space-between center"
+    >
+      <md-button
+        md-prevent-menu-close
+        ng-click="vm.activateHueSelection(false,false)"
+        class="md-icon-button"
+        ng-class="{'hidden':!vm.selectedPalette}"
+        aria-label="Palette"
+      >
+        <md-icon md-font-icon="icon-arrow-left" class="s20"></md-icon>
+      </md-button>
+
+      <span ng-if="vm.selectedColor.palette">
+        {{vm.selectedColor.palette}} {{vm.selectedColor.hue}}
+      </span>
+
+      <span ng-if="!vm.selectedColor.palette"> Select Color </span>
+
+      <md-button
+        class="remove-color-button md-icon-button"
+        ng-click="vm.removeColor()"
+        aria-label="Remove Color"
+      >
+        <md-icon md-font-icon="icon-delete" class="s20"></md-icon>
+      </md-button>
+    </header>
+
+    <div class="colors" ms-scroll>
+      <div ng-show="!vm.selectedPalette" layout="row" layout-wrap>
+        <div
+          class="color"
+          ng-class="'md-'+palette+'-500-bg'"
+          ng-repeat="(palette, hues) in vm.palettes"
+          ng-click="vm.activateHueSelection(palette,hues)"
+          layout="row"
+          layout-align="start end"
+          md-prevent-menu-close
+          md-ink-ripple
+        >
+          <span class="label"> {{palette}} </span>
+        </div>
+      </div>
+
+      <div ng-show="vm.selectedPalette" layout="row" layout-wrap>
+        <div
+          class="color"
+          ng-class="'md-'+vm.selectedPalette+'-'+hue+'-bg'"
+          ng-repeat="(hue, values) in vm.selectedHues"
+          ng-click="vm.selectColor(vm.selectedPalette,hue)"
+          layout="row"
+          layout-align="start end"
+          md-ink-ripple
+        >
+          <span class="label"> {{hue}} </span>
+          <i
+            ng-if="vm.selectedPalette == vm.selectedColor.palette && hue == vm.selectedColor.hue"
+            class="s16 icon-check"
+          >
+          </i>
+        </div>
+      </div>
+    </div>
+  </md-menu-content>
+</md-menu>
diff --git a/public/src/js/modules/core/directives/ms-navigation/templates/horizontal.html/horizontal-[chunkhash].html b/public/src/js/modules/core/directives/ms-navigation/templates/horizontal.html/horizontal-[chunkhash].html
deleted file mode 100644
index 57b00a9..0000000
--- a/public/src/js/modules/core/directives/ms-navigation/templates/horizontal.html/horizontal-[chunkhash].html
+++ /dev/null
@@ -1,50 +0,0 @@
-<div class="navigation-toggle" hide-gt-sm>
-  <md-button
-    class="md-icon-button"
-    ng-click="vm.toggleHorizontalMobileMenu()"
-    aria-label="Toggle Mobile Navigation"
-  >
-    <md-icon md-font-icon="icon-menu"></md-icon>
-  </md-button>
-</div>
-
-<ul class="horizontal">
-  <li
-    ng-repeat="node in vm.navigation"
-    ms-navigation-horizontal-node="node"
-    ng-class="{'has-children': vm.hasChildren}"
-    ng-include="'navigation-horizontal-nested.html'"
-  ></li>
-</ul>
-
-<!-- Nested horizontal navigation template -->
-<script type="text/ng-template" id="navigation-horizontal-nested.html">
-
-  <div ms-navigation-horizontal-item layout="row" ng-if="!vm.isHidden()">
-
-      <div class="ms-navigation-horizontal-button" ng-if="!node.uisref && node.title"
-           ng-class="{'active md-accent-bg md-accent-fg': vm.isActive}">
-          <i class="icon s18 {{node.icon}}" ng-if="node.icon"></i>
-          <span class="title" translate="{{node.translate}}" flex>{{node.title}}</span>
-          <span class="badge white-fg" style="background: {{node.badge.color}}" ng-if="node.badge">{{node.badge.content}}</span>
-          <i class="icon-chevron-right s18 arrow" ng-if="vm.hasChildren"></i>
-      </div>
-
-      <a class="ms-navigation-horizontal-button" ui-sref="{{node.uisref}}" ui-sref-active="active md-accent-bg"
-         ng-class="{'active md-accent-bg md-accent-fg': vm.isActive}"
-         ng-if="node.uisref && node.title">
-          <i class="icon s18 {{node.icon}}" ng-if="node.icon"></i>
-          <span class="title" translate="{{node.translate}}" flex>{{node.title}}</span>
-          <span class="badge white-fg" style="background: {{node.badge.color}}" ng-if="node.badge">{{node.badge.content}}</span>
-          <i class="icon-chevron-right s18 arrow" ng-if="vm.hasChildren"></i>
-      </a>
-
-  </div>
-
-  <ul ng-if="vm.hasChildren && !vm.isHidden()">
-      <li ng-repeat="node in node.children" ms-navigation-horizontal-node="node"
-          ng-class="{'has-children': vm.hasChildren}"
-          ng-include="'navigation-horizontal-nested.html'"></li>
-  </ul>
-</script>
-<!-- / Nested navigation template -->
diff --git a/public/src/js/modules/core/directives/ms-navigation/templates/horizontal.html/horizontal.html b/public/src/js/modules/core/directives/ms-navigation/templates/horizontal.html/horizontal.html
new file mode 100644
index 0000000..57b00a9
--- /dev/null
+++ b/public/src/js/modules/core/directives/ms-navigation/templates/horizontal.html/horizontal.html
@@ -0,0 +1,50 @@
+<div class="navigation-toggle" hide-gt-sm>
+  <md-button
+    class="md-icon-button"
+    ng-click="vm.toggleHorizontalMobileMenu()"
+    aria-label="Toggle Mobile Navigation"
+  >
+    <md-icon md-font-icon="icon-menu"></md-icon>
+  </md-button>
+</div>
+
+<ul class="horizontal">
+  <li
+    ng-repeat="node in vm.navigation"
+    ms-navigation-horizontal-node="node"
+    ng-class="{'has-children': vm.hasChildren}"
+    ng-include="'navigation-horizontal-nested.html'"
+  ></li>
+</ul>
+
+<!-- Nested horizontal navigation template -->
+<script type="text/ng-template" id="navigation-horizontal-nested.html">
+
+  <div ms-navigation-horizontal-item layout="row" ng-if="!vm.isHidden()">
+
+      <div class="ms-navigation-horizontal-button" ng-if="!node.uisref && node.title"
+           ng-class="{'active md-accent-bg md-accent-fg': vm.isActive}">
+          <i class="icon s18 {{node.icon}}" ng-if="node.icon"></i>
+          <span class="title" translate="{{node.translate}}" flex>{{node.title}}</span>
+          <span class="badge white-fg" style="background: {{node.badge.color}}" ng-if="node.badge">{{node.badge.content}}</span>
+          <i class="icon-chevron-right s18 arrow" ng-if="vm.hasChildren"></i>
+      </div>
+
+      <a class="ms-navigation-horizontal-button" ui-sref="{{node.uisref}}" ui-sref-active="active md-accent-bg"
+         ng-class="{'active md-accent-bg md-accent-fg': vm.isActive}"
+         ng-if="node.uisref && node.title">
+          <i class="icon s18 {{node.icon}}" ng-if="node.icon"></i>
+          <span class="title" translate="{{node.translate}}" flex>{{node.title}}</span>
+          <span class="badge white-fg" style="background: {{node.badge.color}}" ng-if="node.badge">{{node.badge.content}}</span>
+          <i class="icon-chevron-right s18 arrow" ng-if="vm.hasChildren"></i>
+      </a>
+
+  </div>
+
+  <ul ng-if="vm.hasChildren && !vm.isHidden()">
+      <li ng-repeat="node in node.children" ms-navigation-horizontal-node="node"
+          ng-class="{'has-children': vm.hasChildren}"
+          ng-include="'navigation-horizontal-nested.html'"></li>
+  </ul>
+</script>
+<!-- / Nested navigation template -->
diff --git a/public/src/js/modules/core/directives/ms-navigation/templates/vertical.html/vertical-[chunkhash].html b/public/src/js/modules/core/directives/ms-navigation/templates/vertical.html/vertical-[chunkhash].html
deleted file mode 100644
index 96c5935..0000000
--- a/public/src/js/modules/core/directives/ms-navigation/templates/vertical.html/vertical-[chunkhash].html
+++ /dev/null
@@ -1,37 +0,0 @@
-<ul>
-  <li
-    ng-repeat="node in vm.navigation"
-    ms-navigation-node="node"
-    ng-class="{'collapsed': vm.collapsed, 'has-children': vm.hasChildren}"
-    ng-include="'navigation-nested.html'"
-  ></li>
-</ul>
-
-<!-- Nested navigation template -->
-<script type="text/ng-template" id="navigation-nested.html">
-
-  <div id="{{ node.id }}" ms-navigation-item layout="row" ng-if="!vm.isHidden()">
-
-      <div class="ms-navigation-button" ng-if="!node.uisref && node.title">
-          <i class="icon s16 {{node.icon}}" ng-if="node.icon"></i>
-          <span class="title" translate="{{node.translate}}" flex>{{node.title}}</span>
-          <span class="badge white-fg margin-right-20" ng-style="{'background': node.badge.color}" ng-if="node.badge">{{node.badge.content}}</span>
-          <i class="icon-chevron-right s16 arrow" ng-if="vm.collapsable && vm.hasChildren"></i>
-      </div>
-
-      <a class="ms-navigation-button" ui-sref="{{node.uisref}}" ui-sref-active="active md-accent-bg" ng-if="node.uisref && node.title">
-          <i class="icon s16 {{node.icon}}" ng-if="node.icon"></i>
-          <span class="title" translate="{{node.translate}}" flex>{{node.title}}</span>
-          <span class="badge white-fg margin-right-20" ng-style="{'background': node.badge.color}" ng-if="node.badge">{{node.badge.content}}</span>
-          <i class="icon-chevron-right s16 arrow" ng-if="vm.collapsable && vm.hasChildren"></i>
-      </a>
-
-  </div>
-
-  <ul ng-if="vm.hasChildren && !vm.isHidden()">
-      <li ng-repeat="node in node.children" ms-navigation-node="node"
-          ng-class="{'collapsed': vm.collapsed, 'has-children': vm.hasChildren}"
-          ng-include="'navigation-nested.html'"></li>
-  </ul>
-</script>
-<!-- / Nested navigation template -->
diff --git a/public/src/js/modules/core/directives/ms-navigation/templates/vertical.html/vertical.html b/public/src/js/modules/core/directives/ms-navigation/templates/vertical.html/vertical.html
new file mode 100644
index 0000000..96c5935
--- /dev/null
+++ b/public/src/js/modules/core/directives/ms-navigation/templates/vertical.html/vertical.html
@@ -0,0 +1,37 @@
+<ul>
+  <li
+    ng-repeat="node in vm.navigation"
+    ms-navigation-node="node"
+    ng-class="{'collapsed': vm.collapsed, 'has-children': vm.hasChildren}"
+    ng-include="'navigation-nested.html'"
+  ></li>
+</ul>
+
+<!-- Nested navigation template -->
+<script type="text/ng-template" id="navigation-nested.html">
+
+  <div id="{{ node.id }}" ms-navigation-item layout="row" ng-if="!vm.isHidden()">
+
+      <div class="ms-navigation-button" ng-if="!node.uisref && node.title">
+          <i class="icon s16 {{node.icon}}" ng-if="node.icon"></i>
+          <span class="title" translate="{{node.translate}}" flex>{{node.title}}</span>
+          <span class="badge white-fg margin-right-20" ng-style="{'background': node.badge.color}" ng-if="node.badge">{{node.badge.content}}</span>
+          <i class="icon-chevron-right s16 arrow" ng-if="vm.collapsable && vm.hasChildren"></i>
+      </div>
+
+      <a class="ms-navigation-button" ui-sref="{{node.uisref}}" ui-sref-active="active md-accent-bg" ng-if="node.uisref && node.title">
+          <i class="icon s16 {{node.icon}}" ng-if="node.icon"></i>
+          <span class="title" translate="{{node.translate}}" flex>{{node.title}}</span>
+          <span class="badge white-fg margin-right-20" ng-style="{'background': node.badge.color}" ng-if="node.badge">{{node.badge.content}}</span>
+          <i class="icon-chevron-right s16 arrow" ng-if="vm.collapsable && vm.hasChildren"></i>
+      </a>
+
+  </div>
+
+  <ul ng-if="vm.hasChildren && !vm.isHidden()">
+      <li ng-repeat="node in node.children" ms-navigation-node="node"
+          ng-class="{'collapsed': vm.collapsed, 'has-children': vm.hasChildren}"
+          ng-include="'navigation-nested.html'"></li>
+  </ul>
+</script>
+<!-- / Nested navigation template -->
diff --git a/public/src/js/modules/core/directives/ms-phonebar/ms-phonebar.html/ms-phonebar-[chunkhash].html b/public/src/js/modules/core/directives/ms-phonebar/ms-phonebar.html/ms-phonebar-[chunkhash].html
deleted file mode 100644
index 50a1bd3..0000000
--- a/public/src/js/modules/core/directives/ms-phonebar/ms-phonebar.html/ms-phonebar-[chunkhash].html
+++ /dev/null
@@ -1,15 +0,0 @@
-<div layout="row" layout-align="start center" flex>
-  <!-- Audio stream -->
-  <audio id="remote-audio" autoplay hidden="true"></audio>
-  <!-- Audio stream -->
-
-  <!-- WebRtc PhoneBar -->
-  <div
-    class="phonebar-container"
-    ng-include="'app/core/directives/ms-phonebar/ms-phonebar-dialpad.html'"
-    layout="row"
-    layout-align="start center"
-    flex
-  ></div>
-  <!-- WebRtc PhoneBar -->
-</div>
diff --git a/public/src/js/modules/core/directives/ms-phonebar/ms-phonebar.html/ms-phonebar.html b/public/src/js/modules/core/directives/ms-phonebar/ms-phonebar.html/ms-phonebar.html
new file mode 100644
index 0000000..50a1bd3
--- /dev/null
+++ b/public/src/js/modules/core/directives/ms-phonebar/ms-phonebar.html/ms-phonebar.html
@@ -0,0 +1,15 @@
+<div layout="row" layout-align="start center" flex>
+  <!-- Audio stream -->
+  <audio id="remote-audio" autoplay hidden="true"></audio>
+  <!-- Audio stream -->
+
+  <!-- WebRtc PhoneBar -->
+  <div
+    class="phonebar-container"
+    ng-include="'app/core/directives/ms-phonebar/ms-phonebar-dialpad.html'"
+    layout="row"
+    layout-align="start center"
+    flex
+  ></div>
+  <!-- WebRtc PhoneBar -->
+</div>
diff --git a/public/src/js/modules/core/directives/ms-phonebar/prefix/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/core/directives/ms-phonebar/prefix/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 9f0872c..0000000
--- a/public/src/js/modules/core/directives/ms-phonebar/prefix/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,59 +0,0 @@
-<md-dialog aria-label="Prefix">
-  <form ng-cloak>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <div flex>
-          <span class="title" translate="TOOLBAR.PREFIXES">Prefixes</span>
-        </div>
-        <div layout="row" layout-align="end center">
-          <md-button
-            class="md-icon-button no-margin no-padding"
-            ng-click="vm.closeDialog(-1)"
-          >
-            <md-icon
-              class="no-margin"
-              md-font-icon="icon-close"
-              aria-label="Close dialog"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content>
-      <md-radio-group ng-model="vm.prefix">
-        <md-radio-button
-          ng-repeat="prefix in vm.prefixes.rows"
-          value="{{prefix.prefix}}"
-          class="md-primary"
-          >{{prefix.name}}</md-radio-button
-        >
-        <md-radio-button ng-if="!vm.required" ng-value="null" class="md-primary"
-          >no prefix</md-radio-button
-        >
-      </md-radio-group>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row">
-      <md-button
-        ng-click="vm.call()"
-        class="send-button md-accent md-raised"
-        aria-label="call"
-        ng-disabled="!vm.prefix && vm.required"
-      >
-        <span translate="TOOLBAR.CALL">CALL</span>
-      </md-button>
-      <md-button
-        ng-click="vm.closeDialog(-1)"
-        class="send-button md-accent md-raised"
-        aria-label="cancel"
-      >
-        <span translate="TOOLBAR.CANCEL">Cancel</span>
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/core/directives/ms-phonebar/prefix/dialog.html/dialog.html b/public/src/js/modules/core/directives/ms-phonebar/prefix/dialog.html/dialog.html
new file mode 100644
index 0000000..9f0872c
--- /dev/null
+++ b/public/src/js/modules/core/directives/ms-phonebar/prefix/dialog.html/dialog.html
@@ -0,0 +1,59 @@
+<md-dialog aria-label="Prefix">
+  <form ng-cloak>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <div flex>
+          <span class="title" translate="TOOLBAR.PREFIXES">Prefixes</span>
+        </div>
+        <div layout="row" layout-align="end center">
+          <md-button
+            class="md-icon-button no-margin no-padding"
+            ng-click="vm.closeDialog(-1)"
+          >
+            <md-icon
+              class="no-margin"
+              md-font-icon="icon-close"
+              aria-label="Close dialog"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content>
+      <md-radio-group ng-model="vm.prefix">
+        <md-radio-button
+          ng-repeat="prefix in vm.prefixes.rows"
+          value="{{prefix.prefix}}"
+          class="md-primary"
+          >{{prefix.name}}</md-radio-button
+        >
+        <md-radio-button ng-if="!vm.required" ng-value="null" class="md-primary"
+          >no prefix</md-radio-button
+        >
+      </md-radio-group>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row">
+      <md-button
+        ng-click="vm.call()"
+        class="send-button md-accent md-raised"
+        aria-label="call"
+        ng-disabled="!vm.prefix && vm.required"
+      >
+        <span translate="TOOLBAR.CALL">CALL</span>
+      </md-button>
+      <md-button
+        ng-click="vm.closeDialog(-1)"
+        class="send-button md-accent md-raised"
+        aria-label="cancel"
+      >
+        <span translate="TOOLBAR.CANCEL">Cancel</span>
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/core/directives/ms-phonebar/record/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/core/directives/ms-phonebar/record/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 1da5e13..0000000
--- a/public/src/js/modules/core/directives/ms-phonebar/record/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,83 +0,0 @@
-<md-dialog aria-label="Recording" ng-init="vm.onInit()">
-  <form ng-cloak>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <div flex>
-          <span class="title" translate="TOOLBAR.RECORDING">Recording</span>
-        </div>
-        <div layout="row" layout-align="end center">
-          <md-button class="md-icon-button no-margin no-padding">
-            <md-icon
-              class="no-margin"
-              md-font-icon="icon-plus"
-              aria-label="Add"
-              ng-click="vm.addRecording()"
-            ></md-icon>
-          </md-button>
-          <md-button
-            class="md-icon-button no-margin no-padding"
-            ng-click="vm.closeDialog()"
-          >
-            <md-icon
-              class="no-margin"
-              md-font-icon="icon-close"
-              aria-label="Close dialog"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-toolbar>
-
-    <md-table-container>
-      <table md-table layout-padding>
-        <thead md-head>
-          <tr md-row>
-            <th md-column>
-              <span translate="TOOLBAR.FILENAME">File name</span>
-            </th>
-            <th md-column><span translate="TOOLBAR.STATUS">Status</span></th>
-            <th md-column><span translate="TOOLBAR.ACTIONS">Actions</span></th>
-          </tr>
-        </thead>
-        <tbody md-body>
-          <tr md-row ng-hide="vm.session.monitors.length">
-            <td md-cell colspan="3">
-              <div layout="row" layout-align="center center">
-                <span translate="TOOLBAR.NO_AVAILABLE_INFO"
-                  >No Available Info</span
-                >
-              </div>
-            </td>
-          </tr>
-          <tr md-row ng-repeat="monitor in vm.session.monitors">
-            <td md-cell>{{monitor.filename}}</td>
-            <td md-cell class="no-padding">
-              <md-icon
-                md-font-icon="icon-radiobox-marked"
-                class="icon s16"
-                ng-class="(monitor.status == 'rec') ? 'red-fg ms-blink' : 'grey-fg'"
-              ></md-icon>
-            </td>
-            <td md-cell class="no-padding">
-              <md-button
-                class="md-fab md-mini white-bg width-35 height-35 margin-5"
-                aria-label="Record"
-                ng-click="(monitor.status == 'rec') ? vm.stop(monitor) : vm.start(monitor)"
-              >
-                <md-icon
-                  md-font-icon="{{monitor.status == 'rec' ? 'icon-stop' : 'icon-play'}}"
-                  class="icon s16"
-                  ng-class="monitor.status == 'rec' ? 'grey-fg' : 'red-fg'"
-                ></md-icon>
-              </md-button>
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </md-table-container>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/core/directives/ms-phonebar/record/dialog.html/dialog.html b/public/src/js/modules/core/directives/ms-phonebar/record/dialog.html/dialog.html
new file mode 100644
index 0000000..1da5e13
--- /dev/null
+++ b/public/src/js/modules/core/directives/ms-phonebar/record/dialog.html/dialog.html
@@ -0,0 +1,83 @@
+<md-dialog aria-label="Recording" ng-init="vm.onInit()">
+  <form ng-cloak>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <div flex>
+          <span class="title" translate="TOOLBAR.RECORDING">Recording</span>
+        </div>
+        <div layout="row" layout-align="end center">
+          <md-button class="md-icon-button no-margin no-padding">
+            <md-icon
+              class="no-margin"
+              md-font-icon="icon-plus"
+              aria-label="Add"
+              ng-click="vm.addRecording()"
+            ></md-icon>
+          </md-button>
+          <md-button
+            class="md-icon-button no-margin no-padding"
+            ng-click="vm.closeDialog()"
+          >
+            <md-icon
+              class="no-margin"
+              md-font-icon="icon-close"
+              aria-label="Close dialog"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-toolbar>
+
+    <md-table-container>
+      <table md-table layout-padding>
+        <thead md-head>
+          <tr md-row>
+            <th md-column>
+              <span translate="TOOLBAR.FILENAME">File name</span>
+            </th>
+            <th md-column><span translate="TOOLBAR.STATUS">Status</span></th>
+            <th md-column><span translate="TOOLBAR.ACTIONS">Actions</span></th>
+          </tr>
+        </thead>
+        <tbody md-body>
+          <tr md-row ng-hide="vm.session.monitors.length">
+            <td md-cell colspan="3">
+              <div layout="row" layout-align="center center">
+                <span translate="TOOLBAR.NO_AVAILABLE_INFO"
+                  >No Available Info</span
+                >
+              </div>
+            </td>
+          </tr>
+          <tr md-row ng-repeat="monitor in vm.session.monitors">
+            <td md-cell>{{monitor.filename}}</td>
+            <td md-cell class="no-padding">
+              <md-icon
+                md-font-icon="icon-radiobox-marked"
+                class="icon s16"
+                ng-class="(monitor.status == 'rec') ? 'red-fg ms-blink' : 'grey-fg'"
+              ></md-icon>
+            </td>
+            <td md-cell class="no-padding">
+              <md-button
+                class="md-fab md-mini white-bg width-35 height-35 margin-5"
+                aria-label="Record"
+                ng-click="(monitor.status == 'rec') ? vm.stop(monitor) : vm.start(monitor)"
+              >
+                <md-icon
+                  md-font-icon="{{monitor.status == 'rec' ? 'icon-stop' : 'icon-play'}}"
+                  class="icon s16"
+                  ng-class="monitor.status == 'rec' ? 'grey-fg' : 'red-fg'"
+                ></md-icon>
+              </md-button>
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </md-table-container>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/core/directives/ms-phonebar/referAttended/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/core/directives/ms-phonebar/referAttended/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 6718070..0000000
--- a/public/src/js/modules/core/directives/ms-phonebar/referAttended/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,58 +0,0 @@
-<md-dialog aria-label="Transfer">
-  <form ng-cloak>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <div flex>
-          <span class="title" translate="TOOLBAR.ATTENDED_TRANSFER"
-            >Transfer</span
-          >
-        </div>
-        <div layout="row" layout-align="end center">
-          <md-button
-            class="md-icon-button no-margin no-padding"
-            ng-click="vm.closeDialog()"
-          >
-            <md-icon
-              class="no-margin"
-              md-font-icon="icon-close"
-              aria-label="Close dialog"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content>
-      <label translate="TOOLBAR.TARGET">Target</label>
-      <md-input-container class="md-block">
-        <md-select ng-model="vm.target">
-          <md-option ng-repeat="session in vm.sessions" ng-value="session.user">
-            {{ session.name }}
-          </md-option>
-        </md-select>
-      </md-input-container>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row">
-      <md-button
-        ng-click="vm.transfer()"
-        class="send-button md-accent md-raised"
-        aria-label="transfer"
-        ng-disabled="!vm.target && !vm.sessionId"
-      >
-        <span translate="TOOLBAR.TRANSFER">TRANSFER</span>
-      </md-button>
-      <md-button
-        ng-click="vm.closeDialog()"
-        class="send-button md-accent md-raised"
-        aria-label="cancel"
-      >
-        <span translate="TOOLBAR.CANCEL">Cancel</span>
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/core/directives/ms-phonebar/referAttended/dialog.html/dialog.html b/public/src/js/modules/core/directives/ms-phonebar/referAttended/dialog.html/dialog.html
new file mode 100644
index 0000000..6718070
--- /dev/null
+++ b/public/src/js/modules/core/directives/ms-phonebar/referAttended/dialog.html/dialog.html
@@ -0,0 +1,58 @@
+<md-dialog aria-label="Transfer">
+  <form ng-cloak>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <div flex>
+          <span class="title" translate="TOOLBAR.ATTENDED_TRANSFER"
+            >Transfer</span
+          >
+        </div>
+        <div layout="row" layout-align="end center">
+          <md-button
+            class="md-icon-button no-margin no-padding"
+            ng-click="vm.closeDialog()"
+          >
+            <md-icon
+              class="no-margin"
+              md-font-icon="icon-close"
+              aria-label="Close dialog"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content>
+      <label translate="TOOLBAR.TARGET">Target</label>
+      <md-input-container class="md-block">
+        <md-select ng-model="vm.target">
+          <md-option ng-repeat="session in vm.sessions" ng-value="session.user">
+            {{ session.name }}
+          </md-option>
+        </md-select>
+      </md-input-container>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row">
+      <md-button
+        ng-click="vm.transfer()"
+        class="send-button md-accent md-raised"
+        aria-label="transfer"
+        ng-disabled="!vm.target && !vm.sessionId"
+      >
+        <span translate="TOOLBAR.TRANSFER">TRANSFER</span>
+      </md-button>
+      <md-button
+        ng-click="vm.closeDialog()"
+        class="send-button md-accent md-raised"
+        aria-label="cancel"
+      >
+        <span translate="TOOLBAR.CANCEL">Cancel</span>
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/core/directives/ms-phonebar/settings/settings.html/settings-[chunkhash].html b/public/src/js/modules/core/directives/ms-phonebar/settings/settings.html/settings-[chunkhash].html
deleted file mode 100644
index 08754a1..0000000
--- a/public/src/js/modules/core/directives/ms-phonebar/settings/settings.html/settings-[chunkhash].html
+++ /dev/null
@@ -1,270 +0,0 @@
-<md-dialog class="md-phonebar-dialog" aria-label="{{vm.name}}">
-  <form name="settingsForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title" translate="TOOLBAR.SETTINGS">Settings</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content class="no-padding" ms-scroll>
-      <md-tabs md-no-pagination md-stretch-tabs="always">
-        <md-tab label="{{ 'TOOLBAR.PROFILE' | translate}}">
-          <md-content layout-padding layout="column">
-            <span
-              ><span translate="TOOLBAR.FULLNAME">Fullname</span>:
-              {{vm.conf.fullname}}</span
-            >
-            <span
-              ><span translate="TOOLBAR.NAME">Name</span>:
-              {{vm.conf.name}}</span
-            >
-            <span
-              ><span translate="TOOLBAR.INTERNAL">Internal</span>:
-              {{vm.conf.internal}}</span
-            >
-            <span
-              ><span translate="TOOLBAR.BROWSER">Browser</span>:
-              {{vm.conf.browserName}} {{vm.conf.browserVersion}}</span
-            >
-            <span
-              ><span translate="TOOLBAR.OS">OS</span>: {{vm.conf.osName}}
-              {{vm.conf.osVersion}}</span
-            >
-          </md-content>
-        </md-tab>
-        <md-tab label="{{ 'TOOLBAR.SERVICES' | translate}}">
-          <md-content layout-padding>
-            <md-input-container class="md-block">
-              <md-switch ng-model="vm.conf.autoAnswer" aria-label="Auto Answer">
-                <span translate="TOOLBAR.AUTOANSWER">Auto Answer</span>
-                <span>{{ vm.conf.autoAnswerDelay }} [s]</span>
-              </md-switch>
-            </md-input-container>
-          </md-content>
-        </md-tab>
-        <md-tab label="{{ 'TOOLBAR.AUDIO' | translate}}">
-          <md-content layout-padding>
-            <div class="border brad-5" layout-margin>
-              <md-input-container
-                class="md-block"
-                ng-if="(vm.devices | filter: { kind: 'audiooutput' }).length"
-              >
-                <label translate="TOOLBAR.RINGINGDEVICE">Ringing Device</label>
-                <md-select
-                  name="ringingDevice"
-                  ng-model="vm.conf.ringingId"
-                  required
-                >
-                  <md-option
-                    ng-value="device.deviceId"
-                    ng-repeat="device in vm.devices | filter: { kind: 'audiooutput' }"
-                    >{{ device.label || ('Speaker ' + ($index + 1))
-                    }}</md-option
-                  >
-                </md-select>
-                <div
-                  ng-messages="settingsForm['ringingDevice'].$error"
-                  ng-show="settingsForm['ringingDevice'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLBAR.ERRORS.FIELD_REQUIRED"
-                      >Field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-
-              <div layout="row" layout-align="space-between center">
-                <md-switch ng-model="vm.conf.ringingMute" aria-label="Mute">
-                  Mute
-                </md-switch>
-
-                <md-slider-container flex="80">
-                  <md-slider
-                    flex
-                    step="0.1"
-                    min="0"
-                    max="1"
-                    ng-model="vm.conf.ringingVolume"
-                    aria-label="volume"
-                  ></md-slider>
-                </md-slider-container>
-              </div>
-            </div>
-
-            <div class="border brad-5" layout-margin>
-              <md-input-container
-                class="md-block"
-                ng-if="(vm.devices | filter: { kind: 'audiooutput' }).length"
-              >
-                <label translate="TOOLBAR.SPEAKERDEVICE">Speaker Device</label>
-                <md-select
-                  name="speakerDevice"
-                  ng-model="vm.conf.speakerId"
-                  required
-                >
-                  <md-option
-                    ng-value="device.deviceId"
-                    ng-repeat="device in vm.devices | filter: { kind: 'audiooutput' }"
-                    >{{ device.label || ('Speaker ' + ($index + 1))
-                    }}</md-option
-                  >
-                </md-select>
-                <div
-                  ng-messages="settingsForm['speakerDevice'].$error"
-                  ng-show="settingsForm['speakerDevice'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLBAR.ERRORS.FIELD_REQUIRED"
-                      >Field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-
-              <div layout="row" layout-align="space-between cetner">
-                <md-switch ng-model="vm.conf.speakerMute" aria-label="Mute">
-                  Mute
-                </md-switch>
-
-                <md-slider-container flex="80">
-                  <md-slider
-                    flex
-                    step="0.1"
-                    min="0"
-                    max="1"
-                    ng-model="vm.conf.speakerVolume"
-                    aria-label="volume"
-                  ></md-slider>
-                </md-slider-container>
-              </div>
-            </div>
-
-            <div class="border brad-5" layout-margin>
-              <md-input-container
-                class="md-block"
-                ng-if="(vm.devices | filter: { kind: 'audioinput' }).length"
-              >
-                <label translate="TOOLBAR.MICROPHONEDEVICE"
-                  >Microphone Device</label
-                >
-                <md-select
-                  name="microphoneDevice"
-                  ng-model="vm.conf.microphoneId"
-                  required
-                >
-                  <md-option
-                    ng-value="device.deviceId"
-                    ng-repeat="device in vm.devices | filter: { kind: 'audioinput' }"
-                    >{{ device.label || ('Microphone ' + ($index +
-                    1))}}</md-option
-                  >
-                </md-select>
-                <div
-                  ng-messages="settingsForm['microphoneDevice'].$error"
-                  ng-show="settingsForm['microphoneDevice'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLBAR.ERRORS.FIELD_REQUIRED"
-                      >Field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-
-              <div layout="row" layout-align="space-between center">
-                <md-switch ng-model="vm.conf.microphoneMute" aria-label="Mute">
-                  Mute
-                </md-switch>
-              </div>
-            </div>
-          </md-content>
-        </md-tab>
-        <md-tab label="{{ 'TOOLBAR.REQUIREMENTS' | translate}}">
-          <md-content layout-padding>
-            <md-list>
-              <md-list-item>
-                <h3 translate="TOOLBAR.LICENSE">License</h3>
-                <md-icon
-                  class="md-secondary"
-                  ng-class="vm.conf.license ? 'green-fg' : 'red-fg'"
-                  md-font-icon="{{vm.conf.license ? 'icon-check' : 'icon-close'}}"
-                ></md-icon>
-              </md-list-item>
-              <md-list-item>
-                <h3 translate="TOOLBAR.BROWSER_COMPATIBILITY">
-                  Browser Compatibility
-                </h3>
-                <md-icon
-                  class="md-secondary"
-                  ng-class="vm.isCompatibleBrowser() ? 'green-fg' : 'red-fg'"
-                  md-font-icon="{{vm.isCompatibleBrowser() ? 'icon-check' : 'icon-close'}}"
-                ></md-icon>
-              </md-list-item>
-              <md-list-item>
-                <h3 translate="TOOLBAR.HTTPS">HTTPS</h3>
-                <md-icon
-                  class="md-secondary"
-                  ng-class="vm.conf.protocol === 'https' ? 'green-fg' : 'red-fg'"
-                  md-font-icon="{{vm.conf.protocol === 'https' ? 'icon-check' : 'icon-close'}}"
-                ></md-icon>
-              </md-list-item>
-              <md-list-item>
-                <h3 translate="TOOLBAR.WEBRTCSUPPORT">WebRTC Support</h3>
-                <md-icon
-                  class="md-secondary"
-                  ng-class="vm.conf.isWebRTCSupported ? 'green-fg' : 'red-fg'"
-                  md-font-icon="{{vm.conf.isWebRTCSupported ? 'icon-check' : 'icon-close'}}"
-                ></md-icon>
-              </md-list-item>
-              <md-list-item>
-                <h3 translate="TOOLBAR.MICROPHONE">Microphone</h3>
-                <md-icon
-                  class="md-secondary"
-                  ng-class="vm.conf.hasMicrophone ? 'green-fg' : 'red-fg'"
-                  md-font-icon="{{vm.conf.hasMicrophone ? 'icon-check' : 'icon-close'}}"
-                ></md-icon>
-              </md-list-item>
-              <md-list-item>
-                <h3 translate="TOOLBAR.SPEAKER">Speaker</h3>
-                <md-icon
-                  class="md-secondary"
-                  ng-class="vm.conf.hasSpeakers ? 'green-fg' : 'red-fg'"
-                  md-font-icon="{{vm.conf.hasSpeakers ? 'icon-check' : 'icon-close'}}"
-                ></md-icon>
-              </md-list-item>
-            </md-list>
-          </md-content>
-        </md-tab>
-      </md-tabs>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-click="vm.saveSettings()"
-          class="send-button md-accent md-raised"
-          ng-disabled="settingsForm.$invalid || settingsForm.$pristine"
-          aria-label="SAVE"
-          translate="TOOLBAR.SAVE"
-          translate-attr-aria-label="TOOLBAR.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/core/directives/ms-phonebar/settings/settings.html/settings.html b/public/src/js/modules/core/directives/ms-phonebar/settings/settings.html/settings.html
new file mode 100644
index 0000000..08754a1
--- /dev/null
+++ b/public/src/js/modules/core/directives/ms-phonebar/settings/settings.html/settings.html
@@ -0,0 +1,270 @@
+<md-dialog class="md-phonebar-dialog" aria-label="{{vm.name}}">
+  <form name="settingsForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title" translate="TOOLBAR.SETTINGS">Settings</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content class="no-padding" ms-scroll>
+      <md-tabs md-no-pagination md-stretch-tabs="always">
+        <md-tab label="{{ 'TOOLBAR.PROFILE' | translate}}">
+          <md-content layout-padding layout="column">
+            <span
+              ><span translate="TOOLBAR.FULLNAME">Fullname</span>:
+              {{vm.conf.fullname}}</span
+            >
+            <span
+              ><span translate="TOOLBAR.NAME">Name</span>:
+              {{vm.conf.name}}</span
+            >
+            <span
+              ><span translate="TOOLBAR.INTERNAL">Internal</span>:
+              {{vm.conf.internal}}</span
+            >
+            <span
+              ><span translate="TOOLBAR.BROWSER">Browser</span>:
+              {{vm.conf.browserName}} {{vm.conf.browserVersion}}</span
+            >
+            <span
+              ><span translate="TOOLBAR.OS">OS</span>: {{vm.conf.osName}}
+              {{vm.conf.osVersion}}</span
+            >
+          </md-content>
+        </md-tab>
+        <md-tab label="{{ 'TOOLBAR.SERVICES' | translate}}">
+          <md-content layout-padding>
+            <md-input-container class="md-block">
+              <md-switch ng-model="vm.conf.autoAnswer" aria-label="Auto Answer">
+                <span translate="TOOLBAR.AUTOANSWER">Auto Answer</span>
+                <span>{{ vm.conf.autoAnswerDelay }} [s]</span>
+              </md-switch>
+            </md-input-container>
+          </md-content>
+        </md-tab>
+        <md-tab label="{{ 'TOOLBAR.AUDIO' | translate}}">
+          <md-content layout-padding>
+            <div class="border brad-5" layout-margin>
+              <md-input-container
+                class="md-block"
+                ng-if="(vm.devices | filter: { kind: 'audiooutput' }).length"
+              >
+                <label translate="TOOLBAR.RINGINGDEVICE">Ringing Device</label>
+                <md-select
+                  name="ringingDevice"
+                  ng-model="vm.conf.ringingId"
+                  required
+                >
+                  <md-option
+                    ng-value="device.deviceId"
+                    ng-repeat="device in vm.devices | filter: { kind: 'audiooutput' }"
+                    >{{ device.label || ('Speaker ' + ($index + 1))
+                    }}</md-option
+                  >
+                </md-select>
+                <div
+                  ng-messages="settingsForm['ringingDevice'].$error"
+                  ng-show="settingsForm['ringingDevice'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLBAR.ERRORS.FIELD_REQUIRED"
+                      >Field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+
+              <div layout="row" layout-align="space-between center">
+                <md-switch ng-model="vm.conf.ringingMute" aria-label="Mute">
+                  Mute
+                </md-switch>
+
+                <md-slider-container flex="80">
+                  <md-slider
+                    flex
+                    step="0.1"
+                    min="0"
+                    max="1"
+                    ng-model="vm.conf.ringingVolume"
+                    aria-label="volume"
+                  ></md-slider>
+                </md-slider-container>
+              </div>
+            </div>
+
+            <div class="border brad-5" layout-margin>
+              <md-input-container
+                class="md-block"
+                ng-if="(vm.devices | filter: { kind: 'audiooutput' }).length"
+              >
+                <label translate="TOOLBAR.SPEAKERDEVICE">Speaker Device</label>
+                <md-select
+                  name="speakerDevice"
+                  ng-model="vm.conf.speakerId"
+                  required
+                >
+                  <md-option
+                    ng-value="device.deviceId"
+                    ng-repeat="device in vm.devices | filter: { kind: 'audiooutput' }"
+                    >{{ device.label || ('Speaker ' + ($index + 1))
+                    }}</md-option
+                  >
+                </md-select>
+                <div
+                  ng-messages="settingsForm['speakerDevice'].$error"
+                  ng-show="settingsForm['speakerDevice'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLBAR.ERRORS.FIELD_REQUIRED"
+                      >Field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+
+              <div layout="row" layout-align="space-between cetner">
+                <md-switch ng-model="vm.conf.speakerMute" aria-label="Mute">
+                  Mute
+                </md-switch>
+
+                <md-slider-container flex="80">
+                  <md-slider
+                    flex
+                    step="0.1"
+                    min="0"
+                    max="1"
+                    ng-model="vm.conf.speakerVolume"
+                    aria-label="volume"
+                  ></md-slider>
+                </md-slider-container>
+              </div>
+            </div>
+
+            <div class="border brad-5" layout-margin>
+              <md-input-container
+                class="md-block"
+                ng-if="(vm.devices | filter: { kind: 'audioinput' }).length"
+              >
+                <label translate="TOOLBAR.MICROPHONEDEVICE"
+                  >Microphone Device</label
+                >
+                <md-select
+                  name="microphoneDevice"
+                  ng-model="vm.conf.microphoneId"
+                  required
+                >
+                  <md-option
+                    ng-value="device.deviceId"
+                    ng-repeat="device in vm.devices | filter: { kind: 'audioinput' }"
+                    >{{ device.label || ('Microphone ' + ($index +
+                    1))}}</md-option
+                  >
+                </md-select>
+                <div
+                  ng-messages="settingsForm['microphoneDevice'].$error"
+                  ng-show="settingsForm['microphoneDevice'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLBAR.ERRORS.FIELD_REQUIRED"
+                      >Field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+
+              <div layout="row" layout-align="space-between center">
+                <md-switch ng-model="vm.conf.microphoneMute" aria-label="Mute">
+                  Mute
+                </md-switch>
+              </div>
+            </div>
+          </md-content>
+        </md-tab>
+        <md-tab label="{{ 'TOOLBAR.REQUIREMENTS' | translate}}">
+          <md-content layout-padding>
+            <md-list>
+              <md-list-item>
+                <h3 translate="TOOLBAR.LICENSE">License</h3>
+                <md-icon
+                  class="md-secondary"
+                  ng-class="vm.conf.license ? 'green-fg' : 'red-fg'"
+                  md-font-icon="{{vm.conf.license ? 'icon-check' : 'icon-close'}}"
+                ></md-icon>
+              </md-list-item>
+              <md-list-item>
+                <h3 translate="TOOLBAR.BROWSER_COMPATIBILITY">
+                  Browser Compatibility
+                </h3>
+                <md-icon
+                  class="md-secondary"
+                  ng-class="vm.isCompatibleBrowser() ? 'green-fg' : 'red-fg'"
+                  md-font-icon="{{vm.isCompatibleBrowser() ? 'icon-check' : 'icon-close'}}"
+                ></md-icon>
+              </md-list-item>
+              <md-list-item>
+                <h3 translate="TOOLBAR.HTTPS">HTTPS</h3>
+                <md-icon
+                  class="md-secondary"
+                  ng-class="vm.conf.protocol === 'https' ? 'green-fg' : 'red-fg'"
+                  md-font-icon="{{vm.conf.protocol === 'https' ? 'icon-check' : 'icon-close'}}"
+                ></md-icon>
+              </md-list-item>
+              <md-list-item>
+                <h3 translate="TOOLBAR.WEBRTCSUPPORT">WebRTC Support</h3>
+                <md-icon
+                  class="md-secondary"
+                  ng-class="vm.conf.isWebRTCSupported ? 'green-fg' : 'red-fg'"
+                  md-font-icon="{{vm.conf.isWebRTCSupported ? 'icon-check' : 'icon-close'}}"
+                ></md-icon>
+              </md-list-item>
+              <md-list-item>
+                <h3 translate="TOOLBAR.MICROPHONE">Microphone</h3>
+                <md-icon
+                  class="md-secondary"
+                  ng-class="vm.conf.hasMicrophone ? 'green-fg' : 'red-fg'"
+                  md-font-icon="{{vm.conf.hasMicrophone ? 'icon-check' : 'icon-close'}}"
+                ></md-icon>
+              </md-list-item>
+              <md-list-item>
+                <h3 translate="TOOLBAR.SPEAKER">Speaker</h3>
+                <md-icon
+                  class="md-secondary"
+                  ng-class="vm.conf.hasSpeakers ? 'green-fg' : 'red-fg'"
+                  md-font-icon="{{vm.conf.hasSpeakers ? 'icon-check' : 'icon-close'}}"
+                ></md-icon>
+              </md-list-item>
+            </md-list>
+          </md-content>
+        </md-tab>
+      </md-tabs>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-click="vm.saveSettings()"
+          class="send-button md-accent md-raised"
+          ng-disabled="settingsForm.$invalid || settingsForm.$pristine"
+          aria-label="SAVE"
+          translate="TOOLBAR.SAVE"
+          translate-attr-aria-label="TOOLBAR.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/core/directives/ms-quick-filter/ms-quick-filter.html/ms-quick-filter-[chunkhash].html b/public/src/js/modules/core/directives/ms-quick-filter/ms-quick-filter.html/ms-quick-filter-[chunkhash].html
deleted file mode 100644
index 8702af9..0000000
--- a/public/src/js/modules/core/directives/ms-quick-filter/ms-quick-filter.html/ms-quick-filter-[chunkhash].html
+++ /dev/null
@@ -1,93 +0,0 @@
-<div ng-cloak layout="row" class="quick-filter-container" flex>
-  <div
-    ng-repeat="filter in vm.filters"
-    ng-if="filter.ngIf ? $eval('vm.query.' + filter.ngIf) : true"
-    layout="column"
-    class="padding-horizontal-16"
-  >
-    <span class="font-size-10" translate="{{ filter.label }}" />
-    <md-select
-      ng-if="filter.type === 'select'"
-      class="font-size-12 no-margin"
-      ng-model="vm.query[filter.key]"
-      ng-change="vm.search()"
-      aria-label="Filter {{ filter.name }}"
-    >
-      <md-option
-        ng-repeat="option in filter.options"
-        ng-value="filter.ngValue ? option[filter.ngValue] : option.id"
-        >{{ option.name }}</md-option
-      >
-      <md-option
-        ng-repeat="option in filter.customOptions"
-        ng-value="option.value"
-        translate="{{ option.translate }}"
-      ></md-option>
-    </md-select>
-
-    <md-select
-      ng-if="filter.type === 'multiselect'"
-      multiple
-      class="font-size-12 no-margin"
-      ng-init="vm.onMultiselectInit(filter)"
-      ng-model="vm.query[filter.key]"
-      ng-disabled="filter.options.length === 0"
-      ng-change="vm.onMultiselectSelection(filter)"
-      md-selected-text="vm.placeholders[filter.key]"
-      aria-label="Filter {{ filter.name }}"
-    >
-      <md-option
-        ng-repeat="option in filter.options"
-        ng-value="filter.ngValue ? option[filter.ngValue] : option.id"
-        ng-disabled="filter.clearAll === false && vm.query[filter.key].length === 1 && vm.query[filter.key][0] === (filter.ngValue ? option[filter.ngValue] : option.id)"
-      >
-        {{ option.name }}</md-option
-      >
-      <md-button
-        ng-if="vm.query[filter.key].length &lt; filter.options.length"
-        ng-click="vm.selectAll(filter)"
-        md-no-ink
-        class="md-primary"
-        layout-fill
-      >
-        {{'DASHBOARDS.SELECT_ALL' | translate}}</md-button
-      >
-      <md-button
-        ng-if="vm.query[filter.key].length === filter.options.length"
-        ng-click="vm.clearSelection(filter)"
-        md-no-ink
-        class="md-primary"
-        layout-fill
-      >
-        {{'DASHBOARDS.CLEAR' | translate}}</md-button
-      >
-    </md-select>
-
-    <div
-      ng-if="filter.type === 'date'"
-      layout="row"
-      layout-align="center center"
-    >
-      <md-date-range
-        ng-init="vm.onDateRangeInit(filter)"
-        localization-map="vm.localizationMap"
-        ng-model="vm.pickerModels[filter.key]"
-        auto-confirm="true"
-        show-template="true"
-        md-on-select="vm.onDateRangeSelection(filter)"
-        placeholder="{{ 'DASHBOARDS.ALL' | translate }}"
-      >
-      </md-date-range>
-      <md-button
-        ng-if="vm.pickerModels[filter.key].dateStart"
-        ng-click="vm.clearDate(filter)"
-        class="md-icon-button no-margin no-padding width-20 height-20"
-      >
-        <md-icon
-          md-font-icon="icon-close"
-          class="quick-filter-date-clear-button s16"
-        ></md-icon>
-      </md-button>
-    </div>
-  </div>
-</div>
diff --git a/public/src/js/modules/core/directives/ms-quick-filter/ms-quick-filter.html/ms-quick-filter.html b/public/src/js/modules/core/directives/ms-quick-filter/ms-quick-filter.html/ms-quick-filter.html
new file mode 100644
index 0000000..8702af9
--- /dev/null
+++ b/public/src/js/modules/core/directives/ms-quick-filter/ms-quick-filter.html/ms-quick-filter.html
@@ -0,0 +1,93 @@
+<div ng-cloak layout="row" class="quick-filter-container" flex>
+  <div
+    ng-repeat="filter in vm.filters"
+    ng-if="filter.ngIf ? $eval('vm.query.' + filter.ngIf) : true"
+    layout="column"
+    class="padding-horizontal-16"
+  >
+    <span class="font-size-10" translate="{{ filter.label }}" />
+    <md-select
+      ng-if="filter.type === 'select'"
+      class="font-size-12 no-margin"
+      ng-model="vm.query[filter.key]"
+      ng-change="vm.search()"
+      aria-label="Filter {{ filter.name }}"
+    >
+      <md-option
+        ng-repeat="option in filter.options"
+        ng-value="filter.ngValue ? option[filter.ngValue] : option.id"
+        >{{ option.name }}</md-option
+      >
+      <md-option
+        ng-repeat="option in filter.customOptions"
+        ng-value="option.value"
+        translate="{{ option.translate }}"
+      ></md-option>
+    </md-select>
+
+    <md-select
+      ng-if="filter.type === 'multiselect'"
+      multiple
+      class="font-size-12 no-margin"
+      ng-init="vm.onMultiselectInit(filter)"
+      ng-model="vm.query[filter.key]"
+      ng-disabled="filter.options.length === 0"
+      ng-change="vm.onMultiselectSelection(filter)"
+      md-selected-text="vm.placeholders[filter.key]"
+      aria-label="Filter {{ filter.name }}"
+    >
+      <md-option
+        ng-repeat="option in filter.options"
+        ng-value="filter.ngValue ? option[filter.ngValue] : option.id"
+        ng-disabled="filter.clearAll === false && vm.query[filter.key].length === 1 && vm.query[filter.key][0] === (filter.ngValue ? option[filter.ngValue] : option.id)"
+      >
+        {{ option.name }}</md-option
+      >
+      <md-button
+        ng-if="vm.query[filter.key].length &lt; filter.options.length"
+        ng-click="vm.selectAll(filter)"
+        md-no-ink
+        class="md-primary"
+        layout-fill
+      >
+        {{'DASHBOARDS.SELECT_ALL' | translate}}</md-button
+      >
+      <md-button
+        ng-if="vm.query[filter.key].length === filter.options.length"
+        ng-click="vm.clearSelection(filter)"
+        md-no-ink
+        class="md-primary"
+        layout-fill
+      >
+        {{'DASHBOARDS.CLEAR' | translate}}</md-button
+      >
+    </md-select>
+
+    <div
+      ng-if="filter.type === 'date'"
+      layout="row"
+      layout-align="center center"
+    >
+      <md-date-range
+        ng-init="vm.onDateRangeInit(filter)"
+        localization-map="vm.localizationMap"
+        ng-model="vm.pickerModels[filter.key]"
+        auto-confirm="true"
+        show-template="true"
+        md-on-select="vm.onDateRangeSelection(filter)"
+        placeholder="{{ 'DASHBOARDS.ALL' | translate }}"
+      >
+      </md-date-range>
+      <md-button
+        ng-if="vm.pickerModels[filter.key].dateStart"
+        ng-click="vm.clearDate(filter)"
+        class="md-icon-button no-margin no-padding width-20 height-20"
+      >
+        <md-icon
+          md-font-icon="icon-close"
+          class="quick-filter-date-clear-button s16"
+        ></md-icon>
+      </md-button>
+    </div>
+  </div>
+</div>
diff --git a/public/src/js/modules/core/directives/ms-search-bar/ms-search-bar.html/ms-search-bar-[chunkhash].html b/public/src/js/modules/core/directives/ms-search-bar/ms-search-bar.html/ms-search-bar-[chunkhash].html
deleted file mode 100644
index a90484a..0000000
--- a/public/src/js/modules/core/directives/ms-search-bar/ms-search-bar.html/ms-search-bar-[chunkhash].html
+++ /dev/null
@@ -1,74 +0,0 @@
-<div flex layout="row" layout-align="start center" ng-init="vm.onInit()">
-  <label>
-    <md-button
-      class="ms-search-bar-expander md-icon-button"
-      aria-label="Expand Search Bar"
-      ng-click="vm.expand()"
-      ng-if="!vm.resultsLoading || vm.collapsed"
-    >
-      <md-icon
-        id="ms-search-bar-icon"
-        md-font-icon="icon-magnify"
-        class="s24"
-        ng-class="{'{{ vm.iconColor }}': vm.iconColor && vm.collapsed }"
-      ></md-icon>
-    </md-button>
-    <div
-      class="ms-search-bar-loader"
-      layout="row"
-      layout-align="center center"
-      ng-if="vm.resultsLoading && !vm.collapsed"
-    >
-      <md-progress-circular
-        class="md-accent"
-        md-diameter="32"
-        md-mode="indeterminate"
-      ></md-progress-circular>
-    </div>
-  </label>
-  <input
-    ng-if="!vm.collapsed"
-    focus-on="!vm.collapsed"
-    type="text"
-    placeholder="Search"
-    flex
-    ng-model="vm.query"
-    ng-model-options="vm.queryOptions"
-    ng-blur="vm.blurCollapse()"
-    ng-keydown="vm.handleKeydown($event)"
-  />
-  <md-button
-    class="ms-search-bar-collapser md-icon-button"
-    ng-click="vm.collapse()"
-    aria-label="Collapse Search Bar"
-  >
-    <md-icon md-font-icon="icon-close" class="icon s24"></md-icon>
-  </md-button>
-
-  <div class="ms-search-bar-results" ng-if="vm.results" ms-scroll>
-    <div class="no-results" ng-if="vm.results.length === 0">No Results!</div>
-
-    <div
-      class="result"
-      ng-repeat="result in vm.results"
-      ng-click="vm.handleResultClick(result)"
-      ng-mouseenter="vm.handleMouseenter($index)"
-      ng-mousedown="vm.absorbEvent($event)"
-      ng-class="{'selected': $index == vm.selectedResultIndex}"
-      md-ink-ripple
-    >
-      <div layout="row" layout-align="start center">
-        <div class="icon-container" layout="row" layout-align="center center">
-          <i ng-if="result.icon" class="icon {{ result.icon }}"></i>
-          <div ng-if="!result.icon" class="square md-accent-bg"></div>
-        </div>
-        <div>
-          <div class="title">{{ result.title }}</div>
-          <div class="description" ng-if="result.description">
-            {{ result.description }}
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</div>
diff --git a/public/src/js/modules/core/directives/ms-search-bar/ms-search-bar.html/ms-search-bar.html b/public/src/js/modules/core/directives/ms-search-bar/ms-search-bar.html/ms-search-bar.html
new file mode 100644
index 0000000..a90484a
--- /dev/null
+++ b/public/src/js/modules/core/directives/ms-search-bar/ms-search-bar.html/ms-search-bar.html
@@ -0,0 +1,74 @@
+<div flex layout="row" layout-align="start center" ng-init="vm.onInit()">
+  <label>
+    <md-button
+      class="ms-search-bar-expander md-icon-button"
+      aria-label="Expand Search Bar"
+      ng-click="vm.expand()"
+      ng-if="!vm.resultsLoading || vm.collapsed"
+    >
+      <md-icon
+        id="ms-search-bar-icon"
+        md-font-icon="icon-magnify"
+        class="s24"
+        ng-class="{'{{ vm.iconColor }}': vm.iconColor && vm.collapsed }"
+      ></md-icon>
+    </md-button>
+    <div
+      class="ms-search-bar-loader"
+      layout="row"
+      layout-align="center center"
+      ng-if="vm.resultsLoading && !vm.collapsed"
+    >
+      <md-progress-circular
+        class="md-accent"
+        md-diameter="32"
+        md-mode="indeterminate"
+      ></md-progress-circular>
+    </div>
+  </label>
+  <input
+    ng-if="!vm.collapsed"
+    focus-on="!vm.collapsed"
+    type="text"
+    placeholder="Search"
+    flex
+    ng-model="vm.query"
+    ng-model-options="vm.queryOptions"
+    ng-blur="vm.blurCollapse()"
+    ng-keydown="vm.handleKeydown($event)"
+  />
+  <md-button
+    class="ms-search-bar-collapser md-icon-button"
+    ng-click="vm.collapse()"
+    aria-label="Collapse Search Bar"
+  >
+    <md-icon md-font-icon="icon-close" class="icon s24"></md-icon>
+  </md-button>
+
+  <div class="ms-search-bar-results" ng-if="vm.results" ms-scroll>
+    <div class="no-results" ng-if="vm.results.length === 0">No Results!</div>
+
+    <div
+      class="result"
+      ng-repeat="result in vm.results"
+      ng-click="vm.handleResultClick(result)"
+      ng-mouseenter="vm.handleMouseenter($index)"
+      ng-mousedown="vm.absorbEvent($event)"
+      ng-class="{'selected': $index == vm.selectedResultIndex}"
+      md-ink-ripple
+    >
+      <div layout="row" layout-align="start center">
+        <div class="icon-container" layout="row" layout-align="center center">
+          <i ng-if="result.icon" class="icon {{ result.icon }}"></i>
+          <div ng-if="!result.icon" class="square md-accent-bg"></div>
+        </div>
+        <div>
+          <div class="title">{{ result.title }}</div>
+          <div class="description" ng-if="result.description">
+            {{ result.description }}
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
diff --git a/public/src/js/modules/core/directives/ms-shortcuts/ms-shortcuts.html/ms-shortcuts-[chunkhash].html b/public/src/js/modules/core/directives/ms-shortcuts/ms-shortcuts.html/ms-shortcuts-[chunkhash].html
deleted file mode 100644
index 34a53da..0000000
--- a/public/src/js/modules/core/directives/ms-shortcuts/ms-shortcuts.html/ms-shortcuts-[chunkhash].html
+++ /dev/null
@@ -1,119 +0,0 @@
-<div
-  class="shortcuts-container"
-  layout="row"
-  layout-align="space-between center"
-  flex
-  ng-class="{'mobile-bar-active': MsShortcuts.mobileBarActive}"
->
-  <div
-    class="flex-noshrink"
-    layout="row"
-    layout-align="start center"
-    flex
-    ng-if="MsShortcuts.shortcuts.length > 0"
-  >
-    <div
-      class="shortcuts hide show-gt-xs"
-      layout="row"
-      layout-align="start center"
-      ms-scroll
-      ng-sortable="MsShortcuts.sortableOptions"
-    >
-      <div
-        ng-repeat="shortcut in MsShortcuts.shortcuts"
-        layout="row"
-        layout-align="center center"
-      >
-        <md-button
-          class="md-icon-button shortcut"
-          aria-label="{{shortcut.title}}"
-          ui-sref="{{shortcut.uisref}}"
-        >
-          <md-icon
-            ng-if="shortcut.icon"
-            md-font-icon="{{shortcut.icon}}"
-            class="icon s24"
-          ></md-icon>
-          <div ng-if="!shortcut.icon" class="first-letter">
-            {{shortcut.title.charAt(0)}}
-          </div>
-          <md-tooltip md-direction="bottom">{{shortcut.title}}</md-tooltip>
-        </md-button>
-      </div>
-    </div>
-
-    <!-- <md-menu md-offset="8 56" class="shortcut-menu hide show-gt-xs">
-            <md-button class="md-icon-button add-shortcut-button" aria-label="Add shortcut"
-                       ng-click="$mdMenu.open($event)">
-                <md-icon md-menu-origin md-font-icon="icon-star" class="icon amber-600-fg s24"></md-icon>
-                <md-tooltip md-direction="bottom">Click to add/remove shortcut</md-tooltip>
-            </md-button>
-
-            <md-menu-content>
-                <div id="ms-shortcut-add-menu">
-                    <div class="shortcut-search" layout="row" layout-align="start center">
-                        <div class="search-icon" layout="row" layout-align="center center"
-                             ng-if="!MsShortcuts.resultsLoading">
-                            <md-icon md-menu-align-target md-font-icon="icon-magnify" class="icon s24"></md-icon>
-                        </div>
-                        <div class="shortcut-loader" layout="row" layout-align="center center"
-                             ng-if="MsShortcuts.resultsLoading">
-                            <md-progress-circular class="md-accent" md-diameter="20" md-mode="indeterminate">
-                            </md-progress-circular>
-                        </div>
-
-                        <input type="text" placeholder="Search" flex
-                               ng-model="MsShortcuts.query"
-                               ng-model-options="MsShortcuts.queryOptions"
-                               ng-keydown="MsShortcuts.handleKeydown($event)">
-                    </div>
-
-                    <div class="results" ng-if="MsShortcuts.results" ms-scroll>
-                        <div class="no-results" ng-if="MsShortcuts.results.length === 0">No Results!</div>
-
-                        <div class="result" ng-repeat="result in MsShortcuts.results"
-                             ng-click="MsShortcuts.handleResultClick(result)"
-                             ng-mouseenter="MsShortcuts.handleMouseenter($index)"
-                             ng-mousedown="MsShortcuts.absorbEvent($event)"
-                             ng-class="{'selected': $index == MsShortcuts.selectedResultIndex}"
-                             md-prevent-menu-close="md-prevent-menu-close"
-                             md-ink-ripple>
-                            <div layout="row" layout-align="start space-between">
-                                <div layout="row" layout-align="start center" flex>
-                                    <div class="icon icon-container" layout="row" layout-align="center center">
-                                        <i ng-if="result.icon" class="{{result.icon}}"></i>
-                                        <div ng-if="!result.icon" class="square md-accent-bg"></div>
-                                    </div>
-                                    <div>
-                                        <div class="title">{{result.title}}</div>
-                                    </div>
-                                </div>
-                                <md-icon md-font-icon="icon-pin" class="icon s18"
-                                         ng-class="{'fade-text': !result.hasShortcut}"></md-icon>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </md-menu-content>
-        </md-menu> -->
-  </div>
-
-  <md-button
-    class="md-icon-button toggle-mobile-menu hide-gt-xs"
-    aria-label="Add shortcut"
-    ng-click="MsShortcuts.toggleMobileBar()"
-  >
-    <md-icon
-      md-menu-origin
-      md-font-icon="icon-star"
-      class="icon amber-600-fg s24"
-      ng-hide="MsShortcuts.mobileBarActive"
-    ></md-icon>
-    <md-icon
-      md-menu-origin
-      md-font-icon="icon-close"
-      class="icon s24"
-      ng-hide="!MsShortcuts.mobileBarActive"
-    ></md-icon>
-  </md-button>
-</div>
diff --git a/public/src/js/modules/core/directives/ms-shortcuts/ms-shortcuts.html/ms-shortcuts.html b/public/src/js/modules/core/directives/ms-shortcuts/ms-shortcuts.html/ms-shortcuts.html
new file mode 100644
index 0000000..34a53da
--- /dev/null
+++ b/public/src/js/modules/core/directives/ms-shortcuts/ms-shortcuts.html/ms-shortcuts.html
@@ -0,0 +1,119 @@
+<div
+  class="shortcuts-container"
+  layout="row"
+  layout-align="space-between center"
+  flex
+  ng-class="{'mobile-bar-active': MsShortcuts.mobileBarActive}"
+>
+  <div
+    class="flex-noshrink"
+    layout="row"
+    layout-align="start center"
+    flex
+    ng-if="MsShortcuts.shortcuts.length > 0"
+  >
+    <div
+      class="shortcuts hide show-gt-xs"
+      layout="row"
+      layout-align="start center"
+      ms-scroll
+      ng-sortable="MsShortcuts.sortableOptions"
+    >
+      <div
+        ng-repeat="shortcut in MsShortcuts.shortcuts"
+        layout="row"
+        layout-align="center center"
+      >
+        <md-button
+          class="md-icon-button shortcut"
+          aria-label="{{shortcut.title}}"
+          ui-sref="{{shortcut.uisref}}"
+        >
+          <md-icon
+            ng-if="shortcut.icon"
+            md-font-icon="{{shortcut.icon}}"
+            class="icon s24"
+          ></md-icon>
+          <div ng-if="!shortcut.icon" class="first-letter">
+            {{shortcut.title.charAt(0)}}
+          </div>
+          <md-tooltip md-direction="bottom">{{shortcut.title}}</md-tooltip>
+        </md-button>
+      </div>
+    </div>
+
+    <!-- <md-menu md-offset="8 56" class="shortcut-menu hide show-gt-xs">
+            <md-button class="md-icon-button add-shortcut-button" aria-label="Add shortcut"
+                       ng-click="$mdMenu.open($event)">
+                <md-icon md-menu-origin md-font-icon="icon-star" class="icon amber-600-fg s24"></md-icon>
+                <md-tooltip md-direction="bottom">Click to add/remove shortcut</md-tooltip>
+            </md-button>
+
+            <md-menu-content>
+                <div id="ms-shortcut-add-menu">
+                    <div class="shortcut-search" layout="row" layout-align="start center">
+                        <div class="search-icon" layout="row" layout-align="center center"
+                             ng-if="!MsShortcuts.resultsLoading">
+                            <md-icon md-menu-align-target md-font-icon="icon-magnify" class="icon s24"></md-icon>
+                        </div>
+                        <div class="shortcut-loader" layout="row" layout-align="center center"
+                             ng-if="MsShortcuts.resultsLoading">
+                            <md-progress-circular class="md-accent" md-diameter="20" md-mode="indeterminate">
+                            </md-progress-circular>
+                        </div>
+
+                        <input type="text" placeholder="Search" flex
+                               ng-model="MsShortcuts.query"
+                               ng-model-options="MsShortcuts.queryOptions"
+                               ng-keydown="MsShortcuts.handleKeydown($event)">
+                    </div>
+
+                    <div class="results" ng-if="MsShortcuts.results" ms-scroll>
+                        <div class="no-results" ng-if="MsShortcuts.results.length === 0">No Results!</div>
+
+                        <div class="result" ng-repeat="result in MsShortcuts.results"
+                             ng-click="MsShortcuts.handleResultClick(result)"
+                             ng-mouseenter="MsShortcuts.handleMouseenter($index)"
+                             ng-mousedown="MsShortcuts.absorbEvent($event)"
+                             ng-class="{'selected': $index == MsShortcuts.selectedResultIndex}"
+                             md-prevent-menu-close="md-prevent-menu-close"
+                             md-ink-ripple>
+                            <div layout="row" layout-align="start space-between">
+                                <div layout="row" layout-align="start center" flex>
+                                    <div class="icon icon-container" layout="row" layout-align="center center">
+                                        <i ng-if="result.icon" class="{{result.icon}}"></i>
+                                        <div ng-if="!result.icon" class="square md-accent-bg"></div>
+                                    </div>
+                                    <div>
+                                        <div class="title">{{result.title}}</div>
+                                    </div>
+                                </div>
+                                <md-icon md-font-icon="icon-pin" class="icon s18"
+                                         ng-class="{'fade-text': !result.hasShortcut}"></md-icon>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </md-menu-content>
+        </md-menu> -->
+  </div>
+
+  <md-button
+    class="md-icon-button toggle-mobile-menu hide-gt-xs"
+    aria-label="Add shortcut"
+    ng-click="MsShortcuts.toggleMobileBar()"
+  >
+    <md-icon
+      md-menu-origin
+      md-font-icon="icon-star"
+      class="icon amber-600-fg s24"
+      ng-hide="MsShortcuts.mobileBarActive"
+    ></md-icon>
+    <md-icon
+      md-menu-origin
+      md-font-icon="icon-close"
+      class="icon s24"
+      ng-hide="!MsShortcuts.mobileBarActive"
+    ></md-icon>
+  </md-button>
+</div>
diff --git a/public/src/js/modules/core/directives/ms-stepper/templates/horizontal/horizontal.html/horizontal-[chunkhash].html b/public/src/js/modules/core/directives/ms-stepper/templates/horizontal/horizontal.html/horizontal-[chunkhash].html
deleted file mode 100644
index 9b64da6..0000000
--- a/public/src/js/modules/core/directives/ms-stepper/templates/horizontal/horizontal.html/horizontal-[chunkhash].html
+++ /dev/null
@@ -1,88 +0,0 @@
-<div class="ms-stepper-horizontal">
-  <div class="ms-stepper-navigation-wrapper">
-    <div
-      class="ms-stepper-navigation"
-      layout="row"
-      layout-align="center center"
-    >
-      <md-button
-        class="ms-stepper-navigation-item"
-        ng-class="{'current': MsStepper.isStepCurrent(step.stepNumber), 'valid': MsStepper.isStepValid(step.stepNumber), 'disabled': MsStepper.isStepDisabled(step.stepNumber), 'optional': MsStepper.isStepOptional(step.stepNumber)}"
-        ng-click="MsStepper.gotoStep(step.stepNumber)"
-        ng-disabled="MsStepper.isStepDisabled(step.stepNumber)"
-        ng-repeat="step in MsStepper.steps | filter:MsStepper.filterHiddenStep"
-        layout="row"
-        layout-align="start center"
-      >
-        <div
-          class="step md-accent-bg"
-          layout="row"
-          layout-align="center center"
-        >
-          <span
-            ng-if="!MsStepper.isStepValid(step.stepNumber) || MsStepper.isStepOptional(step.stepNumber)"
-          >
-            {{$index + 1}}
-          </span>
-          <span
-            ng-if="MsStepper.isStepValid(step.stepNumber) && !MsStepper.isStepOptional(step.stepNumber)"
-          >
-            <i class="icon icon-check s18"></i>
-          </span>
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="title" translate="{{step.stepTitleTranslate}}">
-            {{step.stepTitle}}
-          </div>
-          <div
-            class="subtitle"
-            ng-if="MsStepper.isStepOptional(step.stepNumber)"
-          >
-            Optional
-          </div>
-        </div>
-      </md-button>
-    </div>
-  </div>
-
-  <div class="ms-stepper-steps" ng-transclude></div>
-
-  <div class="ms-stepper-controls" layout="row" layout-align="center center">
-    <md-button
-      class="md-accent md-raised"
-      ng-disabled="MsStepper.isFirstStep()"
-      ng-click="MsStepper.gotoPreviousStep()"
-    >
-      Back
-    </md-button>
-
-    <div class="ms-stepper-dots">
-      <span
-        ng-repeat="step in MsStepper.steps"
-        ng-hide="MsStepper.isStepHidden(step.stepNumber)"
-        ng-class="{'selected md-accent-bg':MsStepper.currentStepNumber === $index + 1}"
-      >
-      </span>
-    </div>
-
-    <md-button
-      class="md-accent md-raised"
-      ng-if="!MsStepper.isLastStep()"
-      ng-disabled="!MsStepper.isStepValid(MsStepper.currentStepNumber)"
-      ng-click="MsStepper.gotoNextStep()"
-    >
-      Next
-    </md-button>
-
-    <md-button
-      type="submit"
-      class="md-accent md-raised"
-      ng-click="MsStepper.resetForm()"
-      ng-if="MsStepper.isLastStep()"
-      ng-disabled="!MsStepper.isFormValid()"
-    >
-      Submit
-    </md-button>
-  </div>
-</div>
diff --git a/public/src/js/modules/core/directives/ms-stepper/templates/horizontal/horizontal.html/horizontal.html b/public/src/js/modules/core/directives/ms-stepper/templates/horizontal/horizontal.html/horizontal.html
new file mode 100644
index 0000000..9b64da6
--- /dev/null
+++ b/public/src/js/modules/core/directives/ms-stepper/templates/horizontal/horizontal.html/horizontal.html
@@ -0,0 +1,88 @@
+<div class="ms-stepper-horizontal">
+  <div class="ms-stepper-navigation-wrapper">
+    <div
+      class="ms-stepper-navigation"
+      layout="row"
+      layout-align="center center"
+    >
+      <md-button
+        class="ms-stepper-navigation-item"
+        ng-class="{'current': MsStepper.isStepCurrent(step.stepNumber), 'valid': MsStepper.isStepValid(step.stepNumber), 'disabled': MsStepper.isStepDisabled(step.stepNumber), 'optional': MsStepper.isStepOptional(step.stepNumber)}"
+        ng-click="MsStepper.gotoStep(step.stepNumber)"
+        ng-disabled="MsStepper.isStepDisabled(step.stepNumber)"
+        ng-repeat="step in MsStepper.steps | filter:MsStepper.filterHiddenStep"
+        layout="row"
+        layout-align="start center"
+      >
+        <div
+          class="step md-accent-bg"
+          layout="row"
+          layout-align="center center"
+        >
+          <span
+            ng-if="!MsStepper.isStepValid(step.stepNumber) || MsStepper.isStepOptional(step.stepNumber)"
+          >
+            {{$index + 1}}
+          </span>
+          <span
+            ng-if="MsStepper.isStepValid(step.stepNumber) && !MsStepper.isStepOptional(step.stepNumber)"
+          >
+            <i class="icon icon-check s18"></i>
+          </span>
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="title" translate="{{step.stepTitleTranslate}}">
+            {{step.stepTitle}}
+          </div>
+          <div
+            class="subtitle"
+            ng-if="MsStepper.isStepOptional(step.stepNumber)"
+          >
+            Optional
+          </div>
+        </div>
+      </md-button>
+    </div>
+  </div>
+
+  <div class="ms-stepper-steps" ng-transclude></div>
+
+  <div class="ms-stepper-controls" layout="row" layout-align="center center">
+    <md-button
+      class="md-accent md-raised"
+      ng-disabled="MsStepper.isFirstStep()"
+      ng-click="MsStepper.gotoPreviousStep()"
+    >
+      Back
+    </md-button>
+
+    <div class="ms-stepper-dots">
+      <span
+        ng-repeat="step in MsStepper.steps"
+        ng-hide="MsStepper.isStepHidden(step.stepNumber)"
+        ng-class="{'selected md-accent-bg':MsStepper.currentStepNumber === $index + 1}"
+      >
+      </span>
+    </div>
+
+    <md-button
+      class="md-accent md-raised"
+      ng-if="!MsStepper.isLastStep()"
+      ng-disabled="!MsStepper.isStepValid(MsStepper.currentStepNumber)"
+      ng-click="MsStepper.gotoNextStep()"
+    >
+      Next
+    </md-button>
+
+    <md-button
+      type="submit"
+      class="md-accent md-raised"
+      ng-click="MsStepper.resetForm()"
+      ng-if="MsStepper.isLastStep()"
+      ng-disabled="!MsStepper.isFormValid()"
+    >
+      Submit
+    </md-button>
+  </div>
+</div>
diff --git a/public/src/js/modules/core/directives/ms-stepper/templates/vertical/step/vertical-step.html/vertical-step-[chunkhash].html b/public/src/js/modules/core/directives/ms-stepper/templates/vertical/step/vertical-step.html/vertical-step-[chunkhash].html
deleted file mode 100644
index 4966d0b..0000000
--- a/public/src/js/modules/core/directives/ms-stepper/templates/vertical/step/vertical-step.html/vertical-step-[chunkhash].html
+++ /dev/null
@@ -1,71 +0,0 @@
-<md-button
-  class="ms-stepper-navigation-item"
-  ng-class="{'current': MsStepper.isStepCurrent(stepInfo.stepNumber), 'valid': MsStepper.isStepValid(stepInfo.stepNumber), 'disabled': MsStepper.isStepDisabled(stepInfo.stepNumber), 'optional': MsStepper.isStepOptional(stepInfo.stepNumber)}"
-  ng-click="MsStepper.gotoStep(stepInfo.stepNumber)"
-  ng-disabled="MsStepper.isStepDisabled(stepInfo.stepNumber)"
-  ng-hide="MsStepper.isStepHidden(stepInfo.stepNumber)"
-  aria-label="Stepper navigation button"
-  layout="row"
-  layout-align="start center"
->
-  <div class="step" layout="row" layout-align="center center">
-    <span
-      ng-if="!MsStepper.isStepValid(stepInfo.stepNumber) || MsStepper.isStepOptional(stepInfo.stepNumber)"
-    >
-      <i class="icon icon-checkbox-blank-circle-outline s18 md-accent-fg"></i>
-    </span>
-    <span
-      ng-if="MsStepper.isStepValid(stepInfo.stepNumber) && !MsStepper.isStepOptional(stepInfo.stepNumber)"
-    >
-      <i class="icon icon-check-circle s18 md-accent-fg"></i>
-    </span>
-  </div>
-
-  <div layout="column" layout-align="start start">
-    <div class="title" ng-if="stepInfo.stepTitleTranslate">
-      {{stepInfo.stepTitleTranslate | translate }}
-    </div>
-    <div class="title" ng-if="!stepInfo.stepTitleTranslate">
-      {{stepInfo.stepTitle}}
-    </div>
-    <div class="subtitle" ng-if="MsStepper.isStepOptional(stepInfo.stepNumber)">
-      Optional
-    </div>
-  </div>
-</md-button>
-
-<div class="ms-stepper-step-content" ng-transclude></div>
-
-<div
-  class="ms-stepper-controls"
-  layout="row"
-  layout-align="start center"
-  ng-show="MsStepper.isStepCurrent(stepInfo.stepNumber)"
->
-  <md-button
-    class="md-accent md-raised"
-    ng-disabled="MsStepper.isFirstStep()"
-    ng-click="MsStepper.gotoPreviousStep()"
-  >
-    Back
-  </md-button>
-
-  <md-button
-    class="md-accent md-raised"
-    ng-if="!MsStepper.isLastStep()"
-    ng-disabled="!MsStepper.isStepValid(MsStepper.currentStepNumber)"
-    ng-click="MsStepper.gotoNextStep()"
-  >
-    Next
-  </md-button>
-
-  <md-button
-    type="submit"
-    class="md-accent md-raised"
-    ng-click="MsStepper.resetForm()"
-    ng-if="MsStepper.isLastStep()"
-    ng-disabled="!MsStepper.isFormValid()"
-  >
-    Submit
-  </md-button>
-</div>
diff --git a/public/src/js/modules/core/directives/ms-stepper/templates/vertical/step/vertical-step.html/vertical-step.html b/public/src/js/modules/core/directives/ms-stepper/templates/vertical/step/vertical-step.html/vertical-step.html
new file mode 100644
index 0000000..4966d0b
--- /dev/null
+++ b/public/src/js/modules/core/directives/ms-stepper/templates/vertical/step/vertical-step.html/vertical-step.html
@@ -0,0 +1,71 @@
+<md-button
+  class="ms-stepper-navigation-item"
+  ng-class="{'current': MsStepper.isStepCurrent(stepInfo.stepNumber), 'valid': MsStepper.isStepValid(stepInfo.stepNumber), 'disabled': MsStepper.isStepDisabled(stepInfo.stepNumber), 'optional': MsStepper.isStepOptional(stepInfo.stepNumber)}"
+  ng-click="MsStepper.gotoStep(stepInfo.stepNumber)"
+  ng-disabled="MsStepper.isStepDisabled(stepInfo.stepNumber)"
+  ng-hide="MsStepper.isStepHidden(stepInfo.stepNumber)"
+  aria-label="Stepper navigation button"
+  layout="row"
+  layout-align="start center"
+>
+  <div class="step" layout="row" layout-align="center center">
+    <span
+      ng-if="!MsStepper.isStepValid(stepInfo.stepNumber) || MsStepper.isStepOptional(stepInfo.stepNumber)"
+    >
+      <i class="icon icon-checkbox-blank-circle-outline s18 md-accent-fg"></i>
+    </span>
+    <span
+      ng-if="MsStepper.isStepValid(stepInfo.stepNumber) && !MsStepper.isStepOptional(stepInfo.stepNumber)"
+    >
+      <i class="icon icon-check-circle s18 md-accent-fg"></i>
+    </span>
+  </div>
+
+  <div layout="column" layout-align="start start">
+    <div class="title" ng-if="stepInfo.stepTitleTranslate">
+      {{stepInfo.stepTitleTranslate | translate }}
+    </div>
+    <div class="title" ng-if="!stepInfo.stepTitleTranslate">
+      {{stepInfo.stepTitle}}
+    </div>
+    <div class="subtitle" ng-if="MsStepper.isStepOptional(stepInfo.stepNumber)">
+      Optional
+    </div>
+  </div>
+</md-button>
+
+<div class="ms-stepper-step-content" ng-transclude></div>
+
+<div
+  class="ms-stepper-controls"
+  layout="row"
+  layout-align="start center"
+  ng-show="MsStepper.isStepCurrent(stepInfo.stepNumber)"
+>
+  <md-button
+    class="md-accent md-raised"
+    ng-disabled="MsStepper.isFirstStep()"
+    ng-click="MsStepper.gotoPreviousStep()"
+  >
+    Back
+  </md-button>
+
+  <md-button
+    class="md-accent md-raised"
+    ng-if="!MsStepper.isLastStep()"
+    ng-disabled="!MsStepper.isStepValid(MsStepper.currentStepNumber)"
+    ng-click="MsStepper.gotoNextStep()"
+  >
+    Next
+  </md-button>
+
+  <md-button
+    type="submit"
+    class="md-accent md-raised"
+    ng-click="MsStepper.resetForm()"
+    ng-if="MsStepper.isLastStep()"
+    ng-disabled="!MsStepper.isFormValid()"
+  >
+    Submit
+  </md-button>
+</div>
diff --git a/public/src/js/modules/core/directives/ms-stepper/templates/vertical/vertical.html/vertical-[chunkhash].html b/public/src/js/modules/core/directives/ms-stepper/templates/vertical/vertical.html/vertical-[chunkhash].html
deleted file mode 100644
index bdf911d..0000000
--- a/public/src/js/modules/core/directives/ms-stepper/templates/vertical/vertical.html/vertical-[chunkhash].html
+++ /dev/null
@@ -1,4 +0,0 @@
-<div class="ms-stepper-vertical">
-  <div class="ms-stepper-vertical-line"></div>
-  <div class="ms-stepper-steps" ng-transclude></div>
-</div>
diff --git a/public/src/js/modules/core/directives/ms-stepper/templates/vertical/vertical.html/vertical.html b/public/src/js/modules/core/directives/ms-stepper/templates/vertical/vertical.html/vertical.html
new file mode 100644
index 0000000..bdf911d
--- /dev/null
+++ b/public/src/js/modules/core/directives/ms-stepper/templates/vertical/vertical.html/vertical.html
@@ -0,0 +1,4 @@
+<div class="ms-stepper-vertical">
+  <div class="ms-stepper-vertical-line"></div>
+  <div class="ms-stepper-steps" ng-transclude></div>
+</div>
diff --git a/public/src/js/modules/core/directives/ms-tab-scroll/ms-tab-scroll.html/ms-tab-scroll-[chunkhash].html b/public/src/js/modules/core/directives/ms-tab-scroll/ms-tab-scroll.html/ms-tab-scroll-[chunkhash].html
deleted file mode 100644
index 8c48711..0000000
--- a/public/src/js/modules/core/directives/ms-tab-scroll/ms-tab-scroll.html/ms-tab-scroll-[chunkhash].html
+++ /dev/null
@@ -1,25 +0,0 @@
-<div layout="row">
-  <md-button
-    class="md-icon-button md-mini width-25 no-margin scroll-arrow"
-    ng-click="vm.onTabScroll('left')"
-    ng-if="vm.canScroll('left') == true"
-  >
-    <md-icon md-font-icon="icon-chevron-left" class="icon s26"></md-icon>
-  </md-button>
-  <div id="bar-container" layout="row" class="bar-container">
-    <div
-      ng-transclude
-      id="tab-container"
-      layout="row"
-      layout-align="start center"
-      class="scroll-container"
-    ></div>
-  </div>
-  <md-button
-    class="md-icon-button md-mini width-25 no-margin scroll-arrow"
-    ng-click="vm.onTabScroll('right')"
-    ng-if="vm.canScroll('right') == true"
-  >
-    <md-icon md-font-icon="icon-chevron-right" class="icon s26"></md-icon>
-  </md-button>
-</div>
diff --git a/public/src/js/modules/core/directives/ms-tab-scroll/ms-tab-scroll.html/ms-tab-scroll.html b/public/src/js/modules/core/directives/ms-tab-scroll/ms-tab-scroll.html/ms-tab-scroll.html
new file mode 100644
index 0000000..8c48711
--- /dev/null
+++ b/public/src/js/modules/core/directives/ms-tab-scroll/ms-tab-scroll.html/ms-tab-scroll.html
@@ -0,0 +1,25 @@
+<div layout="row">
+  <md-button
+    class="md-icon-button md-mini width-25 no-margin scroll-arrow"
+    ng-click="vm.onTabScroll('left')"
+    ng-if="vm.canScroll('left') == true"
+  >
+    <md-icon md-font-icon="icon-chevron-left" class="icon s26"></md-icon>
+  </md-button>
+  <div id="bar-container" layout="row" class="bar-container">
+    <div
+      ng-transclude
+      id="tab-container"
+      layout="row"
+      layout-align="start center"
+      class="scroll-container"
+    ></div>
+  </div>
+  <md-button
+    class="md-icon-button md-mini width-25 no-margin scroll-arrow"
+    ng-click="vm.onTabScroll('right')"
+    ng-if="vm.canScroll('right') == true"
+  >
+    <md-icon md-font-icon="icon-chevron-right" class="icon s26"></md-icon>
+  </md-button>
+</div>
diff --git a/public/src/js/modules/core/directives/ms-timezone/ms-timezone.html/ms-timezone-[chunkhash].html b/public/src/js/modules/core/directives/ms-timezone/ms-timezone.html/ms-timezone-[chunkhash].html
deleted file mode 100644
index 6fe00ae..0000000
--- a/public/src/js/modules/core/directives/ms-timezone/ms-timezone.html/ms-timezone-[chunkhash].html
+++ /dev/null
@@ -1,6 +0,0 @@
-<md-select ng-model="ngModel" class="no-margin">
-  <md-option ng-value="null">NONE</md-option>
-  <md-option ng-repeat="t in timezone | orderBy:'utcOffset'" value="{{t.name}}"
-    >{{t.name}} ({{t.offsetStr}})</md-option
-  >
-</md-select>
diff --git a/public/src/js/modules/core/directives/ms-timezone/ms-timezone.html/ms-timezone.html b/public/src/js/modules/core/directives/ms-timezone/ms-timezone.html/ms-timezone.html
new file mode 100644
index 0000000..6fe00ae
--- /dev/null
+++ b/public/src/js/modules/core/directives/ms-timezone/ms-timezone.html/ms-timezone.html
@@ -0,0 +1,6 @@
+<md-select ng-model="ngModel" class="no-margin">
+  <md-option ng-value="null">NONE</md-option>
+  <md-option ng-repeat="t in timezone | orderBy:'utcOffset'" value="{{t.name}}"
+    >{{t.name}} ({{t.offsetStr}})</md-option
+  >
+</md-select>
diff --git a/public/src/js/modules/core/directives/ms-widget-engine/ms-widget-engine.html/ms-widget-engine-[chunkhash].html b/public/src/js/modules/core/directives/ms-widget-engine/ms-widget-engine.html/ms-widget-engine-[chunkhash].html
deleted file mode 100644
index d17d45a..0000000
--- a/public/src/js/modules/core/directives/ms-widget-engine/ms-widget-engine.html/ms-widget-engine-[chunkhash].html
+++ /dev/null
@@ -1,98 +0,0 @@
-<div gridster="vm.config">
-  <ul>
-    <li gridster-item="widget" ng-repeat="widget in vm.config.widgets">
-      <md-card layout-fill>
-        <md-toolbar
-          class="height-40"
-          ng-style="{'background-color': widget.background, 'color': widget.foreground }"
-        >
-          <div
-            class="md-toolbar-tools height-40 no-margin"
-            layout="row"
-            layout-align="start center"
-          >
-            <a
-              ng-href="{{widget.link ? widget.link : 'javascript:void(0)'}}"
-              ng-style="{'color': widget.foreground}"
-              class="text-truncate"
-              flex
-            >
-              {{ widget.title || 'No Title' }}
-            </a>
-            <md-button
-              ng-if="!vm.config.preview"
-              class="draggable md-icon-button width-30 no-margin no-padding"
-              aria-label="Move"
-            >
-              <md-tooltip
-                ><span translate="TOOLS.MOVE_WIDGET">Move</span></md-tooltip
-              >
-              <md-icon
-                md-font-icon="icon-cursor-move"
-                class="s20"
-                ng-style="{'color': widget.foreground}"
-              ></md-icon>
-            </md-button>
-            <md-menu ng-if="!vm.config.preview">
-              <md-button
-                ng-click="$mdMenu.open($event)"
-                class="md-icon-button width-30 no-margin no-padding"
-                aria-label="More"
-              >
-                <md-icon
-                  md-font-icon="icon-dots-vertical"
-                  class="s20"
-                  ng-style="{'color': widget.foreground}"
-                ></md-icon>
-              </md-button>
-              <md-menu-content>
-                <md-menu-item>
-                  <md-button
-                    ng-click="vm.onEdit({widget: widget})"
-                    translate="TOOLS.EDIT_WIDGET"
-                    >Edit</md-button
-                  >
-                </md-menu-item>
-                <md-menu-item>
-                  <md-button
-                    ng-click="vm.onDelete({widget: widget})"
-                    translate="TOOLS.DELETE_WIDGET"
-                    >Delete</md-button
-                  >
-                </md-menu-item>
-              </md-menu-content>
-            </md-menu>
-          </div>
-        </md-toolbar>
-        <md-card-content
-          class="resizable"
-          layout="column"
-          layout-align="center center"
-          flex
-          ng-style="{'background-color': widget.background, 'color': widget.foreground}"
-        >
-          <div ng-switch="widget.type" layout-fill>
-            <iframe
-              ng-switch-when="iframe|custom"
-              ng-switch-when-separator="|"
-              ng-src="{{vm.getTrustedURL(widget.attrs[0].value)}}"
-              frameborder="0"
-              style="border: 0px; width: 100%; height: 100%"
-            ></iframe>
-            <ds-widget-clock
-              ng-class="'font-size-' + (widget.attrs[2].value || 12)"
-              ng-switch-when="clock"
-              digital-format="widget.attrs[0].value"
-              gmt-offset="widget.attrs[1].value"
-              data-show-digital
-              show-gmt-info
-            ></ds-widget-clock>
-            <div ng-switch-default layout-fill>
-              <div ng-include="widget.templateUrl" layout-fill></div>
-            </div>
-          </div>
-        </md-card-content>
-      </md-card>
-    </li>
-  </ul>
-</div>
diff --git a/public/src/js/modules/core/directives/ms-widget-engine/ms-widget-engine.html/ms-widget-engine.html b/public/src/js/modules/core/directives/ms-widget-engine/ms-widget-engine.html/ms-widget-engine.html
new file mode 100644
index 0000000..d17d45a
--- /dev/null
+++ b/public/src/js/modules/core/directives/ms-widget-engine/ms-widget-engine.html/ms-widget-engine.html
@@ -0,0 +1,98 @@
+<div gridster="vm.config">
+  <ul>
+    <li gridster-item="widget" ng-repeat="widget in vm.config.widgets">
+      <md-card layout-fill>
+        <md-toolbar
+          class="height-40"
+          ng-style="{'background-color': widget.background, 'color': widget.foreground }"
+        >
+          <div
+            class="md-toolbar-tools height-40 no-margin"
+            layout="row"
+            layout-align="start center"
+          >
+            <a
+              ng-href="{{widget.link ? widget.link : 'javascript:void(0)'}}"
+              ng-style="{'color': widget.foreground}"
+              class="text-truncate"
+              flex
+            >
+              {{ widget.title || 'No Title' }}
+            </a>
+            <md-button
+              ng-if="!vm.config.preview"
+              class="draggable md-icon-button width-30 no-margin no-padding"
+              aria-label="Move"
+            >
+              <md-tooltip
+                ><span translate="TOOLS.MOVE_WIDGET">Move</span></md-tooltip
+              >
+              <md-icon
+                md-font-icon="icon-cursor-move"
+                class="s20"
+                ng-style="{'color': widget.foreground}"
+              ></md-icon>
+            </md-button>
+            <md-menu ng-if="!vm.config.preview">
+              <md-button
+                ng-click="$mdMenu.open($event)"
+                class="md-icon-button width-30 no-margin no-padding"
+                aria-label="More"
+              >
+                <md-icon
+                  md-font-icon="icon-dots-vertical"
+                  class="s20"
+                  ng-style="{'color': widget.foreground}"
+                ></md-icon>
+              </md-button>
+              <md-menu-content>
+                <md-menu-item>
+                  <md-button
+                    ng-click="vm.onEdit({widget: widget})"
+                    translate="TOOLS.EDIT_WIDGET"
+                    >Edit</md-button
+                  >
+                </md-menu-item>
+                <md-menu-item>
+                  <md-button
+                    ng-click="vm.onDelete({widget: widget})"
+                    translate="TOOLS.DELETE_WIDGET"
+                    >Delete</md-button
+                  >
+                </md-menu-item>
+              </md-menu-content>
+            </md-menu>
+          </div>
+        </md-toolbar>
+        <md-card-content
+          class="resizable"
+          layout="column"
+          layout-align="center center"
+          flex
+          ng-style="{'background-color': widget.background, 'color': widget.foreground}"
+        >
+          <div ng-switch="widget.type" layout-fill>
+            <iframe
+              ng-switch-when="iframe|custom"
+              ng-switch-when-separator="|"
+              ng-src="{{vm.getTrustedURL(widget.attrs[0].value)}}"
+              frameborder="0"
+              style="border: 0px; width: 100%; height: 100%"
+            ></iframe>
+            <ds-widget-clock
+              ng-class="'font-size-' + (widget.attrs[2].value || 12)"
+              ng-switch-when="clock"
+              digital-format="widget.attrs[0].value"
+              gmt-offset="widget.attrs[1].value"
+              data-show-digital
+              show-gmt-info
+            ></ds-widget-clock>
+            <div ng-switch-default layout-fill>
+              <div ng-include="widget.templateUrl" layout-fill></div>
+            </div>
+          </div>
+        </md-card-content>
+      </md-card>
+    </li>
+  </ul>
+</div>
diff --git a/public/src/js/modules/core/layouts/content-only.html/content-only-[chunkhash].html b/public/src/js/modules/core/layouts/content-only.html/content-only-[chunkhash].html
deleted file mode 100644
index e732cec..0000000
--- a/public/src/js/modules/core/layouts/content-only.html/content-only-[chunkhash].html
+++ /dev/null
@@ -1,8 +0,0 @@
-<div id="layout-content-only" class="template-layout" layout="column" flex>
-  <md-content
-    id="content"
-    class="animate-slide-up md-hue-2"
-    ui-view="content"
-    flex
-  ></md-content>
-</div>
diff --git a/public/src/js/modules/core/layouts/content-only.html/content-only.html b/public/src/js/modules/core/layouts/content-only.html/content-only.html
new file mode 100644
index 0000000..e732cec
--- /dev/null
+++ b/public/src/js/modules/core/layouts/content-only.html/content-only.html
@@ -0,0 +1,8 @@
+<div id="layout-content-only" class="template-layout" layout="column" flex>
+  <md-content
+    id="content"
+    class="animate-slide-up md-hue-2"
+    ui-view="content"
+    flex
+  ></md-content>
+</div>
diff --git a/public/src/js/modules/core/layouts/content-with-toolbar.html/content-with-toolbar-[chunkhash].html b/public/src/js/modules/core/layouts/content-with-toolbar.html/content-with-toolbar-[chunkhash].html
deleted file mode 100644
index 1c115a8..0000000
--- a/public/src/js/modules/core/layouts/content-with-toolbar.html/content-with-toolbar-[chunkhash].html
+++ /dev/null
@@ -1,26 +0,0 @@
-<div
-  id="layout-content-with-toolbar"
-  class="template-layout"
-  layout="column"
-  flex
->
-  <md-toolbar
-    id="toolbar"
-    class="md-menu-toolbar md-whiteframe-1dp"
-    ui-view="toolbar"
-  ></md-toolbar>
-  <md-content
-    id="content"
-    class="animate-slide-up md-hue-2"
-    ui-view="content"
-    flex
-  ></md-content>
-
-  <md-sidenav
-    id="quick-panel"
-    class="md-sidenav-right md-whiteframe-4dp"
-    md-component-id="quick-panel"
-    ms-scroll
-    ui-view="quickPanel"
-  ></md-sidenav>
-</div>
diff --git a/public/src/js/modules/core/layouts/content-with-toolbar.html/content-with-toolbar.html b/public/src/js/modules/core/layouts/content-with-toolbar.html/content-with-toolbar.html
new file mode 100644
index 0000000..1c115a8
--- /dev/null
+++ b/public/src/js/modules/core/layouts/content-with-toolbar.html/content-with-toolbar.html
@@ -0,0 +1,26 @@
+<div
+  id="layout-content-with-toolbar"
+  class="template-layout"
+  layout="column"
+  flex
+>
+  <md-toolbar
+    id="toolbar"
+    class="md-menu-toolbar md-whiteframe-1dp"
+    ui-view="toolbar"
+  ></md-toolbar>
+  <md-content
+    id="content"
+    class="animate-slide-up md-hue-2"
+    ui-view="content"
+    flex
+  ></md-content>
+
+  <md-sidenav
+    id="quick-panel"
+    class="md-sidenav-right md-whiteframe-4dp"
+    md-component-id="quick-panel"
+    ms-scroll
+    ui-view="quickPanel"
+  ></md-sidenav>
+</div>
diff --git a/public/src/js/modules/core/layouts/horizontal-navigation.html/horizontal-navigation-[chunkhash].html b/public/src/js/modules/core/layouts/horizontal-navigation.html/horizontal-navigation-[chunkhash].html
deleted file mode 100644
index 8ef4f73..0000000
--- a/public/src/js/modules/core/layouts/horizontal-navigation.html/horizontal-navigation-[chunkhash].html
+++ /dev/null
@@ -1,44 +0,0 @@
-<div
-  id="layout-horizontal-navigation"
-  class="template-layout"
-  layout="column"
-  flex
->
-  <div
-    id="toolbar-navigation-container"
-    class="md-whiteframe-1dp"
-    layout="column"
-    layout-align="space-between start"
-  >
-    <md-toolbar
-      id="toolbar"
-      class="md-menu-toolbar md-whiteframe-1dp"
-      ui-view="toolbar"
-    ></md-toolbar>
-    <div
-      id="horizontal-navigation"
-      ui-view="navigation"
-      layout="row"
-      layout-align="start end"
-      flex
-    ></div>
-  </div>
-
-  <div id="content-container" flex layout="column">
-    <md-content
-      id="content"
-      class="animate-slide-up md-hue-2"
-      ms-scroll
-      ui-view="content"
-      flex
-    ></md-content>
-  </div>
-
-  <md-sidenav
-    id="quick-panel"
-    class="md-sidenav-right md-whiteframe-4dp"
-    md-component-id="quick-panel"
-    ms-scroll
-    ui-view="quickPanel"
-  ></md-sidenav>
-</div>
diff --git a/public/src/js/modules/core/layouts/horizontal-navigation.html/horizontal-navigation.html b/public/src/js/modules/core/layouts/horizontal-navigation.html/horizontal-navigation.html
new file mode 100644
index 0000000..8ef4f73
--- /dev/null
+++ b/public/src/js/modules/core/layouts/horizontal-navigation.html/horizontal-navigation.html
@@ -0,0 +1,44 @@
+<div
+  id="layout-horizontal-navigation"
+  class="template-layout"
+  layout="column"
+  flex
+>
+  <div
+    id="toolbar-navigation-container"
+    class="md-whiteframe-1dp"
+    layout="column"
+    layout-align="space-between start"
+  >
+    <md-toolbar
+      id="toolbar"
+      class="md-menu-toolbar md-whiteframe-1dp"
+      ui-view="toolbar"
+    ></md-toolbar>
+    <div
+      id="horizontal-navigation"
+      ui-view="navigation"
+      layout="row"
+      layout-align="start end"
+      flex
+    ></div>
+  </div>
+
+  <div id="content-container" flex layout="column">
+    <md-content
+      id="content"
+      class="animate-slide-up md-hue-2"
+      ms-scroll
+      ui-view="content"
+      flex
+    ></md-content>
+  </div>
+
+  <md-sidenav
+    id="quick-panel"
+    class="md-sidenav-right md-whiteframe-4dp"
+    md-component-id="quick-panel"
+    ms-scroll
+    ui-view="quickPanel"
+  ></md-sidenav>
+</div>
diff --git a/public/src/js/modules/core/layouts/vertical-navigation-fullwidth-toolbar-2.html/vertical-navigation-fullwidth-toolbar-2-[chunkhash].html b/public/src/js/modules/core/layouts/vertical-navigation-fullwidth-toolbar-2.html/vertical-navigation-fullwidth-toolbar-2-[chunkhash].html
deleted file mode 100644
index c572dca..0000000
--- a/public/src/js/modules/core/layouts/vertical-navigation-fullwidth-toolbar-2.html/vertical-navigation-fullwidth-toolbar-2-[chunkhash].html
+++ /dev/null
@@ -1,41 +0,0 @@
-<div
-  id="layout-vertical-navigation-fullwidth-toolbar-2"
-  class="template-layout"
-  layout="column"
-  flex
->
-  <md-toolbar
-    id="toolbar"
-    class="md-menu-toolbar md-whiteframe-1dp md-accent"
-    ui-view="toolbar"
-  ></md-toolbar>
-
-  <div id="main-container" layout="row" flex>
-    <md-sidenav
-      id="vertical-navigation"
-      class="md-primary-bg"
-      md-is-locked-open="$mdMedia('gt-sm')"
-      md-component-id="navigation"
-      ms-scroll
-      ui-view="navigation"
-    ></md-sidenav>
-
-    <div id="content-container" flex layout="column">
-      <md-content
-        id="content"
-        class="animate-slide-up md-hue-2"
-        ms-scroll
-        ui-view="content"
-        flex
-      ></md-content>
-    </div>
-
-    <md-sidenav
-      id="quick-panel"
-      class="md-sidenav-right md-whiteframe-4dp"
-      md-component-id="quick-panel"
-      ms-scroll
-      ui-view="quickPanel"
-    ></md-sidenav>
-  </div>
-</div>
diff --git a/public/src/js/modules/core/layouts/vertical-navigation-fullwidth-toolbar-2.html/vertical-navigation-fullwidth-toolbar-2.html b/public/src/js/modules/core/layouts/vertical-navigation-fullwidth-toolbar-2.html/vertical-navigation-fullwidth-toolbar-2.html
new file mode 100644
index 0000000..c572dca
--- /dev/null
+++ b/public/src/js/modules/core/layouts/vertical-navigation-fullwidth-toolbar-2.html/vertical-navigation-fullwidth-toolbar-2.html
@@ -0,0 +1,41 @@
+<div
+  id="layout-vertical-navigation-fullwidth-toolbar-2"
+  class="template-layout"
+  layout="column"
+  flex
+>
+  <md-toolbar
+    id="toolbar"
+    class="md-menu-toolbar md-whiteframe-1dp md-accent"
+    ui-view="toolbar"
+  ></md-toolbar>
+
+  <div id="main-container" layout="row" flex>
+    <md-sidenav
+      id="vertical-navigation"
+      class="md-primary-bg"
+      md-is-locked-open="$mdMedia('gt-sm')"
+      md-component-id="navigation"
+      ms-scroll
+      ui-view="navigation"
+    ></md-sidenav>
+
+    <div id="content-container" flex layout="column">
+      <md-content
+        id="content"
+        class="animate-slide-up md-hue-2"
+        ms-scroll
+        ui-view="content"
+        flex
+      ></md-content>
+    </div>
+
+    <md-sidenav
+      id="quick-panel"
+      class="md-sidenav-right md-whiteframe-4dp"
+      md-component-id="quick-panel"
+      ms-scroll
+      ui-view="quickPanel"
+    ></md-sidenav>
+  </div>
+</div>
diff --git a/public/src/js/modules/core/layouts/vertical-navigation-fullwidth-toolbar.html/vertical-navigation-fullwidth-toolbar-[chunkhash].html b/public/src/js/modules/core/layouts/vertical-navigation-fullwidth-toolbar.html/vertical-navigation-fullwidth-toolbar-[chunkhash].html
deleted file mode 100644
index b45b6eb..0000000
--- a/public/src/js/modules/core/layouts/vertical-navigation-fullwidth-toolbar.html/vertical-navigation-fullwidth-toolbar-[chunkhash].html
+++ /dev/null
@@ -1,41 +0,0 @@
-<div
-  id="layout-vertical-navigation-fullwidth-toolbar"
-  class="template-layout"
-  layout="column"
-  flex
->
-  <md-toolbar
-    id="toolbar"
-    class="md-menu-toolbar md-whiteframe-1dp md-accent"
-    ui-view="toolbar"
-  ></md-toolbar>
-
-  <div id="main-container" layout="row" flex>
-    <md-sidenav
-      id="vertical-navigation"
-      class="md-primary-bg"
-      md-is-locked-open="$mdMedia('gt-sm')"
-      md-component-id="navigation"
-      ms-scroll
-      ui-view="navigation"
-    ></md-sidenav>
-
-    <div id="content-container" flex layout="column">
-      <md-content
-        id="content"
-        class="animate-slide-up md-hue-2"
-        ms-scroll
-        ui-view="content"
-        flex
-      ></md-content>
-    </div>
-
-    <md-sidenav
-      id="quick-panel"
-      class="md-sidenav-right md-whiteframe-4dp"
-      md-component-id="quick-panel"
-      ms-scroll
-      ui-view="quickPanel"
-    ></md-sidenav>
-  </div>
-</div>
diff --git a/public/src/js/modules/core/layouts/vertical-navigation-fullwidth-toolbar.html/vertical-navigation-fullwidth-toolbar.html b/public/src/js/modules/core/layouts/vertical-navigation-fullwidth-toolbar.html/vertical-navigation-fullwidth-toolbar.html
new file mode 100644
index 0000000..b45b6eb
--- /dev/null
+++ b/public/src/js/modules/core/layouts/vertical-navigation-fullwidth-toolbar.html/vertical-navigation-fullwidth-toolbar.html
@@ -0,0 +1,41 @@
+<div
+  id="layout-vertical-navigation-fullwidth-toolbar"
+  class="template-layout"
+  layout="column"
+  flex
+>
+  <md-toolbar
+    id="toolbar"
+    class="md-menu-toolbar md-whiteframe-1dp md-accent"
+    ui-view="toolbar"
+  ></md-toolbar>
+
+  <div id="main-container" layout="row" flex>
+    <md-sidenav
+      id="vertical-navigation"
+      class="md-primary-bg"
+      md-is-locked-open="$mdMedia('gt-sm')"
+      md-component-id="navigation"
+      ms-scroll
+      ui-view="navigation"
+    ></md-sidenav>
+
+    <div id="content-container" flex layout="column">
+      <md-content
+        id="content"
+        class="animate-slide-up md-hue-2"
+        ms-scroll
+        ui-view="content"
+        flex
+      ></md-content>
+    </div>
+
+    <md-sidenav
+      id="quick-panel"
+      class="md-sidenav-right md-whiteframe-4dp"
+      md-component-id="quick-panel"
+      ms-scroll
+      ui-view="quickPanel"
+    ></md-sidenav>
+  </div>
+</div>
diff --git a/public/src/js/modules/core/layouts/vertical-navigation.html/vertical-navigation-[chunkhash].html b/public/src/js/modules/core/layouts/vertical-navigation.html/vertical-navigation-[chunkhash].html
deleted file mode 100644
index 2656362..0000000
--- a/public/src/js/modules/core/layouts/vertical-navigation.html/vertical-navigation-[chunkhash].html
+++ /dev/null
@@ -1,39 +0,0 @@
-<div id="header" ui-view="header"></div>
-
-<div id="layout-vertical-navigation" class="template-layout" layout="row" flex>
-  <md-sidenav
-    id="vertical-navigation"
-    class="md-primary-bg"
-    md-is-locked-open="$mdMedia('gt-sm')"
-    md-component-id="navigation"
-    ms-scroll
-    ui-view="navigation"
-    ng-if="!vm.isAgent()"
-  ></md-sidenav>
-
-  <div id="content-container" flex layout="column">
-    <md-toolbar
-      id="toolbar"
-      class="md-menu-toolbar md-whiteframe-1dp"
-      ui-view="toolbar"
-    ></md-toolbar>
-
-    <md-content
-      id="content"
-      class="animate-slide-up md-hue-2"
-      ms-scroll
-      ui-view="content"
-      flex
-    ></md-content>
-  </div>
-
-  <md-sidenav
-    id="quick-panel"
-    class="md-sidenav-right md-whiteframe-4dp"
-    md-component-id="quick-panel"
-    ms-scroll
-    ui-view="quickPanel"
-  ></md-sidenav>
-</div>
-
-<div id="footer" ui-view="footer"></div>
diff --git a/public/src/js/modules/core/layouts/vertical-navigation.html/vertical-navigation.html b/public/src/js/modules/core/layouts/vertical-navigation.html/vertical-navigation.html
new file mode 100644
index 0000000..2656362
--- /dev/null
+++ b/public/src/js/modules/core/layouts/vertical-navigation.html/vertical-navigation.html
@@ -0,0 +1,39 @@
+<div id="header" ui-view="header"></div>
+
+<div id="layout-vertical-navigation" class="template-layout" layout="row" flex>
+  <md-sidenav
+    id="vertical-navigation"
+    class="md-primary-bg"
+    md-is-locked-open="$mdMedia('gt-sm')"
+    md-component-id="navigation"
+    ms-scroll
+    ui-view="navigation"
+    ng-if="!vm.isAgent()"
+  ></md-sidenav>
+
+  <div id="content-container" flex layout="column">
+    <md-toolbar
+      id="toolbar"
+      class="md-menu-toolbar md-whiteframe-1dp"
+      ui-view="toolbar"
+    ></md-toolbar>
+
+    <md-content
+      id="content"
+      class="animate-slide-up md-hue-2"
+      ms-scroll
+      ui-view="content"
+      flex
+    ></md-content>
+  </div>
+
+  <md-sidenav
+    id="quick-panel"
+    class="md-sidenav-right md-whiteframe-4dp"
+    md-component-id="quick-panel"
+    ms-scroll
+    ui-view="quickPanel"
+  ></md-sidenav>
+</div>
+
+<div id="footer" ui-view="footer"></div>
diff --git a/public/src/js/modules/core/theme-options/theme-options.html/theme-options-[chunkhash].html b/public/src/js/modules/core/theme-options/theme-options.html/theme-options-[chunkhash].html
deleted file mode 100644
index 75d8104..0000000
--- a/public/src/js/modules/core/theme-options/theme-options.html/theme-options-[chunkhash].html
+++ /dev/null
@@ -1,76 +0,0 @@
-<div
-  class="ms-theme-options-button md-primary-bg"
-  ng-click="toggleOptionsSidenav()"
->
-  <md-icon md-font-icon="icon-cog" class="white-text"></md-icon>
-</div>
-
-<md-sidenav md-component-id="motion-theme-options" class="md-sidenav-right">
-  <div class="ms-theme-options-list" layout="column">
-    <div class="theme-option layout-options">
-      <div class="option-title">Layout Style:</div>
-      <md-radio-group
-        layout="row"
-        layout-align="start start"
-        layout-wrap
-        ng-model="vm.layoutStyle"
-        ng-change="vm.updateLayoutStyle()"
-      >
-        <md-radio-button
-          ng-repeat="layoutStyle in vm.layoutStyles"
-          ng-value="layoutStyle.value"
-        >
-          <div layout="column" layout-align="center center">
-            <img ng-src="{{layoutStyle.figure}}" />
-            <span class="text-center font-size-12 mt-8"
-              >{{layoutStyle.label}}</span
-            >
-          </div>
-        </md-radio-button>
-      </md-radio-group>
-    </div>
-
-    <md-divider></md-divider>
-
-    <div class="theme-option">
-      <div class="option-title">Layout Mode:</div>
-      <md-radio-group
-        layout="row"
-        layout-align="start center"
-        ng-model="vm.layoutMode"
-        ng-change="vm.updateLayoutMode()"
-      >
-        <md-radio-button
-          ng-repeat="layoutMode in vm.layoutModes"
-          ng-value="layoutMode.value"
-        >
-          {{layoutMode.label}}
-        </md-radio-button>
-      </md-radio-group>
-    </div>
-
-    <md-divider></md-divider>
-
-    <div class="theme-option color-palettes">
-      <div class="option-title">Color Palette:</div>
-      <div layout="row" layout-align="start start" layout-wrap>
-        <md-button
-          ng-repeat="(themeName, theme) in vm.themes.list"
-          class="md-raised theme-button"
-          layout="row"
-          layout-align="center center"
-          aria-label="{{themeName}}"
-          ng-click="vm.setActiveTheme(themeName)"
-          ng-style="{'background-color': theme.primary.color,'border-color': theme.accent.color,'color': theme.primary.contrast1}"
-          ng-class="{active: vm.getActiveTheme().name === themeName}"
-        >
-          <md-icon
-            ng-style="{'color': theme.primary.contrast1}"
-            md-font-icon="icon-palette"
-            class="icon s32"
-          ></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-</md-sidenav>
diff --git a/public/src/js/modules/core/theme-options/theme-options.html/theme-options.html b/public/src/js/modules/core/theme-options/theme-options.html/theme-options.html
new file mode 100644
index 0000000..75d8104
--- /dev/null
+++ b/public/src/js/modules/core/theme-options/theme-options.html/theme-options.html
@@ -0,0 +1,76 @@
+<div
+  class="ms-theme-options-button md-primary-bg"
+  ng-click="toggleOptionsSidenav()"
+>
+  <md-icon md-font-icon="icon-cog" class="white-text"></md-icon>
+</div>
+
+<md-sidenav md-component-id="motion-theme-options" class="md-sidenav-right">
+  <div class="ms-theme-options-list" layout="column">
+    <div class="theme-option layout-options">
+      <div class="option-title">Layout Style:</div>
+      <md-radio-group
+        layout="row"
+        layout-align="start start"
+        layout-wrap
+        ng-model="vm.layoutStyle"
+        ng-change="vm.updateLayoutStyle()"
+      >
+        <md-radio-button
+          ng-repeat="layoutStyle in vm.layoutStyles"
+          ng-value="layoutStyle.value"
+        >
+          <div layout="column" layout-align="center center">
+            <img ng-src="{{layoutStyle.figure}}" />
+            <span class="text-center font-size-12 mt-8"
+              >{{layoutStyle.label}}</span
+            >
+          </div>
+        </md-radio-button>
+      </md-radio-group>
+    </div>
+
+    <md-divider></md-divider>
+
+    <div class="theme-option">
+      <div class="option-title">Layout Mode:</div>
+      <md-radio-group
+        layout="row"
+        layout-align="start center"
+        ng-model="vm.layoutMode"
+        ng-change="vm.updateLayoutMode()"
+      >
+        <md-radio-button
+          ng-repeat="layoutMode in vm.layoutModes"
+          ng-value="layoutMode.value"
+        >
+          {{layoutMode.label}}
+        </md-radio-button>
+      </md-radio-group>
+    </div>
+
+    <md-divider></md-divider>
+
+    <div class="theme-option color-palettes">
+      <div class="option-title">Color Palette:</div>
+      <div layout="row" layout-align="start start" layout-wrap>
+        <md-button
+          ng-repeat="(themeName, theme) in vm.themes.list"
+          class="md-raised theme-button"
+          layout="row"
+          layout-align="center center"
+          aria-label="{{themeName}}"
+          ng-click="vm.setActiveTheme(themeName)"
+          ng-style="{'background-color': theme.primary.color,'border-color': theme.accent.color,'color': theme.primary.contrast1}"
+          ng-class="{active: vm.getActiveTheme().name === themeName}"
+        >
+          <md-icon
+            ng-style="{'color': theme.primary.contrast1}"
+            md-font-icon="icon-palette"
+            class="icon s32"
+          ></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+</md-sidenav>
diff --git a/public/src/js/modules/errors/404/error-404.html/error-404-[chunkhash].html b/public/src/js/modules/errors/404/error-404.html/error-404-[chunkhash].html
deleted file mode 100644
index c00514c..0000000
--- a/public/src/js/modules/errors/404/error-404.html/error-404-[chunkhash].html
+++ /dev/null
@@ -1,27 +0,0 @@
-<div id="error-404" layout="column" layout-align="center center">
-  <div class="content" layout="column" layout-align="center center">
-    <div class="error-code" translate="ERROR404.CODE">404</div>
-
-    <div class="message" translate="ERROR404.MESSAGE">
-      Sorry but we couldn’t find the page you are looking for
-    </div>
-    <ms-search-bar
-      on-search="vm.search(query)"
-      on-result-click="vm.searchResultClick(item)"
-      debounce="300"
-      >Search for anything</ms-search-bar
-    >
-
-    <!-- <div class="search md-whiteframe-1dp" layout="row" layout-align="start center">
-            <md-icon md-font-icon="icon-magnify" class="icon s24"></md-icon>
-            <input ng-model="vm.search" type="text" placeholder="Search for anything" translate translate-attr-placeholder="ERROR404.SEARCH" flex>
-        </div> -->
-
-    <a
-      class="md-button md-raised md-primary back-link"
-      href="/"
-      translate="ERROR404.GO_BACK"
-      >Go back to dashboard</a
-    >
-  </div>
-</div>
diff --git a/public/src/js/modules/errors/404/error-404.html/error-404.html b/public/src/js/modules/errors/404/error-404.html/error-404.html
new file mode 100644
index 0000000..c00514c
--- /dev/null
+++ b/public/src/js/modules/errors/404/error-404.html/error-404.html
@@ -0,0 +1,27 @@
+<div id="error-404" layout="column" layout-align="center center">
+  <div class="content" layout="column" layout-align="center center">
+    <div class="error-code" translate="ERROR404.CODE">404</div>
+
+    <div class="message" translate="ERROR404.MESSAGE">
+      Sorry but we couldn’t find the page you are looking for
+    </div>
+    <ms-search-bar
+      on-search="vm.search(query)"
+      on-result-click="vm.searchResultClick(item)"
+      debounce="300"
+      >Search for anything</ms-search-bar
+    >
+
+    <!-- <div class="search md-whiteframe-1dp" layout="row" layout-align="start center">
+            <md-icon md-font-icon="icon-magnify" class="icon s24"></md-icon>
+            <input ng-model="vm.search" type="text" placeholder="Search for anything" translate translate-attr-placeholder="ERROR404.SEARCH" flex>
+        </div> -->
+
+    <a
+      class="md-button md-raised md-primary back-link"
+      href="/"
+      translate="ERROR404.GO_BACK"
+      >Go back to dashboard</a
+    >
+  </div>
+</div>
diff --git a/public/src/js/modules/errors/500/error-500.html/error-500-[chunkhash].html b/public/src/js/modules/errors/500/error-500.html/error-500-[chunkhash].html
deleted file mode 100644
index f1f58dc..0000000
--- a/public/src/js/modules/errors/500/error-500.html/error-500-[chunkhash].html
+++ /dev/null
@@ -1,54 +0,0 @@
-<div id="error-500" layout="column" layout-align="center center">
-  <div
-    ng-if="!vm.send"
-    class="content"
-    layout="column"
-    layout-align="center center"
-  >
-    <div class="error-code" translate="ERROR500.CODE">500</div>
-    <div class="message" translate="ERROR500.MESSAGE">
-      Well, you broke the internet!
-    </div>
-    <div class="sub-message" translate="ERROR500.SUBMESSAGE">
-      Just kidding, looks like we have an internal issue, please try again in
-      couple minutes
-    </div>
-    <a
-      class="md-button md-raised md-primary back-link"
-      href="/"
-      translate="ERROR500.GO_BACK"
-      >Go back to dashboard</a
-    >
-    <md-button
-      class="md-raised md-warn"
-      ng-click="vm.sendReport()"
-      translate="ERROR500.REPORT"
-      >Report this problem</md-button
-    >
-  </div>
-  <pre ng-if="!vm.send">
-      {{vm.error}}
-    </pre
-  >
-  <div
-    ng-if="vm.send"
-    class="content"
-    layout="column"
-    layout-align="center center"
-  >
-    <div class="error-code">#{{vm.code}}</div>
-    <div class="message" translate="ERROR500.JIRA_MESSAGE">
-      Your request has been received and will be processed shortly.
-    </div>
-    <div class="sub-message" translate="ERROR500.JIRA_SUBMESSAGE">
-      Sorry for the inconvenience. If you have any questions or concerns, please
-      do not hesitate to contact us.
-    </div>
-    <a
-      class="md-button md-raised md-primary back-link"
-      href="/"
-      translate="ERROR500.GO_BACK"
-      >Go back to dashboard</a
-    >
-  </div>
-</div>
diff --git a/public/src/js/modules/errors/500/error-500.html/error-500.html b/public/src/js/modules/errors/500/error-500.html/error-500.html
new file mode 100644
index 0000000..f1f58dc
--- /dev/null
+++ b/public/src/js/modules/errors/500/error-500.html/error-500.html
@@ -0,0 +1,54 @@
+<div id="error-500" layout="column" layout-align="center center">
+  <div
+    ng-if="!vm.send"
+    class="content"
+    layout="column"
+    layout-align="center center"
+  >
+    <div class="error-code" translate="ERROR500.CODE">500</div>
+    <div class="message" translate="ERROR500.MESSAGE">
+      Well, you broke the internet!
+    </div>
+    <div class="sub-message" translate="ERROR500.SUBMESSAGE">
+      Just kidding, looks like we have an internal issue, please try again in
+      couple minutes
+    </div>
+    <a
+      class="md-button md-raised md-primary back-link"
+      href="/"
+      translate="ERROR500.GO_BACK"
+      >Go back to dashboard</a
+    >
+    <md-button
+      class="md-raised md-warn"
+      ng-click="vm.sendReport()"
+      translate="ERROR500.REPORT"
+      >Report this problem</md-button
+    >
+  </div>
+  <pre ng-if="!vm.send">
+      {{vm.error}}
+    </pre
+  >
+  <div
+    ng-if="vm.send"
+    class="content"
+    layout="column"
+    layout-align="center center"
+  >
+    <div class="error-code">#{{vm.code}}</div>
+    <div class="message" translate="ERROR500.JIRA_MESSAGE">
+      Your request has been received and will be processed shortly.
+    </div>
+    <div class="sub-message" translate="ERROR500.JIRA_SUBMESSAGE">
+      Sorry for the inconvenience. If you have any questions or concerns, please
+      do not hesitate to contact us.
+    </div>
+    <a
+      class="md-button md-raised md-primary back-link"
+      href="/"
+      translate="ERROR500.GO_BACK"
+      >Go back to dashboard</a
+    >
+  </div>
+</div>
diff --git a/public/src/js/modules/footer/layouts/vertical-navigation/footer.html/footer-[chunkhash].html b/public/src/js/modules/footer/layouts/vertical-navigation/footer.html/footer-[chunkhash].html
deleted file mode 100644
index 4c452a1..0000000
--- a/public/src/js/modules/footer/layouts/vertical-navigation/footer.html/footer-[chunkhash].html
+++ /dev/null
@@ -1,15 +0,0 @@
-<div layout="row" layout-align="start center">
-  <ms-info-bar
-    ng-if="!vm.cookieAlertHide"
-    on-close="vm.cookieAlertOnClose()"
-    class="grey-100-bg"
-  >
-    <div layout="row" layout-align="start center">
-      <span
-        translate="FOOTER.COOKIE_LAW"
-        flex
-        class="text-center grey-600-fg"
-      ></span>
-    </div>
-  </ms-info-bar>
-</div>
diff --git a/public/src/js/modules/footer/layouts/vertical-navigation/footer.html/footer.html b/public/src/js/modules/footer/layouts/vertical-navigation/footer.html/footer.html
new file mode 100644
index 0000000..4c452a1
--- /dev/null
+++ b/public/src/js/modules/footer/layouts/vertical-navigation/footer.html/footer.html
@@ -0,0 +1,15 @@
+<div layout="row" layout-align="start center">
+  <ms-info-bar
+    ng-if="!vm.cookieAlertHide"
+    on-close="vm.cookieAlertOnClose()"
+    class="grey-100-bg"
+  >
+    <div layout="row" layout-align="start center">
+      <span
+        translate="FOOTER.COOKIE_LAW"
+        flex
+        class="text-center grey-600-fg"
+      ></span>
+    </div>
+  </ms-info-bar>
+</div>
diff --git a/public/src/js/modules/forgot/forgot.html/forgot-[chunkhash].html b/public/src/js/modules/forgot/forgot.html/forgot-[chunkhash].html
deleted file mode 100644
index 8accbd7..0000000
--- a/public/src/js/modules/forgot/forgot.html/forgot-[chunkhash].html
+++ /dev/null
@@ -1,74 +0,0 @@
-<div
-  id="forgot-password"
-  class="flex-scrollable"
-  layout="column"
-  ms-scroll
-  ng-init="vm.onInit()"
->
-  <div
-    id="forgot-password-form-wrapper"
-    layout="column"
-    layout-align="center center"
-  >
-    <div id="forgot-password-form" class="md-whiteframe-8dp">
-      <img
-        ng-src="{{vm.baseUrl}}settings/1/logo_login"
-        alt="logo_login"
-        class="logo_login"
-      />
-
-      <div class="title" translate="FORGOTPASSWORD.TITLE">
-        Recover your password
-      </div>
-
-      <form name="forgotPasswordForm" novalidate>
-        <md-input-container class="md-block" md-no-float>
-          <input
-            type="email"
-            name="email"
-            ng-model="vm.form.email"
-            placeholder="Email address"
-            translate
-            translate-attr-placeholder="FORGOTPASSWORD.EMAIL_ADRESS"
-            ng-pattern="/^.+@.+\..+$/"
-            required
-          />
-          <div
-            ng-messages="forgotPasswordForm.email.$error"
-            role="alert"
-            multiple
-          >
-            <div ng-message="required">
-              <span translate="FORGOTPASSWORD.ERRORS.EMAIL_REQUIRED"
-                >Email field is required</span
-              >
-            </div>
-            <div ng-message="pattern">
-              <span translate="FORGOTPASSWORD.ERRORS.EMAIL_MUST_VALID"
-                >Email must be a valid e-mail address</span
-              >
-            </div>
-          </div>
-        </md-input-container>
-
-        <md-button
-          type="button"
-          ng-click="vm.forgotPassword()"
-          class="md-raised md-accent submit-button"
-          aria-label="RESET MY PASSWORD"
-          ng-disabled="forgotPasswordForm.$invalid || forgotPasswordForm.$pristine"
-          translate="FORGOTPASSWORD.SEND_RESET_LINK"
-          translate-attr-aria-label="FORGOTPASSWORD.SEND_RESET_LINK"
-        >
-          SEND RESET LINK
-        </md-button>
-      </form>
-
-      <div class="login" layout="row" layout-align="center center">
-        <a class="link" ui-sref="app.login" translate="FORGOTPASSWORD.GO_BACK"
-          >Go back to login</a
-        >
-      </div>
-    </div>
-  </div>
-</div>
diff --git a/public/src/js/modules/forgot/forgot.html/forgot.html b/public/src/js/modules/forgot/forgot.html/forgot.html
new file mode 100644
index 0000000..8accbd7
--- /dev/null
+++ b/public/src/js/modules/forgot/forgot.html/forgot.html
@@ -0,0 +1,74 @@
+<div
+  id="forgot-password"
+  class="flex-scrollable"
+  layout="column"
+  ms-scroll
+  ng-init="vm.onInit()"
+>
+  <div
+    id="forgot-password-form-wrapper"
+    layout="column"
+    layout-align="center center"
+  >
+    <div id="forgot-password-form" class="md-whiteframe-8dp">
+      <img
+        ng-src="{{vm.baseUrl}}settings/1/logo_login"
+        alt="logo_login"
+        class="logo_login"
+      />
+
+      <div class="title" translate="FORGOTPASSWORD.TITLE">
+        Recover your password
+      </div>
+
+      <form name="forgotPasswordForm" novalidate>
+        <md-input-container class="md-block" md-no-float>
+          <input
+            type="email"
+            name="email"
+            ng-model="vm.form.email"
+            placeholder="Email address"
+            translate
+            translate-attr-placeholder="FORGOTPASSWORD.EMAIL_ADRESS"
+            ng-pattern="/^.+@.+\..+$/"
+            required
+          />
+          <div
+            ng-messages="forgotPasswordForm.email.$error"
+            role="alert"
+            multiple
+          >
+            <div ng-message="required">
+              <span translate="FORGOTPASSWORD.ERRORS.EMAIL_REQUIRED"
+                >Email field is required</span
+              >
+            </div>
+            <div ng-message="pattern">
+              <span translate="FORGOTPASSWORD.ERRORS.EMAIL_MUST_VALID"
+                >Email must be a valid e-mail address</span
+              >
+            </div>
+          </div>
+        </md-input-container>
+
+        <md-button
+          type="button"
+          ng-click="vm.forgotPassword()"
+          class="md-raised md-accent submit-button"
+          aria-label="RESET MY PASSWORD"
+          ng-disabled="forgotPasswordForm.$invalid || forgotPasswordForm.$pristine"
+          translate="FORGOTPASSWORD.SEND_RESET_LINK"
+          translate-attr-aria-label="FORGOTPASSWORD.SEND_RESET_LINK"
+        >
+          SEND RESET LINK
+        </md-button>
+      </form>
+
+      <div class="login" layout="row" layout-align="center center">
+        <a class="link" ui-sref="app.login" translate="FORGOTPASSWORD.GO_BACK"
+          >Go back to login</a
+        >
+      </div>
+    </div>
+  </div>
+</div>
diff --git a/public/src/js/modules/header/layouts/vertical-navigation/header.html/header-[chunkhash].html b/public/src/js/modules/header/layouts/vertical-navigation/header.html/header-[chunkhash].html
deleted file mode 100644
index 21c6daa..0000000
--- a/public/src/js/modules/header/layouts/vertical-navigation/header.html/header-[chunkhash].html
+++ /dev/null
@@ -1,8 +0,0 @@
-<!-- <div layout="row" layout-align="start center">
-    <ms-info-bar ng-if="vm.currentUser.role == 'admin' && !vm.newsAlertHide" on-close="vm.newsAlertOnClose()" class="green-600-bg white-fg">
-        <div layout="row" layout-align="start center">
-            <md-icon md-font-icon="icon-message-text-outline" class="icon margin-right-10 s20"></md-icon>
-            <div flex hide-xs translate="HEADER.NEWS"></div>
-        </div>
-    </ms-info-bar>
-</div> -->
diff --git a/public/src/js/modules/header/layouts/vertical-navigation/header.html/header.html b/public/src/js/modules/header/layouts/vertical-navigation/header.html/header.html
new file mode 100644
index 0000000..21c6daa
--- /dev/null
+++ b/public/src/js/modules/header/layouts/vertical-navigation/header.html/header.html
@@ -0,0 +1,8 @@
+<!-- <div layout="row" layout-align="start center">
+    <ms-info-bar ng-if="vm.currentUser.role == 'admin' && !vm.newsAlertHide" on-close="vm.newsAlertOnClose()" class="green-600-bg white-fg">
+        <div layout="row" layout-align="start center">
+            <md-icon md-font-icon="icon-message-text-outline" class="icon margin-right-10 s20"></md-icon>
+            <div flex hide-xs translate="HEADER.NEWS"></div>
+        </div>
+    </ms-info-bar>
+</div> -->
diff --git a/public/src/js/modules/login/login.html/login-[chunkhash].html b/public/src/js/modules/login/login.html/login-[chunkhash].html
deleted file mode 100644
index 782bbed..0000000
--- a/public/src/js/modules/login/login.html/login-[chunkhash].html
+++ /dev/null
@@ -1,115 +0,0 @@
-<div id="login" class="flex-scrollable" layout="column" ms-scroll>
-  <div id="login-form-wrapper" layout="column" layout-align="center center">
-    <div id="login-form" class="md-whiteframe-8dp">
-      <img
-        ng-src="{{vm.baseUrl}}settings/1/logo_login"
-        alt="logo_login"
-        class="logo_login"
-      />
-      <!-- <img src="assets/images/logos/login.png" alt="motion_logo_login" /> -->
-
-      <div class="md-subhead padding-top-45" translate="LOGIN.TITLE">
-        Log in to your account
-      </div>
-
-      <form name="loginForm" novalidate ng-if="!vm.progressLogin">
-        <md-input-container class="md-block" md-no-float>
-          <input
-            type="input"
-            name="name"
-            ng-model="vm.form.name"
-            autofocus
-            aria-label="username"
-            translate
-            translate-attr-placeholder="LOGIN.USERNAME"
-            required
-          />
-          <div ng-messages="loginForm.name.$error" role="alert" multiple>
-            <div ng-message="required">
-              <span translate="LOGIN.ERRORS.USERNAME_REQUIRED"
-                >Username field is required</span
-              >
-            </div>
-          </div>
-        </md-input-container>
-
-        <md-input-container class="md-block" md-no-float>
-          <input
-            type="password"
-            name="password"
-            ng-model="vm.form.password"
-            aria-label="password"
-            translate
-            translate-attr-placeholder="LOGIN.PASSWORD"
-            required
-          />
-          <div ng-messages="loginForm.password.$error" role="alert" multiple>
-            <div ng-message="required">
-              <span translate="LOGIN.ERRORS.PASSWORD_REQUIRED"
-                >Password field is required</span
-              >
-            </div>
-          </div>
-        </md-input-container>
-
-        <div
-          class="remember-forgot-password"
-          layout="row"
-          layout-xs="column"
-          layout-align="end center"
-        >
-          <!-- <md-checkbox class="remember-me" ng-model="data.cb1" aria-label="Remember Me">
-                        <span translate="LOGIN.REMEMBER_ME">Remember Me</span>
-                    </md-checkbox> -->
-          <a
-            ui-sref="app.forgot"
-            class="forgot-password md-accent-color"
-            style="cursor: pointer"
-            translate="LOGIN.FORGOT_PASSWORD"
-            >Forgot Password?</a
-          >
-        </div>
-
-        <b
-          layout="row"
-          layout-align="center center"
-          class="md-padding"
-          ng-if="vm.message"
-          ><font color="red">{{vm.message}}</font></b
-        >
-        <md-button
-          type="submit"
-          ng-click="vm.login()"
-          class="md-raised md-accent submit-button"
-          aria-label="LOGIN"
-          translate="LOGIN.LOG_IN"
-          translate-attr-aria-label="LOGIN.LOG_IN"
-        >
-          LOG IN
-        </md-button>
-      </form>
-
-      <md-progress-circular
-        ng-if="vm.progressLogin"
-        md-diameter="96"
-      ></md-progress-circular>
-
-      <div ng-if="vm.googleSsoEnabled" class="separator">
-        <span class="text" translate="LOGIN.OR">OR</span>
-      </div>
-
-      <md-button
-        ng-if="vm.googleSsoEnabled"
-        ng-click="vm.loginOauth('google')"
-        class="md-raised google"
-      >
-        <div layout="row" layout-align="center center">
-          <span>
-            <md-icon md-font-icon="fab fa-google" class="s16"></md-icon>
-            <span translate="LOGIN.WITH_GOOGLE">Log in with Google</span>
-          </span>
-        </div>
-      </md-button>
-    </div>
-  </div>
-</div>
diff --git a/public/src/js/modules/login/login.html/login.html b/public/src/js/modules/login/login.html/login.html
new file mode 100644
index 0000000..782bbed
--- /dev/null
+++ b/public/src/js/modules/login/login.html/login.html
@@ -0,0 +1,115 @@
+<div id="login" class="flex-scrollable" layout="column" ms-scroll>
+  <div id="login-form-wrapper" layout="column" layout-align="center center">
+    <div id="login-form" class="md-whiteframe-8dp">
+      <img
+        ng-src="{{vm.baseUrl}}settings/1/logo_login"
+        alt="logo_login"
+        class="logo_login"
+      />
+      <!-- <img src="assets/images/logos/login.png" alt="motion_logo_login" /> -->
+
+      <div class="md-subhead padding-top-45" translate="LOGIN.TITLE">
+        Log in to your account
+      </div>
+
+      <form name="loginForm" novalidate ng-if="!vm.progressLogin">
+        <md-input-container class="md-block" md-no-float>
+          <input
+            type="input"
+            name="name"
+            ng-model="vm.form.name"
+            autofocus
+            aria-label="username"
+            translate
+            translate-attr-placeholder="LOGIN.USERNAME"
+            required
+          />
+          <div ng-messages="loginForm.name.$error" role="alert" multiple>
+            <div ng-message="required">
+              <span translate="LOGIN.ERRORS.USERNAME_REQUIRED"
+                >Username field is required</span
+              >
+            </div>
+          </div>
+        </md-input-container>
+
+        <md-input-container class="md-block" md-no-float>
+          <input
+            type="password"
+            name="password"
+            ng-model="vm.form.password"
+            aria-label="password"
+            translate
+            translate-attr-placeholder="LOGIN.PASSWORD"
+            required
+          />
+          <div ng-messages="loginForm.password.$error" role="alert" multiple>
+            <div ng-message="required">
+              <span translate="LOGIN.ERRORS.PASSWORD_REQUIRED"
+                >Password field is required</span
+              >
+            </div>
+          </div>
+        </md-input-container>
+
+        <div
+          class="remember-forgot-password"
+          layout="row"
+          layout-xs="column"
+          layout-align="end center"
+        >
+          <!-- <md-checkbox class="remember-me" ng-model="data.cb1" aria-label="Remember Me">
+                        <span translate="LOGIN.REMEMBER_ME">Remember Me</span>
+                    </md-checkbox> -->
+          <a
+            ui-sref="app.forgot"
+            class="forgot-password md-accent-color"
+            style="cursor: pointer"
+            translate="LOGIN.FORGOT_PASSWORD"
+            >Forgot Password?</a
+          >
+        </div>
+
+        <b
+          layout="row"
+          layout-align="center center"
+          class="md-padding"
+          ng-if="vm.message"
+          ><font color="red">{{vm.message}}</font></b
+        >
+        <md-button
+          type="submit"
+          ng-click="vm.login()"
+          class="md-raised md-accent submit-button"
+          aria-label="LOGIN"
+          translate="LOGIN.LOG_IN"
+          translate-attr-aria-label="LOGIN.LOG_IN"
+        >
+          LOG IN
+        </md-button>
+      </form>
+
+      <md-progress-circular
+        ng-if="vm.progressLogin"
+        md-diameter="96"
+      ></md-progress-circular>
+
+      <div ng-if="vm.googleSsoEnabled" class="separator">
+        <span class="text" translate="LOGIN.OR">OR</span>
+      </div>
+
+      <md-button
+        ng-if="vm.googleSsoEnabled"
+        ng-click="vm.loginOauth('google')"
+        class="md-raised google"
+      >
+        <div layout="row" layout-align="center center">
+          <span>
+            <md-icon md-font-icon="fab fa-google" class="s16"></md-icon>
+            <span translate="LOGIN.WITH_GOOGLE">Log in with Google</span>
+          </span>
+        </div>
+      </md-button>
+    </div>
+  </div>
+</div>
diff --git a/public/src/js/modules/main/apps/analytics/views/extractedReports/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/analytics/views/extractedReports/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 2bbd845..0000000
--- a/public/src/js/modules/main/apps/analytics/views/extractedReports/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,155 +0,0 @@
-<md-dialog class="extractedReport-dialog" aria-label="New ExtractedReport">
-  <form name="extractedReportForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="ANALYTICS.REPORTNAME">ReportName</label>
-        <input
-          type=""
-          name="name"
-          ng-model="vm.extractedReport.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="extractedReportForm['name'].$error"
-          ng-show="extractedReportForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="ANALYTICS.ERRORS.REPORTNAME_REQUIRED"
-              >ReportName field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="ANALYTICS.NAME">Name</label>
-        <input
-          type=""
-          name="basename"
-          ng-model="vm.extractedReport.basename"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="extractedReportForm['basename'].$error"
-          ng-show="extractedReportForm['basename'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="ANALYTICS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newExtractedReport"
-          ng-click="vm.saveExtractedReport()"
-          class="send-button md-accent md-raised"
-          ng-disabled="extractedReportForm.$invalid || extractedReportForm.$pristine"
-          aria-label="SAVE"
-          translate="ANALYTICS.SAVE"
-          translate-attr-aria-label="ANALYTICS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newExtractedReport"
-          ng-click="vm.addNewExtractedReport()"
-          class="send-button md-accent md-raised"
-          ng-disabled="extractedReportForm.$invalid"
-          aria-label="ADD"
-          translate="ANALYTICS.ADD_EXTRACTEDREPORT"
-          translate-attr-aria-label="ANALYTICS.ADD_EXTRACTEDREPORT"
-        >
-          ADD EXTRACTEDREPORT
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newExtractedReport"
-          ng-click="vm.deleteExtractedReport($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="ANALYTICS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="ANALYTICS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/analytics/views/extractedReports/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/analytics/views/extractedReports/create/dialog.html/dialog.html
new file mode 100644
index 0000000..2bbd845
--- /dev/null
+++ b/public/src/js/modules/main/apps/analytics/views/extractedReports/create/dialog.html/dialog.html
@@ -0,0 +1,155 @@
+<md-dialog class="extractedReport-dialog" aria-label="New ExtractedReport">
+  <form name="extractedReportForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="ANALYTICS.REPORTNAME">ReportName</label>
+        <input
+          type=""
+          name="name"
+          ng-model="vm.extractedReport.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="extractedReportForm['name'].$error"
+          ng-show="extractedReportForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="ANALYTICS.ERRORS.REPORTNAME_REQUIRED"
+              >ReportName field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="ANALYTICS.NAME">Name</label>
+        <input
+          type=""
+          name="basename"
+          ng-model="vm.extractedReport.basename"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="extractedReportForm['basename'].$error"
+          ng-show="extractedReportForm['basename'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="ANALYTICS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newExtractedReport"
+          ng-click="vm.saveExtractedReport()"
+          class="send-button md-accent md-raised"
+          ng-disabled="extractedReportForm.$invalid || extractedReportForm.$pristine"
+          aria-label="SAVE"
+          translate="ANALYTICS.SAVE"
+          translate-attr-aria-label="ANALYTICS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newExtractedReport"
+          ng-click="vm.addNewExtractedReport()"
+          class="send-button md-accent md-raised"
+          ng-disabled="extractedReportForm.$invalid"
+          aria-label="ADD"
+          translate="ANALYTICS.ADD_EXTRACTEDREPORT"
+          translate-attr-aria-label="ANALYTICS.ADD_EXTRACTEDREPORT"
+        >
+          ADD EXTRACTEDREPORT
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newExtractedReport"
+          ng-click="vm.deleteExtractedReport($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="ANALYTICS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="ANALYTICS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/analytics/views/extractedReports/extractedReports.html/extractedReports-[chunkhash].html b/public/src/js/modules/main/apps/analytics/views/extractedReports/extractedReports.html/extractedReports-[chunkhash].html
deleted file mode 100644
index 140a82e..0000000
--- a/public/src/js/modules/main/apps/analytics/views/extractedReports/extractedReports.html/extractedReports-[chunkhash].html
+++ /dev/null
@@ -1,363 +0,0 @@
-<div
-  id="extractedReports"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-chart-line" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="ANALYTICS.EXTRACTEDREPORTS"
-          >ExtractedReports</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="ANALYTICS.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedExtractedReports.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div
-      class="close-button-wrapper"
-      ng-click="vm.selectedExtractedReports =[]"
-    >
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="ANALYTICS.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-extractedReports-count">
-          <span>{{vm.selectedExtractedReports.length}}</span>
-          <span translate="ANALYTICS.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="ANALYTICS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllExtractedReports()"
-                translate="ANALYTICS.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectExtractedReports()"
-                translate="ANALYTICS.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedExtractedReports"
-          csv-label="true"
-          filename="extractedReports.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedExtractedReports($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="ANALYTICS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- EXTRACTEDREPORT TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedExtractedReports"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getExtractedReports"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">
-                  {{ 'ANALYTICS.ID' | translate }}
-                </th>
-                <th md-column md-order-by="name">
-                  {{ 'ANALYTICS.REPORTNAME' | translate }}
-                </th>
-                <th md-column md-order-by="basename">
-                  {{ 'ANALYTICS.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="type">
-                  {{ 'ANALYTICS.TYPE' | translate }}
-                </th>
-                <th md-column md-order-by="startDate">
-                  {{ 'ANALYTICS.DATE_RANGE_FROM' | translate }}
-                </th>
-                <th md-column md-order-by="endDate">
-                  {{ 'ANALYTICS.DATE_RANGE_TO' | translate }}
-                </th>
-                <th md-column md-order-by="createdAt">
-                  {{ 'ANALYTICS.GENERATED_AT' | translate }}
-                </th>
-                <th md-column md-order-by="status">
-                  {{ 'ANALYTICS.STATUS' | translate }}
-                </th>
-                <th md-column md-order-by="output">
-                  {{ 'ANALYTICS.OUTPUT' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.extractedReports.rows.length">
-                <td md-cell colspan="10">
-                  <div layout="row" layout-align="center center">
-                    <span translate="ANALYTICS.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="extractedReport"
-                md-select-id="id"
-                ng-repeat="extractedReport in vm.extractedReports.rows"
-              >
-                <td md-cell ng-if="extractedReport.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{extractedReport.name}}"
-                    ng-src="api/users/{{extractedReport.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!extractedReport.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{extractedReport.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.createOrEditExtractedReport($event, extractedReport)"
-                  md-cell
-                  class="id"
-                >
-                  {{extractedReport.id}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditExtractedReport($event, extractedReport)"
-                  md-cell
-                  class="name"
-                >
-                  {{extractedReport.name}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditExtractedReport($event, extractedReport)"
-                  md-cell
-                  class="basename"
-                >
-                  {{extractedReport.basename}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditExtractedReport($event, extractedReport)"
-                  md-cell
-                  class="type"
-                >
-                  {{extractedReport.type}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditExtractedReport($event, extractedReport)"
-                  md-cell
-                  class="startDate"
-                >
-                  {{extractedReport.startDate | date:'medium' }}
-                </td>
-                <td
-                  ng-click="vm.createOrEditExtractedReport($event, extractedReport)"
-                  md-cell
-                  class="endDate"
-                >
-                  {{extractedReport.endDate | date:'medium' }}
-                </td>
-                <td
-                  ng-click="vm.createOrEditExtractedReport($event, extractedReport)"
-                  md-cell
-                  class="createdAt"
-                >
-                  {{extractedReport.createdAt | date:'medium' }}
-                </td>
-                <td
-                  ng-click="vm.createOrEditExtractedReport($event, extractedReport)"
-                  md-cell
-                  class="status"
-                >
-                  {{extractedReport.status}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditExtractedReport($event, extractedReport)"
-                  md-cell
-                  class="output"
-                >
-                  {{extractedReport.output}}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="ANALYTICS.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editdialog(extractedReport, $event    )"
-                          translate="ANALYTICS.EDIT_EXTRACTEDREPORT"
-                        >
-                          Edit ExtractedReport
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item
-                        ng-if="extractedReport.status == 'Completed'"
-                      >
-                        <md-button
-                          ng-click="vm.downloadfile2(extractedReport, $event  , 'analytics/extracted_reports'   )"
-                          translate="ANALYTICS.DOWNLOAD_EXTRACTEDREPORT"
-                        >
-                          Download ExtractedReport
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(extractedReport, $event    )"
-                          translate="ANALYTICS.DELETE_EXTRACTEDREPORT"
-                        >
-                          Delete ExtractedReport
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'ANALYTICS.PAGE' | translate}}:', rowsPerPage: '{{'ANALYTICS.ROWSPERPAGE' | translate}}:', of: '{{'ANALYTICS.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.extractedReports.count}}"
-          md-on-paginate="vm.getExtractedReports"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / EXTRACTEDREPORT TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- NO ADD BUTTON BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/analytics/views/extractedReports/extractedReports.html/extractedReports.html b/public/src/js/modules/main/apps/analytics/views/extractedReports/extractedReports.html/extractedReports.html
new file mode 100644
index 0000000..140a82e
--- /dev/null
+++ b/public/src/js/modules/main/apps/analytics/views/extractedReports/extractedReports.html/extractedReports.html
@@ -0,0 +1,363 @@
+<div
+  id="extractedReports"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-chart-line" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="ANALYTICS.EXTRACTEDREPORTS"
+          >ExtractedReports</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="ANALYTICS.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedExtractedReports.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div
+      class="close-button-wrapper"
+      ng-click="vm.selectedExtractedReports =[]"
+    >
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="ANALYTICS.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-extractedReports-count">
+          <span>{{vm.selectedExtractedReports.length}}</span>
+          <span translate="ANALYTICS.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="ANALYTICS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllExtractedReports()"
+                translate="ANALYTICS.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectExtractedReports()"
+                translate="ANALYTICS.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedExtractedReports"
+          csv-label="true"
+          filename="extractedReports.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedExtractedReports($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="ANALYTICS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- EXTRACTEDREPORT TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedExtractedReports"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getExtractedReports"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">
+                  {{ 'ANALYTICS.ID' | translate }}
+                </th>
+                <th md-column md-order-by="name">
+                  {{ 'ANALYTICS.REPORTNAME' | translate }}
+                </th>
+                <th md-column md-order-by="basename">
+                  {{ 'ANALYTICS.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="type">
+                  {{ 'ANALYTICS.TYPE' | translate }}
+                </th>
+                <th md-column md-order-by="startDate">
+                  {{ 'ANALYTICS.DATE_RANGE_FROM' | translate }}
+                </th>
+                <th md-column md-order-by="endDate">
+                  {{ 'ANALYTICS.DATE_RANGE_TO' | translate }}
+                </th>
+                <th md-column md-order-by="createdAt">
+                  {{ 'ANALYTICS.GENERATED_AT' | translate }}
+                </th>
+                <th md-column md-order-by="status">
+                  {{ 'ANALYTICS.STATUS' | translate }}
+                </th>
+                <th md-column md-order-by="output">
+                  {{ 'ANALYTICS.OUTPUT' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.extractedReports.rows.length">
+                <td md-cell colspan="10">
+                  <div layout="row" layout-align="center center">
+                    <span translate="ANALYTICS.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="extractedReport"
+                md-select-id="id"
+                ng-repeat="extractedReport in vm.extractedReports.rows"
+              >
+                <td md-cell ng-if="extractedReport.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{extractedReport.name}}"
+                    ng-src="api/users/{{extractedReport.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!extractedReport.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{extractedReport.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.createOrEditExtractedReport($event, extractedReport)"
+                  md-cell
+                  class="id"
+                >
+                  {{extractedReport.id}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditExtractedReport($event, extractedReport)"
+                  md-cell
+                  class="name"
+                >
+                  {{extractedReport.name}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditExtractedReport($event, extractedReport)"
+                  md-cell
+                  class="basename"
+                >
+                  {{extractedReport.basename}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditExtractedReport($event, extractedReport)"
+                  md-cell
+                  class="type"
+                >
+                  {{extractedReport.type}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditExtractedReport($event, extractedReport)"
+                  md-cell
+                  class="startDate"
+                >
+                  {{extractedReport.startDate | date:'medium' }}
+                </td>
+                <td
+                  ng-click="vm.createOrEditExtractedReport($event, extractedReport)"
+                  md-cell
+                  class="endDate"
+                >
+                  {{extractedReport.endDate | date:'medium' }}
+                </td>
+                <td
+                  ng-click="vm.createOrEditExtractedReport($event, extractedReport)"
+                  md-cell
+                  class="createdAt"
+                >
+                  {{extractedReport.createdAt | date:'medium' }}
+                </td>
+                <td
+                  ng-click="vm.createOrEditExtractedReport($event, extractedReport)"
+                  md-cell
+                  class="status"
+                >
+                  {{extractedReport.status}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditExtractedReport($event, extractedReport)"
+                  md-cell
+                  class="output"
+                >
+                  {{extractedReport.output}}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="ANALYTICS.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editdialog(extractedReport, $event    )"
+                          translate="ANALYTICS.EDIT_EXTRACTEDREPORT"
+                        >
+                          Edit ExtractedReport
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item
+                        ng-if="extractedReport.status == 'Completed'"
+                      >
+                        <md-button
+                          ng-click="vm.downloadfile2(extractedReport, $event  , 'analytics/extracted_reports'   )"
+                          translate="ANALYTICS.DOWNLOAD_EXTRACTEDREPORT"
+                        >
+                          Download ExtractedReport
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(extractedReport, $event    )"
+                          translate="ANALYTICS.DELETE_EXTRACTEDREPORT"
+                        >
+                          Delete ExtractedReport
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'ANALYTICS.PAGE' | translate}}:', rowsPerPage: '{{'ANALYTICS.ROWSPERPAGE' | translate}}:', of: '{{'ANALYTICS.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.extractedReports.count}}"
+          md-on-paginate="vm.getExtractedReports"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / EXTRACTEDREPORT TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- NO ADD BUTTON BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/analytics/views/metrics/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/analytics/views/metrics/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index cdfdf9d..0000000
--- a/public/src/js/modules/main/apps/analytics/views/metrics/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,295 +0,0 @@
-<md-dialog class="metric-dialog" aria-label="New Metric">
-  <form name="metricForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="ANALYTICS.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.metric.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="metricForm['name'].$error"
-          ng-show="metricForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="ANALYTICS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="ANALYTICS.TABLE">Table</label>
-        <md-select name="table" ng-model="vm.metric.table" required>
-          <md-option ng-value="'report_agent'">Agent Report</md-option>
-          <md-option ng-value="'report_call'">Call Report</md-option>
-          <md-option ng-value="'cdr'">CDR</md-option>
-          <md-option ng-value="'chat_websites'">Chat Website</md-option>
-          <md-option ng-value="'chat_interactions'">Chat Interaction</md-option>
-          <md-option ng-value="'chat_messages'">Chat Messages</md-option>
-          <md-option ng-value="'chat_offline_messages'"
-            >Chat Offline Messages</md-option
-          >
-          <md-option ng-value="'chat_queues'">Chat Queues</md-option>
-          <md-option ng-value="'report_chat_queue'"
-            >Chat Report Queue</md-option
-          >
-          <md-option ng-value="'report_chat_transfer'"
-            >Chat Report Transfer</md-option
-          >
-          <md-option ng-value="'cm_companies'">Companies</md-option>
-          <md-option ng-value="'cm_contacts'">Contacts</md-option>
-          <md-option ng-value="'report_square'">CSquare Report</md-option>
-          <md-option ng-value="'report_square_details'"
-            >CSquare Details Report</md-option
-          >
-          <md-option ng-value="'report_dial'">Dial Report</md-option>
-          <md-option ng-value="'cm_hopper'">Dialer Hopper Processing</md-option>
-          <md-option ng-value="'cm_hopper_history'"
-            >Dialer Hopper Logs</md-option
-          >
-          <md-option ng-value="'cm_hopper_final'"
-            >Dialer Hopper Final</md-option
-          >
-          <md-option ng-value="'mail_accounts'">Email Account</md-option>
-          <md-option ng-value="'mail_interactions'"
-            >Email Interaction</md-option
-          >
-          <md-option ng-value="'mail_messages'">Email Messages</md-option>
-          <md-option ng-value="'mail_queues'">Email Queues</md-option>
-          <md-option ng-value="'report_mail_queue'"
-            >Email Report Queue</md-option
-          >
-          <md-option ng-value="'report_mail_transfer'"
-            >Email Report Transfer</md-option
-          >
-          <md-option ng-value="'fax_accounts'">Fax Account</md-option>
-          <md-option ng-value="'fax_interactions'">Fax Interaction</md-option>
-          <md-option ng-value="'fax_messages'">Fax Messages</md-option>
-          <md-option ng-value="'fax_queues'">Fax Queues</md-option>
-          <md-option ng-value="'report_fax_queue'">Fax Report Queue</md-option>
-          <md-option ng-value="'report_fax_transfer'"
-            >Fax Report Transfer</md-option
-          >
-          <md-option ng-value="'report_jscripty_sessions'"
-            >Jscripty Sessions</md-option
-          >
-          <md-option ng-value="'report_jscripty_questions'"
-            >Jscripty Questions</md-option
-          >
-          <md-option ng-value="'report_jscripty_answers'"
-            >Jscripty Answers</md-option
-          >
-          <md-option ng-value="'cm_lists'">Lists</md-option>
-          <md-option ng-value="'report_member'">Member Report</md-option>
-          <md-option ng-value="'openchannel_accounts'"
-            >Openchannel Account</md-option
-          >
-          <md-option ng-value="'openchannel_interactions'"
-            >Openchannel Interaction</md-option
-          >
-          <md-option ng-value="'openchannel_messages'"
-            >Openchannel Messages</md-option
-          >
-          <md-option ng-value="'openchannel_queues'"
-            >Openchannel Queues</md-option
-          >
-          <md-option ng-value="'report_openchannel_queue'"
-            >Openchannel Report Queue</md-option
-          >
-          <md-option ng-value="'report_openchannel_transfer'"
-            >Openchannel Report Transfer</md-option
-          >
-          <md-option ng-value="'report_queue'">Queue Report</md-option>
-          <md-option ng-value="'sms_accounts'">SMS Account</md-option>
-          <md-option ng-value="'sms_interactions'">SMS Interaction</md-option>
-          <md-option ng-value="'sms_messages'">SMS Messages</md-option>
-          <md-option ng-value="'sms_queues'">SMS Queues</md-option>
-          <md-option ng-value="'report_sms_queue'">SMS Report Queue</md-option>
-          <md-option ng-value="'report_sms_transfer'"
-            >SMS Report Transfer</md-option
-          >
-          <md-option ng-value="'users'">Users</md-option>
-          <md-option ng-value="'voice_recordings'">Voice Recordings</md-option>
-          <md-option ng-value="'whatsapp_accounts'">Whatsapp Account</md-option>
-          <md-option ng-value="'whatsapp_interactions'"
-            >Whatsapp Interaction</md-option
-          >
-          <md-option ng-value="'whatsapp_messages'"
-            >Whatsapp Messages</md-option
-          >
-          <md-option ng-value="'whatsapp_queues'">Whatsapp Queues</md-option>
-          <md-option ng-value="'report_whatsapp_queue'"
-            >Whatsapp Report Queue</md-option
-          >
-          <md-option ng-value="'report_whatsapp_transfer'"
-            >Whatsapp Report Transfer</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="metricForm['table'].$error"
-          ng-show="metricForm['table'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="ANALYTICS.ERRORS.TABLE_REQUIRED"
-              >Table field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="ANALYTICS.METRIC">Metric</label>
-        <input
-          type="text"
-          name="metric"
-          ng-model="vm.metric.metric"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="metricForm['metric'].$error"
-          ng-show="metricForm['metric'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="ANALYTICS.ERRORS.METRIC_REQUIRED"
-              >Metric field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="ANALYTICS.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.metric.description"
-        />
-
-        <div
-          ng-messages="metricForm['description'].$error"
-          ng-show="metricForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="ANALYTICS.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newMetric"
-          ng-click="vm.saveMetric()"
-          class="send-button md-accent md-raised"
-          ng-disabled="metricForm.$invalid || metricForm.$pristine"
-          aria-label="SAVE"
-          translate="ANALYTICS.SAVE"
-          translate-attr-aria-label="ANALYTICS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newMetric"
-          ng-click="vm.addNewMetric()"
-          class="send-button md-accent md-raised"
-          ng-disabled="metricForm.$invalid"
-          aria-label="ADD"
-          translate="ANALYTICS.ADD_METRIC"
-          translate-attr-aria-label="ANALYTICS.ADD_METRIC"
-        >
-          ADD METRIC
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newMetric"
-          ng-click="vm.deleteMetric($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="ANALYTICS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="ANALYTICS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/analytics/views/metrics/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/analytics/views/metrics/create/dialog.html/dialog.html
new file mode 100644
index 0000000..cdfdf9d
--- /dev/null
+++ b/public/src/js/modules/main/apps/analytics/views/metrics/create/dialog.html/dialog.html
@@ -0,0 +1,295 @@
+<md-dialog class="metric-dialog" aria-label="New Metric">
+  <form name="metricForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="ANALYTICS.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.metric.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="metricForm['name'].$error"
+          ng-show="metricForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="ANALYTICS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="ANALYTICS.TABLE">Table</label>
+        <md-select name="table" ng-model="vm.metric.table" required>
+          <md-option ng-value="'report_agent'">Agent Report</md-option>
+          <md-option ng-value="'report_call'">Call Report</md-option>
+          <md-option ng-value="'cdr'">CDR</md-option>
+          <md-option ng-value="'chat_websites'">Chat Website</md-option>
+          <md-option ng-value="'chat_interactions'">Chat Interaction</md-option>
+          <md-option ng-value="'chat_messages'">Chat Messages</md-option>
+          <md-option ng-value="'chat_offline_messages'"
+            >Chat Offline Messages</md-option
+          >
+          <md-option ng-value="'chat_queues'">Chat Queues</md-option>
+          <md-option ng-value="'report_chat_queue'"
+            >Chat Report Queue</md-option
+          >
+          <md-option ng-value="'report_chat_transfer'"
+            >Chat Report Transfer</md-option
+          >
+          <md-option ng-value="'cm_companies'">Companies</md-option>
+          <md-option ng-value="'cm_contacts'">Contacts</md-option>
+          <md-option ng-value="'report_square'">CSquare Report</md-option>
+          <md-option ng-value="'report_square_details'"
+            >CSquare Details Report</md-option
+          >
+          <md-option ng-value="'report_dial'">Dial Report</md-option>
+          <md-option ng-value="'cm_hopper'">Dialer Hopper Processing</md-option>
+          <md-option ng-value="'cm_hopper_history'"
+            >Dialer Hopper Logs</md-option
+          >
+          <md-option ng-value="'cm_hopper_final'"
+            >Dialer Hopper Final</md-option
+          >
+          <md-option ng-value="'mail_accounts'">Email Account</md-option>
+          <md-option ng-value="'mail_interactions'"
+            >Email Interaction</md-option
+          >
+          <md-option ng-value="'mail_messages'">Email Messages</md-option>
+          <md-option ng-value="'mail_queues'">Email Queues</md-option>
+          <md-option ng-value="'report_mail_queue'"
+            >Email Report Queue</md-option
+          >
+          <md-option ng-value="'report_mail_transfer'"
+            >Email Report Transfer</md-option
+          >
+          <md-option ng-value="'fax_accounts'">Fax Account</md-option>
+          <md-option ng-value="'fax_interactions'">Fax Interaction</md-option>
+          <md-option ng-value="'fax_messages'">Fax Messages</md-option>
+          <md-option ng-value="'fax_queues'">Fax Queues</md-option>
+          <md-option ng-value="'report_fax_queue'">Fax Report Queue</md-option>
+          <md-option ng-value="'report_fax_transfer'"
+            >Fax Report Transfer</md-option
+          >
+          <md-option ng-value="'report_jscripty_sessions'"
+            >Jscripty Sessions</md-option
+          >
+          <md-option ng-value="'report_jscripty_questions'"
+            >Jscripty Questions</md-option
+          >
+          <md-option ng-value="'report_jscripty_answers'"
+            >Jscripty Answers</md-option
+          >
+          <md-option ng-value="'cm_lists'">Lists</md-option>
+          <md-option ng-value="'report_member'">Member Report</md-option>
+          <md-option ng-value="'openchannel_accounts'"
+            >Openchannel Account</md-option
+          >
+          <md-option ng-value="'openchannel_interactions'"
+            >Openchannel Interaction</md-option
+          >
+          <md-option ng-value="'openchannel_messages'"
+            >Openchannel Messages</md-option
+          >
+          <md-option ng-value="'openchannel_queues'"
+            >Openchannel Queues</md-option
+          >
+          <md-option ng-value="'report_openchannel_queue'"
+            >Openchannel Report Queue</md-option
+          >
+          <md-option ng-value="'report_openchannel_transfer'"
+            >Openchannel Report Transfer</md-option
+          >
+          <md-option ng-value="'report_queue'">Queue Report</md-option>
+          <md-option ng-value="'sms_accounts'">SMS Account</md-option>
+          <md-option ng-value="'sms_interactions'">SMS Interaction</md-option>
+          <md-option ng-value="'sms_messages'">SMS Messages</md-option>
+          <md-option ng-value="'sms_queues'">SMS Queues</md-option>
+          <md-option ng-value="'report_sms_queue'">SMS Report Queue</md-option>
+          <md-option ng-value="'report_sms_transfer'"
+            >SMS Report Transfer</md-option
+          >
+          <md-option ng-value="'users'">Users</md-option>
+          <md-option ng-value="'voice_recordings'">Voice Recordings</md-option>
+          <md-option ng-value="'whatsapp_accounts'">Whatsapp Account</md-option>
+          <md-option ng-value="'whatsapp_interactions'"
+            >Whatsapp Interaction</md-option
+          >
+          <md-option ng-value="'whatsapp_messages'"
+            >Whatsapp Messages</md-option
+          >
+          <md-option ng-value="'whatsapp_queues'">Whatsapp Queues</md-option>
+          <md-option ng-value="'report_whatsapp_queue'"
+            >Whatsapp Report Queue</md-option
+          >
+          <md-option ng-value="'report_whatsapp_transfer'"
+            >Whatsapp Report Transfer</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="metricForm['table'].$error"
+          ng-show="metricForm['table'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="ANALYTICS.ERRORS.TABLE_REQUIRED"
+              >Table field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="ANALYTICS.METRIC">Metric</label>
+        <input
+          type="text"
+          name="metric"
+          ng-model="vm.metric.metric"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="metricForm['metric'].$error"
+          ng-show="metricForm['metric'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="ANALYTICS.ERRORS.METRIC_REQUIRED"
+              >Metric field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="ANALYTICS.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.metric.description"
+        />
+
+        <div
+          ng-messages="metricForm['description'].$error"
+          ng-show="metricForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="ANALYTICS.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newMetric"
+          ng-click="vm.saveMetric()"
+          class="send-button md-accent md-raised"
+          ng-disabled="metricForm.$invalid || metricForm.$pristine"
+          aria-label="SAVE"
+          translate="ANALYTICS.SAVE"
+          translate-attr-aria-label="ANALYTICS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newMetric"
+          ng-click="vm.addNewMetric()"
+          class="send-button md-accent md-raised"
+          ng-disabled="metricForm.$invalid"
+          aria-label="ADD"
+          translate="ANALYTICS.ADD_METRIC"
+          translate-attr-aria-label="ANALYTICS.ADD_METRIC"
+        >
+          ADD METRIC
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newMetric"
+          ng-click="vm.deleteMetric($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="ANALYTICS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="ANALYTICS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/analytics/views/metrics/metrics.html/metrics-[chunkhash].html b/public/src/js/modules/main/apps/analytics/views/metrics/metrics.html/metrics-[chunkhash].html
deleted file mode 100644
index 6f02354..0000000
--- a/public/src/js/modules/main/apps/analytics/views/metrics/metrics.html/metrics-[chunkhash].html
+++ /dev/null
@@ -1,309 +0,0 @@
-<div
-  id="metrics"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-chart-line" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="ANALYTICS.METRICS">Metrics</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="ANALYTICS.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedMetrics.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedMetrics =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="ANALYTICS.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-metrics-count">
-          <span>{{vm.selectedMetrics.length}}</span>
-          <span translate="ANALYTICS.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="ANALYTICS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllMetrics()"
-                translate="ANALYTICS.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectMetrics()"
-                translate="ANALYTICS.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedMetrics"
-          csv-label="true"
-          filename="metrics.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedMetrics($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="ANALYTICS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- METRIC TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedMetrics"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getMetrics"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">
-                  {{ 'ANALYTICS.ID' | translate }}
-                </th>
-                <th md-column md-order-by="name">
-                  {{ 'ANALYTICS.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="table">
-                  {{ 'ANALYTICS.TABLE' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'ANALYTICS.DESCRIPTION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.metrics.rows.length">
-                <td md-cell colspan="5">
-                  <div layout="row" layout-align="center center">
-                    <span translate="ANALYTICS.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="metric"
-                md-select-id="id"
-                ng-repeat="metric in vm.metrics.rows"
-              >
-                <td md-cell ng-if="metric.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{metric.name}}"
-                    ng-src="api/users/{{metric.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!metric.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{metric.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.createOrEditMetric($event, metric)"
-                  md-cell
-                  class="id"
-                >
-                  {{metric.id}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditMetric($event, metric)"
-                  md-cell
-                  class="name"
-                >
-                  {{metric.name}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditMetric($event, metric)"
-                  md-cell
-                  class="table"
-                >
-                  {{ vm.arraytable[metric.table].option }}
-                </td>
-                <td
-                  ng-click="vm.createOrEditMetric($event, metric)"
-                  md-cell
-                  class="description"
-                >
-                  {{metric.description}}
-                </td>
-
-                <td
-                  md-cell
-                  class="actions"
-                  ng-if="!vm.crudPermissions.readOnly"
-                >
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="ANALYTICS.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editdialog(metric, $event    )"
-                          translate="ANALYTICS.EDIT_METRIC"
-                        >
-                          Edit Metric
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(metric, $event    )"
-                          translate="ANALYTICS.DELETE_METRIC"
-                        >
-                          Delete Metric
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'ANALYTICS.PAGE' | translate}}:', rowsPerPage: '{{'ANALYTICS.ROWSPERPAGE' | translate}}:', of: '{{'ANALYTICS.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.metrics.count}}"
-          md-on-paginate="vm.getMetrics"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / METRIC TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD METRIC BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-metric-button"
-    ng-click="vm.createOrEditMetric($event)"
-    aria-label="add metric"
-    translate
-    translate-attr-aria-label="ANALYTICS.ADD_METRIC"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD METRIC BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/analytics/views/metrics/metrics.html/metrics.html b/public/src/js/modules/main/apps/analytics/views/metrics/metrics.html/metrics.html
new file mode 100644
index 0000000..6f02354
--- /dev/null
+++ b/public/src/js/modules/main/apps/analytics/views/metrics/metrics.html/metrics.html
@@ -0,0 +1,309 @@
+<div
+  id="metrics"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-chart-line" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="ANALYTICS.METRICS">Metrics</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="ANALYTICS.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedMetrics.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedMetrics =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="ANALYTICS.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-metrics-count">
+          <span>{{vm.selectedMetrics.length}}</span>
+          <span translate="ANALYTICS.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="ANALYTICS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllMetrics()"
+                translate="ANALYTICS.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectMetrics()"
+                translate="ANALYTICS.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedMetrics"
+          csv-label="true"
+          filename="metrics.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedMetrics($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="ANALYTICS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- METRIC TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedMetrics"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getMetrics"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">
+                  {{ 'ANALYTICS.ID' | translate }}
+                </th>
+                <th md-column md-order-by="name">
+                  {{ 'ANALYTICS.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="table">
+                  {{ 'ANALYTICS.TABLE' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'ANALYTICS.DESCRIPTION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.metrics.rows.length">
+                <td md-cell colspan="5">
+                  <div layout="row" layout-align="center center">
+                    <span translate="ANALYTICS.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="metric"
+                md-select-id="id"
+                ng-repeat="metric in vm.metrics.rows"
+              >
+                <td md-cell ng-if="metric.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{metric.name}}"
+                    ng-src="api/users/{{metric.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!metric.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{metric.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.createOrEditMetric($event, metric)"
+                  md-cell
+                  class="id"
+                >
+                  {{metric.id}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditMetric($event, metric)"
+                  md-cell
+                  class="name"
+                >
+                  {{metric.name}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditMetric($event, metric)"
+                  md-cell
+                  class="table"
+                >
+                  {{ vm.arraytable[metric.table].option }}
+                </td>
+                <td
+                  ng-click="vm.createOrEditMetric($event, metric)"
+                  md-cell
+                  class="description"
+                >
+                  {{metric.description}}
+                </td>
+
+                <td
+                  md-cell
+                  class="actions"
+                  ng-if="!vm.crudPermissions.readOnly"
+                >
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="ANALYTICS.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editdialog(metric, $event    )"
+                          translate="ANALYTICS.EDIT_METRIC"
+                        >
+                          Edit Metric
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(metric, $event    )"
+                          translate="ANALYTICS.DELETE_METRIC"
+                        >
+                          Delete Metric
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'ANALYTICS.PAGE' | translate}}:', rowsPerPage: '{{'ANALYTICS.ROWSPERPAGE' | translate}}:', of: '{{'ANALYTICS.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.metrics.count}}"
+          md-on-paginate="vm.getMetrics"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / METRIC TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD METRIC BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-metric-button"
+    ng-click="vm.createOrEditMetric($event)"
+    aria-label="add metric"
+    translate
+    translate-attr-aria-label="ANALYTICS.ADD_METRIC"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD METRIC BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/analytics/views/reports/copy/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/analytics/views/reports/copy/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 53f9fb2..0000000
--- a/public/src/js/modules/main/apps/analytics/views/reports/copy/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,102 +0,0 @@
-<md-dialog class="report-dialog" aria-label="Run Report">
-  <form name="reportForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title" translate="ANALYTICS.COPY_REPORT">Copy Report</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="ANALYTICS.NAME">Name</label>
-        <input name="name" ng-model="vm.report.name" required md-autofocus />
-        <div
-          ng-messages="reportForm.name.$error"
-          ng-show="reportForm.name.$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="ANALYTICS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <div class="md-block">
-        <label translate="ANALYTICS.SELECT_NODE">Select Node</label>
-        <div
-          js-tree="vm.treeCustomConfig"
-          tree-events-obj="vm.treeCustomEvents"
-          ng-model="vm.treeCustomData"
-          tree="vm.treeCustomInstance"
-        ></div>
-      </div>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-click="vm.copyReport()"
-          class="send-button md-accent md-raised"
-          ng-disabled="!vm.currentNode"
-          aria-label="COPY"
-          translate="ANALYTICS.COPY_REPORT"
-          translate-attr-aria-label="ANALYTICS.COPY_REPORT"
-        >
-          COPY REPORT
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/analytics/views/reports/copy/dialog.html/dialog.html b/public/src/js/modules/main/apps/analytics/views/reports/copy/dialog.html/dialog.html
new file mode 100644
index 0000000..53f9fb2
--- /dev/null
+++ b/public/src/js/modules/main/apps/analytics/views/reports/copy/dialog.html/dialog.html
@@ -0,0 +1,102 @@
+<md-dialog class="report-dialog" aria-label="Run Report">
+  <form name="reportForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title" translate="ANALYTICS.COPY_REPORT">Copy Report</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="ANALYTICS.NAME">Name</label>
+        <input name="name" ng-model="vm.report.name" required md-autofocus />
+        <div
+          ng-messages="reportForm.name.$error"
+          ng-show="reportForm.name.$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="ANALYTICS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <div class="md-block">
+        <label translate="ANALYTICS.SELECT_NODE">Select Node</label>
+        <div
+          js-tree="vm.treeCustomConfig"
+          tree-events-obj="vm.treeCustomEvents"
+          ng-model="vm.treeCustomData"
+          tree="vm.treeCustomInstance"
+        ></div>
+      </div>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-click="vm.copyReport()"
+          class="send-button md-accent md-raised"
+          ng-disabled="!vm.currentNode"
+          aria-label="COPY"
+          translate="ANALYTICS.COPY_REPORT"
+          translate-attr-aria-label="ANALYTICS.COPY_REPORT"
+        >
+          COPY REPORT
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/analytics/views/reports/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/analytics/views/reports/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index d43c1ba..0000000
--- a/public/src/js/modules/main/apps/analytics/views/reports/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,250 +0,0 @@
-<md-dialog class="report-dialog" aria-label="New Report">
-  <form name="reportForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="ANALYTICS.NAME">Name</label>
-        <input
-          type=""
-          name="name"
-          ng-model="vm.report.name"
-          required
-          md-autofocus
-        />
-        <div
-          ng-messages="reportForm.name.$error"
-          ng-show="reportForm.name.$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="ANALYTICS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block" ng-if="vm.newReport">
-        <label translate="ANALYTICS.TABLE">Table</label>
-        <md-select ng-model="vm.report.table" required>
-          <md-option
-            ng-repeat="table in vm.tables | orderBy:'name'"
-            ng-value="table.name"
-            >{{table.name}}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="reportForm.table.$error"
-          ng-show="reportForm.table.$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="ANALYTICS.ERRORS.TABLE_REQUIRED"
-              >Table field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="ANALYTICS.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.report.description"
-        />
-        <div
-          ng-messages="reportForm.description.$error"
-          ng-show="reportForm.description.$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="ANALYTICS.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <md-autocomplete
-        ng-if="vm.newReport"
-        md-selected-item="vm.selectedItem"
-        md-search-text="vm.searchText"
-        md-items="table in vm.tables | filter:vm.searchText"
-        md-item-text="table.name"
-        md-min-length="0"
-        md-selected-item-change="vm.selectedTableChange(table)"
-        placeholder="Select the table to Join"
-      >
-        <md-item-template>
-          <span md-highlight-text="vm.searchText" md-highlight-flags="^i"
-            >{{table.name}}</span
-          >
-        </md-item-template>
-        <md-not-found>
-          No states matching "{{vm.searchText}}" were found.
-        </md-not-found>
-      </md-autocomplete>
-
-      <md-card
-        ng-if="vm.newReport"
-        md-theme="default"
-        md-theme-watch
-        ng-repeat="table in vm.joinTables"
-      >
-        <md-card-title>
-          <md-card-title-text layout="row">
-            <div layout="row" flex="50">
-              <span class="md-subhead">{{table.name}}</span>
-            </div>
-            <div layout="row" layout-align="end center" flex>
-              <md-button
-                class="md-icon-button"
-                ng-click="vm.removeJoin($index)"
-              >
-                <md-icon
-                  md-font-icon="icon-delete"
-                  aria-label="alert error"
-                ></md-icon>
-              </md-button>
-            </div>
-          </md-card-title-text>
-        </md-card-title>
-        <md-card-content>
-          <md-select
-            ng-model="table.parentKey"
-            placeholder="Select the parent key"
-            ng-init="table.parentFields = []; vm.getFields(table, 'parentFields', vm.report.table)"
-            required
-          >
-            <md-option ng-repeat="field in table.parentFields" ng-value="field"
-              >{{field}}</md-option
-            >
-          </md-select>
-          <md-select
-            ng-model="table.foreignKey"
-            placeholder="Select the foreign key"
-            ng-init="table.foreignFields = []; vm.getFields(table, 'foreignFields', table.name)"
-            required
-          >
-            <md-option ng-repeat="field in table.foreignFields" ng-value="field"
-              >{{field}}</md-option
-            >
-          </md-select>
-          <md-select
-            ng-model="table.type"
-            placeholder="Select join type"
-            required
-          >
-            <md-option ng-repeat="join in vm.joinTypes" ng-value="join.key"
-              >{{join.value}}</md-option
-            >
-          </md-select>
-        </md-card-content>
-      </md-card>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-if="!vm.newReport"
-          ng-click="vm.saveReport()"
-          class="send-button md-accent md-raised"
-          ng-disabled="reportForm.$invalid || reportForm.$pristine"
-          aria-label="SAVE"
-          translate="ANALYTICS.SAVE"
-          translate-attr-aria-label="ANALYTICS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.newReport"
-          ng-click="vm.addNewReport()"
-          class="send-button md-accent md-raised"
-          ng-disabled="reportForm.$invalid || reportForm.$pristine"
-          aria-label="ADD"
-          translate="ANALYTICS.ADD_REPORT"
-          translate-attr-aria-label="ANALYTICS.ADD_REPORT"
-        >
-          ADD REPORT
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newReport"
-          ng-click="vm.deleteReport($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="ANALYTICS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="ANALYTICS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/analytics/views/reports/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/analytics/views/reports/create/dialog.html/dialog.html
new file mode 100644
index 0000000..d43c1ba
--- /dev/null
+++ b/public/src/js/modules/main/apps/analytics/views/reports/create/dialog.html/dialog.html
@@ -0,0 +1,250 @@
+<md-dialog class="report-dialog" aria-label="New Report">
+  <form name="reportForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="ANALYTICS.NAME">Name</label>
+        <input
+          type=""
+          name="name"
+          ng-model="vm.report.name"
+          required
+          md-autofocus
+        />
+        <div
+          ng-messages="reportForm.name.$error"
+          ng-show="reportForm.name.$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="ANALYTICS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block" ng-if="vm.newReport">
+        <label translate="ANALYTICS.TABLE">Table</label>
+        <md-select ng-model="vm.report.table" required>
+          <md-option
+            ng-repeat="table in vm.tables | orderBy:'name'"
+            ng-value="table.name"
+            >{{table.name}}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="reportForm.table.$error"
+          ng-show="reportForm.table.$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="ANALYTICS.ERRORS.TABLE_REQUIRED"
+              >Table field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="ANALYTICS.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.report.description"
+        />
+        <div
+          ng-messages="reportForm.description.$error"
+          ng-show="reportForm.description.$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="ANALYTICS.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <md-autocomplete
+        ng-if="vm.newReport"
+        md-selected-item="vm.selectedItem"
+        md-search-text="vm.searchText"
+        md-items="table in vm.tables | filter:vm.searchText"
+        md-item-text="table.name"
+        md-min-length="0"
+        md-selected-item-change="vm.selectedTableChange(table)"
+        placeholder="Select the table to Join"
+      >
+        <md-item-template>
+          <span md-highlight-text="vm.searchText" md-highlight-flags="^i"
+            >{{table.name}}</span
+          >
+        </md-item-template>
+        <md-not-found>
+          No states matching "{{vm.searchText}}" were found.
+        </md-not-found>
+      </md-autocomplete>
+
+      <md-card
+        ng-if="vm.newReport"
+        md-theme="default"
+        md-theme-watch
+        ng-repeat="table in vm.joinTables"
+      >
+        <md-card-title>
+          <md-card-title-text layout="row">
+            <div layout="row" flex="50">
+              <span class="md-subhead">{{table.name}}</span>
+            </div>
+            <div layout="row" layout-align="end center" flex>
+              <md-button
+                class="md-icon-button"
+                ng-click="vm.removeJoin($index)"
+              >
+                <md-icon
+                  md-font-icon="icon-delete"
+                  aria-label="alert error"
+                ></md-icon>
+              </md-button>
+            </div>
+          </md-card-title-text>
+        </md-card-title>
+        <md-card-content>
+          <md-select
+            ng-model="table.parentKey"
+            placeholder="Select the parent key"
+            ng-init="table.parentFields = []; vm.getFields(table, 'parentFields', vm.report.table)"
+            required
+          >
+            <md-option ng-repeat="field in table.parentFields" ng-value="field"
+              >{{field}}</md-option
+            >
+          </md-select>
+          <md-select
+            ng-model="table.foreignKey"
+            placeholder="Select the foreign key"
+            ng-init="table.foreignFields = []; vm.getFields(table, 'foreignFields', table.name)"
+            required
+          >
+            <md-option ng-repeat="field in table.foreignFields" ng-value="field"
+              >{{field}}</md-option
+            >
+          </md-select>
+          <md-select
+            ng-model="table.type"
+            placeholder="Select join type"
+            required
+          >
+            <md-option ng-repeat="join in vm.joinTypes" ng-value="join.key"
+              >{{join.value}}</md-option
+            >
+          </md-select>
+        </md-card-content>
+      </md-card>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-if="!vm.newReport"
+          ng-click="vm.saveReport()"
+          class="send-button md-accent md-raised"
+          ng-disabled="reportForm.$invalid || reportForm.$pristine"
+          aria-label="SAVE"
+          translate="ANALYTICS.SAVE"
+          translate-attr-aria-label="ANALYTICS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.newReport"
+          ng-click="vm.addNewReport()"
+          class="send-button md-accent md-raised"
+          ng-disabled="reportForm.$invalid || reportForm.$pristine"
+          aria-label="ADD"
+          translate="ANALYTICS.ADD_REPORT"
+          translate-attr-aria-label="ANALYTICS.ADD_REPORT"
+        >
+          ADD REPORT
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newReport"
+          ng-click="vm.deleteReport($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="ANALYTICS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="ANALYTICS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/analytics/views/reports/edit/field/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/analytics/views/reports/edit/field/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index af1b1b4..0000000
--- a/public/src/js/modules/main/apps/analytics/views/reports/edit/field/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,278 +0,0 @@
-<md-dialog class="reportField-dialog" aria-label="New Report Field">
-  <form name="reportFieldForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{vm.title}}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <pre></pre>
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="ANALYTICS.TYPE">Type</label>
-        <md-select
-          name="type"
-          ng-model="vm.reportField.type"
-          ng-change="vm.reportField.field = undefined"
-          required
-        >
-          <md-option value="column">Select a column</md-option>
-          <md-option value="metric">Select an existing metric</md-option>
-          <md-option value="custom">Write a custom metric</md-option>
-        </md-select>
-        <div
-          ng-messages="reportForm.type.$error"
-          ng-show="reportForm.type.$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="ANALYTICS.ERRORS.TYPE_REQUIRED"
-              >Type field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <div ng-switch on="vm.reportField.type">
-        <md-input-container class="md-block" ng-switch-when="column">
-          <label translate="ANALYTICS.COLUMN">Column Name</label>
-          <md-select name="column" ng-model="vm.reportField.field" required>
-            <md-optgroup label="{{vm.report.table}}">
-              <md-option
-                ng-repeat="column in vm.columns"
-                value="{{vm.report.table}}.{{column}}"
-                >{{column}}</md-option
-              >
-              <!-- <md-option ng-repeat="column in vm.columns" ng-value="">{{column}}</md-option> -->
-            </md-optgroup>
-            <md-optgroup
-              ng-if="vm.report.joins"
-              ng-repeat="join in vm.report.joins"
-              label="{{join.foreignTable}}"
-            >
-              <md-option
-                ng-repeat="field in join.foreignTableFields"
-                value="{{join.foreignTable}}.{{field}}"
-                >{{field}}</md-option
-              >
-            </md-optgroup>
-          </md-select>
-          <div
-            ng-messages="reportForm.column.$error"
-            ng-show="reportForm.column.$touched"
-            role="alert"
-          >
-            <div ng-message="required">
-              <span translate="ANALYTICS.ERRORS.COLUMN_REQUIRED"
-                >Column field is required</span
-              >
-            </div>
-          </div>
-        </md-input-container>
-        <md-input-container class="md-block" ng-switch-when="metric">
-          <label translate="ANALYTICS.METRIC_NAME">Metric Name</label>
-          <md-select name="metric" ng-model="vm.reportField.MetricId" required>
-            <md-option ng-repeat="metric in vm.metrics" ng-value="metric.id"
-              >{{metric.name}}</md-option
-            >
-          </md-select>
-          <div
-            ng-messages="reportForm.metric.$error"
-            ng-show="reportForm.metric.$touched"
-            role="alert"
-          >
-            <div ng-message="required">
-              <span translate="ANALYTICS.ERRORS.METRIC_REQUIRED"
-                >Metric field is required</span
-              >
-            </div>
-          </div>
-        </md-input-container>
-        <md-input-container class="md-block" ng-switch-when="custom">
-          <label translate="ANALYTICS.CUSTOM_METRIC">Custom Metric</label>
-          <input
-            type="text"
-            name="field"
-            ng-model="vm.reportField.field"
-            required
-            md-autofocus
-          />
-          <div
-            ng-messages="reportFieldForm.field.$error"
-            ng-show="reportFieldForm.field.$touched"
-            role="alert"
-          >
-            <div ng-message="required">
-              <span translate="ANALYTICS.ERRORS.CUSTOM_METRIC_REQUIRED"
-                >Custom Metric field is required</span
-              >
-            </div>
-          </div>
-        </md-input-container>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="ANALYTICS.ALIAS">Alias</label>
-        <input
-          type="text"
-          name="alias"
-          ng-model="vm.reportField.alias"
-          ng-required="vm.reportField.type === 'custom' || vm.reportField.type === 'metric'"
-        />
-        <div
-          ng-messages="reportFieldForm.alias.$error"
-          ng-show="reportFieldForm.alias.$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="ANALYTICS.ERRORS.ALIAS_REQUIRED"
-              >Alias field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        class="md-block"
-        ng-if="vm.reportField.type !== 'metric'"
-      >
-        <label translate="ANALYTICS.FUNCTION">Function</label>
-        <md-select name="function" ng-model="vm.reportField.function">
-          <md-option ng-value="null">No Function</md-option>
-          <md-option
-            ng-repeat="function in vm.sqlUtil.getFunctions"
-            ng-value="function.value"
-            >{{function.value}}</md-option
-          >
-        </md-select>
-      </md-input-container>
-      <md-input-container
-        class="md-block"
-        ng-if="vm.reportField.type !== 'metric'"
-      >
-        <label translate="ANALYTICS.FORMAT">Format</label>
-        <md-select name="format" ng-model="vm.reportField.format">
-          <md-option ng-value="null">No Format</md-option>
-          <md-option
-            ng-repeat="format in vm.sqlUtil.getFormats"
-            ng-value="format.value"
-            >{{format.value}}</md-option
-          >
-        </md-select>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="ANALYTICS.GROUP_BY">Group By</label>
-        <md-select name="groupBy" ng-model="vm.reportField.groupBy">
-          <md-option ng-repeat="gb in vm.sqlUtil.getGroupBy" ng-value="gb.value"
-            >{{gb.value ? 'Yes' : 'No'}}</md-option
-          >
-        </md-select>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="ANALYTICS.ORDER_BY">Order By</label>
-        <md-select name="orderBy" ng-model="vm.reportField.orderBy">
-          <md-option ng-value="null">No Order</md-option>
-          <md-option ng-repeat="ob in vm.sqlUtil.getOrderBy" ng-value="ob.value"
-            >{{ob.value}}</md-option
-          >
-        </md-select>
-      </md-input-container>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-if="!vm.newReportField"
-          ng-click="vm.saveReportField()"
-          class="send-button md-accent md-raised"
-          ng-disabled="reportFieldForm.$invalid || reportFieldForm.$pristine"
-          aria-label="SAVE"
-          translate="ANALYTICS.SAVE"
-          translate-attr-aria-label="ANALYTICS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.newReportField"
-          ng-click="vm.addNewReportField()"
-          class="send-button md-accent md-raised"
-          ng-disabled="reportFieldForm.$invalid || reportFieldForm.$pristine"
-          aria-label="ADD"
-          translate="ANALYTICS.ADD_REPORTFIELD"
-          translate-attr-aria-label="ANALYTICS.ADD_REPORTFIELD"
-        >
-          ADD REPORT FIELD
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newReportField"
-          ng-click="vm.deleteReportField($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="ANALYTICS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="ANALYTICS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/analytics/views/reports/edit/field/dialog.html/dialog.html b/public/src/js/modules/main/apps/analytics/views/reports/edit/field/dialog.html/dialog.html
new file mode 100644
index 0000000..af1b1b4
--- /dev/null
+++ b/public/src/js/modules/main/apps/analytics/views/reports/edit/field/dialog.html/dialog.html
@@ -0,0 +1,278 @@
+<md-dialog class="reportField-dialog" aria-label="New Report Field">
+  <form name="reportFieldForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{vm.title}}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <pre></pre>
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="ANALYTICS.TYPE">Type</label>
+        <md-select
+          name="type"
+          ng-model="vm.reportField.type"
+          ng-change="vm.reportField.field = undefined"
+          required
+        >
+          <md-option value="column">Select a column</md-option>
+          <md-option value="metric">Select an existing metric</md-option>
+          <md-option value="custom">Write a custom metric</md-option>
+        </md-select>
+        <div
+          ng-messages="reportForm.type.$error"
+          ng-show="reportForm.type.$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="ANALYTICS.ERRORS.TYPE_REQUIRED"
+              >Type field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <div ng-switch on="vm.reportField.type">
+        <md-input-container class="md-block" ng-switch-when="column">
+          <label translate="ANALYTICS.COLUMN">Column Name</label>
+          <md-select name="column" ng-model="vm.reportField.field" required>
+            <md-optgroup label="{{vm.report.table}}">
+              <md-option
+                ng-repeat="column in vm.columns"
+                value="{{vm.report.table}}.{{column}}"
+                >{{column}}</md-option
+              >
+              <!-- <md-option ng-repeat="column in vm.columns" ng-value="">{{column}}</md-option> -->
+            </md-optgroup>
+            <md-optgroup
+              ng-if="vm.report.joins"
+              ng-repeat="join in vm.report.joins"
+              label="{{join.foreignTable}}"
+            >
+              <md-option
+                ng-repeat="field in join.foreignTableFields"
+                value="{{join.foreignTable}}.{{field}}"
+                >{{field}}</md-option
+              >
+            </md-optgroup>
+          </md-select>
+          <div
+            ng-messages="reportForm.column.$error"
+            ng-show="reportForm.column.$touched"
+            role="alert"
+          >
+            <div ng-message="required">
+              <span translate="ANALYTICS.ERRORS.COLUMN_REQUIRED"
+                >Column field is required</span
+              >
+            </div>
+          </div>
+        </md-input-container>
+        <md-input-container class="md-block" ng-switch-when="metric">
+          <label translate="ANALYTICS.METRIC_NAME">Metric Name</label>
+          <md-select name="metric" ng-model="vm.reportField.MetricId" required>
+            <md-option ng-repeat="metric in vm.metrics" ng-value="metric.id"
+              >{{metric.name}}</md-option
+            >
+          </md-select>
+          <div
+            ng-messages="reportForm.metric.$error"
+            ng-show="reportForm.metric.$touched"
+            role="alert"
+          >
+            <div ng-message="required">
+              <span translate="ANALYTICS.ERRORS.METRIC_REQUIRED"
+                >Metric field is required</span
+              >
+            </div>
+          </div>
+        </md-input-container>
+        <md-input-container class="md-block" ng-switch-when="custom">
+          <label translate="ANALYTICS.CUSTOM_METRIC">Custom Metric</label>
+          <input
+            type="text"
+            name="field"
+            ng-model="vm.reportField.field"
+            required
+            md-autofocus
+          />
+          <div
+            ng-messages="reportFieldForm.field.$error"
+            ng-show="reportFieldForm.field.$touched"
+            role="alert"
+          >
+            <div ng-message="required">
+              <span translate="ANALYTICS.ERRORS.CUSTOM_METRIC_REQUIRED"
+                >Custom Metric field is required</span
+              >
+            </div>
+          </div>
+        </md-input-container>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="ANALYTICS.ALIAS">Alias</label>
+        <input
+          type="text"
+          name="alias"
+          ng-model="vm.reportField.alias"
+          ng-required="vm.reportField.type === 'custom' || vm.reportField.type === 'metric'"
+        />
+        <div
+          ng-messages="reportFieldForm.alias.$error"
+          ng-show="reportFieldForm.alias.$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="ANALYTICS.ERRORS.ALIAS_REQUIRED"
+              >Alias field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        class="md-block"
+        ng-if="vm.reportField.type !== 'metric'"
+      >
+        <label translate="ANALYTICS.FUNCTION">Function</label>
+        <md-select name="function" ng-model="vm.reportField.function">
+          <md-option ng-value="null">No Function</md-option>
+          <md-option
+            ng-repeat="function in vm.sqlUtil.getFunctions"
+            ng-value="function.value"
+            >{{function.value}}</md-option
+          >
+        </md-select>
+      </md-input-container>
+      <md-input-container
+        class="md-block"
+        ng-if="vm.reportField.type !== 'metric'"
+      >
+        <label translate="ANALYTICS.FORMAT">Format</label>
+        <md-select name="format" ng-model="vm.reportField.format">
+          <md-option ng-value="null">No Format</md-option>
+          <md-option
+            ng-repeat="format in vm.sqlUtil.getFormats"
+            ng-value="format.value"
+            >{{format.value}}</md-option
+          >
+        </md-select>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="ANALYTICS.GROUP_BY">Group By</label>
+        <md-select name="groupBy" ng-model="vm.reportField.groupBy">
+          <md-option ng-repeat="gb in vm.sqlUtil.getGroupBy" ng-value="gb.value"
+            >{{gb.value ? 'Yes' : 'No'}}</md-option
+          >
+        </md-select>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="ANALYTICS.ORDER_BY">Order By</label>
+        <md-select name="orderBy" ng-model="vm.reportField.orderBy">
+          <md-option ng-value="null">No Order</md-option>
+          <md-option ng-repeat="ob in vm.sqlUtil.getOrderBy" ng-value="ob.value"
+            >{{ob.value}}</md-option
+          >
+        </md-select>
+      </md-input-container>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-if="!vm.newReportField"
+          ng-click="vm.saveReportField()"
+          class="send-button md-accent md-raised"
+          ng-disabled="reportFieldForm.$invalid || reportFieldForm.$pristine"
+          aria-label="SAVE"
+          translate="ANALYTICS.SAVE"
+          translate-attr-aria-label="ANALYTICS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.newReportField"
+          ng-click="vm.addNewReportField()"
+          class="send-button md-accent md-raised"
+          ng-disabled="reportFieldForm.$invalid || reportFieldForm.$pristine"
+          aria-label="ADD"
+          translate="ANALYTICS.ADD_REPORTFIELD"
+          translate-attr-aria-label="ANALYTICS.ADD_REPORTFIELD"
+        >
+          ADD REPORT FIELD
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newReportField"
+          ng-click="vm.deleteReportField($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="ANALYTICS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="ANALYTICS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/analytics/views/reports/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/analytics/views/reports/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index 5615fe7..0000000
--- a/public/src/js/modules/main/apps/analytics/views/reports/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,488 +0,0 @@
-<div id="analytics-report" class="page-layout simple tabbed" layout="column">
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-reports-button md-icon-button"
-        aria-label="Go to reports"
-        ng-click="vm.gotoReports()"
-        translate
-        translate-attr-aria-label="ANALYTICS.GO_TO_ANALYTICSQUEUES"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="report-image" hide-xs>
-          <img ng-src="assets/images/business/reports.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">#{{vm.report.id}} {{vm.report.name}}</div>
-          <div class="subtitle secondary-text">
-            <span translate="ANALYTICS.CREATED_AT"></span>
-            <span>{{vm.report.createdAt | date:'medium'}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span>{{vm.report.description}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveReport()"
-        ng-disabled="generalForm.$pristine && conditionsForm.$pristine"
-        class="send-button md-accent md-raised"
-        translate="ANALYTICS.SAVE"
-        translate-attr-aria-label="ANALYTICS.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="ANALYTICS.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-
-        <md-tab-body>
-          <div
-            class="report-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="ANALYTICS.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="ANALYTICS.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ng-model="vm.report.name"
-                  required
-                  md-autofocus
-                />
-                <div
-                  ng-messages="generalForm.name.$error"
-                  ng-show="generalForm.name.$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="ANALYTICS.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="ANALYTICS.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ng-model="vm.report.description"
-                />
-                <div
-                  ng-messages="generalForm.description.$error"
-                  ng-show="generalForm.description.$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="ANALYTICS.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="ANALYTICS.FIELDS">FIELDS</span>
-        </md-tab-label>
-
-        <md-tab-body>
-          <div
-            class="report-detail-form-container fields md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="ReportFieldsController as vm_rf"
-              ng-init="vm_rf.init(vm.report, vm.crudPermissions)"
-            >
-              <md-toolbar
-                class="md-table-toolbar md-default"
-                ng-hide="vm_rf.selectedReportFields.length"
-              >
-                <div class="md-toolbar-tools">
-                  <div layout="row" layout-align="start center">
-                    <div layout="column" layout-align="start start">
-                      <div class="md-subhead" translate="ANALYTICS.FIELDS">
-                        <span translate="ANALYTICS.FIELDS">FIELDS</span>
-                      </div>
-                      <div class="h4">
-                        <span translate="ANALYTICS.TABLE">TABLE</span>
-                        <span class="text-bold">{{vm.report.table}}</span>
-                      </div>
-                      <div
-                        class="h4"
-                        ng-if="vm.report.joins && vm.report.joins.length && vm.isArray(vm.report.joins)"
-                      >
-                        <span>Join</span>
-                        <span class="text-bold"
-                          >{{ vm.mapArray(vm.report.joins, 'foreignTable')
-                          }}</span
-                        >
-                      </div>
-                    </div>
-                  </div>
-                  <div flex></div>
-                  <ms-search-bar
-                    on-search="vm_rf.query.filter = query"
-                    on-collapse="vm_rf.query.filter = undefined"
-                    debounce="300"
-                  ></ms-search-bar>
-                  <md-button
-                    class="md-icon-button"
-                    ng-if="vm_rf.crudPermissions.canEdit"
-                    ng-click="vm_rf.createOrEditReportField($event)"
-                    aria-label="add field"
-                    translate
-                    translate-attr-label="ANALYTICS.ADD_FIELD"
-                  >
-                    <md-icon md-font-icon="icon-plus"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-toolbar
-                class="md-table-toolbar md-accent"
-                ng-show="vm_rf.selectedReportFields.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead"
-                    >{{vm_rf.selectedReportFields.length}}
-                    {{vm_rf.selectedReportFields.length > 1 ? 'items' : 'item'}}
-                    selected</span
-                  >
-                  <div flex></div>
-                  <md-button
-                    class="md-icon-button"
-                    ng-click="vm_rf.deleteSelectedReportFields($event)"
-                    aria-label="delete selected"
-                    translate
-                    translate-attr-label="ANALYTICS.DELETE_SELECTED"
-                  >
-                    <md-icon md-font-icon="icon-delete"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-table-container>
-                <table
-                  md-table
-                  md-row-select="vm_rf.crudPermissions.canDelete"
-                  multiple
-                  ng-model="vm_rf.selectedReportFields"
-                  md-progress="vm_rf.promise"
-                >
-                  <thead
-                    md-head
-                    md-order="vm_rf.query.sort"
-                    md-on-reorder="vm_rf.getReportFields"
-                  >
-                    <tr md-row>
-                      <th
-                        md-column
-                        width="10px"
-                        ng-if="vm_rf.crudPermissions.canEdit"
-                      >
-                        <md-icon md-font-icon="icon-drag-vertical"></md-icon>
-                      </th>
-                      <th md-column>Type</th>
-                      <th md-column>Column or Metric</th>
-                      <th md-column>Alias</th>
-                      <th md-column>Function</th>
-                      <th md-column>Format</th>
-                      <th md-column>Group By</th>
-                      <th md-column>Order By</th>
-                      <th
-                        md-column
-                        width="10px"
-                        ng-if="vm_rf.crudPermissions.canEdit"
-                      ></th>
-                    </tr>
-                  </thead>
-                  <tbody md-body ng-sortable="vm_rf.sortableTable">
-                    <tr
-                      md-row
-                      md-select="reportField"
-                      md-select-id="id"
-                      ng-repeat="reportField in vm_rf.reportFields.rows"
-                    >
-                      <td
-                        md-cell
-                        class="handle"
-                        ng-if="vm_rf.crudPermissions.canEdit"
-                      >
-                        <md-icon
-                          md-font-icon="icon-drag-vertical"
-                          class="s16"
-                        ></md-icon>
-                      </td>
-                      <td md-cell>
-                        <div
-                          ng-if="reportField.MetricId && !reportField.custom"
-                          ng-click="vm_rf.createOrEditReportField($event, reportField)"
-                          class="icon icon-shape-plus s16"
-                        ></div>
-                        <div
-                          ng-if="!reportField.MetricId && reportField.custom"
-                          ng-click="vm_rf.createOrEditReportField($event, reportField)"
-                          class="icon icon-pencil-box-outline s16"
-                        ></div>
-                        <div
-                          ng-if="!reportField.MetricId && !reportField.custom"
-                          ng-click="vm_rf.createOrEditReportField($event, reportField)"
-                          class="icon icon-view-column s16"
-                        ></div>
-                      </td>
-                      <td
-                        md-cell
-                        ng-click="vm_rf.createOrEditReportField($event, reportField)"
-                      >
-                        {{reportField.MetricId ?
-                        vm_rf.getMetricName(reportField.MetricId) :
-                        reportField.field}}
-                      </td>
-                      <td
-                        md-cell
-                        ng-click="vm_rf.createOrEditReportField($event, reportField)"
-                      >
-                        {{reportField.alias}}
-                      </td>
-                      <td
-                        md-cell
-                        ng-click="vm_rf.createOrEditReportField($event, reportField)"
-                      >
-                        <span
-                          class="text-boxed blue-bg white-fg"
-                          ng-if="reportField.function"
-                          >{{reportField.function}}</span
-                        ><span ng-if="!reportField.function">--</span>
-                      </td>
-                      <td
-                        md-cell
-                        ng-click="vm_rf.createOrEditReportField($event, reportField)"
-                      >
-                        <span
-                          class="text-boxed blue-bg white-fg"
-                          ng-if="reportField.format"
-                          >{{reportField.format}}</span
-                        ><span ng-if="!reportField.format">--</span>
-                      </td>
-                      <td
-                        md-cell
-                        ng-click="vm_rf.createOrEditReportField($event, reportField)"
-                      >
-                        <span
-                          class="text-boxed blue-bg white-fg"
-                          ng-if="reportField.groupBy"
-                          >YES</span
-                        ><span ng-if="!reportField.groupBy">--</span>
-                      </td>
-                      <td
-                        md-cell
-                        ng-click="vm_rf.createOrEditReportField($event, reportField)"
-                      >
-                        <span
-                          class="text-boxed blue-bg white-fg"
-                          ng-if="reportField.orderBy"
-                          >{{reportField.orderBy}}</span
-                        ><span ng-if="!reportField.orderBy">--</span>
-                      </td>
-                      <td
-                        md-cell
-                        class="actions"
-                        ng-if="vm_rf.crudPermissions.canEdit"
-                      >
-                        <md-menu>
-                          <md-button
-                            class="md-icon-button"
-                            aria-label="More"
-                            translate
-                            translate-attr-aria-label="ANALYTICS.MORE"
-                            ng-click="$mdMenu.open($event)"
-                          >
-                            <md-icon
-                              md-font-icon="icon-dots-vertical"
-                            ></md-icon>
-                          </md-button>
-
-                          <md-menu-content width="3">
-                            <md-menu-item>
-                              <md-button
-                                ng-click="vm_rf.createOrEditReportField($event, reportField)"
-                                translate="ANALYTICS.EDIT_REPORTFIELD"
-                              >
-                                Edit Field
-                              </md-button>
-                            </md-menu-item>
-                            <md-menu-item>
-                              <md-button
-                                ng-click="vm_rf.deleteConfirm(reportField, $event)"
-                                translate="ANALYTICS.DELETE_REPORTFIELD"
-                              >
-                                Delete Field
-                              </md-button>
-                            </md-menu-item>
-                          </md-menu-content>
-                        </md-menu>
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="ANALYTICS.CONDITIONS">CONDITIONS</span>
-        </md-tab-label>
-
-        <md-tab-body>
-          <div
-            class="report-detail-form-container conditions md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="ReportConditionsController as vm_rc"
-              ng-init="vm_rc.init(vm.report, vm.crudPermissions)"
-            >
-              <div class="pb-16" layout="row" layout-align="start center">
-                <div class="h2 secondary-text" translate="ANALYTICS.CONDITION">
-                  CONDITION
-                </div>
-              </div>
-              <form name="conditionsForm" novalidate>
-                <div
-                  ng-if="vm_rc.report.condition.group"
-                  ng-include="'app/main/apps/analytics/views/reports/edit/condition/group.html'"
-                  ng-init="group=vm_rc.report.condition.group"
-                ></div>
-              </form>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab md-on-select="vm.previewReport()">
-        <md-tab-label>
-          <span translate="ANALYTICS.PREVIEW">PREVIEW</span>
-        </md-tab-label>
-
-        <md-tab-body>
-          <div
-            class="report-detail-form-container result md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div
-                ng-if="vm.error"
-                class="h2 secondary-text"
-                translate="ANALYTICS.ERROR"
-              >
-                ERROR
-              </div>
-              <div
-                ng-if="!vm.error"
-                class="h2 secondary-text"
-                translate="ANALYTICS.LIMITED_RESULT"
-              >
-                LIMITED RESULT
-              </div>
-            </div>
-            <dl ng-if="vm.error">
-              <dt class="text-bold" translate="ANALYTICS.QUERY_ERROR">
-                Query Error
-              </dt>
-              <dd>{{vm.error.sql}}</dd>
-              <dt translate="ANALYTICS.MESSAGE">Message</dt>
-              <dd>{{vm.error.msg}}</dd>
-            </dl>
-            <md-table-container ng-if="!vm.error">
-              <table md-table>
-                <thead md-head>
-                  <tr md-row>
-                    <th ng-repeat="column in vm.columns">
-                      {{column.alias || column.field}}
-                    </th>
-                  </tr>
-                </thead>
-                <tbody md-body>
-                  <tr md-row ng-repeat="row in vm.rows">
-                    <td md-cell ng-repeat="(key, value) in row">
-                      {{ vm.valueReplacer(key, value) }}
-                    </td>
-                  </tr>
-                  <tr md-row ng-if="!vm.rows.length">
-                    <td md-cell colspan="{{vm.columns.length}}">
-                      <span translate="ANALYTICS.NO_DATA">NO DATA</span>
-                    </td>
-                  </tr>
-                </tbody>
-              </table>
-            </md-table-container>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab md-on-select="vm.queryReport()">
-        <md-tab-label>
-          <span>Query</span>
-        </md-tab-label>
-
-        <md-tab-body>
-          <div
-            class="report-detail-form-container result md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div
-                ng-if="vm.error"
-                class="h2 secondary-text"
-                translate="ANALYTICS.ERROR"
-              >
-                ERROR
-              </div>
-              <div ng-if="!vm.error" class="h2 secondary-text">SQL</div>
-            </div>
-            <dl ng-if="vm.error">
-              <dt class="text-bold" translate="ANALYTICS.QUERY_ERROR">
-                Query Error
-              </dt>
-              <dd>{{vm.error.sql}}</dd>
-              <dt translate="ANALYTICS.MESSAGE">Message</dt>
-              <dd>{{vm.error.msg}}</dd>
-            </dl>
-            <div ng-if="!vm.error">{{vm.queryResult}}</div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/analytics/views/reports/edit/view.html/view.html b/public/src/js/modules/main/apps/analytics/views/reports/edit/view.html/view.html
new file mode 100644
index 0000000..5615fe7
--- /dev/null
+++ b/public/src/js/modules/main/apps/analytics/views/reports/edit/view.html/view.html
@@ -0,0 +1,488 @@
+<div id="analytics-report" class="page-layout simple tabbed" layout="column">
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-reports-button md-icon-button"
+        aria-label="Go to reports"
+        ng-click="vm.gotoReports()"
+        translate
+        translate-attr-aria-label="ANALYTICS.GO_TO_ANALYTICSQUEUES"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="report-image" hide-xs>
+          <img ng-src="assets/images/business/reports.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">#{{vm.report.id}} {{vm.report.name}}</div>
+          <div class="subtitle secondary-text">
+            <span translate="ANALYTICS.CREATED_AT"></span>
+            <span>{{vm.report.createdAt | date:'medium'}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span>{{vm.report.description}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveReport()"
+        ng-disabled="generalForm.$pristine && conditionsForm.$pristine"
+        class="send-button md-accent md-raised"
+        translate="ANALYTICS.SAVE"
+        translate-attr-aria-label="ANALYTICS.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="ANALYTICS.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+
+        <md-tab-body>
+          <div
+            class="report-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="ANALYTICS.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="ANALYTICS.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ng-model="vm.report.name"
+                  required
+                  md-autofocus
+                />
+                <div
+                  ng-messages="generalForm.name.$error"
+                  ng-show="generalForm.name.$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="ANALYTICS.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="ANALYTICS.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ng-model="vm.report.description"
+                />
+                <div
+                  ng-messages="generalForm.description.$error"
+                  ng-show="generalForm.description.$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="ANALYTICS.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="ANALYTICS.FIELDS">FIELDS</span>
+        </md-tab-label>
+
+        <md-tab-body>
+          <div
+            class="report-detail-form-container fields md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="ReportFieldsController as vm_rf"
+              ng-init="vm_rf.init(vm.report, vm.crudPermissions)"
+            >
+              <md-toolbar
+                class="md-table-toolbar md-default"
+                ng-hide="vm_rf.selectedReportFields.length"
+              >
+                <div class="md-toolbar-tools">
+                  <div layout="row" layout-align="start center">
+                    <div layout="column" layout-align="start start">
+                      <div class="md-subhead" translate="ANALYTICS.FIELDS">
+                        <span translate="ANALYTICS.FIELDS">FIELDS</span>
+                      </div>
+                      <div class="h4">
+                        <span translate="ANALYTICS.TABLE">TABLE</span>
+                        <span class="text-bold">{{vm.report.table}}</span>
+                      </div>
+                      <div
+                        class="h4"
+                        ng-if="vm.report.joins && vm.report.joins.length && vm.isArray(vm.report.joins)"
+                      >
+                        <span>Join</span>
+                        <span class="text-bold"
+                          >{{ vm.mapArray(vm.report.joins, 'foreignTable')
+                          }}</span
+                        >
+                      </div>
+                    </div>
+                  </div>
+                  <div flex></div>
+                  <ms-search-bar
+                    on-search="vm_rf.query.filter = query"
+                    on-collapse="vm_rf.query.filter = undefined"
+                    debounce="300"
+                  ></ms-search-bar>
+                  <md-button
+                    class="md-icon-button"
+                    ng-if="vm_rf.crudPermissions.canEdit"
+                    ng-click="vm_rf.createOrEditReportField($event)"
+                    aria-label="add field"
+                    translate
+                    translate-attr-label="ANALYTICS.ADD_FIELD"
+                  >
+                    <md-icon md-font-icon="icon-plus"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-toolbar
+                class="md-table-toolbar md-accent"
+                ng-show="vm_rf.selectedReportFields.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead"
+                    >{{vm_rf.selectedReportFields.length}}
+                    {{vm_rf.selectedReportFields.length > 1 ? 'items' : 'item'}}
+                    selected</span
+                  >
+                  <div flex></div>
+                  <md-button
+                    class="md-icon-button"
+                    ng-click="vm_rf.deleteSelectedReportFields($event)"
+                    aria-label="delete selected"
+                    translate
+                    translate-attr-label="ANALYTICS.DELETE_SELECTED"
+                  >
+                    <md-icon md-font-icon="icon-delete"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-table-container>
+                <table
+                  md-table
+                  md-row-select="vm_rf.crudPermissions.canDelete"
+                  multiple
+                  ng-model="vm_rf.selectedReportFields"
+                  md-progress="vm_rf.promise"
+                >
+                  <thead
+                    md-head
+                    md-order="vm_rf.query.sort"
+                    md-on-reorder="vm_rf.getReportFields"
+                  >
+                    <tr md-row>
+                      <th
+                        md-column
+                        width="10px"
+                        ng-if="vm_rf.crudPermissions.canEdit"
+                      >
+                        <md-icon md-font-icon="icon-drag-vertical"></md-icon>
+                      </th>
+                      <th md-column>Type</th>
+                      <th md-column>Column or Metric</th>
+                      <th md-column>Alias</th>
+                      <th md-column>Function</th>
+                      <th md-column>Format</th>
+                      <th md-column>Group By</th>
+                      <th md-column>Order By</th>
+                      <th
+                        md-column
+                        width="10px"
+                        ng-if="vm_rf.crudPermissions.canEdit"
+                      ></th>
+                    </tr>
+                  </thead>
+                  <tbody md-body ng-sortable="vm_rf.sortableTable">
+                    <tr
+                      md-row
+                      md-select="reportField"
+                      md-select-id="id"
+                      ng-repeat="reportField in vm_rf.reportFields.rows"
+                    >
+                      <td
+                        md-cell
+                        class="handle"
+                        ng-if="vm_rf.crudPermissions.canEdit"
+                      >
+                        <md-icon
+                          md-font-icon="icon-drag-vertical"
+                          class="s16"
+                        ></md-icon>
+                      </td>
+                      <td md-cell>
+                        <div
+                          ng-if="reportField.MetricId && !reportField.custom"
+                          ng-click="vm_rf.createOrEditReportField($event, reportField)"
+                          class="icon icon-shape-plus s16"
+                        ></div>
+                        <div
+                          ng-if="!reportField.MetricId && reportField.custom"
+                          ng-click="vm_rf.createOrEditReportField($event, reportField)"
+                          class="icon icon-pencil-box-outline s16"
+                        ></div>
+                        <div
+                          ng-if="!reportField.MetricId && !reportField.custom"
+                          ng-click="vm_rf.createOrEditReportField($event, reportField)"
+                          class="icon icon-view-column s16"
+                        ></div>
+                      </td>
+                      <td
+                        md-cell
+                        ng-click="vm_rf.createOrEditReportField($event, reportField)"
+                      >
+                        {{reportField.MetricId ?
+                        vm_rf.getMetricName(reportField.MetricId) :
+                        reportField.field}}
+                      </td>
+                      <td
+                        md-cell
+                        ng-click="vm_rf.createOrEditReportField($event, reportField)"
+                      >
+                        {{reportField.alias}}
+                      </td>
+                      <td
+                        md-cell
+                        ng-click="vm_rf.createOrEditReportField($event, reportField)"
+                      >
+                        <span
+                          class="text-boxed blue-bg white-fg"
+                          ng-if="reportField.function"
+                          >{{reportField.function}}</span
+                        ><span ng-if="!reportField.function">--</span>
+                      </td>
+                      <td
+                        md-cell
+                        ng-click="vm_rf.createOrEditReportField($event, reportField)"
+                      >
+                        <span
+                          class="text-boxed blue-bg white-fg"
+                          ng-if="reportField.format"
+                          >{{reportField.format}}</span
+                        ><span ng-if="!reportField.format">--</span>
+                      </td>
+                      <td
+                        md-cell
+                        ng-click="vm_rf.createOrEditReportField($event, reportField)"
+                      >
+                        <span
+                          class="text-boxed blue-bg white-fg"
+                          ng-if="reportField.groupBy"
+                          >YES</span
+                        ><span ng-if="!reportField.groupBy">--</span>
+                      </td>
+                      <td
+                        md-cell
+                        ng-click="vm_rf.createOrEditReportField($event, reportField)"
+                      >
+                        <span
+                          class="text-boxed blue-bg white-fg"
+                          ng-if="reportField.orderBy"
+                          >{{reportField.orderBy}}</span
+                        ><span ng-if="!reportField.orderBy">--</span>
+                      </td>
+                      <td
+                        md-cell
+                        class="actions"
+                        ng-if="vm_rf.crudPermissions.canEdit"
+                      >
+                        <md-menu>
+                          <md-button
+                            class="md-icon-button"
+                            aria-label="More"
+                            translate
+                            translate-attr-aria-label="ANALYTICS.MORE"
+                            ng-click="$mdMenu.open($event)"
+                          >
+                            <md-icon
+                              md-font-icon="icon-dots-vertical"
+                            ></md-icon>
+                          </md-button>
+
+                          <md-menu-content width="3">
+                            <md-menu-item>
+                              <md-button
+                                ng-click="vm_rf.createOrEditReportField($event, reportField)"
+                                translate="ANALYTICS.EDIT_REPORTFIELD"
+                              >
+                                Edit Field
+                              </md-button>
+                            </md-menu-item>
+                            <md-menu-item>
+                              <md-button
+                                ng-click="vm_rf.deleteConfirm(reportField, $event)"
+                                translate="ANALYTICS.DELETE_REPORTFIELD"
+                              >
+                                Delete Field
+                              </md-button>
+                            </md-menu-item>
+                          </md-menu-content>
+                        </md-menu>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="ANALYTICS.CONDITIONS">CONDITIONS</span>
+        </md-tab-label>
+
+        <md-tab-body>
+          <div
+            class="report-detail-form-container conditions md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="ReportConditionsController as vm_rc"
+              ng-init="vm_rc.init(vm.report, vm.crudPermissions)"
+            >
+              <div class="pb-16" layout="row" layout-align="start center">
+                <div class="h2 secondary-text" translate="ANALYTICS.CONDITION">
+                  CONDITION
+                </div>
+              </div>
+              <form name="conditionsForm" novalidate>
+                <div
+                  ng-if="vm_rc.report.condition.group"
+                  ng-include="'app/main/apps/analytics/views/reports/edit/condition/group.html'"
+                  ng-init="group=vm_rc.report.condition.group"
+                ></div>
+              </form>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab md-on-select="vm.previewReport()">
+        <md-tab-label>
+          <span translate="ANALYTICS.PREVIEW">PREVIEW</span>
+        </md-tab-label>
+
+        <md-tab-body>
+          <div
+            class="report-detail-form-container result md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div
+                ng-if="vm.error"
+                class="h2 secondary-text"
+                translate="ANALYTICS.ERROR"
+              >
+                ERROR
+              </div>
+              <div
+                ng-if="!vm.error"
+                class="h2 secondary-text"
+                translate="ANALYTICS.LIMITED_RESULT"
+              >
+                LIMITED RESULT
+              </div>
+            </div>
+            <dl ng-if="vm.error">
+              <dt class="text-bold" translate="ANALYTICS.QUERY_ERROR">
+                Query Error
+              </dt>
+              <dd>{{vm.error.sql}}</dd>
+              <dt translate="ANALYTICS.MESSAGE">Message</dt>
+              <dd>{{vm.error.msg}}</dd>
+            </dl>
+            <md-table-container ng-if="!vm.error">
+              <table md-table>
+                <thead md-head>
+                  <tr md-row>
+                    <th ng-repeat="column in vm.columns">
+                      {{column.alias || column.field}}
+                    </th>
+                  </tr>
+                </thead>
+                <tbody md-body>
+                  <tr md-row ng-repeat="row in vm.rows">
+                    <td md-cell ng-repeat="(key, value) in row">
+                      {{ vm.valueReplacer(key, value) }}
+                    </td>
+                  </tr>
+                  <tr md-row ng-if="!vm.rows.length">
+                    <td md-cell colspan="{{vm.columns.length}}">
+                      <span translate="ANALYTICS.NO_DATA">NO DATA</span>
+                    </td>
+                  </tr>
+                </tbody>
+              </table>
+            </md-table-container>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab md-on-select="vm.queryReport()">
+        <md-tab-label>
+          <span>Query</span>
+        </md-tab-label>
+
+        <md-tab-body>
+          <div
+            class="report-detail-form-container result md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div
+                ng-if="vm.error"
+                class="h2 secondary-text"
+                translate="ANALYTICS.ERROR"
+              >
+                ERROR
+              </div>
+              <div ng-if="!vm.error" class="h2 secondary-text">SQL</div>
+            </div>
+            <dl ng-if="vm.error">
+              <dt class="text-bold" translate="ANALYTICS.QUERY_ERROR">
+                Query Error
+              </dt>
+              <dd>{{vm.error.sql}}</dd>
+              <dt translate="ANALYTICS.MESSAGE">Message</dt>
+              <dd>{{vm.error.msg}}</dd>
+            </dl>
+            <div ng-if="!vm.error">{{vm.queryResult}}</div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/analytics/views/reports/preview/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/analytics/views/reports/preview/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 9b6f39e..0000000
--- a/public/src/js/modules/main/apps/analytics/views/reports/preview/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,127 +0,0 @@
-<md-dialog aria-label="Run Report">
-  <form name="reportForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title" translate="ANALYTICS.PREVIEW_REPORT"
-          >Preview Report</span
-        >
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <div class="md-block">
-        <div class="pb-16" layout="row" layout-align="start center">
-          <div
-            ng-if="vm.error"
-            class="h2 secondary-text"
-            translate="ANALYTICS.ERROR"
-          >
-            ERROR
-          </div>
-          <div
-            ng-if="!vm.error"
-            class="h2 secondary-text"
-            translate="ANALYTICS.LIMITED_RESULT"
-          >
-            LIMITED RESULT
-          </div>
-        </div>
-        <dl ng-if="vm.error">
-          <dt class="text-bold" translate="ANALYTICS.QUERY_ERROR">
-            Query Error
-          </dt>
-          <dd>{{vm.error.sql}}</dd>
-          <dt translate="ANALYTICS.MESSAGE">Message</dt>
-          <dd>{{vm.error.msg}}</dd>
-        </dl>
-        <md-table-container ng-if="!vm.error">
-          <table md-table md-progress="vm.promise">
-            <thead md-head>
-              <tr md-row>
-                <th md-column ng-repeat="column in vm.columns">
-                  {{column.alias || column.field}}
-                </th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-repeat="row in vm.rows">
-                <td md-cell ng-repeat="(key, value) in row">
-                  {{ vm.valueReplacer(key, value) }}
-                </td>
-              </tr>
-              <tr md-row ng-if="!vm.rows.length">
-                <td md-cell colspan="{{vm.columns.length}}">
-                  <span translate="ANALYTICS.NO_DATA">NO DATA</span>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-      </div>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div flex></div>
-      <md-button
-        type="submit"
-        ng-click="vm.closeDialog()"
-        class="md-raised"
-        aria-label="CLOSE"
-        translate="ANALYTICS.CLOSE"
-        translate-attr-aria-label="ANALYTICS.CLOSE"
-      >
-        CLOSE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/analytics/views/reports/preview/dialog.html/dialog.html b/public/src/js/modules/main/apps/analytics/views/reports/preview/dialog.html/dialog.html
new file mode 100644
index 0000000..9b6f39e
--- /dev/null
+++ b/public/src/js/modules/main/apps/analytics/views/reports/preview/dialog.html/dialog.html
@@ -0,0 +1,127 @@
+<md-dialog aria-label="Run Report">
+  <form name="reportForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title" translate="ANALYTICS.PREVIEW_REPORT"
+          >Preview Report</span
+        >
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <div class="md-block">
+        <div class="pb-16" layout="row" layout-align="start center">
+          <div
+            ng-if="vm.error"
+            class="h2 secondary-text"
+            translate="ANALYTICS.ERROR"
+          >
+            ERROR
+          </div>
+          <div
+            ng-if="!vm.error"
+            class="h2 secondary-text"
+            translate="ANALYTICS.LIMITED_RESULT"
+          >
+            LIMITED RESULT
+          </div>
+        </div>
+        <dl ng-if="vm.error">
+          <dt class="text-bold" translate="ANALYTICS.QUERY_ERROR">
+            Query Error
+          </dt>
+          <dd>{{vm.error.sql}}</dd>
+          <dt translate="ANALYTICS.MESSAGE">Message</dt>
+          <dd>{{vm.error.msg}}</dd>
+        </dl>
+        <md-table-container ng-if="!vm.error">
+          <table md-table md-progress="vm.promise">
+            <thead md-head>
+              <tr md-row>
+                <th md-column ng-repeat="column in vm.columns">
+                  {{column.alias || column.field}}
+                </th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-repeat="row in vm.rows">
+                <td md-cell ng-repeat="(key, value) in row">
+                  {{ vm.valueReplacer(key, value) }}
+                </td>
+              </tr>
+              <tr md-row ng-if="!vm.rows.length">
+                <td md-cell colspan="{{vm.columns.length}}">
+                  <span translate="ANALYTICS.NO_DATA">NO DATA</span>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+      </div>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div flex></div>
+      <md-button
+        type="submit"
+        ng-click="vm.closeDialog()"
+        class="md-raised"
+        aria-label="CLOSE"
+        translate="ANALYTICS.CLOSE"
+        translate-attr-aria-label="ANALYTICS.CLOSE"
+      >
+        CLOSE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/analytics/views/reports/reports.html/reports-[chunkhash].html b/public/src/js/modules/main/apps/analytics/views/reports/reports.html/reports-[chunkhash].html
deleted file mode 100644
index a164c7b..0000000
--- a/public/src/js/modules/main/apps/analytics/views/reports/reports.html/reports-[chunkhash].html
+++ /dev/null
@@ -1,344 +0,0 @@
-<div id="reports" class="page-layout simple left-sidenav inner-sidenav">
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-chart-line" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="ANALYTICS.REPORTS">Reports</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedReports.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedReports =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="ANALYTICS.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-reports-count">
-          <span>{{vm.selectedReports.length}}</span>
-          <span translate="ANALYTICS.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="ANALYTICS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllReports()"
-                translate="ANALYTICS.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectReports()"
-                translate="ANALYTICS.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedReports"
-          csv-label="true"
-          filename="reports.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          ng-if="vm.crudPermissions.canDelete && vm.currentNode.custom"
-          class="md-icon-button"
-          ng-click="vm.deleteSelectedReports($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="ANALYTICS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div layout="column" flex="30">
-      <md-card class="padding-top-5 padding-horizontal-10 padding-bottom-0">
-        <!-- SEARCH -->
-        <div layout="row" layout-align="start center">
-          <label for="searchFolder" class="m-0">
-            <md-icon md-font-icon="icon-magnify"></md-icon>
-          </label>
-          <md-input-container
-            md-no-float
-            class="margin-horizontal-0 margin-bottom-0 margin-top-10"
-            flex
-          >
-            <input
-              id="searchFolder"
-              placeholder="Search folder"
-              type="text"
-              ng-model="vm.search"
-              ng-model-options="{ debounce: 1000 }"
-              translate
-              translate-attr-placeholder="ANALYTICS.SEARCH_FOR_FOLDER"
-            />
-          </md-input-container>
-        </div>
-        <!-- / SEARCH -->
-      </md-card>
-      <md-card class="padding-10 scrollable" ms-scroll>
-        <div
-          js-tree="vm.treeDefaultConfig"
-          tree-events-obj="vm.treeDefaultEvents"
-          ng-model="vm.treeDefaultData"
-          tree="vm.treeDefaultInstance"
-        ></div>
-      </md-card>
-      <md-card class="padding-10 scrollable" ms-scroll>
-        <div
-          js-tree="vm.treeCustomConfig"
-          tree-events-obj="vm.treeCustomEvents"
-          ng-model="vm.treeCustomData"
-          tree="vm.treeCustomInstance"
-        ></div>
-      </md-card>
-    </div>
-    <md-card flex="70">
-      <md-toolbar class="md-table-toolbar md-default">
-        <div class="md-toolbar-tools">
-          <span class="h2 secondary-text">{{vm.currentNode.text}}</span>
-          <p ng-if="vm.currentPath">
-            <span class="text-boxed">{{vm.currentPath}}</span>
-          </p>
-          <div flex></div>
-          <ms-search-bar
-            on-search="vm.query.filter = query"
-            on-collapse="vm.query.filter = undefined"
-            debounce="300"
-          ></ms-search-bar>
-          <div
-            flow-init
-            flow-file-added="vm.importReport($file, $event, $flow)"
-          >
-            <md-button
-              ng-if="vm.crudPermissions.canEdit && vm.currentNode.custom"
-              class="md-icon-button"
-              aria-label="import report"
-              translate
-              translate-attr-label="ANALYTICS.IMPORT_REPORT"
-              flow-btn
-            >
-              <md-icon md-font-icon="icon-upload"></md-icon>
-            </md-button>
-          </div>
-          <md-button
-            ng-if="vm.crudPermissions.canEdit && vm.currentNode.custom"
-            class="md-icon-button"
-            ng-click="vm.createOrEditReport($event)"
-            aria-label="add report"
-            translate
-            translate-attr-label="ANALYTICS.ADD_REPORT"
-          >
-            <md-icon md-font-icon="icon-plus"></md-icon>
-          </md-button>
-        </div>
-      </md-toolbar>
-      <md-table-container>
-        <table
-          md-table
-          md-row-select
-          multiple
-          ng-model="vm.selectedReports"
-          md-progress="vm.promise"
-        >
-          <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getReports">
-            <tr md-row>
-              <th md-column md-order-by="id" width="10px">
-                {{ 'ANALYTICS.ID' | translate }}
-              </th>
-              <th md-column md-order-by="name">
-                {{ 'ANALYTICS.NAME' | translate }}
-              </th>
-              <th md-column md-order-by="description">
-                {{ 'ANALYTICS.DESCRIPTION' | translate }}
-              </th>
-              <th md-column md-order-by="createdAt">
-                {{ 'ANALYTICS.CREATED_AT' | translate }}
-              </th>
-              <th md-column width="10px"></th>
-            </tr>
-          </thead>
-          <tbody md-body>
-            <tr md-row ng-hide="vm.reports.rows.length">
-              <td md-cell colspan="5">
-                <div layout="row" layout-align="center center">
-                  <span translate="ANALYTICS.NO_AVAILABLE_INFO"
-                    >No Available Info</span
-                  >
-                </div>
-              </td>
-            </tr>
-            <tr
-              md-row
-              md-select="report"
-              md-select-id="id"
-              ng-repeat="report in vm.reports.rows"
-            >
-              <td
-                ng-click="!vm.crudPermissions.canEdit ? vm.currentNode.custom && vm.editstate(report, $event) : vm.currentNode.custom && vm.createOrEditReport($event, report)"
-                md-cell
-                class="id"
-              >
-                {{report.id}}
-              </td>
-              <td
-                ng-click="!vm.crudPermissions.canEdit ? vm.currentNode.custom && vm.editstate(report, $event) : vm.currentNode.custom && vm.createOrEditReport($event, report)"
-                md-cell
-                class="name"
-              >
-                {{report.name}}
-              </td>
-              <td
-                ng-click="!vm.crudPermissions.canEdit ? vm.currentNode.custom && vm.editstate(report, $event) : vm.currentNode.custom && vm.createOrEditReport($event, report)"
-                md-cell
-                class="description"
-              >
-                {{report.description}}
-              </td>
-              <td
-                ng-click="!vm.crudPermissions.canEdit ? vm.currentNode.custom && vm.editstate(report, $event) : vm.currentNode.custom && vm.createOrEditReport($event, report)"
-                md-cell
-                class="createdAt"
-              >
-                {{report.createdAt | date:'medium'}}
-              </td>
-              <td md-cell class="actions">
-                <md-menu>
-                  <md-button
-                    class="md-icon-button"
-                    aria-label="More"
-                    translate
-                    translate-attr-aria-label="ANALYTICS.MORE"
-                    ng-click="$mdMenu.open($event)"
-                  >
-                    <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                  </md-button>
-
-                  <md-menu-content width="3">
-                    <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                      <md-button
-                        ng-click="vm.copydialog(report, $event)"
-                        translate="ANALYTICS.COPY_REPORT"
-                      >
-                        Copy Report
-                      </md-button>
-                    </md-menu-item>
-                    <md-menu-item>
-                      <md-button
-                        ng-click="vm.previewdialog(report, $event)"
-                        translate="ANALYTICS.PREVIEW_REPORT"
-                      >
-                        Preview Report
-                      </md-button>
-                    </md-menu-item>
-                    <md-menu-item>
-                      <md-button
-                        ng-click="vm.rundialog(report, $event)"
-                        translate="ANALYTICS.RUN_REPORT"
-                      >
-                        Run Report
-                      </md-button>
-                    </md-menu-item>
-                    <md-menu-item>
-                      <md-button
-                        ng-click="vm.downloadfile(report, $event)"
-                        translate="ANALYTICS.DOWNLOAD_JSON_REPORT"
-                      >
-                        Download Json Report
-                      </md-button>
-                    </md-menu-item>
-                    <md-menu-divider
-                      ng-if="vm.crudPermissions.canEdit && vm.crudPermissions.canDelete && vm.currentNode.custom"
-                    >
-                    </md-menu-divider>
-                    <md-menu-item
-                      ng-if="vm.crudPermissions.canEdit && vm.currentNode.custom"
-                    >
-                      <md-button
-                        ng-click="vm.editstate(report, $event)"
-                        translate="ANALYTICS.EDIT_REPORT"
-                      >
-                        Edit Report
-                      </md-button>
-                    </md-menu-item>
-
-                    <md-menu-item
-                      ng-if="vm.crudPermissions.canDelete && vm.currentNode.custom"
-                    >
-                      <md-button
-                        ng-click="vm.deleteconfirm(report, $event)"
-                        translate="ANALYTICS.DELETE_REPORT"
-                      >
-                        Delete Report
-                      </md-button>
-                    </md-menu-item>
-                  </md-menu-content>
-                </md-menu>
-              </td>
-            </tr>
-          </tbody>
-        </table>
-      </md-table-container>
-
-      <md-table-pagination
-        md-label="{page: '{{'ANALYTICS.PAGE' | translate}}:', rowsPerPage: '{{'ANALYTICS.ROWSPERPAGE' | translate}}:', of: '{{'ANALYTICS.OF' | translate}}'}"
-        md-limit="vm.query.limit"
-        md-limit-options="[10, 15, 20, 50, 100, 250]"
-        md-page="vm.query.page"
-        md-total="{{vm.reports.count}}"
-        md-on-paginate="vm.getReports"
-        md-page-select
-      ></md-table-pagination>
-    </md-card>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- NO ADD BUTTON BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/analytics/views/reports/reports.html/reports.html b/public/src/js/modules/main/apps/analytics/views/reports/reports.html/reports.html
new file mode 100644
index 0000000..a164c7b
--- /dev/null
+++ b/public/src/js/modules/main/apps/analytics/views/reports/reports.html/reports.html
@@ -0,0 +1,344 @@
+<div id="reports" class="page-layout simple left-sidenav inner-sidenav">
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-chart-line" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="ANALYTICS.REPORTS">Reports</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedReports.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedReports =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="ANALYTICS.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-reports-count">
+          <span>{{vm.selectedReports.length}}</span>
+          <span translate="ANALYTICS.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="ANALYTICS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllReports()"
+                translate="ANALYTICS.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectReports()"
+                translate="ANALYTICS.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedReports"
+          csv-label="true"
+          filename="reports.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          ng-if="vm.crudPermissions.canDelete && vm.currentNode.custom"
+          class="md-icon-button"
+          ng-click="vm.deleteSelectedReports($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="ANALYTICS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div layout="column" flex="30">
+      <md-card class="padding-top-5 padding-horizontal-10 padding-bottom-0">
+        <!-- SEARCH -->
+        <div layout="row" layout-align="start center">
+          <label for="searchFolder" class="m-0">
+            <md-icon md-font-icon="icon-magnify"></md-icon>
+          </label>
+          <md-input-container
+            md-no-float
+            class="margin-horizontal-0 margin-bottom-0 margin-top-10"
+            flex
+          >
+            <input
+              id="searchFolder"
+              placeholder="Search folder"
+              type="text"
+              ng-model="vm.search"
+              ng-model-options="{ debounce: 1000 }"
+              translate
+              translate-attr-placeholder="ANALYTICS.SEARCH_FOR_FOLDER"
+            />
+          </md-input-container>
+        </div>
+        <!-- / SEARCH -->
+      </md-card>
+      <md-card class="padding-10 scrollable" ms-scroll>
+        <div
+          js-tree="vm.treeDefaultConfig"
+          tree-events-obj="vm.treeDefaultEvents"
+          ng-model="vm.treeDefaultData"
+          tree="vm.treeDefaultInstance"
+        ></div>
+      </md-card>
+      <md-card class="padding-10 scrollable" ms-scroll>
+        <div
+          js-tree="vm.treeCustomConfig"
+          tree-events-obj="vm.treeCustomEvents"
+          ng-model="vm.treeCustomData"
+          tree="vm.treeCustomInstance"
+        ></div>
+      </md-card>
+    </div>
+    <md-card flex="70">
+      <md-toolbar class="md-table-toolbar md-default">
+        <div class="md-toolbar-tools">
+          <span class="h2 secondary-text">{{vm.currentNode.text}}</span>
+          <p ng-if="vm.currentPath">
+            <span class="text-boxed">{{vm.currentPath}}</span>
+          </p>
+          <div flex></div>
+          <ms-search-bar
+            on-search="vm.query.filter = query"
+            on-collapse="vm.query.filter = undefined"
+            debounce="300"
+          ></ms-search-bar>
+          <div
+            flow-init
+            flow-file-added="vm.importReport($file, $event, $flow)"
+          >
+            <md-button
+              ng-if="vm.crudPermissions.canEdit && vm.currentNode.custom"
+              class="md-icon-button"
+              aria-label="import report"
+              translate
+              translate-attr-label="ANALYTICS.IMPORT_REPORT"
+              flow-btn
+            >
+              <md-icon md-font-icon="icon-upload"></md-icon>
+            </md-button>
+          </div>
+          <md-button
+            ng-if="vm.crudPermissions.canEdit && vm.currentNode.custom"
+            class="md-icon-button"
+            ng-click="vm.createOrEditReport($event)"
+            aria-label="add report"
+            translate
+            translate-attr-label="ANALYTICS.ADD_REPORT"
+          >
+            <md-icon md-font-icon="icon-plus"></md-icon>
+          </md-button>
+        </div>
+      </md-toolbar>
+      <md-table-container>
+        <table
+          md-table
+          md-row-select
+          multiple
+          ng-model="vm.selectedReports"
+          md-progress="vm.promise"
+        >
+          <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getReports">
+            <tr md-row>
+              <th md-column md-order-by="id" width="10px">
+                {{ 'ANALYTICS.ID' | translate }}
+              </th>
+              <th md-column md-order-by="name">
+                {{ 'ANALYTICS.NAME' | translate }}
+              </th>
+              <th md-column md-order-by="description">
+                {{ 'ANALYTICS.DESCRIPTION' | translate }}
+              </th>
+              <th md-column md-order-by="createdAt">
+                {{ 'ANALYTICS.CREATED_AT' | translate }}
+              </th>
+              <th md-column width="10px"></th>
+            </tr>
+          </thead>
+          <tbody md-body>
+            <tr md-row ng-hide="vm.reports.rows.length">
+              <td md-cell colspan="5">
+                <div layout="row" layout-align="center center">
+                  <span translate="ANALYTICS.NO_AVAILABLE_INFO"
+                    >No Available Info</span
+                  >
+                </div>
+              </td>
+            </tr>
+            <tr
+              md-row
+              md-select="report"
+              md-select-id="id"
+              ng-repeat="report in vm.reports.rows"
+            >
+              <td
+                ng-click="!vm.crudPermissions.canEdit ? vm.currentNode.custom && vm.editstate(report, $event) : vm.currentNode.custom && vm.createOrEditReport($event, report)"
+                md-cell
+                class="id"
+              >
+                {{report.id}}
+              </td>
+              <td
+                ng-click="!vm.crudPermissions.canEdit ? vm.currentNode.custom && vm.editstate(report, $event) : vm.currentNode.custom && vm.createOrEditReport($event, report)"
+                md-cell
+                class="name"
+              >
+                {{report.name}}
+              </td>
+              <td
+                ng-click="!vm.crudPermissions.canEdit ? vm.currentNode.custom && vm.editstate(report, $event) : vm.currentNode.custom && vm.createOrEditReport($event, report)"
+                md-cell
+                class="description"
+              >
+                {{report.description}}
+              </td>
+              <td
+                ng-click="!vm.crudPermissions.canEdit ? vm.currentNode.custom && vm.editstate(report, $event) : vm.currentNode.custom && vm.createOrEditReport($event, report)"
+                md-cell
+                class="createdAt"
+              >
+                {{report.createdAt | date:'medium'}}
+              </td>
+              <td md-cell class="actions">
+                <md-menu>
+                  <md-button
+                    class="md-icon-button"
+                    aria-label="More"
+                    translate
+                    translate-attr-aria-label="ANALYTICS.MORE"
+                    ng-click="$mdMenu.open($event)"
+                  >
+                    <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                  </md-button>
+
+                  <md-menu-content width="3">
+                    <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                      <md-button
+                        ng-click="vm.copydialog(report, $event)"
+                        translate="ANALYTICS.COPY_REPORT"
+                      >
+                        Copy Report
+                      </md-button>
+                    </md-menu-item>
+                    <md-menu-item>
+                      <md-button
+                        ng-click="vm.previewdialog(report, $event)"
+                        translate="ANALYTICS.PREVIEW_REPORT"
+                      >
+                        Preview Report
+                      </md-button>
+                    </md-menu-item>
+                    <md-menu-item>
+                      <md-button
+                        ng-click="vm.rundialog(report, $event)"
+                        translate="ANALYTICS.RUN_REPORT"
+                      >
+                        Run Report
+                      </md-button>
+                    </md-menu-item>
+                    <md-menu-item>
+                      <md-button
+                        ng-click="vm.downloadfile(report, $event)"
+                        translate="ANALYTICS.DOWNLOAD_JSON_REPORT"
+                      >
+                        Download Json Report
+                      </md-button>
+                    </md-menu-item>
+                    <md-menu-divider
+                      ng-if="vm.crudPermissions.canEdit && vm.crudPermissions.canDelete && vm.currentNode.custom"
+                    >
+                    </md-menu-divider>
+                    <md-menu-item
+                      ng-if="vm.crudPermissions.canEdit && vm.currentNode.custom"
+                    >
+                      <md-button
+                        ng-click="vm.editstate(report, $event)"
+                        translate="ANALYTICS.EDIT_REPORT"
+                      >
+                        Edit Report
+                      </md-button>
+                    </md-menu-item>
+
+                    <md-menu-item
+                      ng-if="vm.crudPermissions.canDelete && vm.currentNode.custom"
+                    >
+                      <md-button
+                        ng-click="vm.deleteconfirm(report, $event)"
+                        translate="ANALYTICS.DELETE_REPORT"
+                      >
+                        Delete Report
+                      </md-button>
+                    </md-menu-item>
+                  </md-menu-content>
+                </md-menu>
+              </td>
+            </tr>
+          </tbody>
+        </table>
+      </md-table-container>
+
+      <md-table-pagination
+        md-label="{page: '{{'ANALYTICS.PAGE' | translate}}:', rowsPerPage: '{{'ANALYTICS.ROWSPERPAGE' | translate}}:', of: '{{'ANALYTICS.OF' | translate}}'}"
+        md-limit="vm.query.limit"
+        md-limit-options="[10, 15, 20, 50, 100, 250]"
+        md-page="vm.query.page"
+        md-total="{{vm.reports.count}}"
+        md-on-paginate="vm.getReports"
+        md-page-select
+      ></md-table-pagination>
+    </md-card>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- NO ADD BUTTON BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/analytics/views/reports/run/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/analytics/views/reports/run/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 72b406f..0000000
--- a/public/src/js/modules/main/apps/analytics/views/reports/run/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,254 +0,0 @@
-<md-dialog class="report-dialog" aria-label="Run Report">
-  <form name="reportForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title" translate="ANALYTICS.RUN_REPORT">Run Report</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="ANALYTICS.NAME">Name</label>
-        <input name="name" ng-model="vm.export.name" required md-autofocus />
-        <div
-          ng-messages="reportForm.name.$error"
-          ng-show="reportForm.name.$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="ANALYTICS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="ANALYTICS.FORMAT">FORMAT</label>
-        <md-select name="format" ng-model="vm.export.output" required>
-          <md-option value="csv">CSV</md-option>
-          <md-option value="xlsx">Excel (XLSX)</md-option>
-          <md-option value="pdf">PDF</md-option>
-          <md-option value="web">Web</md-option>
-        </md-select>
-        <div
-          ng-messages="reportForm.format.$error"
-          ng-show="reportForm.format.$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="ANALYTICS.ERRORS.FORMAT_REQUIRED"
-              >Format field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <div layout="row">
-        <div class="md-block" flex>
-          <mdp-date-picker
-            mdp-open-on-click
-            required
-            name="dateRangeFrom"
-            mdp-placeholder="Date Range From"
-            mdp-format="YYYY-MM-DD"
-            mdp-max-date="vm.dateRangeTo"
-            ng-model="vm.export.startDate"
-          >
-            <div
-              ng-messages="reportForm.dateRangeFrom.$error"
-              ng-show="reportForm.dateRangeFrom.$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="ANALYTICS.ERRORS.DATE_RANGE_FROM_REQUIRED"
-                  >Date Range From field is required</span
-                >
-              </div>
-              <div ng-message="format">
-                <span translate="ANALYTICS.ERRORS.DATE_RANGE_FROM_INVALID"
-                  >Date Range From field is invalid</span
-                >
-              </div>
-              <div ng-message="maxDate">
-                <span translate="ANALYTICS.ERRORS.DATE_RANGE_FROM_MAX_INVALID"
-                  >Date Range From Max field is invalid</span
-                >
-              </div>
-            </div>
-          </mdp-date-picker>
-        </div>
-        <div class="md-block" flex>
-          <mdp-date-picker
-            mdp-open-on-click
-            required
-            name="dateRangeTo"
-            mdp-placeholder="Date Range To"
-            mdp-format="YYYY-MM-DD"
-            mdp-min-date="vm.dateRangeFrom"
-            ng-model="vm.export.endDate"
-          >
-            <div
-              ng-messages="reportForm.dateRangeTo.$error"
-              ng-show="reportForm.dateRangeTo.$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="ANALYTICS.ERRORS.DATE_RANGE_TO_REQUIRED"
-                  >Date Range From field is required</span
-                >
-              </div>
-              <div ng-message="format">
-                <span translate="ANALYTICS.ERRORS.DATE_RANGE_TO_INVALID"
-                  >Date Range From field is invalid</span
-                >
-              </div>
-              <div ng-message="minDate">
-                <span translate="ANALYTICS.ERRORS.DATE_RANGE_FROM_MIN_INVALID"
-                  >Date Range From Min field is invalid</span
-                >
-              </div>
-            </div>
-          </mdp-date-picker>
-        </div>
-      </div>
-      <div layout="row">
-        <div class="md-block" flex>
-          <mdp-time-picker
-            required
-            name="timeRangeFrom"
-            mdp-placeholder="Time Range From"
-            mdp-format="HH:mm:ss"
-            mdp-auto-switch="true"
-            mdp-max-date="vm.dateRangeTo"
-            ng-model="vm.export.startDate"
-          >
-            <div
-              ng-messages="reportForm.timeRangeFrom.$error"
-              ng-show="reportForm.timeRangeFrom.$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="ANALYTICS.ERRORS.TIME_RANGE_FROM_REQUIRED"
-                  >Time Range From field is required</span
-                >
-              </div>
-              <div ng-message="format">
-                <span translate="ANALYTICS.ERRORS.TIME_RANGE_FROM_INVALID"
-                  >Time Range From field is invalid</span
-                >
-              </div>
-            </div>
-          </mdp-time-picker>
-        </div>
-        <div class="md-block" flex>
-          <mdp-time-picker
-            required
-            name="timeRangeTo"
-            mdp-placeholder="Time Range To"
-            mdp-format="HH:mm:ss"
-            mdp-auto-switch="true"
-            mdp-min-date="vm.dateRangeFrom"
-            ng-model="vm.export.endDate"
-          >
-            <div
-              ng-messages="reportForm.timeRangeTo.$error"
-              ng-show="reportForm.timeRangeTo.$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="ANALYTICS.ERRORS.TIME_RANGE_TO_REQUIRED"
-                  >Time Range From field is required</span
-                >
-              </div>
-              <div ng-message="format">
-                <span translate="ANALYTICS.ERRORS.TIME_RANGE_TO_INVALID"
-                  >Time Range From field is invalid</span
-                >
-              </div>
-            </div>
-          </mdp-time-picker>
-        </div>
-      </div>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-click="vm.runReport($event)"
-          class="send-button md-accent md-raised"
-          ng-disabled="reportForm.$invalid"
-          aria-label="RUN"
-          translate="ANALYTICS.RUN_REPORT"
-          translate-attr-aria-label="ANALYTICS.RUN_REPORT"
-        >
-          RUN REPORT
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-click="vm.refreshDate()"
-          aria-label="REFRESH"
-          translate
-          translate-attr-aria-label="ANALYTICS.REFRESH"
-        >
-          <md-icon md-font-icon="icon-refresh"></md-icon>
-          <md-tooltip
-            ><span translate="ANALYTICS.REFRESH">REFRESH</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/analytics/views/reports/run/dialog.html/dialog.html b/public/src/js/modules/main/apps/analytics/views/reports/run/dialog.html/dialog.html
new file mode 100644
index 0000000..72b406f
--- /dev/null
+++ b/public/src/js/modules/main/apps/analytics/views/reports/run/dialog.html/dialog.html
@@ -0,0 +1,254 @@
+<md-dialog class="report-dialog" aria-label="Run Report">
+  <form name="reportForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title" translate="ANALYTICS.RUN_REPORT">Run Report</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="ANALYTICS.NAME">Name</label>
+        <input name="name" ng-model="vm.export.name" required md-autofocus />
+        <div
+          ng-messages="reportForm.name.$error"
+          ng-show="reportForm.name.$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="ANALYTICS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="ANALYTICS.FORMAT">FORMAT</label>
+        <md-select name="format" ng-model="vm.export.output" required>
+          <md-option value="csv">CSV</md-option>
+          <md-option value="xlsx">Excel (XLSX)</md-option>
+          <md-option value="pdf">PDF</md-option>
+          <md-option value="web">Web</md-option>
+        </md-select>
+        <div
+          ng-messages="reportForm.format.$error"
+          ng-show="reportForm.format.$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="ANALYTICS.ERRORS.FORMAT_REQUIRED"
+              >Format field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <div layout="row">
+        <div class="md-block" flex>
+          <mdp-date-picker
+            mdp-open-on-click
+            required
+            name="dateRangeFrom"
+            mdp-placeholder="Date Range From"
+            mdp-format="YYYY-MM-DD"
+            mdp-max-date="vm.dateRangeTo"
+            ng-model="vm.export.startDate"
+          >
+            <div
+              ng-messages="reportForm.dateRangeFrom.$error"
+              ng-show="reportForm.dateRangeFrom.$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="ANALYTICS.ERRORS.DATE_RANGE_FROM_REQUIRED"
+                  >Date Range From field is required</span
+                >
+              </div>
+              <div ng-message="format">
+                <span translate="ANALYTICS.ERRORS.DATE_RANGE_FROM_INVALID"
+                  >Date Range From field is invalid</span
+                >
+              </div>
+              <div ng-message="maxDate">
+                <span translate="ANALYTICS.ERRORS.DATE_RANGE_FROM_MAX_INVALID"
+                  >Date Range From Max field is invalid</span
+                >
+              </div>
+            </div>
+          </mdp-date-picker>
+        </div>
+        <div class="md-block" flex>
+          <mdp-date-picker
+            mdp-open-on-click
+            required
+            name="dateRangeTo"
+            mdp-placeholder="Date Range To"
+            mdp-format="YYYY-MM-DD"
+            mdp-min-date="vm.dateRangeFrom"
+            ng-model="vm.export.endDate"
+          >
+            <div
+              ng-messages="reportForm.dateRangeTo.$error"
+              ng-show="reportForm.dateRangeTo.$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="ANALYTICS.ERRORS.DATE_RANGE_TO_REQUIRED"
+                  >Date Range From field is required</span
+                >
+              </div>
+              <div ng-message="format">
+                <span translate="ANALYTICS.ERRORS.DATE_RANGE_TO_INVALID"
+                  >Date Range From field is invalid</span
+                >
+              </div>
+              <div ng-message="minDate">
+                <span translate="ANALYTICS.ERRORS.DATE_RANGE_FROM_MIN_INVALID"
+                  >Date Range From Min field is invalid</span
+                >
+              </div>
+            </div>
+          </mdp-date-picker>
+        </div>
+      </div>
+      <div layout="row">
+        <div class="md-block" flex>
+          <mdp-time-picker
+            required
+            name="timeRangeFrom"
+            mdp-placeholder="Time Range From"
+            mdp-format="HH:mm:ss"
+            mdp-auto-switch="true"
+            mdp-max-date="vm.dateRangeTo"
+            ng-model="vm.export.startDate"
+          >
+            <div
+              ng-messages="reportForm.timeRangeFrom.$error"
+              ng-show="reportForm.timeRangeFrom.$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="ANALYTICS.ERRORS.TIME_RANGE_FROM_REQUIRED"
+                  >Time Range From field is required</span
+                >
+              </div>
+              <div ng-message="format">
+                <span translate="ANALYTICS.ERRORS.TIME_RANGE_FROM_INVALID"
+                  >Time Range From field is invalid</span
+                >
+              </div>
+            </div>
+          </mdp-time-picker>
+        </div>
+        <div class="md-block" flex>
+          <mdp-time-picker
+            required
+            name="timeRangeTo"
+            mdp-placeholder="Time Range To"
+            mdp-format="HH:mm:ss"
+            mdp-auto-switch="true"
+            mdp-min-date="vm.dateRangeFrom"
+            ng-model="vm.export.endDate"
+          >
+            <div
+              ng-messages="reportForm.timeRangeTo.$error"
+              ng-show="reportForm.timeRangeTo.$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="ANALYTICS.ERRORS.TIME_RANGE_TO_REQUIRED"
+                  >Time Range From field is required</span
+                >
+              </div>
+              <div ng-message="format">
+                <span translate="ANALYTICS.ERRORS.TIME_RANGE_TO_INVALID"
+                  >Time Range From field is invalid</span
+                >
+              </div>
+            </div>
+          </mdp-time-picker>
+        </div>
+      </div>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-click="vm.runReport($event)"
+          class="send-button md-accent md-raised"
+          ng-disabled="reportForm.$invalid"
+          aria-label="RUN"
+          translate="ANALYTICS.RUN_REPORT"
+          translate-attr-aria-label="ANALYTICS.RUN_REPORT"
+        >
+          RUN REPORT
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-click="vm.refreshDate()"
+          aria-label="REFRESH"
+          translate
+          translate-attr-aria-label="ANALYTICS.REFRESH"
+        >
+          <md-icon md-font-icon="icon-refresh"></md-icon>
+          <md-tooltip
+            ><span translate="ANALYTICS.REFRESH">REFRESH</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/analytics/views/reports/run/web/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/analytics/views/reports/run/web/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 89a36fc..0000000
--- a/public/src/js/modules/main/apps/analytics/views/reports/run/web/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,132 +0,0 @@
-<md-dialog class="web-dialog" aria-label="Show Report">
-  <form name="reportForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title" translate="ANALYTICS.PREVIEW_REPORT"
-          >Web Report</span
-        >
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <div class="md-block">
-        <div class="pb-16" layout="row" layout-align="start center">
-          <div
-            ng-if="vm.error"
-            class="h2 secondary-text"
-            translate="ANALYTICS.ERROR"
-          >
-            ERROR
-          </div>
-        </div>
-        <dl ng-if="vm.error">
-          <dt class="text-bold" translate="ANALYTICS.QUERY_ERROR">
-            Query Error
-          </dt>
-          <dd>{{vm.error.sql}}</dd>
-          <dt translate="ANALYTICS.MESSAGE">Message</dt>
-          <dd>{{vm.error.msg}}</dd>
-        </dl>
-        <md-table-container ng-if="!vm.error">
-          <table md-table md-progress="vm.promise">
-            <thead md-head>
-              <tr md-row>
-                <th md-column ng-repeat="column in vm.columns">
-                  {{column.alias || column.field}}
-                </th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-repeat="row in vm.results.rows">
-                <td md-cell ng-repeat="(key, value) in row">
-                  {{ vm.valueReplacer(key, value) }}
-                </td>
-              </tr>
-              <tr md-row ng-if="!vm.results.rows.length">
-                <td md-cell colspan="{{vm.columns.length}}">
-                  <div layout="row" layout-align="center center">
-                    <span translate="ANALYTICS.NO_DATA">NO DATA</span>
-                  </div>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'ANALYTICS.PAGE' | translate}}:', rowsPerPage: '{{'ANALYTICS.ROWSPERPAGE' | translate}}:', of: '{{'ANALYTICS.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.results.count}}"
-          md-on-paginate="vm.getResults"
-          md-page-select
-        ></md-table-pagination>
-      </div>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div flex></div>
-      <md-button
-        type="submit"
-        ng-click="vm.closeDialog()"
-        class="md-raised"
-        aria-label="CLOSE"
-        translate="ANALYTICS.CLOSE"
-        translate-attr-aria-label="ANALYTICS.CLOSE"
-      >
-        CLOSE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/analytics/views/reports/run/web/dialog.html/dialog.html b/public/src/js/modules/main/apps/analytics/views/reports/run/web/dialog.html/dialog.html
new file mode 100644
index 0000000..89a36fc
--- /dev/null
+++ b/public/src/js/modules/main/apps/analytics/views/reports/run/web/dialog.html/dialog.html
@@ -0,0 +1,132 @@
+<md-dialog class="web-dialog" aria-label="Show Report">
+  <form name="reportForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title" translate="ANALYTICS.PREVIEW_REPORT"
+          >Web Report</span
+        >
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <div class="md-block">
+        <div class="pb-16" layout="row" layout-align="start center">
+          <div
+            ng-if="vm.error"
+            class="h2 secondary-text"
+            translate="ANALYTICS.ERROR"
+          >
+            ERROR
+          </div>
+        </div>
+        <dl ng-if="vm.error">
+          <dt class="text-bold" translate="ANALYTICS.QUERY_ERROR">
+            Query Error
+          </dt>
+          <dd>{{vm.error.sql}}</dd>
+          <dt translate="ANALYTICS.MESSAGE">Message</dt>
+          <dd>{{vm.error.msg}}</dd>
+        </dl>
+        <md-table-container ng-if="!vm.error">
+          <table md-table md-progress="vm.promise">
+            <thead md-head>
+              <tr md-row>
+                <th md-column ng-repeat="column in vm.columns">
+                  {{column.alias || column.field}}
+                </th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-repeat="row in vm.results.rows">
+                <td md-cell ng-repeat="(key, value) in row">
+                  {{ vm.valueReplacer(key, value) }}
+                </td>
+              </tr>
+              <tr md-row ng-if="!vm.results.rows.length">
+                <td md-cell colspan="{{vm.columns.length}}">
+                  <div layout="row" layout-align="center center">
+                    <span translate="ANALYTICS.NO_DATA">NO DATA</span>
+                  </div>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'ANALYTICS.PAGE' | translate}}:', rowsPerPage: '{{'ANALYTICS.ROWSPERPAGE' | translate}}:', of: '{{'ANALYTICS.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.results.count}}"
+          md-on-paginate="vm.getResults"
+          md-page-select
+        ></md-table-pagination>
+      </div>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div flex></div>
+      <md-button
+        type="submit"
+        ng-click="vm.closeDialog()"
+        class="md-raised"
+        aria-label="CLOSE"
+        translate="ANALYTICS.CLOSE"
+        translate-attr-aria-label="ANALYTICS.CLOSE"
+      >
+        CLOSE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/callysquare/views/odbcs/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/callysquare/views/odbcs/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 25273ee..0000000
--- a/public/src/js/modules/main/apps/callysquare/views/odbcs/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,172 +0,0 @@
-<md-dialog class="odbc-dialog" aria-label="New Odbc">
-  <form name="odbcForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="CALLYSQUARE.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.odbc.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="odbcForm['name'].$error"
-          ng-show="odbcForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CALLYSQUARE.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CALLYSQUARE.DSN">DSN</label>
-        <input
-          type="text"
-          name="dsn"
-          ng-model="vm.odbc.dsn"
-          ng-required="true"
-        />
-
-        <div class="hint"><span translate="CALLYSQUARE.HELP.DSN"></span></div>
-        <div
-          ng-messages="odbcForm['dsn'].$error"
-          ng-show="odbcForm['dsn'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CALLYSQUARE.ERRORS.DSN_REQUIRED"
-              >DSN field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CALLYSQUARE.DESCRIPTION">Description</label>
-        <input type="text" name="description" ng-model="vm.odbc.description" />
-
-        <div
-          ng-messages="odbcForm['description'].$error"
-          ng-show="odbcForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CALLYSQUARE.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newOdbc"
-          ng-click="vm.saveOdbc()"
-          class="send-button md-accent md-raised"
-          ng-disabled="odbcForm.$invalid || odbcForm.$pristine"
-          aria-label="SAVE"
-          translate="CALLYSQUARE.SAVE"
-          translate-attr-aria-label="CALLYSQUARE.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newOdbc"
-          ng-click="vm.addNewOdbc()"
-          class="send-button md-accent md-raised"
-          ng-disabled="odbcForm.$invalid"
-          aria-label="ADD"
-          translate="CALLYSQUARE.ADD_ODBC"
-          translate-attr-aria-label="CALLYSQUARE.ADD_ODBC"
-        >
-          ADD ODBC
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newOdbc"
-          ng-click="vm.deleteOdbc($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="CALLYSQUARE.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="CALLYSQUARE.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/callysquare/views/odbcs/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/callysquare/views/odbcs/create/dialog.html/dialog.html
new file mode 100644
index 0000000..25273ee
--- /dev/null
+++ b/public/src/js/modules/main/apps/callysquare/views/odbcs/create/dialog.html/dialog.html
@@ -0,0 +1,172 @@
+<md-dialog class="odbc-dialog" aria-label="New Odbc">
+  <form name="odbcForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="CALLYSQUARE.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.odbc.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="odbcForm['name'].$error"
+          ng-show="odbcForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CALLYSQUARE.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CALLYSQUARE.DSN">DSN</label>
+        <input
+          type="text"
+          name="dsn"
+          ng-model="vm.odbc.dsn"
+          ng-required="true"
+        />
+
+        <div class="hint"><span translate="CALLYSQUARE.HELP.DSN"></span></div>
+        <div
+          ng-messages="odbcForm['dsn'].$error"
+          ng-show="odbcForm['dsn'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CALLYSQUARE.ERRORS.DSN_REQUIRED"
+              >DSN field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CALLYSQUARE.DESCRIPTION">Description</label>
+        <input type="text" name="description" ng-model="vm.odbc.description" />
+
+        <div
+          ng-messages="odbcForm['description'].$error"
+          ng-show="odbcForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CALLYSQUARE.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newOdbc"
+          ng-click="vm.saveOdbc()"
+          class="send-button md-accent md-raised"
+          ng-disabled="odbcForm.$invalid || odbcForm.$pristine"
+          aria-label="SAVE"
+          translate="CALLYSQUARE.SAVE"
+          translate-attr-aria-label="CALLYSQUARE.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newOdbc"
+          ng-click="vm.addNewOdbc()"
+          class="send-button md-accent md-raised"
+          ng-disabled="odbcForm.$invalid"
+          aria-label="ADD"
+          translate="CALLYSQUARE.ADD_ODBC"
+          translate-attr-aria-label="CALLYSQUARE.ADD_ODBC"
+        >
+          ADD ODBC
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newOdbc"
+          ng-click="vm.deleteOdbc($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="CALLYSQUARE.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="CALLYSQUARE.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/callysquare/views/odbcs/odbcs.html/odbcs-[chunkhash].html b/public/src/js/modules/main/apps/callysquare/views/odbcs/odbcs.html/odbcs-[chunkhash].html
deleted file mode 100644
index 859faf7..0000000
--- a/public/src/js/modules/main/apps/callysquare/views/odbcs/odbcs.html/odbcs-[chunkhash].html
+++ /dev/null
@@ -1,314 +0,0 @@
-<div
-  id="odbcs"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-sitemap" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="CALLYSQUARE.ODBC">ODBC</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="CALLYSQUARE.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedODBC.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedODBC =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="CALLYSQUARE.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-odbcs-count">
-          <span>{{vm.selectedODBC.length}}</span>
-          <span translate="CALLYSQUARE.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="CALLYSQUARE.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllODBC()"
-                translate="CALLYSQUARE.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectODBC()"
-                translate="CALLYSQUARE.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedODBC"
-          csv-label="true"
-          filename="odbcs.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedODBC($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="CALLYSQUARE.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- ODBC TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedODBC"
-            md-progress="vm.promise"
-          >
-            <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getODBC">
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">
-                  {{ 'CALLYSQUARE.ID' | translate }}
-                </th>
-                <th md-column md-order-by="name">
-                  {{ 'CALLYSQUARE.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="dsn">
-                  {{ 'CALLYSQUARE.DSN' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'CALLYSQUARE.DESCRIPTION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.odbcs.rows.length">
-                <td md-cell colspan="5">
-                  <div layout="row" layout-align="center center">
-                    <span translate="CALLYSQUARE.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="odbc"
-                md-select-id="id"
-                ng-repeat="odbc in vm.odbcs.rows"
-              >
-                <td md-cell ng-if="odbc.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{odbc.name}}"
-                    ng-src="api/users/{{odbc.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!odbc.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{odbc.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.createOrEditOdbc($event, odbc)"
-                  md-cell
-                  class="id"
-                >
-                  {{odbc.id}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditOdbc($event, odbc)"
-                  md-cell
-                  class="name"
-                >
-                  {{odbc.name}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditOdbc($event, odbc)"
-                  md-cell
-                  class="dsn"
-                >
-                  {{odbc.dsn}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditOdbc($event, odbc)"
-                  md-cell
-                  class="description"
-                >
-                  {{odbc.description}}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="CALLYSQUARE.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editdialog(odbc, $event    )"
-                          translate="CALLYSQUARE.EDIT_ODBC"
-                        >
-                          Edit Odbc
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.testtestOdbc(odbc, $event    )"
-                          translate="CALLYSQUARE.TEST_ODBC"
-                        >
-                          Test Odbc
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(odbc, $event    )"
-                          translate="CALLYSQUARE.DELETE_ODBC"
-                        >
-                          Delete Odbc
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'CALLYSQUARE.PAGE' | translate}}:', rowsPerPage: '{{'CALLYSQUARE.ROWSPERPAGE' | translate}}:', of: '{{'CALLYSQUARE.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.odbcs.count}}"
-          md-on-paginate="vm.getODBC"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / ODBC TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD ODBC BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-odbc-button"
-    ng-click="vm.createOrEditOdbc($event)"
-    aria-label="add odbc"
-    translate
-    translate-attr-aria-label="CALLYSQUARE.ADD_ODBC"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD ODBC BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/callysquare/views/odbcs/odbcs.html/odbcs.html b/public/src/js/modules/main/apps/callysquare/views/odbcs/odbcs.html/odbcs.html
new file mode 100644
index 0000000..859faf7
--- /dev/null
+++ b/public/src/js/modules/main/apps/callysquare/views/odbcs/odbcs.html/odbcs.html
@@ -0,0 +1,314 @@
+<div
+  id="odbcs"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-sitemap" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="CALLYSQUARE.ODBC">ODBC</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="CALLYSQUARE.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedODBC.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedODBC =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="CALLYSQUARE.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-odbcs-count">
+          <span>{{vm.selectedODBC.length}}</span>
+          <span translate="CALLYSQUARE.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="CALLYSQUARE.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllODBC()"
+                translate="CALLYSQUARE.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectODBC()"
+                translate="CALLYSQUARE.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedODBC"
+          csv-label="true"
+          filename="odbcs.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedODBC($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="CALLYSQUARE.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- ODBC TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedODBC"
+            md-progress="vm.promise"
+          >
+            <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getODBC">
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">
+                  {{ 'CALLYSQUARE.ID' | translate }}
+                </th>
+                <th md-column md-order-by="name">
+                  {{ 'CALLYSQUARE.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="dsn">
+                  {{ 'CALLYSQUARE.DSN' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'CALLYSQUARE.DESCRIPTION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.odbcs.rows.length">
+                <td md-cell colspan="5">
+                  <div layout="row" layout-align="center center">
+                    <span translate="CALLYSQUARE.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="odbc"
+                md-select-id="id"
+                ng-repeat="odbc in vm.odbcs.rows"
+              >
+                <td md-cell ng-if="odbc.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{odbc.name}}"
+                    ng-src="api/users/{{odbc.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!odbc.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{odbc.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.createOrEditOdbc($event, odbc)"
+                  md-cell
+                  class="id"
+                >
+                  {{odbc.id}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditOdbc($event, odbc)"
+                  md-cell
+                  class="name"
+                >
+                  {{odbc.name}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditOdbc($event, odbc)"
+                  md-cell
+                  class="dsn"
+                >
+                  {{odbc.dsn}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditOdbc($event, odbc)"
+                  md-cell
+                  class="description"
+                >
+                  {{odbc.description}}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="CALLYSQUARE.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editdialog(odbc, $event    )"
+                          translate="CALLYSQUARE.EDIT_ODBC"
+                        >
+                          Edit Odbc
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.testtestOdbc(odbc, $event    )"
+                          translate="CALLYSQUARE.TEST_ODBC"
+                        >
+                          Test Odbc
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(odbc, $event    )"
+                          translate="CALLYSQUARE.DELETE_ODBC"
+                        >
+                          Delete Odbc
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'CALLYSQUARE.PAGE' | translate}}:', rowsPerPage: '{{'CALLYSQUARE.ROWSPERPAGE' | translate}}:', of: '{{'CALLYSQUARE.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.odbcs.count}}"
+          md-on-paginate="vm.getODBC"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / ODBC TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD ODBC BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-odbc-button"
+    ng-click="vm.createOrEditOdbc($event)"
+    aria-label="add odbc"
+    translate
+    translate-attr-aria-label="CALLYSQUARE.ADD_ODBC"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD ODBC BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/callysquare/views/projects/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/callysquare/views/projects/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 07356d4..0000000
--- a/public/src/js/modules/main/apps/callysquare/views/projects/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,163 +0,0 @@
-<md-dialog class="project-dialog" aria-label="New Project">
-  <form name="projectForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{vm.title | translate}}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="CALLYSQUARE.NAME">Name</label>
-        <input
-          name="name"
-          ng-model="vm.project.name"
-          required
-          md-autofocus
-          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-          ng-disabled="!vm.newProject"
-        />
-        <div
-          ng-messages="projectForm.name.$error"
-          ng-show="projectForm.name.$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CALLYSQUARE.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span
-              translate="VOICE.ERRORS.NAME_MUST_VALID_PATTERN"
-              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-              >Name must be valid pattern
-            </span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CALLYSQUARE.DESCRIPTION">Description</label>
-        <input name="description" ng-model="vm.project.description" />
-        <div
-          ng-messages="projectForm.description.$error"
-          ng-show="projectForm.description.$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CALLYSQUARE.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container ng-if="vm.openFromEditor" class="md-block"
-        ><!-- Added to check if I'm opening the dialog directly from the square editor -->
-        <md-switch
-          ng-model="vm.newWindow"
-          aria-label="{{'CALLYSQUARE.OPEN_NEW_WINDOW' | translate }}"
-          ><span translate="CALLYSQUARE.OPEN_NEW_WINDOW"></span
-        ></md-switch>
-      </md-input-container>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-if="!vm.newProject"
-          ng-click="vm.saveProject()"
-          class="send-button md-accent md-raised"
-          ng-disabled="projectForm.$invalid || projectForm.$pristine"
-          aria-label="SAVE"
-          translate="CALLYSQUARE.SAVE"
-          translate-attr-aria-label="CALLYSQUARE.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.newProject"
-          ng-click="vm.addNewProject()"
-          class="send-button md-accent md-raised"
-          ng-disabled="projectForm.$invalid || projectForm.$pristine"
-          aria-label="ADD"
-          translate="CALLYSQUARE.ADD_PROJECT"
-          translate-attr-aria-label="CALLYSQUARE.ADD_PROJECT"
-        >
-          ADD PROJECT
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newProject"
-          ng-click="vm.deleteProject($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="CALLYSQUARE.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="CALLYSQUARE.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/callysquare/views/projects/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/callysquare/views/projects/create/dialog.html/dialog.html
new file mode 100644
index 0000000..07356d4
--- /dev/null
+++ b/public/src/js/modules/main/apps/callysquare/views/projects/create/dialog.html/dialog.html
@@ -0,0 +1,163 @@
+<md-dialog class="project-dialog" aria-label="New Project">
+  <form name="projectForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{vm.title | translate}}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="CALLYSQUARE.NAME">Name</label>
+        <input
+          name="name"
+          ng-model="vm.project.name"
+          required
+          md-autofocus
+          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+          ng-disabled="!vm.newProject"
+        />
+        <div
+          ng-messages="projectForm.name.$error"
+          ng-show="projectForm.name.$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CALLYSQUARE.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span
+              translate="VOICE.ERRORS.NAME_MUST_VALID_PATTERN"
+              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+              >Name must be valid pattern
+            </span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CALLYSQUARE.DESCRIPTION">Description</label>
+        <input name="description" ng-model="vm.project.description" />
+        <div
+          ng-messages="projectForm.description.$error"
+          ng-show="projectForm.description.$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CALLYSQUARE.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container ng-if="vm.openFromEditor" class="md-block"
+        ><!-- Added to check if I'm opening the dialog directly from the square editor -->
+        <md-switch
+          ng-model="vm.newWindow"
+          aria-label="{{'CALLYSQUARE.OPEN_NEW_WINDOW' | translate }}"
+          ><span translate="CALLYSQUARE.OPEN_NEW_WINDOW"></span
+        ></md-switch>
+      </md-input-container>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-if="!vm.newProject"
+          ng-click="vm.saveProject()"
+          class="send-button md-accent md-raised"
+          ng-disabled="projectForm.$invalid || projectForm.$pristine"
+          aria-label="SAVE"
+          translate="CALLYSQUARE.SAVE"
+          translate-attr-aria-label="CALLYSQUARE.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.newProject"
+          ng-click="vm.addNewProject()"
+          class="send-button md-accent md-raised"
+          ng-disabled="projectForm.$invalid || projectForm.$pristine"
+          aria-label="ADD"
+          translate="CALLYSQUARE.ADD_PROJECT"
+          translate-attr-aria-label="CALLYSQUARE.ADD_PROJECT"
+        >
+          ADD PROJECT
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newProject"
+          ng-click="vm.deleteProject($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="CALLYSQUARE.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="CALLYSQUARE.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/callysquare/views/projects/edit/dialog/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/callysquare/views/projects/edit/dialog/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 8b87954..0000000
--- a/public/src/js/modules/main/apps/callysquare/views/projects/edit/dialog/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,266 +0,0 @@
-<md-dialog class="project-dialog" aria-label="New dialog" ng-init="vm.onInit()">
-  <form name="dialogForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title"
-          ><span translate="CALLYSQUARE.EDIT"></span>
-          <span translate="CALLYSQUARE.{{vm.cellName | uppercase}}"></span
-        ></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content ms-scroll>
-      <md-input-container
-        class="md-block"
-        ng-repeat="attribute in vm.attributes"
-        ng-switch="attribute.name"
-      >
-        <label translate="CALLYSQUARE.{{attribute.name | uppercase}}"
-          >{{attribute.name | ucfirst }}</label
-        >
-
-        <!--  START SELECT INPUT -->
-        <md-select
-          name="{{attribute.name}}"
-          ng-model="attribute.value"
-          ng-disabled="!vm.crudPermissions.canEdit"
-          ng-switch-when-separator="|"
-          ng-switch-when="answer|trunk_name|trunk_id|queue_id|file_id|variable_id|google_cloud_tts_text_type|google_tts_language|ispeech_tts_language|ispeech_asr_language|google_asr_language|hiddendigitspos|odbc_id|project_id|beep|account_id|interval_id|template_id|list_id|recordingFormat|callback_priority|aws_polly_voice|aws_polly_region|aws_lex_region|sms_account_id|findBy|pause_id|aws_text_type|dialogflow_language|ndagenerate_audio|ndaactivity_type|languageCode|ssmlGender|method"
-          ng-required="attribute.required"
-        >
-          <md-option ng-if="attribute.defaultValue" ng-value="''">
-            - None -
-          </md-option>
-          <md-option
-            value="{{v.value}}"
-            ng-repeat="v in vm.values[attribute.name]"
-            ng-disabled="v.canSelect === false"
-            >{{v.option}}</md-option
-          >
-          <md-option ng-if="!vm.values[attribute.name].length" value="-1"
-            >No {{attribute.name}} available!</md-option
-          >
-        </md-select>
-        <!--  END SELECT INPUT -->
-
-        <!--  START SELECT INPUT -->
-        <md-select
-          name="{{attribute.name}}"
-          ng-model="attribute.value"
-          ng-disabled="!vm.crudPermissions.canEdit"
-          ng-switch-when-separator="|"
-          ng-switch-when="sip_id"
-          ng-required="attribute.required"
-        >
-          <md-optgroup label="{{'CALLYSQUARE.AGENTS' | translate}}">
-            <md-option
-              value="{{v.value}}"
-              ng-repeat="v in vm.values[attribute.name]"
-              ng-if="v.group === 'agent'"
-              ng-disabled="v.canSelect === false"
-              >{{v.option}}</md-option
-            >
-          </md-optgroup>
-          <md-optgroup label="{{'CALLYSQUARE.TELEPHONES' | translate}}">
-            <md-option
-              value="{{v.value}}"
-              ng-repeat="v in vm.values[attribute.name]"
-              ng-if="v.group === 'telephone'"
-              ng-disabled="v.canSelect === false"
-              >{{v.option}}</md-option
-            >
-          </md-optgroup>
-          <md-optgroup label="{{'CALLYSQUARE.USERS' | translate}}">
-            <md-option
-              value="{{v.value}}"
-              ng-repeat="v in vm.values[attribute.name]"
-              ng-if="v.group === 'admin' || v.group === 'user'"
-              >{{v.option}}</md-option
-            >
-          </md-optgroup>
-          <md-option ng-if="!vm.values[attribute.name].length" value="-1"
-            >No {{attribute.name}} available!</md-option
-          >
-        </md-select>
-        <!--  END SELECT INPUT -->
-
-        <!--  START NUMBER INPUT -->
-        <div ng-switch-when="timeout">
-          <div ng-switch="vm.cellName">
-            <input
-              ng-switch-when-separator="|"
-              ng-switch-when="answer|ext_dial|dial|queue"
-              type="number"
-              step="any"
-              name="{{attribute.name}}"
-              min="0"
-              ng-model="attribute.value"
-              ng-required="attribute.required"
-              ng-disabled="!vm.crudPermissions.canEdit"
-              string-to-number
-            />
-            <input
-              ng-switch-when-separator="|"
-              ng-switch-when="record|ispeechasr|googleasr"
-              type="number"
-              step="any"
-              name="{{attribute.name}}"
-              min="-1"
-              ng-model="attribute.value"
-              ng-required="attribute.required"
-              ng-disabled="!vm.crudPermissions.canEdit"
-              string-to-number
-            />
-            <input
-              ng-switch-when-separator="|"
-              ng-switch-when="restapi"
-              type="number"
-              step="any"
-              name="{{attribute.name}}"
-              min="1"
-              ng-model="attribute.value"
-              ng-required="attribute.required"
-              ng-disabled="!vm.crudPermissions.canEdit"
-              string-to-number
-            />
-            <input
-              ng-switch-default
-              type="number"
-              step="any"
-              name="{{attribute.name}}"
-              min="0"
-              ng-model="attribute.value"
-              ng-required="attribute.required"
-              ng-disabled="!vm.crudPermissions.canEdit"
-              string-to-number
-            />
-          </div>
-        </div>
-        <input
-          ng-switch-when-separator="|"
-          ng-switch-when="speed"
-          type="number"
-          step="any"
-          name="{{attribute.name}}"
-          min="-10"
-          max="-10"
-          ng-model="attribute.value"
-          ng-required="attribute.required"
-          ng-disabled="!vm.crudPermissions.canEdit"
-          string-to-number
-        />
-        <input
-          ng-switch-when-separator="|"
-          ng-switch-when="maxdigit|mindigit|digit"
-          type="number"
-          step="any"
-          name="{{attribute.name}}"
-          min="1"
-          ng-model="attribute.value"
-          ng-required="attribute.required"
-          ng-disabled="!vm.crudPermissions.canEdit"
-          string-to-number
-        />
-        <input
-          ng-switch-when-separator="|"
-          ng-switch-when="retry|response|hiddendigitsnum|priority"
-          type="number"
-          step="any"
-          name="{{attribute.name}}"
-          min="1"
-          ng-model="attribute.value"
-          ng-required="attribute.required"
-          ng-disabled="!vm.crudPermissions.canEdit"
-          string-to-number
-        />
-        <!--  END NUMBER INPUT -->
-
-        <!--  START TEXTAREA INPUT -->
-        <textarea
-          name="{{attribute.name}}"
-          ng-model="attribute.value"
-          ng-switch-when-separator="|"
-          ng-switch-when="query|sms_text|condition|text|custom_action_data|headers|body|rawHeaders|rawBody"
-          ng-required="attribute.required"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        ></textarea>
-        <!--  END TEXTAREA INPUT -->
-
-        <!-- START URL INPUT -->
-        <input
-          ng-switch-when-separator="|"
-          ng-switch-when="ndauth_url|ndassistant_url|url"
-          type="url"
-          name="{{attribute.name}}"
-          ng-model="attribute.value"
-          ng-required="attribute.required"
-        />
-        <!-- END URL INPUT -->
-
-        <!--  START TEXT INPUT -->
-        <input
-          ng-switch-default
-          name="{{attribute.name}}"
-          ng-model="attribute.value"
-          ng-required="attribute.required"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-        <div
-          class="hint"
-          ng-if="attribute.name === 'text' && vm.cellName === 'tts' "
-        >
-          <span translate="CALLYSQUARE.HELP.MAX_TEXT_TTS" class="ng-scope"
-            >Max 250 chars are supported</span
-          >
-        </div>
-        <!--  END TEXT INPUT-->
-
-        <div class="hint" ng-if="attribute.help">
-          <span
-            translate="CALLYSQUARE.HELP.{{attribute.name | uppercase}}"
-          ></span>
-        </div>
-        <div
-          ng-messages="dialogForm[attribute.name].$error"
-          ng-show="dialogForm[attribute.name].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CALLYSQUARE.ERRORS.FIELD_REQUIRED"
-              >The field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-click="vm.closeDialog(true)"
-          class="send-button md-accent md-raised"
-          ng-disabled="dialogForm.$invalid || dialogForm.$pristine"
-          aria-label="SAVE"
-          translate="CALLYSQUARE.SAVE"
-          translate-attr-aria-label="CALLYSQUARE.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/callysquare/views/projects/edit/dialog/dialog.html/dialog.html b/public/src/js/modules/main/apps/callysquare/views/projects/edit/dialog/dialog.html/dialog.html
new file mode 100644
index 0000000..8b87954
--- /dev/null
+++ b/public/src/js/modules/main/apps/callysquare/views/projects/edit/dialog/dialog.html/dialog.html
@@ -0,0 +1,266 @@
+<md-dialog class="project-dialog" aria-label="New dialog" ng-init="vm.onInit()">
+  <form name="dialogForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title"
+          ><span translate="CALLYSQUARE.EDIT"></span>
+          <span translate="CALLYSQUARE.{{vm.cellName | uppercase}}"></span
+        ></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content ms-scroll>
+      <md-input-container
+        class="md-block"
+        ng-repeat="attribute in vm.attributes"
+        ng-switch="attribute.name"
+      >
+        <label translate="CALLYSQUARE.{{attribute.name | uppercase}}"
+          >{{attribute.name | ucfirst }}</label
+        >
+
+        <!--  START SELECT INPUT -->
+        <md-select
+          name="{{attribute.name}}"
+          ng-model="attribute.value"
+          ng-disabled="!vm.crudPermissions.canEdit"
+          ng-switch-when-separator="|"
+          ng-switch-when="answer|trunk_name|trunk_id|queue_id|file_id|variable_id|google_cloud_tts_text_type|google_tts_language|ispeech_tts_language|ispeech_asr_language|google_asr_language|hiddendigitspos|odbc_id|project_id|beep|account_id|interval_id|template_id|list_id|recordingFormat|callback_priority|aws_polly_voice|aws_polly_region|aws_lex_region|sms_account_id|findBy|pause_id|aws_text_type|dialogflow_language|ndagenerate_audio|ndaactivity_type|languageCode|ssmlGender|method"
+          ng-required="attribute.required"
+        >
+          <md-option ng-if="attribute.defaultValue" ng-value="''">
+            - None -
+          </md-option>
+          <md-option
+            value="{{v.value}}"
+            ng-repeat="v in vm.values[attribute.name]"
+            ng-disabled="v.canSelect === false"
+            >{{v.option}}</md-option
+          >
+          <md-option ng-if="!vm.values[attribute.name].length" value="-1"
+            >No {{attribute.name}} available!</md-option
+          >
+        </md-select>
+        <!--  END SELECT INPUT -->
+
+        <!--  START SELECT INPUT -->
+        <md-select
+          name="{{attribute.name}}"
+          ng-model="attribute.value"
+          ng-disabled="!vm.crudPermissions.canEdit"
+          ng-switch-when-separator="|"
+          ng-switch-when="sip_id"
+          ng-required="attribute.required"
+        >
+          <md-optgroup label="{{'CALLYSQUARE.AGENTS' | translate}}">
+            <md-option
+              value="{{v.value}}"
+              ng-repeat="v in vm.values[attribute.name]"
+              ng-if="v.group === 'agent'"
+              ng-disabled="v.canSelect === false"
+              >{{v.option}}</md-option
+            >
+          </md-optgroup>
+          <md-optgroup label="{{'CALLYSQUARE.TELEPHONES' | translate}}">
+            <md-option
+              value="{{v.value}}"
+              ng-repeat="v in vm.values[attribute.name]"
+              ng-if="v.group === 'telephone'"
+              ng-disabled="v.canSelect === false"
+              >{{v.option}}</md-option
+            >
+          </md-optgroup>
+          <md-optgroup label="{{'CALLYSQUARE.USERS' | translate}}">
+            <md-option
+              value="{{v.value}}"
+              ng-repeat="v in vm.values[attribute.name]"
+              ng-if="v.group === 'admin' || v.group === 'user'"
+              >{{v.option}}</md-option
+            >
+          </md-optgroup>
+          <md-option ng-if="!vm.values[attribute.name].length" value="-1"
+            >No {{attribute.name}} available!</md-option
+          >
+        </md-select>
+        <!--  END SELECT INPUT -->
+
+        <!--  START NUMBER INPUT -->
+        <div ng-switch-when="timeout">
+          <div ng-switch="vm.cellName">
+            <input
+              ng-switch-when-separator="|"
+              ng-switch-when="answer|ext_dial|dial|queue"
+              type="number"
+              step="any"
+              name="{{attribute.name}}"
+              min="0"
+              ng-model="attribute.value"
+              ng-required="attribute.required"
+              ng-disabled="!vm.crudPermissions.canEdit"
+              string-to-number
+            />
+            <input
+              ng-switch-when-separator="|"
+              ng-switch-when="record|ispeechasr|googleasr"
+              type="number"
+              step="any"
+              name="{{attribute.name}}"
+              min="-1"
+              ng-model="attribute.value"
+              ng-required="attribute.required"
+              ng-disabled="!vm.crudPermissions.canEdit"
+              string-to-number
+            />
+            <input
+              ng-switch-when-separator="|"
+              ng-switch-when="restapi"
+              type="number"
+              step="any"
+              name="{{attribute.name}}"
+              min="1"
+              ng-model="attribute.value"
+              ng-required="attribute.required"
+              ng-disabled="!vm.crudPermissions.canEdit"
+              string-to-number
+            />
+            <input
+              ng-switch-default
+              type="number"
+              step="any"
+              name="{{attribute.name}}"
+              min="0"
+              ng-model="attribute.value"
+              ng-required="attribute.required"
+              ng-disabled="!vm.crudPermissions.canEdit"
+              string-to-number
+            />
+          </div>
+        </div>
+        <input
+          ng-switch-when-separator="|"
+          ng-switch-when="speed"
+          type="number"
+          step="any"
+          name="{{attribute.name}}"
+          min="-10"
+          max="-10"
+          ng-model="attribute.value"
+          ng-required="attribute.required"
+          ng-disabled="!vm.crudPermissions.canEdit"
+          string-to-number
+        />
+        <input
+          ng-switch-when-separator="|"
+          ng-switch-when="maxdigit|mindigit|digit"
+          type="number"
+          step="any"
+          name="{{attribute.name}}"
+          min="1"
+          ng-model="attribute.value"
+          ng-required="attribute.required"
+          ng-disabled="!vm.crudPermissions.canEdit"
+          string-to-number
+        />
+        <input
+          ng-switch-when-separator="|"
+          ng-switch-when="retry|response|hiddendigitsnum|priority"
+          type="number"
+          step="any"
+          name="{{attribute.name}}"
+          min="1"
+          ng-model="attribute.value"
+          ng-required="attribute.required"
+          ng-disabled="!vm.crudPermissions.canEdit"
+          string-to-number
+        />
+        <!--  END NUMBER INPUT -->
+
+        <!--  START TEXTAREA INPUT -->
+        <textarea
+          name="{{attribute.name}}"
+          ng-model="attribute.value"
+          ng-switch-when-separator="|"
+          ng-switch-when="query|sms_text|condition|text|custom_action_data|headers|body|rawHeaders|rawBody"
+          ng-required="attribute.required"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        ></textarea>
+        <!--  END TEXTAREA INPUT -->
+
+        <!-- START URL INPUT -->
+        <input
+          ng-switch-when-separator="|"
+          ng-switch-when="ndauth_url|ndassistant_url|url"
+          type="url"
+          name="{{attribute.name}}"
+          ng-model="attribute.value"
+          ng-required="attribute.required"
+        />
+        <!-- END URL INPUT -->
+
+        <!--  START TEXT INPUT -->
+        <input
+          ng-switch-default
+          name="{{attribute.name}}"
+          ng-model="attribute.value"
+          ng-required="attribute.required"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+        <div
+          class="hint"
+          ng-if="attribute.name === 'text' && vm.cellName === 'tts' "
+        >
+          <span translate="CALLYSQUARE.HELP.MAX_TEXT_TTS" class="ng-scope"
+            >Max 250 chars are supported</span
+          >
+        </div>
+        <!--  END TEXT INPUT-->
+
+        <div class="hint" ng-if="attribute.help">
+          <span
+            translate="CALLYSQUARE.HELP.{{attribute.name | uppercase}}"
+          ></span>
+        </div>
+        <div
+          ng-messages="dialogForm[attribute.name].$error"
+          ng-show="dialogForm[attribute.name].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CALLYSQUARE.ERRORS.FIELD_REQUIRED"
+              >The field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-click="vm.closeDialog(true)"
+          class="send-button md-accent md-raised"
+          ng-disabled="dialogForm.$invalid || dialogForm.$pristine"
+          aria-label="SAVE"
+          translate="CALLYSQUARE.SAVE"
+          translate-attr-aria-label="CALLYSQUARE.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/callysquare/views/projects/edit/edit/edit.html/edit-[chunkhash].html b/public/src/js/modules/main/apps/callysquare/views/projects/edit/edit/edit.html/edit-[chunkhash].html
deleted file mode 100644
index b5862f3..0000000
--- a/public/src/js/modules/main/apps/callysquare/views/projects/edit/edit/edit.html/edit-[chunkhash].html
+++ /dev/null
@@ -1,86 +0,0 @@
-<md-dialog class="project-dialog" aria-label="New dialog">
-  <form name="editForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title"
-          ><span translate="CALLYSQUARE.EDIT_XML"></span
-        ></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label>XML</label>
-        <textarea
-          name="preproduction"
-          ng-model="vm.project.preproduction"
-        ></textarea>
-      </md-input-container>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-click="vm.closeDialog(true)"
-          class="send-button md-accent md-raised"
-          ng-disabled="editForm.$invalid"
-          aria-label="SAVE"
-          translate="CALLYSQUARE.SAVE"
-          translate-attr-aria-label="CALLYSQUARE.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/callysquare/views/projects/edit/edit/edit.html/edit.html b/public/src/js/modules/main/apps/callysquare/views/projects/edit/edit/edit.html/edit.html
new file mode 100644
index 0000000..b5862f3
--- /dev/null
+++ b/public/src/js/modules/main/apps/callysquare/views/projects/edit/edit/edit.html/edit.html
@@ -0,0 +1,86 @@
+<md-dialog class="project-dialog" aria-label="New dialog">
+  <form name="editForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title"
+          ><span translate="CALLYSQUARE.EDIT_XML"></span
+        ></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label>XML</label>
+        <textarea
+          name="preproduction"
+          ng-model="vm.project.preproduction"
+        ></textarea>
+      </md-input-container>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-click="vm.closeDialog(true)"
+          class="send-button md-accent md-raised"
+          ng-disabled="editForm.$invalid"
+          aria-label="SAVE"
+          translate="CALLYSQUARE.SAVE"
+          translate-attr-aria-label="CALLYSQUARE.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/callysquare/views/projects/edit/import/import.html/import-[chunkhash].html b/public/src/js/modules/main/apps/callysquare/views/projects/edit/import/import.html/import-[chunkhash].html
deleted file mode 100644
index 7183724..0000000
--- a/public/src/js/modules/main/apps/callysquare/views/projects/edit/import/import.html/import-[chunkhash].html
+++ /dev/null
@@ -1,104 +0,0 @@
-<md-dialog class="project-dialog" aria-label="New dialog">
-  <form name="importForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title"
-          ><span translate="CALLYSQUARE.IMPORT_XML"></span
-        ></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <div
-        id="xml-uploader"
-        flow-init="vm.ngFlowOptions"
-        flow-name="vm.ngFlow.flow"
-        flow-file-added="vm.fileAdded($file)"
-        flow-drop
-        flow-drag-enter="vm.dropping=true"
-        flow-drag-leave="vm.dropping=false"
-        ng-class="{'dropping':vm.dropping}"
-      >
-        <div
-          class="drop-text hint-text"
-          layout="row"
-          layout-align="center center"
-        >
-          <span translate="CALLYSQUARE.DROP_TO_UPLOAD">Drop to upload</span>
-        </div>
-
-        <div class="upload-button" layout="column" layout-align="center center">
-          <md-button class="md-accent md-raised" flow-btn> Upload </md-button>
-          <span
-            class="secondary-text mt-8"
-            translate="CALLYSQUARE.DROP_TO_UPLOAD_MESSAGE"
-            >You can also drop files here to upload. Only XML - Max. 5MB</span
-          >
-        </div>
-      </div>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-click="vm.closeDialog()"
-          class="send-button md-accent md-raised"
-          ng-disabled="importForm.$invalid"
-          aria-label="CLOSE"
-          translate="CALLYSQUARE.CLOSE"
-          translate-attr-aria-label="CALLYSQUARE.CLOSE"
-        >
-          CLOSE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/callysquare/views/projects/edit/import/import.html/import.html b/public/src/js/modules/main/apps/callysquare/views/projects/edit/import/import.html/import.html
new file mode 100644
index 0000000..7183724
--- /dev/null
+++ b/public/src/js/modules/main/apps/callysquare/views/projects/edit/import/import.html/import.html
@@ -0,0 +1,104 @@
+<md-dialog class="project-dialog" aria-label="New dialog">
+  <form name="importForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title"
+          ><span translate="CALLYSQUARE.IMPORT_XML"></span
+        ></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <div
+        id="xml-uploader"
+        flow-init="vm.ngFlowOptions"
+        flow-name="vm.ngFlow.flow"
+        flow-file-added="vm.fileAdded($file)"
+        flow-drop
+        flow-drag-enter="vm.dropping=true"
+        flow-drag-leave="vm.dropping=false"
+        ng-class="{'dropping':vm.dropping}"
+      >
+        <div
+          class="drop-text hint-text"
+          layout="row"
+          layout-align="center center"
+        >
+          <span translate="CALLYSQUARE.DROP_TO_UPLOAD">Drop to upload</span>
+        </div>
+
+        <div class="upload-button" layout="column" layout-align="center center">
+          <md-button class="md-accent md-raised" flow-btn> Upload </md-button>
+          <span
+            class="secondary-text mt-8"
+            translate="CALLYSQUARE.DROP_TO_UPLOAD_MESSAGE"
+            >You can also drop files here to upload. Only XML - Max. 5MB</span
+          >
+        </div>
+      </div>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-click="vm.closeDialog()"
+          class="send-button md-accent md-raised"
+          ng-disabled="importForm.$invalid"
+          aria-label="CLOSE"
+          translate="CALLYSQUARE.CLOSE"
+          translate-attr-aria-label="CALLYSQUARE.CLOSE"
+        >
+          CLOSE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/callysquare/views/projects/edit/info/info.html/info-[chunkhash].html b/public/src/js/modules/main/apps/callysquare/views/projects/edit/info/info.html/info-[chunkhash].html
deleted file mode 100644
index d9e2b53..0000000
--- a/public/src/js/modules/main/apps/callysquare/views/projects/edit/info/info.html/info-[chunkhash].html
+++ /dev/null
@@ -1,91 +0,0 @@
-<md-dialog class="project-dialog" aria-label="New dialog">
-  <form name="descriptionFrom" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title"
-          ><span translate="CALLYSQUARE.UPDATE_INFO"></span
-        ></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="CALLYSQUARE.DESCRIPTION">Description</label>
-        <input
-          name="description"
-          ng-model="vm.project.description"
-          md-autofocus
-        />
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CALLYSQUARE.NOTES">Description</label>
-        <textarea name="notes" ng-model="vm.project.notes"></textarea>
-      </md-input-container>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-click="vm.save()"
-          class="send-button md-accent md-raised"
-          ng-disabled="descriptionFrom.$invalid"
-          aria-label="SAVE"
-          translate="CALLYSQUARE.UPDATE_INFO"
-          translate-attr-aria-label="CALLYSQUARE.UPDATE"
-        >
-          UPDATE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/callysquare/views/projects/edit/info/info.html/info.html b/public/src/js/modules/main/apps/callysquare/views/projects/edit/info/info.html/info.html
new file mode 100644
index 0000000..d9e2b53
--- /dev/null
+++ b/public/src/js/modules/main/apps/callysquare/views/projects/edit/info/info.html/info.html
@@ -0,0 +1,91 @@
+<md-dialog class="project-dialog" aria-label="New dialog">
+  <form name="descriptionFrom" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title"
+          ><span translate="CALLYSQUARE.UPDATE_INFO"></span
+        ></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="CALLYSQUARE.DESCRIPTION">Description</label>
+        <input
+          name="description"
+          ng-model="vm.project.description"
+          md-autofocus
+        />
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CALLYSQUARE.NOTES">Description</label>
+        <textarea name="notes" ng-model="vm.project.notes"></textarea>
+      </md-input-container>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-click="vm.save()"
+          class="send-button md-accent md-raised"
+          ng-disabled="descriptionFrom.$invalid"
+          aria-label="SAVE"
+          translate="CALLYSQUARE.UPDATE_INFO"
+          translate-attr-aria-label="CALLYSQUARE.UPDATE"
+        >
+          UPDATE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/callysquare/views/projects/edit/open/open.html/open-[chunkhash].html b/public/src/js/modules/main/apps/callysquare/views/projects/edit/open/open.html/open-[chunkhash].html
deleted file mode 100644
index affd9a8..0000000
--- a/public/src/js/modules/main/apps/callysquare/views/projects/edit/open/open.html/open-[chunkhash].html
+++ /dev/null
@@ -1,105 +0,0 @@
-<md-dialog class="project-dialog" aria-label="New dialog">
-  <form name="openForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title"
-          ><span translate="CALLYSQUARE.OPEN_PROJECT"></span
-        ></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="CALLYSQUARE.PROJECT">Project</label>
-        <md-select name="id" ng-model="vm.id" required>
-          <md-option value="{{p.id}}" ng-repeat="p in vm.projects"
-            >{{p.name}}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="openForm.id.$error"
-          ng-show="openForm.id.$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CALLYSQUARE.ERRORS.PROJECT_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <md-switch
-          ng-model="vm.newWindow"
-          aria-label="{{'CALLYSQUARE.OPEN_NEW_WINDOW' | translate }}"
-          ><span translate="CALLYSQUARE.OPEN_NEW_WINDOW"></span
-        ></md-switch>
-      </md-input-container>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-click="vm.closeDialog(true)"
-          class="send-button md-accent md-raised"
-          ng-disabled="openForm.$invalid"
-          aria-label="SAVE"
-          translate="CALLYSQUARE.OPEN_PROJECT"
-          translate-attr-aria-label="CALLYSQUARE.OPEN"
-        >
-          OPEN
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/callysquare/views/projects/edit/open/open.html/open.html b/public/src/js/modules/main/apps/callysquare/views/projects/edit/open/open.html/open.html
new file mode 100644
index 0000000..affd9a8
--- /dev/null
+++ b/public/src/js/modules/main/apps/callysquare/views/projects/edit/open/open.html/open.html
@@ -0,0 +1,105 @@
+<md-dialog class="project-dialog" aria-label="New dialog">
+  <form name="openForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title"
+          ><span translate="CALLYSQUARE.OPEN_PROJECT"></span
+        ></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="CALLYSQUARE.PROJECT">Project</label>
+        <md-select name="id" ng-model="vm.id" required>
+          <md-option value="{{p.id}}" ng-repeat="p in vm.projects"
+            >{{p.name}}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="openForm.id.$error"
+          ng-show="openForm.id.$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CALLYSQUARE.ERRORS.PROJECT_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <md-switch
+          ng-model="vm.newWindow"
+          aria-label="{{'CALLYSQUARE.OPEN_NEW_WINDOW' | translate }}"
+          ><span translate="CALLYSQUARE.OPEN_NEW_WINDOW"></span
+        ></md-switch>
+      </md-input-container>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-click="vm.closeDialog(true)"
+          class="send-button md-accent md-raised"
+          ng-disabled="openForm.$invalid"
+          aria-label="SAVE"
+          translate="CALLYSQUARE.OPEN_PROJECT"
+          translate-attr-aria-label="CALLYSQUARE.OPEN"
+        >
+          OPEN
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/callysquare/views/projects/edit/saveAs/saveAs.html/saveAs-[chunkhash].html b/public/src/js/modules/main/apps/callysquare/views/projects/edit/saveAs/saveAs.html/saveAs-[chunkhash].html
deleted file mode 100644
index ad03e02..0000000
--- a/public/src/js/modules/main/apps/callysquare/views/projects/edit/saveAs/saveAs.html/saveAs-[chunkhash].html
+++ /dev/null
@@ -1,101 +0,0 @@
-<md-dialog class="project-dialog" aria-label="New dialog">
-  <form name="newForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title"
-          ><span translate="CALLYSQUARE.COPY_PROJECT"></span
-        ></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="CALLYSQUARE.NAME">Name</label>
-        <input name="name" ng-model="vm.project.name" required md-autofocus />
-        <div
-          ng-messages="newForm.name.$error"
-          ng-show="newForm.name.$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CALLYSQUARE.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <md-switch
-          ng-model="vm.newWindow"
-          aria-label="{{'CALLYSQUARE.OPEN_NEW_WINDOW' | translate }}"
-          ><span translate="CALLYSQUARE.OPEN_NEW_WINDOW"></span
-        ></md-switch>
-      </md-input-container>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-click="vm.save()"
-          class="send-button md-accent md-raised"
-          ng-disabled="newForm.$invalid"
-          aria-label="SAVE"
-          translate="CALLYSQUARE.COPY_PROJECT"
-          translate-attr-aria-label="CALLYSQUARE.COPY"
-        >
-          COPY
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/callysquare/views/projects/edit/saveAs/saveAs.html/saveAs.html b/public/src/js/modules/main/apps/callysquare/views/projects/edit/saveAs/saveAs.html/saveAs.html
new file mode 100644
index 0000000..ad03e02
--- /dev/null
+++ b/public/src/js/modules/main/apps/callysquare/views/projects/edit/saveAs/saveAs.html/saveAs.html
@@ -0,0 +1,101 @@
+<md-dialog class="project-dialog" aria-label="New dialog">
+  <form name="newForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title"
+          ><span translate="CALLYSQUARE.COPY_PROJECT"></span
+        ></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="CALLYSQUARE.NAME">Name</label>
+        <input name="name" ng-model="vm.project.name" required md-autofocus />
+        <div
+          ng-messages="newForm.name.$error"
+          ng-show="newForm.name.$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CALLYSQUARE.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <md-switch
+          ng-model="vm.newWindow"
+          aria-label="{{'CALLYSQUARE.OPEN_NEW_WINDOW' | translate }}"
+          ><span translate="CALLYSQUARE.OPEN_NEW_WINDOW"></span
+        ></md-switch>
+      </md-input-container>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-click="vm.save()"
+          class="send-button md-accent md-raised"
+          ng-disabled="newForm.$invalid"
+          aria-label="SAVE"
+          translate="CALLYSQUARE.COPY_PROJECT"
+          translate-attr-aria-label="CALLYSQUARE.COPY"
+        >
+          COPY
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/callysquare/views/projects/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/callysquare/views/projects/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index 495aa93..0000000
--- a/public/src/js/modules/main/apps/callysquare/views/projects/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,55 +0,0 @@
-<div
-  id="callysquare-project"
-  class="page-layout simple tabbed"
-  layout="column"
-  ng-init="vm.onInit()"
->
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-projects-button md-icon-button"
-        aria-label="Go to projects"
-        ng-click="vm.gotoProjects()"
-        translate
-        translate-attr-aria-label="CALLYSQUARE.GO_TO_PROJECTS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="project-image" hide-xs>
-          <img ng-src="assets/images/business/cprojects.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">#{{vm.project.id}} {{vm.project.name}}</div>
-          <div class="subtitle secondary-text text-truncate">
-            <span ng-if="vm.project.description"
-              >{{vm.project.description}} - </span
-            ><span translate="CALLYSQUARE.CREATED_AT"></span>
-            <span>{{vm.project.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-if="vm.crudPermissions.canEdit"
-        ng-click="vm.updateInfo($event)"
-        class="md-fab md-yellow-700-bg md-icon-button"
-        aria-label="edit"
-      >
-        <md-icon md-font-icon="icon-tooltip-edit"></md-icon>
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <md-content class="callysquare-content">
-    <div id="geEditor" class="geEditor"></div>
-  </md-content>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/callysquare/views/projects/edit/view.html/view.html b/public/src/js/modules/main/apps/callysquare/views/projects/edit/view.html/view.html
new file mode 100644
index 0000000..495aa93
--- /dev/null
+++ b/public/src/js/modules/main/apps/callysquare/views/projects/edit/view.html/view.html
@@ -0,0 +1,55 @@
+<div
+  id="callysquare-project"
+  class="page-layout simple tabbed"
+  layout="column"
+  ng-init="vm.onInit()"
+>
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-projects-button md-icon-button"
+        aria-label="Go to projects"
+        ng-click="vm.gotoProjects()"
+        translate
+        translate-attr-aria-label="CALLYSQUARE.GO_TO_PROJECTS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="project-image" hide-xs>
+          <img ng-src="assets/images/business/cprojects.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">#{{vm.project.id}} {{vm.project.name}}</div>
+          <div class="subtitle secondary-text text-truncate">
+            <span ng-if="vm.project.description"
+              >{{vm.project.description}} - </span
+            ><span translate="CALLYSQUARE.CREATED_AT"></span>
+            <span>{{vm.project.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-if="vm.crudPermissions.canEdit"
+        ng-click="vm.updateInfo($event)"
+        class="md-fab md-yellow-700-bg md-icon-button"
+        aria-label="edit"
+      >
+        <md-icon md-font-icon="icon-tooltip-edit"></md-icon>
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <md-content class="callysquare-content">
+    <div id="geEditor" class="geEditor"></div>
+  </md-content>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/callysquare/views/projects/projects.html/projects-[chunkhash].html b/public/src/js/modules/main/apps/callysquare/views/projects/projects.html/projects-[chunkhash].html
deleted file mode 100644
index 1deb0b3..0000000
--- a/public/src/js/modules/main/apps/callysquare/views/projects/projects.html/projects-[chunkhash].html
+++ /dev/null
@@ -1,289 +0,0 @@
-<div id="projects" class="page-layout simple left-sidenav inner-sidenav">
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-vector-square" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="CALLYSQUARE.PROJECTS">Projects</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <!-- SEARCH -->
-    <div class="search-input-wrapper" layout="row" layout-align="start center">
-      <label for="search">
-        <md-icon md-font-icon="icon-magnify"></md-icon>
-      </label>
-      <md-input-container md-no-float class="m-0">
-        <input
-          id="search"
-          placeholder="Search for anyone"
-          type="text"
-          ng-model="vm.query.filter"
-          ng-model-options="{ debounce: 1000 }"
-          translate
-          translate-attr-placeholder="CALLYSQUARE.SEARCH_FOR_ANYONE"
-        />
-      </md-input-container>
-    </div>
-    <!-- / SEARCH -->
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedProjects.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedProjects =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="CALLYSQUARE.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-projects-count">
-          <span>{{vm.selectedProjects.length}}</span>
-          <span translate="CALLYSQUARE.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="CALLYSQUARE.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllProjects()"
-                translate="CALLYSQUARE.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectProjects()"
-                translate="CALLYSQUARE.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedProjects"
-          csv-label="true"
-          filename="projects.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          ng-if="vm.crudPermissions.canDelete"
-          class="md-icon-button"
-          ng-click="vm.deleteSelectedProjects($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="CALLYSQUARE.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- PROJECT TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedProjects"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getProjects"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">
-                  {{ 'CALLYSQUARE.ID' | translate }}
-                </th>
-                <th md-column md-order-by="name">
-                  {{ 'CALLYSQUARE.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'CALLYSQUARE.DESCRIPTION' | translate }}
-                </th>
-                <th md-column md-order-by="notes">
-                  {{ 'CALLYSQUARE.NOTES' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.projects.rows.length">
-                <td md-cell colspan="5">
-                  <div layout="row" layout-align="center center">
-                    <span translate="CALLYSQUARE.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="project"
-                md-select-id="id"
-                ng-repeat="project in vm.projects.rows"
-              >
-                <td md-cell ng-if="project.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{project.name}}"
-                    ng-src="api/users/{{project.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!project.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{project.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(project, ev) : vm.createOrEditProject($event, project)"
-                  md-cell
-                  class="id"
-                >
-                  {{project.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(project, ev) : vm.createOrEditProject($event, project)"
-                  md-cell
-                  class="name"
-                >
-                  {{project.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(project, ev) : vm.createOrEditProject($event, project)"
-                  md-cell
-                  class="description"
-                >
-                  {{project.description}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(project, ev) : vm.createOrEditProject($event, project)"
-                  md-cell
-                  class="notes"
-                >
-                  {{project.notes}}
-                </td>
-                <td
-                  md-cell
-                  class="actions"
-                  ng-if="!vm.crudPermissions.readOnly"
-                >
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="CALLYSQUARE.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-                    <md-menu-content width="3">
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(project, ev)"
-                          translate="CALLYSQUARE.EDIT_PROJECT"
-                        >
-                          Edit Project
-                        </md-button>
-                      </md-menu-item>
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(project, ev)"
-                          translate="CALLYSQUARE.DELETE_PROJECT"
-                        >
-                          Delete Project
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'CALLYSQUARE.PAGE' | translate}}:', rowsPerPage: '{{'CALLYSQUARE.ROWSPERPAGE' | translate}}:', of: '{{'CALLYSQUARE.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.projects.count}}"
-          md-on-paginate="vm.getProjects"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / PROJECT TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD PROJECT BUTTON -->
-  <md-button
-    class="md-fab md-accent md-icon-button"
-    id="add-project-button"
-    ng-if="vm.crudPermissions.canEdit"
-    ng-click="vm.createOrEditProject($event)"
-    aria-label="add project"
-    translate
-    translate-attr-aria-label="CALLYSQUARE.ADD_PROJECT"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD PROJECT BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/callysquare/views/projects/projects.html/projects.html b/public/src/js/modules/main/apps/callysquare/views/projects/projects.html/projects.html
new file mode 100644
index 0000000..1deb0b3
--- /dev/null
+++ b/public/src/js/modules/main/apps/callysquare/views/projects/projects.html/projects.html
@@ -0,0 +1,289 @@
+<div id="projects" class="page-layout simple left-sidenav inner-sidenav">
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-vector-square" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="CALLYSQUARE.PROJECTS">Projects</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <!-- SEARCH -->
+    <div class="search-input-wrapper" layout="row" layout-align="start center">
+      <label for="search">
+        <md-icon md-font-icon="icon-magnify"></md-icon>
+      </label>
+      <md-input-container md-no-float class="m-0">
+        <input
+          id="search"
+          placeholder="Search for anyone"
+          type="text"
+          ng-model="vm.query.filter"
+          ng-model-options="{ debounce: 1000 }"
+          translate
+          translate-attr-placeholder="CALLYSQUARE.SEARCH_FOR_ANYONE"
+        />
+      </md-input-container>
+    </div>
+    <!-- / SEARCH -->
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedProjects.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedProjects =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="CALLYSQUARE.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-projects-count">
+          <span>{{vm.selectedProjects.length}}</span>
+          <span translate="CALLYSQUARE.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="CALLYSQUARE.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllProjects()"
+                translate="CALLYSQUARE.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectProjects()"
+                translate="CALLYSQUARE.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedProjects"
+          csv-label="true"
+          filename="projects.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          ng-if="vm.crudPermissions.canDelete"
+          class="md-icon-button"
+          ng-click="vm.deleteSelectedProjects($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="CALLYSQUARE.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- PROJECT TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedProjects"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getProjects"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">
+                  {{ 'CALLYSQUARE.ID' | translate }}
+                </th>
+                <th md-column md-order-by="name">
+                  {{ 'CALLYSQUARE.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'CALLYSQUARE.DESCRIPTION' | translate }}
+                </th>
+                <th md-column md-order-by="notes">
+                  {{ 'CALLYSQUARE.NOTES' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.projects.rows.length">
+                <td md-cell colspan="5">
+                  <div layout="row" layout-align="center center">
+                    <span translate="CALLYSQUARE.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="project"
+                md-select-id="id"
+                ng-repeat="project in vm.projects.rows"
+              >
+                <td md-cell ng-if="project.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{project.name}}"
+                    ng-src="api/users/{{project.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!project.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{project.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(project, ev) : vm.createOrEditProject($event, project)"
+                  md-cell
+                  class="id"
+                >
+                  {{project.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(project, ev) : vm.createOrEditProject($event, project)"
+                  md-cell
+                  class="name"
+                >
+                  {{project.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(project, ev) : vm.createOrEditProject($event, project)"
+                  md-cell
+                  class="description"
+                >
+                  {{project.description}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(project, ev) : vm.createOrEditProject($event, project)"
+                  md-cell
+                  class="notes"
+                >
+                  {{project.notes}}
+                </td>
+                <td
+                  md-cell
+                  class="actions"
+                  ng-if="!vm.crudPermissions.readOnly"
+                >
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="CALLYSQUARE.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+                    <md-menu-content width="3">
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(project, ev)"
+                          translate="CALLYSQUARE.EDIT_PROJECT"
+                        >
+                          Edit Project
+                        </md-button>
+                      </md-menu-item>
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(project, ev)"
+                          translate="CALLYSQUARE.DELETE_PROJECT"
+                        >
+                          Delete Project
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'CALLYSQUARE.PAGE' | translate}}:', rowsPerPage: '{{'CALLYSQUARE.ROWSPERPAGE' | translate}}:', of: '{{'CALLYSQUARE.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.projects.count}}"
+          md-on-paginate="vm.getProjects"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / PROJECT TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD PROJECT BUTTON -->
+  <md-button
+    class="md-fab md-accent md-icon-button"
+    id="add-project-button"
+    ng-if="vm.crudPermissions.canEdit"
+    ng-click="vm.createOrEditProject($event)"
+    aria-label="add project"
+    translate
+    translate-attr-aria-label="CALLYSQUARE.ADD_PROJECT"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD PROJECT BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/callysquare/views/squareRecordings/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/callysquare/views/squareRecordings/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index e37a09c..0000000
--- a/public/src/js/modules/main/apps/callysquare/views/squareRecordings/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,134 +0,0 @@
-<md-dialog class="squareRecording-dialog" aria-label="New SquareRecording">
-  <form name="squareRecordingForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="CALLYSQUARE.FILENAME">Filename</label>
-        <input
-          type=""
-          name="filename"
-          ng-model="vm.squareRecording.filename"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="squareRecordingForm['filename'].$error"
-          ng-show="squareRecordingForm['filename'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CALLYSQUARE.ERRORS.FILENAME_REQUIRED"
-              >Filename field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newSquareRecording"
-          ng-click="vm.saveSquareRecording()"
-          class="send-button md-accent md-raised"
-          ng-disabled="squareRecordingForm.$invalid || squareRecordingForm.$pristine"
-          aria-label="SAVE"
-          translate="CALLYSQUARE.SAVE"
-          translate-attr-aria-label="CALLYSQUARE.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newSquareRecording"
-          ng-click="vm.addNewSquareRecording()"
-          class="send-button md-accent md-raised"
-          ng-disabled="squareRecordingForm.$invalid"
-          aria-label="ADD"
-          translate="CALLYSQUARE.ADD_SQUARERECORDING"
-          translate-attr-aria-label="CALLYSQUARE.ADD_SQUARERECORDING"
-        >
-          ADD SQUARERECORDING
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newSquareRecording"
-          ng-click="vm.deleteSquareRecording($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="CALLYSQUARE.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="CALLYSQUARE.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/callysquare/views/squareRecordings/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/callysquare/views/squareRecordings/create/dialog.html/dialog.html
new file mode 100644
index 0000000..e37a09c
--- /dev/null
+++ b/public/src/js/modules/main/apps/callysquare/views/squareRecordings/create/dialog.html/dialog.html
@@ -0,0 +1,134 @@
+<md-dialog class="squareRecording-dialog" aria-label="New SquareRecording">
+  <form name="squareRecordingForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="CALLYSQUARE.FILENAME">Filename</label>
+        <input
+          type=""
+          name="filename"
+          ng-model="vm.squareRecording.filename"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="squareRecordingForm['filename'].$error"
+          ng-show="squareRecordingForm['filename'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CALLYSQUARE.ERRORS.FILENAME_REQUIRED"
+              >Filename field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newSquareRecording"
+          ng-click="vm.saveSquareRecording()"
+          class="send-button md-accent md-raised"
+          ng-disabled="squareRecordingForm.$invalid || squareRecordingForm.$pristine"
+          aria-label="SAVE"
+          translate="CALLYSQUARE.SAVE"
+          translate-attr-aria-label="CALLYSQUARE.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newSquareRecording"
+          ng-click="vm.addNewSquareRecording()"
+          class="send-button md-accent md-raised"
+          ng-disabled="squareRecordingForm.$invalid"
+          aria-label="ADD"
+          translate="CALLYSQUARE.ADD_SQUARERECORDING"
+          translate-attr-aria-label="CALLYSQUARE.ADD_SQUARERECORDING"
+        >
+          ADD SQUARERECORDING
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newSquareRecording"
+          ng-click="vm.deleteSquareRecording($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="CALLYSQUARE.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="CALLYSQUARE.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/callysquare/views/squareRecordings/squareRecordings.html/squareRecordings-[chunkhash].html b/public/src/js/modules/main/apps/callysquare/views/squareRecordings/squareRecordings.html/squareRecordings-[chunkhash].html
deleted file mode 100644
index 5015b38..0000000
--- a/public/src/js/modules/main/apps/callysquare/views/squareRecordings/squareRecordings.html/squareRecordings-[chunkhash].html
+++ /dev/null
@@ -1,332 +0,0 @@
-<div
-  id="squareRecordings"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-sitemap" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="CALLYSQUARE.SQUARERECORDINGS"
-          >SquareRecordings</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="CALLYSQUARE.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedSquareRecordings.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div
-      class="close-button-wrapper"
-      ng-click="vm.selectedSquareRecordings =[]"
-    >
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="CALLYSQUARE.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-squareRecordings-count">
-          <span>{{vm.selectedSquareRecordings.length}}</span>
-          <span translate="CALLYSQUARE.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="CALLYSQUARE.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllSquareRecordings()"
-                translate="CALLYSQUARE.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectSquareRecordings()"
-                translate="CALLYSQUARE.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedSquareRecordings"
-          csv-label="true"
-          filename="squareRecordings.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedSquareRecordings($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="CALLYSQUARE.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- SQUARERECORDING TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedSquareRecordings"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getSquareRecordings"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="filename">
-                  {{ 'CALLYSQUARE.FILENAME' | translate }}
-                </th>
-                <th md-column md-order-by="projectName">
-                  {{ 'CALLYSQUARE.PROJECT' | translate }}
-                </th>
-                <th md-column md-order-by="uniqueid">
-                  {{ 'CALLYSQUARE.UNIQUEID' | translate }}
-                </th>
-                <th md-column md-order-by="callerid">
-                  {{ 'CALLYSQUARE.PHONE' | translate }}
-                </th>
-                <th md-column md-order-by="extension">
-                  {{ 'CALLYSQUARE.EXTEN' | translate }}
-                </th>
-                <th md-column md-order-by="audio">
-                  {{ 'CALLYSQUARE.AUDIO' | translate }}
-                </th>
-                <th md-column md-order-by="createdAt">
-                  {{ 'CALLYSQUARE.CREATED_AT' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.squareRecordings.rows.length">
-                <td md-cell colspan="8">
-                  <div layout="row" layout-align="center center">
-                    <span translate="CALLYSQUARE.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="squareRecording"
-                md-select-id="id"
-                ng-repeat="squareRecording in vm.squareRecordings.rows"
-              >
-                <td md-cell ng-if="squareRecording.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{squareRecording.name}}"
-                    ng-src="api/users/{{squareRecording.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!squareRecording.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{squareRecording.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.createOrEditSquareRecording($event, squareRecording)"
-                  md-cell
-                  class="filename"
-                >
-                  {{squareRecording.filename}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditSquareRecording($event, squareRecording)"
-                  md-cell
-                  class="projectName"
-                >
-                  {{squareRecording.projectName}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditSquareRecording($event, squareRecording)"
-                  md-cell
-                  class="uniqueid"
-                >
-                  {{squareRecording.uniqueid}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditSquareRecording($event, squareRecording)"
-                  md-cell
-                  class="callerid"
-                >
-                  {{squareRecording.callerid}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditSquareRecording($event, squareRecording)"
-                  md-cell
-                  class="extension"
-                >
-                  {{squareRecording.extension}}
-                </td>
-                <td md-cell class="audio" ng-switch="squareRecording.format">
-                  <!-- audio recording directive -->
-                  <ms-recording
-                    ng-switch-when=".wav"
-                    id="squareRecording.id"
-                  ></ms-recording>
-                  <!-- / audio recording directive -->
-                  <span ng-switch-when=".gsm|.WAV" ng-switch-when-separator="|">
-                    <em>{{ 'VOICE.CANT_PLAY_GSM_AUDIO_FILES' | translate }}</em>
-                  </span>
-                </td>
-                <td
-                  ng-click="vm.createOrEditSquareRecording($event, squareRecording)"
-                  md-cell
-                  class="createdAt"
-                >
-                  {{squareRecording.createdAt | date:'medium' }}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="CALLYSQUARE.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.downloadfile2(squareRecording, $event  , 'square/recordings'   )"
-                          translate="CALLYSQUARE.DOWNLOAD_SQUARERECORDING"
-                        >
-                          Download SquareRecording
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(squareRecording, $event    )"
-                          translate="CALLYSQUARE.DELETE_SQUARERECORDING"
-                        >
-                          Delete SquareRecording
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'CALLYSQUARE.PAGE' | translate}}:', rowsPerPage: '{{'CALLYSQUARE.ROWSPERPAGE' | translate}}:', of: '{{'CALLYSQUARE.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.squareRecordings.count}}"
-          md-on-paginate="vm.getSquareRecordings"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / SQUARERECORDING TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- NO ADD BUTTON BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/callysquare/views/squareRecordings/squareRecordings.html/squareRecordings.html b/public/src/js/modules/main/apps/callysquare/views/squareRecordings/squareRecordings.html/squareRecordings.html
new file mode 100644
index 0000000..5015b38
--- /dev/null
+++ b/public/src/js/modules/main/apps/callysquare/views/squareRecordings/squareRecordings.html/squareRecordings.html
@@ -0,0 +1,332 @@
+<div
+  id="squareRecordings"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-sitemap" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="CALLYSQUARE.SQUARERECORDINGS"
+          >SquareRecordings</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="CALLYSQUARE.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedSquareRecordings.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div
+      class="close-button-wrapper"
+      ng-click="vm.selectedSquareRecordings =[]"
+    >
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="CALLYSQUARE.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-squareRecordings-count">
+          <span>{{vm.selectedSquareRecordings.length}}</span>
+          <span translate="CALLYSQUARE.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="CALLYSQUARE.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllSquareRecordings()"
+                translate="CALLYSQUARE.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectSquareRecordings()"
+                translate="CALLYSQUARE.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedSquareRecordings"
+          csv-label="true"
+          filename="squareRecordings.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedSquareRecordings($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="CALLYSQUARE.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- SQUARERECORDING TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedSquareRecordings"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getSquareRecordings"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="filename">
+                  {{ 'CALLYSQUARE.FILENAME' | translate }}
+                </th>
+                <th md-column md-order-by="projectName">
+                  {{ 'CALLYSQUARE.PROJECT' | translate }}
+                </th>
+                <th md-column md-order-by="uniqueid">
+                  {{ 'CALLYSQUARE.UNIQUEID' | translate }}
+                </th>
+                <th md-column md-order-by="callerid">
+                  {{ 'CALLYSQUARE.PHONE' | translate }}
+                </th>
+                <th md-column md-order-by="extension">
+                  {{ 'CALLYSQUARE.EXTEN' | translate }}
+                </th>
+                <th md-column md-order-by="audio">
+                  {{ 'CALLYSQUARE.AUDIO' | translate }}
+                </th>
+                <th md-column md-order-by="createdAt">
+                  {{ 'CALLYSQUARE.CREATED_AT' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.squareRecordings.rows.length">
+                <td md-cell colspan="8">
+                  <div layout="row" layout-align="center center">
+                    <span translate="CALLYSQUARE.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="squareRecording"
+                md-select-id="id"
+                ng-repeat="squareRecording in vm.squareRecordings.rows"
+              >
+                <td md-cell ng-if="squareRecording.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{squareRecording.name}}"
+                    ng-src="api/users/{{squareRecording.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!squareRecording.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{squareRecording.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.createOrEditSquareRecording($event, squareRecording)"
+                  md-cell
+                  class="filename"
+                >
+                  {{squareRecording.filename}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditSquareRecording($event, squareRecording)"
+                  md-cell
+                  class="projectName"
+                >
+                  {{squareRecording.projectName}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditSquareRecording($event, squareRecording)"
+                  md-cell
+                  class="uniqueid"
+                >
+                  {{squareRecording.uniqueid}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditSquareRecording($event, squareRecording)"
+                  md-cell
+                  class="callerid"
+                >
+                  {{squareRecording.callerid}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditSquareRecording($event, squareRecording)"
+                  md-cell
+                  class="extension"
+                >
+                  {{squareRecording.extension}}
+                </td>
+                <td md-cell class="audio" ng-switch="squareRecording.format">
+                  <!-- audio recording directive -->
+                  <ms-recording
+                    ng-switch-when=".wav"
+                    id="squareRecording.id"
+                  ></ms-recording>
+                  <!-- / audio recording directive -->
+                  <span ng-switch-when=".gsm|.WAV" ng-switch-when-separator="|">
+                    <em>{{ 'VOICE.CANT_PLAY_GSM_AUDIO_FILES' | translate }}</em>
+                  </span>
+                </td>
+                <td
+                  ng-click="vm.createOrEditSquareRecording($event, squareRecording)"
+                  md-cell
+                  class="createdAt"
+                >
+                  {{squareRecording.createdAt | date:'medium' }}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="CALLYSQUARE.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.downloadfile2(squareRecording, $event  , 'square/recordings'   )"
+                          translate="CALLYSQUARE.DOWNLOAD_SQUARERECORDING"
+                        >
+                          Download SquareRecording
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(squareRecording, $event    )"
+                          translate="CALLYSQUARE.DELETE_SQUARERECORDING"
+                        >
+                          Delete SquareRecording
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'CALLYSQUARE.PAGE' | translate}}:', rowsPerPage: '{{'CALLYSQUARE.ROWSPERPAGE' | translate}}:', of: '{{'CALLYSQUARE.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.squareRecordings.count}}"
+          md-on-paginate="vm.getSquareRecordings"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / SQUARERECORDING TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- NO ADD BUTTON BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/chat/views/chatQueues/chatQueues.html/chatQueues-[chunkhash].html b/public/src/js/modules/main/apps/chat/views/chatQueues/chatQueues.html/chatQueues-[chunkhash].html
deleted file mode 100644
index 05275ba..0000000
--- a/public/src/js/modules/main/apps/chat/views/chatQueues/chatQueues.html/chatQueues-[chunkhash].html
+++ /dev/null
@@ -1,332 +0,0 @@
-<div
-  id="chatQueues"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-hangouts" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="CHAT.CHATQUEUES">ChatQueues</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="CHAT.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedChatQueues.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedChatQueues =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="CHAT.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-chatQueues-count">
-          <span>{{vm.selectedChatQueues.length}}</span>
-          <span translate="CHAT.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="CHAT.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllChatQueues()"
-                translate="CHAT.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectChatQueues()"
-                translate="CHAT.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedChatQueues"
-          csv-label="true"
-          filename="chatQueues.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedChatQueues($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="CHAT.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- CHATQUEUE TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedChatQueues"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getChatQueues"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'CHAT.ID' | translate }}</th>
-                <th md-column md-order-by="name">
-                  {{ 'CHAT.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="strategy">
-                  {{ 'CHAT.STRATEGY' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.chatQueues.rows.length">
-                <td md-cell colspan="4">
-                  <div layout="row" layout-align="center center">
-                    <span translate="CHAT.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="chatQueue"
-                md-select-id="id"
-                ng-repeat="chatQueue in vm.chatQueues.rows"
-              >
-                <td md-cell ng-if="chatQueue.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{chatQueue.name}}"
-                    ng-src="api/users/{{chatQueue.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!chatQueue.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{chatQueue.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(chatQueue, ev) : vm.createOrEditChatQueue($event, chatQueue)"
-                  md-cell
-                  class="id"
-                >
-                  {{chatQueue.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(chatQueue, ev) : vm.createOrEditChatQueue($event, chatQueue)"
-                  md-cell
-                  class="name"
-                >
-                  {{chatQueue.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(chatQueue, ev) : vm.createOrEditChatQueue($event, chatQueue)"
-                  md-cell
-                  class="strategy"
-                >
-                  {{ vm.arraystrategy[chatQueue.strategy].option }}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="CHAT.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(chatQueue, $event    )"
-                          translate="CHAT.EDIT_CHATQUEUE"
-                        >
-                          Edit ChatQueue
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.teamadddialog(chatQueue, $event    )"
-                          translate="CHAT.TEAMADD_CHATQUEUE"
-                        >
-                          teamadd ChatQueue
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.agentadddialog(chatQueue, $event    )"
-                          translate="CHAT.AGENTADD_CHATQUEUE"
-                        >
-                          agentadd ChatQueue
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(chatQueue, $event    )"
-                          translate="CHAT.DELETE_CHATQUEUE"
-                        >
-                          Delete ChatQueue
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.gotorealtimegoto(chatQueue, $event    )"
-                          translate="CHAT.GOTOREALTIME_CHATQUEUE"
-                        >
-                          goToRealtime ChatQueue
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'CHAT.PAGE' | translate}}:', rowsPerPage: '{{'CHAT.ROWSPERPAGE' | translate}}:', of: '{{'CHAT.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.chatQueues.count}}"
-          md-on-paginate="vm.getChatQueues"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / CHATQUEUE TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD CHATQUEUE BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-chatQueue-button"
-    ng-click="vm.createOrEditChatQueue($event)"
-    aria-label="add chatQueue"
-    translate
-    translate-attr-aria-label="CHAT.ADD_CHATQUEUE"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD CHATQUEUE BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/chat/views/chatQueues/chatQueues.html/chatQueues.html b/public/src/js/modules/main/apps/chat/views/chatQueues/chatQueues.html/chatQueues.html
new file mode 100644
index 0000000..05275ba
--- /dev/null
+++ b/public/src/js/modules/main/apps/chat/views/chatQueues/chatQueues.html/chatQueues.html
@@ -0,0 +1,332 @@
+<div
+  id="chatQueues"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-hangouts" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="CHAT.CHATQUEUES">ChatQueues</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="CHAT.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedChatQueues.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedChatQueues =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="CHAT.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-chatQueues-count">
+          <span>{{vm.selectedChatQueues.length}}</span>
+          <span translate="CHAT.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="CHAT.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllChatQueues()"
+                translate="CHAT.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectChatQueues()"
+                translate="CHAT.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedChatQueues"
+          csv-label="true"
+          filename="chatQueues.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedChatQueues($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="CHAT.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- CHATQUEUE TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedChatQueues"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getChatQueues"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'CHAT.ID' | translate }}</th>
+                <th md-column md-order-by="name">
+                  {{ 'CHAT.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="strategy">
+                  {{ 'CHAT.STRATEGY' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.chatQueues.rows.length">
+                <td md-cell colspan="4">
+                  <div layout="row" layout-align="center center">
+                    <span translate="CHAT.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="chatQueue"
+                md-select-id="id"
+                ng-repeat="chatQueue in vm.chatQueues.rows"
+              >
+                <td md-cell ng-if="chatQueue.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{chatQueue.name}}"
+                    ng-src="api/users/{{chatQueue.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!chatQueue.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{chatQueue.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(chatQueue, ev) : vm.createOrEditChatQueue($event, chatQueue)"
+                  md-cell
+                  class="id"
+                >
+                  {{chatQueue.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(chatQueue, ev) : vm.createOrEditChatQueue($event, chatQueue)"
+                  md-cell
+                  class="name"
+                >
+                  {{chatQueue.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(chatQueue, ev) : vm.createOrEditChatQueue($event, chatQueue)"
+                  md-cell
+                  class="strategy"
+                >
+                  {{ vm.arraystrategy[chatQueue.strategy].option }}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="CHAT.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(chatQueue, $event    )"
+                          translate="CHAT.EDIT_CHATQUEUE"
+                        >
+                          Edit ChatQueue
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.teamadddialog(chatQueue, $event    )"
+                          translate="CHAT.TEAMADD_CHATQUEUE"
+                        >
+                          teamadd ChatQueue
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.agentadddialog(chatQueue, $event    )"
+                          translate="CHAT.AGENTADD_CHATQUEUE"
+                        >
+                          agentadd ChatQueue
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(chatQueue, $event    )"
+                          translate="CHAT.DELETE_CHATQUEUE"
+                        >
+                          Delete ChatQueue
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.gotorealtimegoto(chatQueue, $event    )"
+                          translate="CHAT.GOTOREALTIME_CHATQUEUE"
+                        >
+                          goToRealtime ChatQueue
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'CHAT.PAGE' | translate}}:', rowsPerPage: '{{'CHAT.ROWSPERPAGE' | translate}}:', of: '{{'CHAT.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.chatQueues.count}}"
+          md-on-paginate="vm.getChatQueues"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / CHATQUEUE TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD CHATQUEUE BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-chatQueue-button"
+    ng-click="vm.createOrEditChatQueue($event)"
+    aria-label="add chatQueue"
+    translate
+    translate-attr-aria-label="CHAT.ADD_CHATQUEUE"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD CHATQUEUE BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/chat/views/chatQueues/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/chat/views/chatQueues/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index b7598a3..0000000
--- a/public/src/js/modules/main/apps/chat/views/chatQueues/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,217 +0,0 @@
-<md-dialog class="chatQueue-dialog" aria-label="New ChatQueue">
-  <form name="chatQueueForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="CHAT.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.chatQueue.name"
-          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.newChatQueue"
-        />
-
-        <div class="hint"><span translate="CHAT.HELP.NAME"></span></div>
-        <div
-          ng-messages="chatQueueForm['name'].$error"
-          ng-show="chatQueueForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span
-              translate="CHAT.ERRORS.NAME_MUST_VALID_PATTERN"
-              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-              >Name must be valid pattern
-            </span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CHAT.STRATEGY">Strategy</label>
-        <md-select name="strategy" ng-model="vm.chatQueue.strategy" required>
-          <md-option ng-value="'beepall'">Beepall</md-option>
-          <md-option ng-value="'rrmemory'">RR Memory</md-option>
-        </md-select>
-        <div
-          ng-messages="chatQueueForm['strategy'].$error"
-          ng-show="chatQueueForm['strategy'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.STRATEGY_REQUIRED"
-              >Strategy field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CHAT.AGENT_TIMEOUT">Agent_Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.chatQueue.timeout"
-          min="1"
-          max="2147483"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="chatQueueForm['timeout'].$error"
-          ng-show="chatQueueForm['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.AGENT_TIMEOUT_REQUIRED"
-              >Agent_Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="CHAT.ERRORS.AGENT_TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Agent_Timeout must be a valid greater or equal than</span
-            >
-            <span>1</span>
-          </div>
-          <div ng-message="max">
-            <span
-              translate="CHAT.ERRORS.AGENT_TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-              >Agent_Timeout must be a valid greater or equal than</span
-            >
-            <span>2147483</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CHAT.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.chatQueue.description"
-        />
-
-        <div
-          ng-messages="chatQueueForm['description'].$error"
-          ng-show="chatQueueForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newChatQueue"
-          ng-click="vm.saveChatQueue()"
-          class="send-button md-accent md-raised"
-          ng-disabled="chatQueueForm.$invalid || chatQueueForm.$pristine"
-          aria-label="SAVE"
-          translate="CHAT.SAVE"
-          translate-attr-aria-label="CHAT.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newChatQueue"
-          ng-click="vm.addNewChatQueue()"
-          class="send-button md-accent md-raised"
-          ng-disabled="chatQueueForm.$invalid"
-          aria-label="ADD"
-          translate="CHAT.ADD_CHATQUEUE"
-          translate-attr-aria-label="CHAT.ADD_CHATQUEUE"
-        >
-          ADD CHATQUEUE
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newChatQueue"
-          ng-click="vm.deleteChatQueue($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="CHAT.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="CHAT.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatQueues/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/chat/views/chatQueues/create/dialog.html/dialog.html
new file mode 100644
index 0000000..b7598a3
--- /dev/null
+++ b/public/src/js/modules/main/apps/chat/views/chatQueues/create/dialog.html/dialog.html
@@ -0,0 +1,217 @@
+<md-dialog class="chatQueue-dialog" aria-label="New ChatQueue">
+  <form name="chatQueueForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="CHAT.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.chatQueue.name"
+          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.newChatQueue"
+        />
+
+        <div class="hint"><span translate="CHAT.HELP.NAME"></span></div>
+        <div
+          ng-messages="chatQueueForm['name'].$error"
+          ng-show="chatQueueForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span
+              translate="CHAT.ERRORS.NAME_MUST_VALID_PATTERN"
+              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+              >Name must be valid pattern
+            </span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CHAT.STRATEGY">Strategy</label>
+        <md-select name="strategy" ng-model="vm.chatQueue.strategy" required>
+          <md-option ng-value="'beepall'">Beepall</md-option>
+          <md-option ng-value="'rrmemory'">RR Memory</md-option>
+        </md-select>
+        <div
+          ng-messages="chatQueueForm['strategy'].$error"
+          ng-show="chatQueueForm['strategy'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.STRATEGY_REQUIRED"
+              >Strategy field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CHAT.AGENT_TIMEOUT">Agent_Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.chatQueue.timeout"
+          min="1"
+          max="2147483"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="chatQueueForm['timeout'].$error"
+          ng-show="chatQueueForm['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.AGENT_TIMEOUT_REQUIRED"
+              >Agent_Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="CHAT.ERRORS.AGENT_TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Agent_Timeout must be a valid greater or equal than</span
+            >
+            <span>1</span>
+          </div>
+          <div ng-message="max">
+            <span
+              translate="CHAT.ERRORS.AGENT_TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+              >Agent_Timeout must be a valid greater or equal than</span
+            >
+            <span>2147483</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CHAT.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.chatQueue.description"
+        />
+
+        <div
+          ng-messages="chatQueueForm['description'].$error"
+          ng-show="chatQueueForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newChatQueue"
+          ng-click="vm.saveChatQueue()"
+          class="send-button md-accent md-raised"
+          ng-disabled="chatQueueForm.$invalid || chatQueueForm.$pristine"
+          aria-label="SAVE"
+          translate="CHAT.SAVE"
+          translate-attr-aria-label="CHAT.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newChatQueue"
+          ng-click="vm.addNewChatQueue()"
+          class="send-button md-accent md-raised"
+          ng-disabled="chatQueueForm.$invalid"
+          aria-label="ADD"
+          translate="CHAT.ADD_CHATQUEUE"
+          translate-attr-aria-label="CHAT.ADD_CHATQUEUE"
+        >
+          ADD CHATQUEUE
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newChatQueue"
+          ng-click="vm.deleteChatQueue($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="CHAT.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="CHAT.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatQueues/edit/agentadd/agentadd.html/agentadd-[chunkhash].html b/public/src/js/modules/main/apps/chat/views/chatQueues/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
deleted file mode 100644
index 81d87a6..0000000
--- a/public/src/js/modules/main/apps/chat/views/chatQueues/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
+++ /dev/null
@@ -1,44 +0,0 @@
-<md-dialog
-  class="chatQueue-dialog"
-  aria-label="chatQueue"
-  ng-init="vm.onInit()"
->
-  <form name="chatQueueForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="CHAT.AGENTADD_CHATQUEUE">Add Agent to chatQueue</h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <ms-dual-multiselect
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveAgents()"
-        class="send-button md-accent md-raised"
-        ng-disabled="!vm.pendingChanges"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatQueues/edit/agentadd/agentadd.html/agentadd.html b/public/src/js/modules/main/apps/chat/views/chatQueues/edit/agentadd/agentadd.html/agentadd.html
new file mode 100644
index 0000000..81d87a6
--- /dev/null
+++ b/public/src/js/modules/main/apps/chat/views/chatQueues/edit/agentadd/agentadd.html/agentadd.html
@@ -0,0 +1,44 @@
+<md-dialog
+  class="chatQueue-dialog"
+  aria-label="chatQueue"
+  ng-init="vm.onInit()"
+>
+  <form name="chatQueueForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="CHAT.AGENTADD_CHATQUEUE">Add Agent to chatQueue</h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <ms-dual-multiselect
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveAgents()"
+        class="send-button md-accent md-raised"
+        ng-disabled="!vm.pendingChanges"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatQueues/edit/teamadd/teamadd.html/teamadd-[chunkhash].html b/public/src/js/modules/main/apps/chat/views/chatQueues/edit/teamadd/teamadd.html/teamadd-[chunkhash].html
deleted file mode 100644
index 557052e..0000000
--- a/public/src/js/modules/main/apps/chat/views/chatQueues/edit/teamadd/teamadd.html/teamadd-[chunkhash].html
+++ /dev/null
@@ -1,44 +0,0 @@
-<md-dialog
-  class="chatQueue-dialog"
-  aria-label="chatQueue"
-  ng-init="vm.onInit()"
->
-  <form name="chatQueueForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="CHAT.TEAMS_ASSOCIATION">Teams Association</h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <ms-dual-multiselect
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveTeams()"
-        ng-disabled="!vm.pendingChanges"
-        class="send-button md-accent md-raised"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatQueues/edit/teamadd/teamadd.html/teamadd.html b/public/src/js/modules/main/apps/chat/views/chatQueues/edit/teamadd/teamadd.html/teamadd.html
new file mode 100644
index 0000000..557052e
--- /dev/null
+++ b/public/src/js/modules/main/apps/chat/views/chatQueues/edit/teamadd/teamadd.html/teamadd.html
@@ -0,0 +1,44 @@
+<md-dialog
+  class="chatQueue-dialog"
+  aria-label="chatQueue"
+  ng-init="vm.onInit()"
+>
+  <form name="chatQueueForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="CHAT.TEAMS_ASSOCIATION">Teams Association</h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <ms-dual-multiselect
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveTeams()"
+        ng-disabled="!vm.pendingChanges"
+        class="send-button md-accent md-raised"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatQueues/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/chat/views/chatQueues/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index 8f33d4a..0000000
--- a/public/src/js/modules/main/apps/chat/views/chatQueues/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,218 +0,0 @@
-<div id="chat-chatQueue" class="page-layout simple tabbed" layout="column">
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-chatQueues-button md-icon-button"
-        aria-label="Go to chatQueues"
-        ng-click="vm.gotoChatQueues()"
-        translate
-        translate-attr-aria-label="CHAT.GO_TO_CHATQUEUES"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="chatQueue-image" hide-xs>
-          <img ng-src="assets/images/business/chatQueues.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.chatQueue.id}}
-            <span ng-if="vm.chatQueue.name">{{vm.chatQueue.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="CHAT.CREATED_AT"></span>
-            <span>{{vm.chatQueue.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.teamadddialog(vm.chatQueue, $event)"
-        class="md-fab md-orange-500-bg md-icon-button"
-        aria-label="teamadd"
-      >
-        <md-tooltip
-          ><span translate="CHAT.TEAMADD_CHATQUEUE"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
-      </md-button>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.agentadddialog(vm.chatQueue, $event)"
-        class="md-fab md-purple-500-bg md-icon-button"
-        aria-label="agentadd"
-      >
-        <md-tooltip
-          ><span translate="CHAT.AGENTADD_CHATQUEUE"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-account-plus"></md-icon>
-      </md-button>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveChatQueue()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid)"
-        translate="CHAT.SAVE"
-        translate-attr-aria-label="CHAT.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="CHAT.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="chatQueue-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="CHAT.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="CHAT.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.chatQueue.name"
-                  ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-                  ng-required="true"
-                  autofocus
-                  disabled
-                />
-
-                <div class="hint"><span translate="CHAT.HELP.NAME"></span></div>
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                  <div ng-message="pattern">
-                    <span
-                      translate="CHAT.ERRORS.NAME_MUST_VALID_PATTERN"
-                      translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-                      >Name must be valid pattern
-                    </span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CHAT.STRATEGY">Strategy</label>
-                <md-select
-                  name="strategy"
-                  ng-model="vm.chatQueue.strategy"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'beepall'">Beepall</md-option>
-                  <md-option ng-value="'rrmemory'">RR Memory</md-option>
-                </md-select>
-                <div
-                  ng-messages="generalForm['strategy'].$error"
-                  ng-show="generalForm['strategy'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.STRATEGY_REQUIRED"
-                      >Strategy field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CHAT.AGENT_TIMEOUT">Agent_Timeout</label>
-                <input
-                  type="number"
-                  name="timeout"
-                  ng-model="vm.chatQueue.timeout"
-                  min="1"
-                  max="2147483"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['timeout'].$error"
-                  ng-show="generalForm['timeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.AGENT_TIMEOUT_REQUIRED"
-                      >Agent_Timeout field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="CHAT.ERRORS.AGENT_TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >Agent_Timeout must be a valid greater or equal than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="CHAT.ERRORS.AGENT_TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >Agent_Timeout must be a valid greater or equal than</span
-                    >
-                    <span>2147483</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CHAT.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.chatQueue.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/chat/views/chatQueues/edit/view.html/view.html b/public/src/js/modules/main/apps/chat/views/chatQueues/edit/view.html/view.html
new file mode 100644
index 0000000..8f33d4a
--- /dev/null
+++ b/public/src/js/modules/main/apps/chat/views/chatQueues/edit/view.html/view.html
@@ -0,0 +1,218 @@
+<div id="chat-chatQueue" class="page-layout simple tabbed" layout="column">
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-chatQueues-button md-icon-button"
+        aria-label="Go to chatQueues"
+        ng-click="vm.gotoChatQueues()"
+        translate
+        translate-attr-aria-label="CHAT.GO_TO_CHATQUEUES"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="chatQueue-image" hide-xs>
+          <img ng-src="assets/images/business/chatQueues.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.chatQueue.id}}
+            <span ng-if="vm.chatQueue.name">{{vm.chatQueue.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="CHAT.CREATED_AT"></span>
+            <span>{{vm.chatQueue.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.teamadddialog(vm.chatQueue, $event)"
+        class="md-fab md-orange-500-bg md-icon-button"
+        aria-label="teamadd"
+      >
+        <md-tooltip
+          ><span translate="CHAT.TEAMADD_CHATQUEUE"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
+      </md-button>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.agentadddialog(vm.chatQueue, $event)"
+        class="md-fab md-purple-500-bg md-icon-button"
+        aria-label="agentadd"
+      >
+        <md-tooltip
+          ><span translate="CHAT.AGENTADD_CHATQUEUE"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-account-plus"></md-icon>
+      </md-button>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveChatQueue()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid)"
+        translate="CHAT.SAVE"
+        translate-attr-aria-label="CHAT.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="CHAT.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="chatQueue-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="CHAT.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="CHAT.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.chatQueue.name"
+                  ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+                  ng-required="true"
+                  autofocus
+                  disabled
+                />
+
+                <div class="hint"><span translate="CHAT.HELP.NAME"></span></div>
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                  <div ng-message="pattern">
+                    <span
+                      translate="CHAT.ERRORS.NAME_MUST_VALID_PATTERN"
+                      translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+                      >Name must be valid pattern
+                    </span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CHAT.STRATEGY">Strategy</label>
+                <md-select
+                  name="strategy"
+                  ng-model="vm.chatQueue.strategy"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'beepall'">Beepall</md-option>
+                  <md-option ng-value="'rrmemory'">RR Memory</md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['strategy'].$error"
+                  ng-show="generalForm['strategy'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.STRATEGY_REQUIRED"
+                      >Strategy field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CHAT.AGENT_TIMEOUT">Agent_Timeout</label>
+                <input
+                  type="number"
+                  name="timeout"
+                  ng-model="vm.chatQueue.timeout"
+                  min="1"
+                  max="2147483"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['timeout'].$error"
+                  ng-show="generalForm['timeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.AGENT_TIMEOUT_REQUIRED"
+                      >Agent_Timeout field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="CHAT.ERRORS.AGENT_TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >Agent_Timeout must be a valid greater or equal than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="CHAT.ERRORS.AGENT_TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >Agent_Timeout must be a valid greater or equal than</span
+                    >
+                    <span>2147483</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CHAT.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.chatQueue.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/chatWebsites.html/chatWebsites-[chunkhash].html b/public/src/js/modules/main/apps/chat/views/chatWebsites/chatWebsites.html/chatWebsites-[chunkhash].html
deleted file mode 100644
index 87e1fba..0000000
--- a/public/src/js/modules/main/apps/chat/views/chatWebsites/chatWebsites.html/chatWebsites-[chunkhash].html
+++ /dev/null
@@ -1,364 +0,0 @@
-<div
-  id="chatWebsites"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-hangouts" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="CHAT.CHATWEBSITES"
-          >ChatWebsites</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="CHAT.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedChatWebsites.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedChatWebsites =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="CHAT.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-chatWebsites-count">
-          <span>{{vm.selectedChatWebsites.length}}</span>
-          <span translate="CHAT.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="CHAT.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllChatWebsites()"
-                translate="CHAT.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectChatWebsites()"
-                translate="CHAT.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedChatWebsites"
-          csv-label="true"
-          filename="chatWebsites.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedChatWebsites($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="CHAT.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- CHATWEBSITE TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedChatWebsites"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getChatWebsites"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'CHAT.ID' | translate }}</th>
-                <th md-column md-order-by="name">
-                  {{ 'CHAT.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="key">
-                  {{ 'CHAT.KEY' | translate }}
-                </th>
-                <th md-column md-order-by="address">
-                  {{ 'CHAT.MOTIONADDRESS' | translate }}
-                </th>
-                <th md-column md-order-by="remote">
-                  {{ 'CHAT.MOTIONPROXY' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'CHAT.DESCRIPTION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.chatWebsites.rows.length">
-                <td md-cell colspan="7">
-                  <div layout="row" layout-align="center center">
-                    <span translate="CHAT.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="chatWebsite"
-                md-select-id="id"
-                ng-repeat="chatWebsite in vm.chatWebsites.rows"
-              >
-                <td md-cell ng-if="chatWebsite.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{chatWebsite.name}}"
-                    ng-src="api/users/{{chatWebsite.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!chatWebsite.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{chatWebsite.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(chatWebsite, ev) : vm.createOrEditChatWebsite($event, chatWebsite)"
-                  md-cell
-                  class="id"
-                >
-                  {{chatWebsite.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(chatWebsite, ev) : vm.createOrEditChatWebsite($event, chatWebsite)"
-                  md-cell
-                  class="name"
-                >
-                  {{chatWebsite.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(chatWebsite, ev) : vm.createOrEditChatWebsite($event, chatWebsite)"
-                  md-cell
-                  class="key"
-                >
-                  {{chatWebsite.key}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(chatWebsite, ev) : vm.createOrEditChatWebsite($event, chatWebsite)"
-                  md-cell
-                  class="address"
-                >
-                  {{chatWebsite.address}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(chatWebsite, ev) : vm.createOrEditChatWebsite($event, chatWebsite)"
-                  md-cell
-                  class="remote"
-                >
-                  {{chatWebsite.remote}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(chatWebsite, ev) : vm.createOrEditChatWebsite($event, chatWebsite)"
-                  md-cell
-                  class="description"
-                >
-                  {{chatWebsite.description}}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="CHAT.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(chatWebsite, $event    )"
-                          translate="CHAT.EDIT_CHATWEBSITE"
-                        >
-                          Edit ChatWebsite
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.interactionsgoto(chatWebsite, $event    )"
-                          translate="CHAT.INTERACTIONS_CHATWEBSITE"
-                        >
-                          Interactions ChatWebsite
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.offlinemessagesgoto(chatWebsite, $event    )"
-                          translate="CHAT.OFFLINEMESSAGES_CHATWEBSITE"
-                        >
-                          OfflineMessages ChatWebsite
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.agentadddialog(chatWebsite, $event    )"
-                          translate="CHAT.AGENTADD_CHATWEBSITE"
-                        >
-                          AgentAdd ChatWebsite
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(chatWebsite, $event    )"
-                          translate="CHAT.DELETE_CHATWEBSITE"
-                        >
-                          Delete ChatWebsite
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'CHAT.PAGE' | translate}}:', rowsPerPage: '{{'CHAT.ROWSPERPAGE' | translate}}:', of: '{{'CHAT.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.chatWebsites.count}}"
-          md-on-paginate="vm.getChatWebsites"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / CHATWEBSITE TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD CHATWEBSITE BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-chatWebsite-button"
-    ng-click="vm.createOrEditChatWebsite($event)"
-    aria-label="add chatWebsite"
-    translate
-    translate-attr-aria-label="CHAT.ADD_CHATWEBSITE"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD CHATWEBSITE BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/chatWebsites.html/chatWebsites.html b/public/src/js/modules/main/apps/chat/views/chatWebsites/chatWebsites.html/chatWebsites.html
new file mode 100644
index 0000000..87e1fba
--- /dev/null
+++ b/public/src/js/modules/main/apps/chat/views/chatWebsites/chatWebsites.html/chatWebsites.html
@@ -0,0 +1,364 @@
+<div
+  id="chatWebsites"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-hangouts" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="CHAT.CHATWEBSITES"
+          >ChatWebsites</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="CHAT.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedChatWebsites.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedChatWebsites =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="CHAT.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-chatWebsites-count">
+          <span>{{vm.selectedChatWebsites.length}}</span>
+          <span translate="CHAT.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="CHAT.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllChatWebsites()"
+                translate="CHAT.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectChatWebsites()"
+                translate="CHAT.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedChatWebsites"
+          csv-label="true"
+          filename="chatWebsites.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedChatWebsites($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="CHAT.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- CHATWEBSITE TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedChatWebsites"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getChatWebsites"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'CHAT.ID' | translate }}</th>
+                <th md-column md-order-by="name">
+                  {{ 'CHAT.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="key">
+                  {{ 'CHAT.KEY' | translate }}
+                </th>
+                <th md-column md-order-by="address">
+                  {{ 'CHAT.MOTIONADDRESS' | translate }}
+                </th>
+                <th md-column md-order-by="remote">
+                  {{ 'CHAT.MOTIONPROXY' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'CHAT.DESCRIPTION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.chatWebsites.rows.length">
+                <td md-cell colspan="7">
+                  <div layout="row" layout-align="center center">
+                    <span translate="CHAT.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="chatWebsite"
+                md-select-id="id"
+                ng-repeat="chatWebsite in vm.chatWebsites.rows"
+              >
+                <td md-cell ng-if="chatWebsite.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{chatWebsite.name}}"
+                    ng-src="api/users/{{chatWebsite.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!chatWebsite.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{chatWebsite.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(chatWebsite, ev) : vm.createOrEditChatWebsite($event, chatWebsite)"
+                  md-cell
+                  class="id"
+                >
+                  {{chatWebsite.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(chatWebsite, ev) : vm.createOrEditChatWebsite($event, chatWebsite)"
+                  md-cell
+                  class="name"
+                >
+                  {{chatWebsite.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(chatWebsite, ev) : vm.createOrEditChatWebsite($event, chatWebsite)"
+                  md-cell
+                  class="key"
+                >
+                  {{chatWebsite.key}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(chatWebsite, ev) : vm.createOrEditChatWebsite($event, chatWebsite)"
+                  md-cell
+                  class="address"
+                >
+                  {{chatWebsite.address}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(chatWebsite, ev) : vm.createOrEditChatWebsite($event, chatWebsite)"
+                  md-cell
+                  class="remote"
+                >
+                  {{chatWebsite.remote}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(chatWebsite, ev) : vm.createOrEditChatWebsite($event, chatWebsite)"
+                  md-cell
+                  class="description"
+                >
+                  {{chatWebsite.description}}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="CHAT.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(chatWebsite, $event    )"
+                          translate="CHAT.EDIT_CHATWEBSITE"
+                        >
+                          Edit ChatWebsite
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.interactionsgoto(chatWebsite, $event    )"
+                          translate="CHAT.INTERACTIONS_CHATWEBSITE"
+                        >
+                          Interactions ChatWebsite
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.offlinemessagesgoto(chatWebsite, $event    )"
+                          translate="CHAT.OFFLINEMESSAGES_CHATWEBSITE"
+                        >
+                          OfflineMessages ChatWebsite
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.agentadddialog(chatWebsite, $event    )"
+                          translate="CHAT.AGENTADD_CHATWEBSITE"
+                        >
+                          AgentAdd ChatWebsite
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(chatWebsite, $event    )"
+                          translate="CHAT.DELETE_CHATWEBSITE"
+                        >
+                          Delete ChatWebsite
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'CHAT.PAGE' | translate}}:', rowsPerPage: '{{'CHAT.ROWSPERPAGE' | translate}}:', of: '{{'CHAT.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.chatWebsites.count}}"
+          md-on-paginate="vm.getChatWebsites"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / CHATWEBSITE TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD CHATWEBSITE BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-chatWebsite-button"
+    ng-click="vm.createOrEditChatWebsite($event)"
+    aria-label="add chatWebsite"
+    translate
+    translate-attr-aria-label="CHAT.ADD_CHATWEBSITE"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD CHATWEBSITE BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/chat/views/chatWebsites/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 9e1a7a7..0000000
--- a/public/src/js/modules/main/apps/chat/views/chatWebsites/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,297 +0,0 @@
-<md-dialog class="chatWebsite-dialog" aria-label="New ChatWebsite">
-  <form name="chatWebsiteForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="CHAT.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.chatWebsite.name"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.newChatWebsite"
-        />
-
-        <div
-          ng-messages="chatWebsiteForm['name'].$error"
-          ng-show="chatWebsiteForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CHAT.KEY">key</label>
-        <input
-          type="text"
-          name="key"
-          ng-model="vm.chatWebsite.key"
-          md-maxlength="5"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="chatWebsiteForm['key'].$error"
-          ng-show="chatWebsiteForm['key'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.KEY_REQUIRED"
-              >key field is required</span
-            >
-          </div>
-          <div ng-message="md-maxlength">
-            <span
-              translate="CHAT.ERRORS.KEY_MAX_LENGTH"
-              translate-values="{max: 5}"
-              >key must have a maximum length equal to 5</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CHAT.MOTIONADDRESS">MotionAddress</label>
-        <input
-          type="url"
-          name="address"
-          ng-model="vm.chatWebsite.address"
-          md-maxlength="255"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="chatWebsiteForm['address'].$error"
-          ng-show="chatWebsiteForm['address'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.MOTIONADDRESS_REQUIRED"
-              >MotionAddress field is required</span
-            >
-          </div>
-          <div ng-message="url">
-            <span translate="CHAT.ERRORS.MOTIONADDRESS_MUST_VALID_URL"
-              >MotionAddress must be a valid url http://www.xcally.com</span
-            >
-          </div>
-          <div ng-message="md-maxlength">
-            <span
-              translate="CHAT.ERRORS.MOTIONADDRESS_MAX_LENGTH"
-              translate-values="{max: 255}"
-              >MotionAddress must have a maximum length equal to 255</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CHAT.MOTIONPROXY">MotionProxy</label>
-        <input
-          type="url"
-          name="remote"
-          ng-model="vm.chatWebsite.remote"
-          md-maxlength="255"
-          ng-required="true"
-        />
-
-        <div class="hint"><span translate="CHAT.HELP.MOTIONPROXY"></span></div>
-        <div
-          ng-messages="chatWebsiteForm['remote'].$error"
-          ng-show="chatWebsiteForm['remote'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.MOTIONPROXY_REQUIRED"
-              >MotionProxy field is required</span
-            >
-          </div>
-          <div ng-message="url">
-            <span translate="CHAT.ERRORS.MOTIONPROXY_MUST_VALID_URL"
-              >MotionProxy must be a valid url http://www.xcally.com</span
-            >
-          </div>
-          <div ng-message="md-maxlength">
-            <span
-              translate="CHAT.ERRORS.MOTIONPROXY_MAX_LENGTH"
-              translate-values="{max: 255}"
-              >MotionProxy must have a maximum length equal to 255</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CHAT.LIST">List</label>
-        <md-select name="ListId" ng-model="vm.chatWebsite.ListId" required>
-          <md-option
-            ng-value="ListId.id"
-            ng-repeat="ListId in vm.lists"
-            ng-disabled="ListId.canSelect === false"
-            >{{ ListId.name }}</md-option
-          >
-        </md-select>
-        <div class="hint"><span translate="CHAT.HELP.LIST"></span></div>
-        <div
-          ng-messages="chatWebsiteForm['ListId'].$error"
-          ng-show="chatWebsiteForm['ListId'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.LIST_REQUIRED"
-              >List field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CHAT.INTERVAL">Interval</label>
-        <md-select name="IntervalId" ng-model="vm.chatWebsite.IntervalId">
-          <md-option ng-value="null">Always</md-option>
-          <md-option
-            ng-value="IntervalId.id"
-            ng-repeat="IntervalId in vm.interval"
-            ng-disabled="IntervalId.canSelect === false"
-            >{{ IntervalId.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="chatWebsiteForm['IntervalId'].$error"
-          ng-show="chatWebsiteForm['IntervalId'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.INTERVAL_REQUIRED"
-              >Interval field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CHAT.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.chatWebsite.description"
-        />
-
-        <div
-          ng-messages="chatWebsiteForm['description'].$error"
-          ng-show="chatWebsiteForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newChatWebsite"
-          ng-click="vm.saveChatWebsite()"
-          class="send-button md-accent md-raised"
-          ng-disabled="chatWebsiteForm.$invalid || chatWebsiteForm.$pristine"
-          aria-label="SAVE"
-          translate="CHAT.SAVE"
-          translate-attr-aria-label="CHAT.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newChatWebsite"
-          ng-click="vm.addNewChatWebsite()"
-          class="send-button md-accent md-raised"
-          ng-disabled="chatWebsiteForm.$invalid"
-          aria-label="ADD"
-          translate="CHAT.ADD_CHATWEBSITE"
-          translate-attr-aria-label="CHAT.ADD_CHATWEBSITE"
-        >
-          ADD CHATWEBSITE
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newChatWebsite"
-          ng-click="vm.deleteChatWebsite($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="CHAT.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="CHAT.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/chat/views/chatWebsites/create/dialog.html/dialog.html
new file mode 100644
index 0000000..9e1a7a7
--- /dev/null
+++ b/public/src/js/modules/main/apps/chat/views/chatWebsites/create/dialog.html/dialog.html
@@ -0,0 +1,297 @@
+<md-dialog class="chatWebsite-dialog" aria-label="New ChatWebsite">
+  <form name="chatWebsiteForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="CHAT.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.chatWebsite.name"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.newChatWebsite"
+        />
+
+        <div
+          ng-messages="chatWebsiteForm['name'].$error"
+          ng-show="chatWebsiteForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CHAT.KEY">key</label>
+        <input
+          type="text"
+          name="key"
+          ng-model="vm.chatWebsite.key"
+          md-maxlength="5"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="chatWebsiteForm['key'].$error"
+          ng-show="chatWebsiteForm['key'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.KEY_REQUIRED"
+              >key field is required</span
+            >
+          </div>
+          <div ng-message="md-maxlength">
+            <span
+              translate="CHAT.ERRORS.KEY_MAX_LENGTH"
+              translate-values="{max: 5}"
+              >key must have a maximum length equal to 5</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CHAT.MOTIONADDRESS">MotionAddress</label>
+        <input
+          type="url"
+          name="address"
+          ng-model="vm.chatWebsite.address"
+          md-maxlength="255"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="chatWebsiteForm['address'].$error"
+          ng-show="chatWebsiteForm['address'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.MOTIONADDRESS_REQUIRED"
+              >MotionAddress field is required</span
+            >
+          </div>
+          <div ng-message="url">
+            <span translate="CHAT.ERRORS.MOTIONADDRESS_MUST_VALID_URL"
+              >MotionAddress must be a valid url http://www.xcally.com</span
+            >
+          </div>
+          <div ng-message="md-maxlength">
+            <span
+              translate="CHAT.ERRORS.MOTIONADDRESS_MAX_LENGTH"
+              translate-values="{max: 255}"
+              >MotionAddress must have a maximum length equal to 255</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CHAT.MOTIONPROXY">MotionProxy</label>
+        <input
+          type="url"
+          name="remote"
+          ng-model="vm.chatWebsite.remote"
+          md-maxlength="255"
+          ng-required="true"
+        />
+
+        <div class="hint"><span translate="CHAT.HELP.MOTIONPROXY"></span></div>
+        <div
+          ng-messages="chatWebsiteForm['remote'].$error"
+          ng-show="chatWebsiteForm['remote'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.MOTIONPROXY_REQUIRED"
+              >MotionProxy field is required</span
+            >
+          </div>
+          <div ng-message="url">
+            <span translate="CHAT.ERRORS.MOTIONPROXY_MUST_VALID_URL"
+              >MotionProxy must be a valid url http://www.xcally.com</span
+            >
+          </div>
+          <div ng-message="md-maxlength">
+            <span
+              translate="CHAT.ERRORS.MOTIONPROXY_MAX_LENGTH"
+              translate-values="{max: 255}"
+              >MotionProxy must have a maximum length equal to 255</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CHAT.LIST">List</label>
+        <md-select name="ListId" ng-model="vm.chatWebsite.ListId" required>
+          <md-option
+            ng-value="ListId.id"
+            ng-repeat="ListId in vm.lists"
+            ng-disabled="ListId.canSelect === false"
+            >{{ ListId.name }}</md-option
+          >
+        </md-select>
+        <div class="hint"><span translate="CHAT.HELP.LIST"></span></div>
+        <div
+          ng-messages="chatWebsiteForm['ListId'].$error"
+          ng-show="chatWebsiteForm['ListId'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.LIST_REQUIRED"
+              >List field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CHAT.INTERVAL">Interval</label>
+        <md-select name="IntervalId" ng-model="vm.chatWebsite.IntervalId">
+          <md-option ng-value="null">Always</md-option>
+          <md-option
+            ng-value="IntervalId.id"
+            ng-repeat="IntervalId in vm.interval"
+            ng-disabled="IntervalId.canSelect === false"
+            >{{ IntervalId.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="chatWebsiteForm['IntervalId'].$error"
+          ng-show="chatWebsiteForm['IntervalId'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.INTERVAL_REQUIRED"
+              >Interval field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CHAT.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.chatWebsite.description"
+        />
+
+        <div
+          ng-messages="chatWebsiteForm['description'].$error"
+          ng-show="chatWebsiteForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newChatWebsite"
+          ng-click="vm.saveChatWebsite()"
+          class="send-button md-accent md-raised"
+          ng-disabled="chatWebsiteForm.$invalid || chatWebsiteForm.$pristine"
+          aria-label="SAVE"
+          translate="CHAT.SAVE"
+          translate-attr-aria-label="CHAT.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newChatWebsite"
+          ng-click="vm.addNewChatWebsite()"
+          class="send-button md-accent md-raised"
+          ng-disabled="chatWebsiteForm.$invalid"
+          aria-label="ADD"
+          translate="CHAT.ADD_CHATWEBSITE"
+          translate-attr-aria-label="CHAT.ADD_CHATWEBSITE"
+        >
+          ADD CHATWEBSITE
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newChatWebsite"
+          ng-click="vm.deleteChatWebsite($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="CHAT.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="CHAT.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/agentadd/agentadd.html/agentadd-[chunkhash].html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
deleted file mode 100644
index dfa8a51..0000000
--- a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
+++ /dev/null
@@ -1,44 +0,0 @@
-<md-dialog
-  class="chatWebsite-dialog"
-  aria-label="chatWebsite"
-  ng-init="vm.onInit()"
->
-  <form name="chatWebsiteForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="CHAT.AGENTADD_CHATWEBSITE">Add Agent to chatWebsite</h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <ms-dual-multiselect
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveAgents()"
-        class="send-button md-accent md-raised"
-        ng-disabled="!vm.pendingChanges"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/agentadd/agentadd.html/agentadd.html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/agentadd/agentadd.html/agentadd.html
new file mode 100644
index 0000000..dfa8a51
--- /dev/null
+++ b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/agentadd/agentadd.html/agentadd.html
@@ -0,0 +1,44 @@
+<md-dialog
+  class="chatWebsite-dialog"
+  aria-label="chatWebsite"
+  ng-init="vm.onInit()"
+>
+  <form name="chatWebsiteForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="CHAT.AGENTADD_CHATWEBSITE">Add Agent to chatWebsite</h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <ms-dual-multiselect
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveAgents()"
+        class="send-button md-accent md-raised"
+        ng-disabled="!vm.pendingChanges"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/agent/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/agent/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 288b08d..0000000
--- a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/agent/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,148 +0,0 @@
-<md-dialog class="chatWebsite-dialog" aria-label="New ChatWebsite">
-  <form name="chatWebsiteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="CHAT.AGENT">Agent</label>
-        <md-select
-          name="agent"
-          ng-model="vm.agent.agent"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="agent.name"
-            ng-repeat="agent in vm.agents"
-            ng-disabled="agent.canSelect === false"
-            >{{ agent.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="chatWebsiteFormApp['agent'].$error"
-          ng-show="chatWebsiteFormApp['agent'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.AGENT_REQUIRED"
-              >Agent field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CHAT.TIMEOUT">Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.agent.timeout"
-          min="0"
-          max="2147483"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="chatWebsiteFormApp['timeout'].$error"
-          ng-show="chatWebsiteFormApp['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.TIMEOUT_REQUIRED"
-              >Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="CHAT.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-          <div ng-message="max">
-            <span translate="CHAT.ERRORS.TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>2147483</span>
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveChatWebsiteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="chatWebsiteFormApp.$invalid || chatWebsiteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="CHAT.SAVE"
-          translate-attr-aria-label="CHAT.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/agent/dialog.html/dialog.html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/agent/dialog.html/dialog.html
new file mode 100644
index 0000000..288b08d
--- /dev/null
+++ b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/agent/dialog.html/dialog.html
@@ -0,0 +1,148 @@
+<md-dialog class="chatWebsite-dialog" aria-label="New ChatWebsite">
+  <form name="chatWebsiteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="CHAT.AGENT">Agent</label>
+        <md-select
+          name="agent"
+          ng-model="vm.agent.agent"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="agent.name"
+            ng-repeat="agent in vm.agents"
+            ng-disabled="agent.canSelect === false"
+            >{{ agent.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="chatWebsiteFormApp['agent'].$error"
+          ng-show="chatWebsiteFormApp['agent'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.AGENT_REQUIRED"
+              >Agent field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CHAT.TIMEOUT">Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.agent.timeout"
+          min="0"
+          max="2147483"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="chatWebsiteFormApp['timeout'].$error"
+          ng-show="chatWebsiteFormApp['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.TIMEOUT_REQUIRED"
+              >Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="CHAT.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+          <div ng-message="max">
+            <span translate="CHAT.ERRORS.TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>2147483</span>
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveChatWebsiteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="chatWebsiteFormApp.$invalid || chatWebsiteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="CHAT.SAVE"
+          translate-attr-aria-label="CHAT.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/amazonlex/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/amazonlex/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 8741946..0000000
--- a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/amazonlex/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,202 +0,0 @@
-<md-dialog class="chatWebsite-dialog" aria-label="New ChatWebsite">
-  <form name="chatWebsiteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="CHAT.ACCESSKEYID">accesskeyid</label>
-        <input
-          type="text"
-          name="accesskeyid"
-          ng-model="vm.amazonlex.accesskeyid"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="chatWebsiteFormApp['accesskeyid'].$error"
-          ng-show="chatWebsiteFormApp['accesskeyid'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.ACCESSKEYID_REQUIRED"
-              >accesskeyid field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CHAT.SECRETACCESSKEY">secretaccesskey</label>
-        <input
-          type="text"
-          name="secretaccesskey"
-          ng-model="vm.amazonlex.secretaccesskey"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="chatWebsiteFormApp['secretaccesskey'].$error"
-          ng-show="chatWebsiteFormApp['secretaccesskey'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.SECRETACCESSKEY_REQUIRED"
-              >secretaccesskey field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CHAT.LEXREGION">lexregion</label>
-        <md-select
-          name="lexregion"
-          ng-model="vm.amazonlex.lexregion"
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="'us-east-1'">US East (N. Virginia)</md-option>
-          <md-option ng-value="'us-west-2'">US West (Oregon)</md-option>
-          <md-option ng-value="'eu-west-1'">EU (Ireland)</md-option>
-          <md-option ng-value="'ap-southeast-2'"
-            >Asia Pacific (Sydney)</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="chatWebsiteFormApp['lexregion'].$error"
-          ng-show="chatWebsiteFormApp['lexregion'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.LEXREGION_REQUIRED"
-              >lexregion field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CHAT.BOTNAME">botname</label>
-        <input
-          type="text"
-          name="botname"
-          ng-model="vm.amazonlex.botname"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="chatWebsiteFormApp['botname'].$error"
-          ng-show="chatWebsiteFormApp['botname'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.BOTNAME_REQUIRED"
-              >botname field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CHAT.WELCOMEMESSAGE">welcomemessage</label>
-        <textarea
-          name="welcomemessage"
-          ng-model="vm.amazonlex.welcomemessage"
-          md-maxlength="255"
-        ></textarea>
-        <div class="hint">
-          <span translate="CHAT.HELP.WELCOMEMESSAGE"></span>
-        </div>
-
-        <div
-          ng-messages="chatWebsiteFormApp['welcomemessage'].$error"
-          ng-show="chatWebsiteFormApp['welcomemessage'].$touched"
-          role="alert"
-        >
-          <div ng-message="md-maxlength">
-            <span
-              translate="CHAT.ERRORS.WELCOMEMESSAGE_MAX_LENGTH"
-              translate-values="{max: 255}"
-              >welcomemessage must have a maximum length equal to 255</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveChatWebsiteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="chatWebsiteFormApp.$invalid || chatWebsiteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="CHAT.SAVE"
-          translate-attr-aria-label="CHAT.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/amazonlex/dialog.html/dialog.html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/amazonlex/dialog.html/dialog.html
new file mode 100644
index 0000000..8741946
--- /dev/null
+++ b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/amazonlex/dialog.html/dialog.html
@@ -0,0 +1,202 @@
+<md-dialog class="chatWebsite-dialog" aria-label="New ChatWebsite">
+  <form name="chatWebsiteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="CHAT.ACCESSKEYID">accesskeyid</label>
+        <input
+          type="text"
+          name="accesskeyid"
+          ng-model="vm.amazonlex.accesskeyid"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="chatWebsiteFormApp['accesskeyid'].$error"
+          ng-show="chatWebsiteFormApp['accesskeyid'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.ACCESSKEYID_REQUIRED"
+              >accesskeyid field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CHAT.SECRETACCESSKEY">secretaccesskey</label>
+        <input
+          type="text"
+          name="secretaccesskey"
+          ng-model="vm.amazonlex.secretaccesskey"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="chatWebsiteFormApp['secretaccesskey'].$error"
+          ng-show="chatWebsiteFormApp['secretaccesskey'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.SECRETACCESSKEY_REQUIRED"
+              >secretaccesskey field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CHAT.LEXREGION">lexregion</label>
+        <md-select
+          name="lexregion"
+          ng-model="vm.amazonlex.lexregion"
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="'us-east-1'">US East (N. Virginia)</md-option>
+          <md-option ng-value="'us-west-2'">US West (Oregon)</md-option>
+          <md-option ng-value="'eu-west-1'">EU (Ireland)</md-option>
+          <md-option ng-value="'ap-southeast-2'"
+            >Asia Pacific (Sydney)</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="chatWebsiteFormApp['lexregion'].$error"
+          ng-show="chatWebsiteFormApp['lexregion'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.LEXREGION_REQUIRED"
+              >lexregion field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CHAT.BOTNAME">botname</label>
+        <input
+          type="text"
+          name="botname"
+          ng-model="vm.amazonlex.botname"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="chatWebsiteFormApp['botname'].$error"
+          ng-show="chatWebsiteFormApp['botname'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.BOTNAME_REQUIRED"
+              >botname field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CHAT.WELCOMEMESSAGE">welcomemessage</label>
+        <textarea
+          name="welcomemessage"
+          ng-model="vm.amazonlex.welcomemessage"
+          md-maxlength="255"
+        ></textarea>
+        <div class="hint">
+          <span translate="CHAT.HELP.WELCOMEMESSAGE"></span>
+        </div>
+
+        <div
+          ng-messages="chatWebsiteFormApp['welcomemessage'].$error"
+          ng-show="chatWebsiteFormApp['welcomemessage'].$touched"
+          role="alert"
+        >
+          <div ng-message="md-maxlength">
+            <span
+              translate="CHAT.ERRORS.WELCOMEMESSAGE_MAX_LENGTH"
+              translate-values="{max: 255}"
+              >welcomemessage must have a maximum length equal to 255</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveChatWebsiteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="chatWebsiteFormApp.$invalid || chatWebsiteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="CHAT.SAVE"
+          translate-attr-aria-label="CHAT.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/autoreply/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/autoreply/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 8ee405f..0000000
--- a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/autoreply/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,123 +0,0 @@
-<md-dialog class="chatWebsite-dialog" aria-label="New ChatWebsite">
-  <form name="chatWebsiteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="CHAT.TIMES">times</label>
-        <md-select
-          name="times"
-          ng-model="vm.autoreply.times"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="1">One Time</md-option>
-          <md-option ng-value="0">Always</md-option>
-        </md-select>
-        <div
-          ng-messages="chatWebsiteFormApp['times'].$error"
-          ng-show="chatWebsiteFormApp['times'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.TIMES_REQUIRED"
-              >times field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CHAT.TEXT">Text</label>
-        <textarea name="text" ng-model="vm.autoreply.text" required></textarea>
-
-        <div
-          ng-messages="chatWebsiteFormApp['text'].$error"
-          ng-show="chatWebsiteFormApp['text'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.TEXT_REQUIRED"
-              >Text field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveChatWebsiteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="chatWebsiteFormApp.$invalid || chatWebsiteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="CHAT.SAVE"
-          translate-attr-aria-label="CHAT.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/autoreply/dialog.html/dialog.html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/autoreply/dialog.html/dialog.html
new file mode 100644
index 0000000..8ee405f
--- /dev/null
+++ b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/autoreply/dialog.html/dialog.html
@@ -0,0 +1,123 @@
+<md-dialog class="chatWebsite-dialog" aria-label="New ChatWebsite">
+  <form name="chatWebsiteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="CHAT.TIMES">times</label>
+        <md-select
+          name="times"
+          ng-model="vm.autoreply.times"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="1">One Time</md-option>
+          <md-option ng-value="0">Always</md-option>
+        </md-select>
+        <div
+          ng-messages="chatWebsiteFormApp['times'].$error"
+          ng-show="chatWebsiteFormApp['times'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.TIMES_REQUIRED"
+              >times field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CHAT.TEXT">Text</label>
+        <textarea name="text" ng-model="vm.autoreply.text" required></textarea>
+
+        <div
+          ng-messages="chatWebsiteFormApp['text'].$error"
+          ng-show="chatWebsiteFormApp['text'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.TEXT_REQUIRED"
+              >Text field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveChatWebsiteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="chatWebsiteFormApp.$invalid || chatWebsiteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="CHAT.SAVE"
+          translate-attr-aria-label="CHAT.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/close/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/close/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index cd6a0ab..0000000
--- a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/close/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,106 +0,0 @@
-<md-dialog class="chatWebsite-dialog" aria-label="New ChatWebsite">
-  <form name="chatWebsiteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="CHAT.DISPOSITION">Disposition</label>
-        <input
-          type="text"
-          name="disposition"
-          ng-model="vm.close.disposition"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="chatWebsiteFormApp['disposition'].$error"
-          ng-show="chatWebsiteFormApp['disposition'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.DISPOSITION_REQUIRED"
-              >Disposition field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveChatWebsiteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="chatWebsiteFormApp.$invalid || chatWebsiteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="CHAT.SAVE"
-          translate-attr-aria-label="CHAT.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/close/dialog.html/dialog.html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/close/dialog.html/dialog.html
new file mode 100644
index 0000000..cd6a0ab
--- /dev/null
+++ b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/close/dialog.html/dialog.html
@@ -0,0 +1,106 @@
+<md-dialog class="chatWebsite-dialog" aria-label="New ChatWebsite">
+  <form name="chatWebsiteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="CHAT.DISPOSITION">Disposition</label>
+        <input
+          type="text"
+          name="disposition"
+          ng-model="vm.close.disposition"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="chatWebsiteFormApp['disposition'].$error"
+          ng-show="chatWebsiteFormApp['disposition'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.DISPOSITION_REQUIRED"
+              >Disposition field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveChatWebsiteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="chatWebsiteFormApp.$invalid || chatWebsiteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="CHAT.SAVE"
+          translate-attr-aria-label="CHAT.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/dialogflow/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/dialogflow/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index f5aa2fd..0000000
--- a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/dialogflow/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,172 +0,0 @@
-<md-dialog class="chatWebsite-dialog" aria-label="New ChatWebsite">
-  <form name="chatWebsiteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="CHAT.KEY">Key</label>
-        <input
-          type="text"
-          name="key"
-          ng-model="vm.dialogflow.key"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="chatWebsiteFormApp['key'].$error"
-          ng-show="chatWebsiteFormApp['key'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.KEY_REQUIRED"
-              >Key field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CHAT.LANGUAGE">language</label>
-        <md-select
-          name="language"
-          ng-model="vm.dialogflow.language"
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="'da'">Danish</md-option>
-          <md-option ng-value="'en'">English</md-option>
-          <md-option ng-value="'de'">German</md-option>
-          <md-option ng-value="'it'">Italian</md-option>
-          <md-option ng-value="'es'">Spanish</md-option>
-          <md-option ng-value="'fr'">French</md-option>
-          <md-option ng-value="'id'">Indonesian</md-option>
-          <md-option ng-value="'ja'">Japanese</md-option>
-          <md-option ng-value="'ko'">Korean (South Korea)</md-option>
-          <md-option ng-value="'nl'">Dutch</md-option>
-          <md-option ng-value="'no'">Norwegian</md-option>
-          <md-option ng-value="'pt'">Portuguese (European)</md-option>
-          <md-option ng-value="'pt-br'">Portuguese (Nrazilian)</md-option>
-          <md-option ng-value="'ru'">Russian</md-option>
-          <md-option ng-value="'sv'">Swedish</md-option>
-          <md-option ng-value="'th'">Thai</md-option>
-          <md-option ng-value="'uk'">Ukrainian</md-option>
-          <md-option ng-value="'zh-CN'">Chinese (Simplified)</md-option>
-          <md-option ng-value="'zh-HK'">Chinese (Hong Kong)</md-option>
-          <md-option ng-value="'zh-TW'">Chinese (Traditional)</md-option>
-        </md-select>
-        <div
-          ng-messages="chatWebsiteFormApp['language'].$error"
-          ng-show="chatWebsiteFormApp['language'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.LANGUAGE_REQUIRED"
-              >language field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CHAT.WELCOMEMESSAGE">welcomemessage</label>
-        <textarea
-          name="welcomemessage"
-          ng-model="vm.dialogflow.welcomemessage"
-          md-maxlength="255"
-        ></textarea>
-        <div class="hint">
-          <span translate="CHAT.HELP.WELCOMEMESSAGE"></span>
-        </div>
-
-        <div
-          ng-messages="chatWebsiteFormApp['welcomemessage'].$error"
-          ng-show="chatWebsiteFormApp['welcomemessage'].$touched"
-          role="alert"
-        >
-          <div ng-message="md-maxlength">
-            <span
-              translate="CHAT.ERRORS.WELCOMEMESSAGE_MAX_LENGTH"
-              translate-values="{max: 255}"
-              >welcomemessage must have a maximum length equal to 255</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveChatWebsiteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="chatWebsiteFormApp.$invalid || chatWebsiteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="CHAT.SAVE"
-          translate-attr-aria-label="CHAT.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/dialogflow/dialog.html/dialog.html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/dialogflow/dialog.html/dialog.html
new file mode 100644
index 0000000..f5aa2fd
--- /dev/null
+++ b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/dialogflow/dialog.html/dialog.html
@@ -0,0 +1,172 @@
+<md-dialog class="chatWebsite-dialog" aria-label="New ChatWebsite">
+  <form name="chatWebsiteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="CHAT.KEY">Key</label>
+        <input
+          type="text"
+          name="key"
+          ng-model="vm.dialogflow.key"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="chatWebsiteFormApp['key'].$error"
+          ng-show="chatWebsiteFormApp['key'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.KEY_REQUIRED"
+              >Key field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CHAT.LANGUAGE">language</label>
+        <md-select
+          name="language"
+          ng-model="vm.dialogflow.language"
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="'da'">Danish</md-option>
+          <md-option ng-value="'en'">English</md-option>
+          <md-option ng-value="'de'">German</md-option>
+          <md-option ng-value="'it'">Italian</md-option>
+          <md-option ng-value="'es'">Spanish</md-option>
+          <md-option ng-value="'fr'">French</md-option>
+          <md-option ng-value="'id'">Indonesian</md-option>
+          <md-option ng-value="'ja'">Japanese</md-option>
+          <md-option ng-value="'ko'">Korean (South Korea)</md-option>
+          <md-option ng-value="'nl'">Dutch</md-option>
+          <md-option ng-value="'no'">Norwegian</md-option>
+          <md-option ng-value="'pt'">Portuguese (European)</md-option>
+          <md-option ng-value="'pt-br'">Portuguese (Nrazilian)</md-option>
+          <md-option ng-value="'ru'">Russian</md-option>
+          <md-option ng-value="'sv'">Swedish</md-option>
+          <md-option ng-value="'th'">Thai</md-option>
+          <md-option ng-value="'uk'">Ukrainian</md-option>
+          <md-option ng-value="'zh-CN'">Chinese (Simplified)</md-option>
+          <md-option ng-value="'zh-HK'">Chinese (Hong Kong)</md-option>
+          <md-option ng-value="'zh-TW'">Chinese (Traditional)</md-option>
+        </md-select>
+        <div
+          ng-messages="chatWebsiteFormApp['language'].$error"
+          ng-show="chatWebsiteFormApp['language'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.LANGUAGE_REQUIRED"
+              >language field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CHAT.WELCOMEMESSAGE">welcomemessage</label>
+        <textarea
+          name="welcomemessage"
+          ng-model="vm.dialogflow.welcomemessage"
+          md-maxlength="255"
+        ></textarea>
+        <div class="hint">
+          <span translate="CHAT.HELP.WELCOMEMESSAGE"></span>
+        </div>
+
+        <div
+          ng-messages="chatWebsiteFormApp['welcomemessage'].$error"
+          ng-show="chatWebsiteFormApp['welcomemessage'].$touched"
+          role="alert"
+        >
+          <div ng-message="md-maxlength">
+            <span
+              translate="CHAT.ERRORS.WELCOMEMESSAGE_MAX_LENGTH"
+              translate-values="{max: 255}"
+              >welcomemessage must have a maximum length equal to 255</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveChatWebsiteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="chatWebsiteFormApp.$invalid || chatWebsiteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="CHAT.SAVE"
+          translate-attr-aria-label="CHAT.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/gotoif/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/gotoif/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 37b0ff8..0000000
--- a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/gotoif/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,166 +0,0 @@
-<md-dialog class="chatWebsite-dialog" aria-label="New ChatWebsite">
-  <form name="chatWebsiteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="CHAT.CONDITION">Condition</label>
-        <input
-          type="text"
-          name="condition"
-          ng-model="vm.gotoif.condition"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="chatWebsiteFormApp['condition'].$error"
-          ng-show="chatWebsiteFormApp['condition'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.CONDITION_REQUIRED"
-              >Condition field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CHAT.TRUEPRIORITY">truepriority</label>
-        <input
-          type="number"
-          name="truepriority"
-          ng-model="vm.gotoif.truepriority"
-          min="1"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="chatWebsiteFormApp['truepriority'].$error"
-          ng-show="chatWebsiteFormApp['truepriority'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.TRUEPRIORITY_REQUIRED"
-              >truepriority field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="CHAT.ERRORS.TRUEPRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >truepriority must be a valid greater or equal than</span
-            >
-            <span>1</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CHAT.FALSEPRIORITY">falsepriority</label>
-        <input
-          type="number"
-          name="falsepriority"
-          ng-model="vm.gotoif.falsepriority"
-          min="1"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="chatWebsiteFormApp['falsepriority'].$error"
-          ng-show="chatWebsiteFormApp['falsepriority'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.FALSEPRIORITY_REQUIRED"
-              >falsepriority field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="CHAT.ERRORS.FALSEPRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >falsepriority must be a valid greater or equal than</span
-            >
-            <span>1</span>
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveChatWebsiteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="chatWebsiteFormApp.$invalid || chatWebsiteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="CHAT.SAVE"
-          translate-attr-aria-label="CHAT.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/gotoif/dialog.html/dialog.html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/gotoif/dialog.html/dialog.html
new file mode 100644
index 0000000..37b0ff8
--- /dev/null
+++ b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/gotoif/dialog.html/dialog.html
@@ -0,0 +1,166 @@
+<md-dialog class="chatWebsite-dialog" aria-label="New ChatWebsite">
+  <form name="chatWebsiteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="CHAT.CONDITION">Condition</label>
+        <input
+          type="text"
+          name="condition"
+          ng-model="vm.gotoif.condition"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="chatWebsiteFormApp['condition'].$error"
+          ng-show="chatWebsiteFormApp['condition'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.CONDITION_REQUIRED"
+              >Condition field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CHAT.TRUEPRIORITY">truepriority</label>
+        <input
+          type="number"
+          name="truepriority"
+          ng-model="vm.gotoif.truepriority"
+          min="1"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="chatWebsiteFormApp['truepriority'].$error"
+          ng-show="chatWebsiteFormApp['truepriority'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.TRUEPRIORITY_REQUIRED"
+              >truepriority field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="CHAT.ERRORS.TRUEPRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >truepriority must be a valid greater or equal than</span
+            >
+            <span>1</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CHAT.FALSEPRIORITY">falsepriority</label>
+        <input
+          type="number"
+          name="falsepriority"
+          ng-model="vm.gotoif.falsepriority"
+          min="1"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="chatWebsiteFormApp['falsepriority'].$error"
+          ng-show="chatWebsiteFormApp['falsepriority'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.FALSEPRIORITY_REQUIRED"
+              >falsepriority field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="CHAT.ERRORS.FALSEPRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >falsepriority must be a valid greater or equal than</span
+            >
+            <span>1</span>
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveChatWebsiteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="chatWebsiteFormApp.$invalid || chatWebsiteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="CHAT.SAVE"
+          translate-attr-aria-label="CHAT.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/gotop/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/gotop/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index bef3343..0000000
--- a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/gotop/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,114 +0,0 @@
-<md-dialog class="chatWebsite-dialog" aria-label="New ChatWebsite">
-  <form name="chatWebsiteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="CHAT.PRIORITY">Priority</label>
-        <input
-          type="number"
-          name="priority"
-          ng-model="vm.gotop.priority"
-          min="0"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="chatWebsiteFormApp['priority'].$error"
-          ng-show="chatWebsiteFormApp['priority'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.PRIORITY_REQUIRED"
-              >Priority field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="CHAT.ERRORS.PRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Priority must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveChatWebsiteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="chatWebsiteFormApp.$invalid || chatWebsiteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="CHAT.SAVE"
-          translate-attr-aria-label="CHAT.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/gotop/dialog.html/dialog.html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/gotop/dialog.html/dialog.html
new file mode 100644
index 0000000..bef3343
--- /dev/null
+++ b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/gotop/dialog.html/dialog.html
@@ -0,0 +1,114 @@
+<md-dialog class="chatWebsite-dialog" aria-label="New ChatWebsite">
+  <form name="chatWebsiteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="CHAT.PRIORITY">Priority</label>
+        <input
+          type="number"
+          name="priority"
+          ng-model="vm.gotop.priority"
+          min="0"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="chatWebsiteFormApp['priority'].$error"
+          ng-show="chatWebsiteFormApp['priority'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.PRIORITY_REQUIRED"
+              >Priority field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="CHAT.ERRORS.PRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Priority must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveChatWebsiteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="chatWebsiteFormApp.$invalid || chatWebsiteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="CHAT.SAVE"
+          translate-attr-aria-label="CHAT.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/interval/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/interval/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index ca0ed91..0000000
--- a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/interval/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,313 +0,0 @@
-<md-dialog class="inboundroute-dialog" aria-label="New Interval">
-  <form name="intervalForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <md-input-container class="md-block">
-        <label translate="TOOLS.TYPE">Type</label>
-        <md-select
-          ng-model="vm.type"
-          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="type" ng-repeat="type in vm.types"
-            >{{ type | ucfirst }}</md-option
-          >
-        </md-select>
-      </md-input-container>
-
-      <md-input-container class="md-block" ng-if="vm.type === 'list'">
-        <label translate="TOOLS.INTERVALS">Intervals</label>
-        <md-select
-          ng-model="vm.interval.IntervalId"
-          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="interval.id" ng-repeat="interval in vm.intervals"
-            >{{ interval.name }}</md-option
-          >
-        </md-select>
-      </md-input-container>
-
-      <!-- TIMERANGE START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.TIME_RANGE"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <div class="md-block" flex>
-          <mdp-time-picker
-            name="timeRangeFrom"
-            mdp-placeholder="FROM"
-            ng-model="vm.timeRangeFrom"
-            mdp-format="HH:mm"
-            mdp-auto-switch="true"
-            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <div
-              ng-messages="intervalForm.timeRangeFrom.$error"
-              ng-show="intervalForm.timeRangeFrom.$touched"
-              role="alert"
-            >
-              <div ng-message="format">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_FROM_INVALID"
-                  >Time Range From field is invalid</span
-                >
-              </div>
-            </div>
-          </mdp-time-picker>
-        </div>
-        <div class="md-block" flex ng-if="vm.timeRangeFrom">
-          <mdp-time-picker
-            name="timeRangeTo"
-            mdp-placeholder="TO*"
-            ng-model="vm.timeRangeTo"
-            mdp-format="HH:mm"
-            mdp-auto-switch="true"
-            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-            required
-          >
-            <div
-              ng-messages="intervalForm.timeRangeTo.$error"
-              ng-show="intervalForm.timeRangeTo.$invalid"
-              role="alert"
-            >
-              <div ng-message="format">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_INVALID"
-                  >Time Range To field is invalid</span
-                >
-              </div>
-              <div ng-message="required">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_REQUIRED"
-                  >Time Range To field is required</span
-                >
-              </div>
-            </div>
-          </mdp-time-picker>
-        </div>
-      </div>
-      <!-- TIMERANGE END -->
-
-      <!-- DAYSOFWEEK START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.WEEK_DAYS"
-        >Week Days</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.dayOfWeekFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
-              ><span translate="TOOLS.{{day.value | uppercase}}"
-                >{{ day.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container flex class="md-block" ng-if="vm.dayOfWeekFrom">
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="dayOfWeekTo"
-            ng-model="vm.dayOfWeekTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
-              ><span translate="TOOLS.{{day.value | uppercase}}"
-                >{{ day.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.dayOfWeekTo.$error"
-            ng-show="intervalForm.dayOfWeekTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- DAYSOFWEEK END -->
-
-      <!-- MONTHDAY START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTH_DAYS"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex layout="column" class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.monthDayFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
-              >{{ month }}</md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container
-          flex
-          layout="column"
-          class="md-block"
-          ng-if="vm.monthDayFrom"
-        >
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="monthDayTo"
-            ng-model="vm.monthDayTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
-              >{{ month }}</md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.monthDayTo.$error"
-            ng-show="intervalForm.monthDayTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- MONTHDAY END -->
-
-      <!-- MONTH START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTHS"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex layout="column" class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.monthFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
-              ><span translate="TOOLS.{{month.value | uppercase}}"
-                >{{ month.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container
-          flex
-          layout="column"
-          class="md-block"
-          ng-if="vm.monthFrom"
-        >
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="monthTo"
-            ng-model="vm.monthTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
-              ><span translate="TOOLS.{{month.value | uppercase}}"
-                >{{ month.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.monthTo.$error"
-            ng-show="intervalForm.monthTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- MONTH END -->
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="!vm.newInterval && vm.crudPermissions.canEdit"
-          ng-click="vm.saveInterval()"
-          class="send-button md-accent md-raised"
-          ng-disabled="intervalForm.$invalid || intervalForm.$pristine"
-          aria-label="SAVE"
-          translate="TOOLS.SAVE"
-          translate-attr-aria-label="TOOLS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.newInterval && vm.crudPermissions.canEdit"
-          ng-click="vm.addNewInterval()"
-          class="send-button md-accent md-raised"
-          ng-disabled="intervalForm.$invalid"
-          aria-label="ADD"
-          translate="TOOLS.ADD_INTERVAL"
-          translate-attr-aria-label="TOOLS.ADD_INTERVAL"
-        >
-          ADD INTERVAL
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/interval/dialog.html/dialog.html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/interval/dialog.html/dialog.html
new file mode 100644
index 0000000..ca0ed91
--- /dev/null
+++ b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/interval/dialog.html/dialog.html
@@ -0,0 +1,313 @@
+<md-dialog class="inboundroute-dialog" aria-label="New Interval">
+  <form name="intervalForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <md-input-container class="md-block">
+        <label translate="TOOLS.TYPE">Type</label>
+        <md-select
+          ng-model="vm.type"
+          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="type" ng-repeat="type in vm.types"
+            >{{ type | ucfirst }}</md-option
+          >
+        </md-select>
+      </md-input-container>
+
+      <md-input-container class="md-block" ng-if="vm.type === 'list'">
+        <label translate="TOOLS.INTERVALS">Intervals</label>
+        <md-select
+          ng-model="vm.interval.IntervalId"
+          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="interval.id" ng-repeat="interval in vm.intervals"
+            >{{ interval.name }}</md-option
+          >
+        </md-select>
+      </md-input-container>
+
+      <!-- TIMERANGE START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.TIME_RANGE"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <div class="md-block" flex>
+          <mdp-time-picker
+            name="timeRangeFrom"
+            mdp-placeholder="FROM"
+            ng-model="vm.timeRangeFrom"
+            mdp-format="HH:mm"
+            mdp-auto-switch="true"
+            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <div
+              ng-messages="intervalForm.timeRangeFrom.$error"
+              ng-show="intervalForm.timeRangeFrom.$touched"
+              role="alert"
+            >
+              <div ng-message="format">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_FROM_INVALID"
+                  >Time Range From field is invalid</span
+                >
+              </div>
+            </div>
+          </mdp-time-picker>
+        </div>
+        <div class="md-block" flex ng-if="vm.timeRangeFrom">
+          <mdp-time-picker
+            name="timeRangeTo"
+            mdp-placeholder="TO*"
+            ng-model="vm.timeRangeTo"
+            mdp-format="HH:mm"
+            mdp-auto-switch="true"
+            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+            required
+          >
+            <div
+              ng-messages="intervalForm.timeRangeTo.$error"
+              ng-show="intervalForm.timeRangeTo.$invalid"
+              role="alert"
+            >
+              <div ng-message="format">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_INVALID"
+                  >Time Range To field is invalid</span
+                >
+              </div>
+              <div ng-message="required">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_REQUIRED"
+                  >Time Range To field is required</span
+                >
+              </div>
+            </div>
+          </mdp-time-picker>
+        </div>
+      </div>
+      <!-- TIMERANGE END -->
+
+      <!-- DAYSOFWEEK START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.WEEK_DAYS"
+        >Week Days</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.dayOfWeekFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
+              ><span translate="TOOLS.{{day.value | uppercase}}"
+                >{{ day.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container flex class="md-block" ng-if="vm.dayOfWeekFrom">
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="dayOfWeekTo"
+            ng-model="vm.dayOfWeekTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
+              ><span translate="TOOLS.{{day.value | uppercase}}"
+                >{{ day.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.dayOfWeekTo.$error"
+            ng-show="intervalForm.dayOfWeekTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- DAYSOFWEEK END -->
+
+      <!-- MONTHDAY START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTH_DAYS"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex layout="column" class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.monthDayFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
+              >{{ month }}</md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container
+          flex
+          layout="column"
+          class="md-block"
+          ng-if="vm.monthDayFrom"
+        >
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="monthDayTo"
+            ng-model="vm.monthDayTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
+              >{{ month }}</md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.monthDayTo.$error"
+            ng-show="intervalForm.monthDayTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- MONTHDAY END -->
+
+      <!-- MONTH START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTHS"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex layout="column" class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.monthFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
+              ><span translate="TOOLS.{{month.value | uppercase}}"
+                >{{ month.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container
+          flex
+          layout="column"
+          class="md-block"
+          ng-if="vm.monthFrom"
+        >
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="monthTo"
+            ng-model="vm.monthTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
+              ><span translate="TOOLS.{{month.value | uppercase}}"
+                >{{ month.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.monthTo.$error"
+            ng-show="intervalForm.monthTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- MONTH END -->
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="!vm.newInterval && vm.crudPermissions.canEdit"
+          ng-click="vm.saveInterval()"
+          class="send-button md-accent md-raised"
+          ng-disabled="intervalForm.$invalid || intervalForm.$pristine"
+          aria-label="SAVE"
+          translate="TOOLS.SAVE"
+          translate-attr-aria-label="TOOLS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.newInterval && vm.crudPermissions.canEdit"
+          ng-click="vm.addNewInterval()"
+          class="send-button md-accent md-raised"
+          ng-disabled="intervalForm.$invalid"
+          aria-label="ADD"
+          translate="TOOLS.ADD_INTERVAL"
+          translate-attr-aria-label="TOOLS.ADD_INTERVAL"
+        >
+          ADD INTERVAL
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/noop/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/noop/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index d48399b..0000000
--- a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/noop/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,105 +0,0 @@
-<md-dialog class="chatWebsite-dialog" aria-label="New ChatWebsite">
-  <form name="chatWebsiteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="CHAT.VALUE">Value</label>
-        <input
-          type="text"
-          name="value"
-          ng-model="vm.noop.value"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="chatWebsiteFormApp['value'].$error"
-          ng-show="chatWebsiteFormApp['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.VALUE_REQUIRED"
-              >Value field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveChatWebsiteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="chatWebsiteFormApp.$invalid || chatWebsiteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="CHAT.SAVE"
-          translate-attr-aria-label="CHAT.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/noop/dialog.html/dialog.html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/noop/dialog.html/dialog.html
new file mode 100644
index 0000000..d48399b
--- /dev/null
+++ b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/noop/dialog.html/dialog.html
@@ -0,0 +1,105 @@
+<md-dialog class="chatWebsite-dialog" aria-label="New ChatWebsite">
+  <form name="chatWebsiteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="CHAT.VALUE">Value</label>
+        <input
+          type="text"
+          name="value"
+          ng-model="vm.noop.value"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="chatWebsiteFormApp['value'].$error"
+          ng-show="chatWebsiteFormApp['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.VALUE_REQUIRED"
+              >Value field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveChatWebsiteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="chatWebsiteFormApp.$invalid || chatWebsiteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="CHAT.SAVE"
+          translate-attr-aria-label="CHAT.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/queue/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/queue/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 63667ec..0000000
--- a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/queue/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,148 +0,0 @@
-<md-dialog class="chatWebsite-dialog" aria-label="New ChatWebsite">
-  <form name="chatWebsiteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="CHAT.QUEUE">Queue</label>
-        <md-select
-          name="queue"
-          ng-model="vm.queue.queue"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="queue.name"
-            ng-repeat="queue in vm.queues"
-            ng-disabled="queue.canSelect === false"
-            >{{ queue.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="chatWebsiteFormApp['queue'].$error"
-          ng-show="chatWebsiteFormApp['queue'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.QUEUE_REQUIRED"
-              >Queue field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CHAT.TIMEOUT">Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.queue.timeout"
-          min="0"
-          max="2147483"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="chatWebsiteFormApp['timeout'].$error"
-          ng-show="chatWebsiteFormApp['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.TIMEOUT_REQUIRED"
-              >Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="CHAT.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-          <div ng-message="max">
-            <span translate="CHAT.ERRORS.TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>2147483</span>
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveChatWebsiteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="chatWebsiteFormApp.$invalid || chatWebsiteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="CHAT.SAVE"
-          translate-attr-aria-label="CHAT.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/queue/dialog.html/dialog.html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/queue/dialog.html/dialog.html
new file mode 100644
index 0000000..63667ec
--- /dev/null
+++ b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/queue/dialog.html/dialog.html
@@ -0,0 +1,148 @@
+<md-dialog class="chatWebsite-dialog" aria-label="New ChatWebsite">
+  <form name="chatWebsiteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="CHAT.QUEUE">Queue</label>
+        <md-select
+          name="queue"
+          ng-model="vm.queue.queue"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="queue.name"
+            ng-repeat="queue in vm.queues"
+            ng-disabled="queue.canSelect === false"
+            >{{ queue.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="chatWebsiteFormApp['queue'].$error"
+          ng-show="chatWebsiteFormApp['queue'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.QUEUE_REQUIRED"
+              >Queue field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CHAT.TIMEOUT">Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.queue.timeout"
+          min="0"
+          max="2147483"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="chatWebsiteFormApp['timeout'].$error"
+          ng-show="chatWebsiteFormApp['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.TIMEOUT_REQUIRED"
+              >Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="CHAT.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+          <div ng-message="max">
+            <span translate="CHAT.ERRORS.TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>2147483</span>
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveChatWebsiteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="chatWebsiteFormApp.$invalid || chatWebsiteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="CHAT.SAVE"
+          translate-attr-aria-label="CHAT.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/system/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/system/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index a17a377..0000000
--- a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/system/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,133 +0,0 @@
-<md-dialog class="chatWebsite-dialog" aria-label="New ChatWebsite">
-  <form name="chatWebsiteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="CHAT.COMMAND">Command</label>
-        <input
-          type="text"
-          name="command"
-          ng-model="vm.system.command"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="chatWebsiteFormApp['command'].$error"
-          ng-show="chatWebsiteFormApp['command'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.COMMAND_REQUIRED"
-              >Command field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CHAT.VARIABLE">Variable</label>
-        <md-select
-          name="variable"
-          ng-model="vm.system.variable"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="''">None</md-option>
-          <md-option
-            ng-value="variable.name"
-            ng-repeat="variable in vm.variables"
-            ng-disabled="variable.canSelect === false"
-            >{{ variable.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="chatWebsiteFormApp['variable'].$error"
-          ng-show="chatWebsiteFormApp['variable'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.VARIABLE_REQUIRED"
-              >Variable field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveChatWebsiteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="chatWebsiteFormApp.$invalid || chatWebsiteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="CHAT.SAVE"
-          translate-attr-aria-label="CHAT.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/system/dialog.html/dialog.html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/system/dialog.html/dialog.html
new file mode 100644
index 0000000..a17a377
--- /dev/null
+++ b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/system/dialog.html/dialog.html
@@ -0,0 +1,133 @@
+<md-dialog class="chatWebsite-dialog" aria-label="New ChatWebsite">
+  <form name="chatWebsiteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="CHAT.COMMAND">Command</label>
+        <input
+          type="text"
+          name="command"
+          ng-model="vm.system.command"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="chatWebsiteFormApp['command'].$error"
+          ng-show="chatWebsiteFormApp['command'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.COMMAND_REQUIRED"
+              >Command field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CHAT.VARIABLE">Variable</label>
+        <md-select
+          name="variable"
+          ng-model="vm.system.variable"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="''">None</md-option>
+          <md-option
+            ng-value="variable.name"
+            ng-repeat="variable in vm.variables"
+            ng-disabled="variable.canSelect === false"
+            >{{ variable.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="chatWebsiteFormApp['variable'].$error"
+          ng-show="chatWebsiteFormApp['variable'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.VARIABLE_REQUIRED"
+              >Variable field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveChatWebsiteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="chatWebsiteFormApp.$invalid || chatWebsiteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="CHAT.SAVE"
+          translate-attr-aria-label="CHAT.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/tag/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/tag/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 6ea9eab..0000000
--- a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/tag/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,111 +0,0 @@
-<md-dialog class="chatWebsite-dialog" aria-label="New ChatWebsite">
-  <form name="chatWebsiteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="CHAT.TAG">Tag</label>
-        <md-select
-          name="tag"
-          ng-model="vm.tag.tag"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="tag.name"
-            ng-repeat="tag in vm.tags"
-            ng-disabled="tag.canSelect === false"
-            >{{ tag.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="chatWebsiteFormApp['tag'].$error"
-          ng-show="chatWebsiteFormApp['tag'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.TAG_REQUIRED"
-              >Tag field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveChatWebsiteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="chatWebsiteFormApp.$invalid || chatWebsiteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="CHAT.SAVE"
-          translate-attr-aria-label="CHAT.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/tag/dialog.html/dialog.html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/tag/dialog.html/dialog.html
new file mode 100644
index 0000000..6ea9eab
--- /dev/null
+++ b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/apps/tag/dialog.html/dialog.html
@@ -0,0 +1,111 @@
+<md-dialog class="chatWebsite-dialog" aria-label="New ChatWebsite">
+  <form name="chatWebsiteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="CHAT.TAG">Tag</label>
+        <md-select
+          name="tag"
+          ng-model="vm.tag.tag"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="tag.name"
+            ng-repeat="tag in vm.tags"
+            ng-disabled="tag.canSelect === false"
+            >{{ tag.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="chatWebsiteFormApp['tag'].$error"
+          ng-show="chatWebsiteFormApp['tag'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.TAG_REQUIRED"
+              >Tag field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveChatWebsiteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="chatWebsiteFormApp.$invalid || chatWebsiteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="CHAT.SAVE"
+          translate-attr-aria-label="CHAT.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/chatCannedAnswers/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/chatCannedAnswers/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index b26025d..0000000
--- a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/chatCannedAnswers/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,173 +0,0 @@
-<md-dialog class="chatCannedAnswer-dialog" aria-label="New ChatCannedAnswer">
-  <form name="chatCannedAnswerForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="CHAT.KEY">Key</label>
-        <input
-          type=""
-          name="key"
-          ng-model="vm.chatCannedAnswer.key"
-          md-maxlength="255"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="chatCannedAnswerForm['key'].$error"
-          ng-show="chatCannedAnswerForm['key'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.KEY_REQUIRED"
-              >Key field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CHAT.VALUE">Value</label>
-        <textarea
-          name="value"
-          ng-model="vm.chatCannedAnswer.value"
-          required
-        ></textarea>
-
-        <div
-          ng-messages="chatCannedAnswerForm['value'].$error"
-          ng-show="chatCannedAnswerForm['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.VALUE_REQUIRED"
-              >Value field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CHAT.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.chatCannedAnswer.description"
-        />
-
-        <div
-          ng-messages="chatCannedAnswerForm['description'].$error"
-          ng-show="chatCannedAnswerForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newChatCannedAnswer"
-          ng-click="vm.saveChatCannedAnswer()"
-          class="send-button md-accent md-raised"
-          ng-disabled="chatCannedAnswerForm.$invalid || chatCannedAnswerForm.$pristine"
-          aria-label="SAVE"
-          translate="CHAT.SAVE"
-          translate-attr-aria-label="CHAT.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newChatCannedAnswer"
-          ng-click="vm.addNewChatCannedAnswer()"
-          class="send-button md-accent md-raised"
-          ng-disabled="chatCannedAnswerForm.$invalid"
-          aria-label="ADD"
-          translate="CHAT.ADD_CHATCANNEDANSWER"
-          translate-attr-aria-label="CHAT.ADD_CHATCANNEDANSWER"
-        >
-          ADD CHATCANNEDANSWER
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newChatCannedAnswer"
-          ng-click="vm.deleteChatCannedAnswer($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="CHAT.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="CHAT.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/chatCannedAnswers/dialog.html/dialog.html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/chatCannedAnswers/dialog.html/dialog.html
new file mode 100644
index 0000000..b26025d
--- /dev/null
+++ b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/chatCannedAnswers/dialog.html/dialog.html
@@ -0,0 +1,173 @@
+<md-dialog class="chatCannedAnswer-dialog" aria-label="New ChatCannedAnswer">
+  <form name="chatCannedAnswerForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="CHAT.KEY">Key</label>
+        <input
+          type=""
+          name="key"
+          ng-model="vm.chatCannedAnswer.key"
+          md-maxlength="255"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="chatCannedAnswerForm['key'].$error"
+          ng-show="chatCannedAnswerForm['key'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.KEY_REQUIRED"
+              >Key field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CHAT.VALUE">Value</label>
+        <textarea
+          name="value"
+          ng-model="vm.chatCannedAnswer.value"
+          required
+        ></textarea>
+
+        <div
+          ng-messages="chatCannedAnswerForm['value'].$error"
+          ng-show="chatCannedAnswerForm['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.VALUE_REQUIRED"
+              >Value field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CHAT.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.chatCannedAnswer.description"
+        />
+
+        <div
+          ng-messages="chatCannedAnswerForm['description'].$error"
+          ng-show="chatCannedAnswerForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newChatCannedAnswer"
+          ng-click="vm.saveChatCannedAnswer()"
+          class="send-button md-accent md-raised"
+          ng-disabled="chatCannedAnswerForm.$invalid || chatCannedAnswerForm.$pristine"
+          aria-label="SAVE"
+          translate="CHAT.SAVE"
+          translate-attr-aria-label="CHAT.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newChatCannedAnswer"
+          ng-click="vm.addNewChatCannedAnswer()"
+          class="send-button md-accent md-raised"
+          ng-disabled="chatCannedAnswerForm.$invalid"
+          aria-label="ADD"
+          translate="CHAT.ADD_CHATCANNEDANSWER"
+          translate-attr-aria-label="CHAT.ADD_CHATCANNEDANSWER"
+        >
+          ADD CHATCANNEDANSWER
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newChatCannedAnswer"
+          ng-click="vm.deleteChatCannedAnswer($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="CHAT.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="CHAT.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/offlineMessages/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/offlineMessages/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index af4a488..0000000
--- a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/offlineMessages/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,18 +0,0 @@
-<md-dialog class="offlineMessage-dialog" aria-label="New OfflineMessage">
-  <md-toolbar class="md-accent md-hue-2">
-    <div
-      class="md-toolbar-tools"
-      layout="row"
-      layout-align="space-between center"
-    >
-      <span class="title">{{ vm.title | translate }}</span>
-      <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-        <md-icon md-font-icon="icon-close" aria-label="Close dialog"></md-icon>
-      </md-button>
-    </div>
-  </md-toolbar>
-
-  <md-content flex layout-padding>
-    <pre>{{vm.message.body}}</pre>
-  </md-content>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/offlineMessages/dialog.html/dialog.html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/offlineMessages/dialog.html/dialog.html
new file mode 100644
index 0000000..af4a488
--- /dev/null
+++ b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/offlineMessages/dialog.html/dialog.html
@@ -0,0 +1,18 @@
+<md-dialog class="offlineMessage-dialog" aria-label="New OfflineMessage">
+  <md-toolbar class="md-accent md-hue-2">
+    <div
+      class="md-toolbar-tools"
+      layout="row"
+      layout-align="space-between center"
+    >
+      <span class="title">{{ vm.title | translate }}</span>
+      <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+        <md-icon md-font-icon="icon-close" aria-label="Close dialog"></md-icon>
+      </md-button>
+    </div>
+  </md-toolbar>
+
+  <md-content flex layout-padding>
+    <pre>{{vm.message.body}}</pre>
+  </md-content>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/proactive/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/proactive/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 53abb73..0000000
--- a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/proactive/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,214 +0,0 @@
-<md-dialog
-  class="chatProactiveAction-dialog"
-  aria-label="New ChatProactiveAction"
->
-  <form name="chatProactiveActionForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="CHAT.NAME">Name</label>
-        <input
-          type=""
-          name="name"
-          ng-model="vm.chatProactiveAction.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="chatProactiveActionForm['name'].$error"
-          ng-show="chatProactiveActionForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CHAT.TYPE">Type</label>
-        <md-select name="type" ng-model="vm.chatProactiveAction.type">
-          <md-option ng-value="'mouseOver'">
-            {{ 'CHAT.MOUSEOVER' | translate }}
-          </md-option>
-
-          <md-option ng-value="'timeout'">
-            {{ 'CHAT.TIMEOUT' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="chatProactiveActionForm['type'].$error"
-          ng-show="chatProactiveActionForm['type'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.TYPE_REQUIRED"
-              >Type field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.chatProactiveAction.type === 'mouseOver'"
-        class="md-block"
-      >
-        <label translate="CHAT.SELECTOR">Selector</label>
-        <input
-          type=""
-          name="selector"
-          ng-model="vm.chatProactiveAction.selector"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="chatProactiveActionForm['selector'].$error"
-          ng-show="chatProactiveActionForm['selector'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.SELECTOR_REQUIRED"
-              >Selector field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.chatProactiveAction.type === 'timeout'"
-        class="md-block"
-      >
-        <label translate="CHAT.TIMEOUT">Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.chatProactiveAction.timeout"
-          min="1"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="chatProactiveActionForm['timeout'].$error"
-          ng-show="chatProactiveActionForm['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CHAT.ERRORS.TIMEOUT_REQUIRED"
-              >Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="CHAT.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>1</span>
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newChatProactiveAction"
-          ng-click="vm.saveChatProactiveAction()"
-          class="send-button md-accent md-raised"
-          ng-disabled="chatProactiveActionForm.$invalid || chatProactiveActionForm.$pristine"
-          aria-label="SAVE"
-          translate="CHAT.SAVE"
-          translate-attr-aria-label="CHAT.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newChatProactiveAction"
-          ng-click="vm.addNewChatProactiveAction()"
-          class="send-button md-accent md-raised"
-          ng-disabled="chatProactiveActionForm.$invalid"
-          aria-label="ADD"
-          translate="CHAT.ADD_CHATPROACTIVEACTION"
-          translate-attr-aria-label="CHAT.ADD_CHATPROACTIVEACTION"
-        >
-          ADD CHATPROACTIVEACTION
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newChatProactiveAction"
-          ng-click="vm.deleteChatProactiveAction($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="CHAT.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="CHAT.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/proactive/dialog.html/dialog.html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/proactive/dialog.html/dialog.html
new file mode 100644
index 0000000..53abb73
--- /dev/null
+++ b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/proactive/dialog.html/dialog.html
@@ -0,0 +1,214 @@
+<md-dialog
+  class="chatProactiveAction-dialog"
+  aria-label="New ChatProactiveAction"
+>
+  <form name="chatProactiveActionForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="CHAT.NAME">Name</label>
+        <input
+          type=""
+          name="name"
+          ng-model="vm.chatProactiveAction.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="chatProactiveActionForm['name'].$error"
+          ng-show="chatProactiveActionForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CHAT.TYPE">Type</label>
+        <md-select name="type" ng-model="vm.chatProactiveAction.type">
+          <md-option ng-value="'mouseOver'">
+            {{ 'CHAT.MOUSEOVER' | translate }}
+          </md-option>
+
+          <md-option ng-value="'timeout'">
+            {{ 'CHAT.TIMEOUT' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="chatProactiveActionForm['type'].$error"
+          ng-show="chatProactiveActionForm['type'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.TYPE_REQUIRED"
+              >Type field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.chatProactiveAction.type === 'mouseOver'"
+        class="md-block"
+      >
+        <label translate="CHAT.SELECTOR">Selector</label>
+        <input
+          type=""
+          name="selector"
+          ng-model="vm.chatProactiveAction.selector"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="chatProactiveActionForm['selector'].$error"
+          ng-show="chatProactiveActionForm['selector'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.SELECTOR_REQUIRED"
+              >Selector field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.chatProactiveAction.type === 'timeout'"
+        class="md-block"
+      >
+        <label translate="CHAT.TIMEOUT">Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.chatProactiveAction.timeout"
+          min="1"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="chatProactiveActionForm['timeout'].$error"
+          ng-show="chatProactiveActionForm['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CHAT.ERRORS.TIMEOUT_REQUIRED"
+              >Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="CHAT.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>1</span>
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newChatProactiveAction"
+          ng-click="vm.saveChatProactiveAction()"
+          class="send-button md-accent md-raised"
+          ng-disabled="chatProactiveActionForm.$invalid || chatProactiveActionForm.$pristine"
+          aria-label="SAVE"
+          translate="CHAT.SAVE"
+          translate-attr-aria-label="CHAT.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newChatProactiveAction"
+          ng-click="vm.addNewChatProactiveAction()"
+          class="send-button md-accent md-raised"
+          ng-disabled="chatProactiveActionForm.$invalid"
+          aria-label="ADD"
+          translate="CHAT.ADD_CHATPROACTIVEACTION"
+          translate-attr-aria-label="CHAT.ADD_CHATPROACTIVEACTION"
+        >
+          ADD CHATPROACTIVEACTION
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newChatProactiveAction"
+          ng-click="vm.deleteChatProactiveAction($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="CHAT.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="CHAT.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index ecbe469..0000000
--- a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,4540 +0,0 @@
-<div id="chat-chatWebsite" class="page-layout simple tabbed" layout="column">
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-chatWebsites-button md-icon-button"
-        aria-label="Go to chatWebsites"
-        ng-click="vm.gotoChatWebsites()"
-        translate
-        translate-attr-aria-label="CHAT.GO_TO_CHATWEBSITES"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="chatWebsite-image" hide-xs>
-          <img ng-src="assets/images/business/chatWebsites.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.chatWebsite.id}}
-            <span ng-if="vm.chatWebsite.name">{{vm.chatWebsite.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="CHAT.CREATED_AT"></span>
-            <span>{{vm.chatWebsite.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.agentadddialog(vm.chatWebsite, $event)"
-        class="md-fab md-warn md-icon-button"
-        aria-label="agentadd"
-      >
-        <md-tooltip
-          ><span translate="CHAT.AGENTADD_CHATWEBSITE"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
-      </md-button>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveChatWebsite()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        translate="CHAT.SAVE"
-        translate-attr-aria-label="CHAT.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="CHAT.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="chatWebsite-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="CHAT.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="CHAT.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.chatWebsite.name"
-                  ng-required="true"
-                  autofocus
-                  disabled
-                />
-
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CHAT.KEY">key</label>
-                <input
-                  type="text"
-                  name="key"
-                  ng-model="vm.chatWebsite.key"
-                  md-maxlength="5"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['key'].$error"
-                  ng-show="generalForm['key'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.KEY_REQUIRED"
-                      >key field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="CHAT.ERRORS.KEY_MAX_LENGTH"
-                      translate-values="{max: 5}"
-                      >key must have a maximum length equal to 5</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CHAT.MOTIONADDRESS">MotionAddress</label>
-                <input
-                  type="url"
-                  name="address"
-                  ng-model="vm.chatWebsite.address"
-                  md-maxlength="255"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['address'].$error"
-                  ng-show="generalForm['address'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.MOTIONADDRESS_REQUIRED"
-                      >MotionAddress field is required</span
-                    >
-                  </div>
-                  <div ng-message="url">
-                    <span translate="CHAT.ERRORS.MOTIONADDRESS_MUST_VALID_URL"
-                      >MotionAddress must be a valid url
-                      http://www.xcally.com</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="CHAT.ERRORS.MOTIONADDRESS_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >MotionAddress must have a maximum length equal to
-                      255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CHAT.LIST">List</label>
-                <md-select
-                  name="ListId"
-                  ng-model="vm.chatWebsite.ListId"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="ListId.id"
-                    ng-repeat="ListId in vm.lists"
-                    ng-disabled="ListId.canSelect === false"
-                    >{{ ListId.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint"><span translate="CHAT.HELP.LIST"></span></div>
-                <div
-                  ng-messages="generalForm['ListId'].$error"
-                  ng-show="generalForm['ListId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.LIST_REQUIRED"
-                      >List field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.chatWebsite.fidelity"
-                class="md-block"
-              >
-                <label translate="CHAT.TIMEOUT">Timeout</label>
-                <input
-                  type="number"
-                  name="timeout"
-                  ng-model="vm.chatWebsite.timeout"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['timeout'].$error"
-                  ng-show="generalForm['timeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.TIMEOUT_REQUIRED"
-                      >Timeout field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CHAT.WAITFORTHEASSIGNEDAGENT"
-                  >WaitForTheAssignedAgent</label
-                >
-                <input
-                  type="number"
-                  name="waitForTheAssignedAgent"
-                  ng-model="vm.chatWebsite.waitForTheAssignedAgent"
-                  min="1"
-                  max="2147483"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['waitForTheAssignedAgent'].$error"
-                  ng-show="generalForm['waitForTheAssignedAgent'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="CHAT.ERRORS.WAITFORTHEASSIGNEDAGENT_REQUIRED"
-                      >WaitForTheAssignedAgent field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="CHAT.ERRORS.WAITFORTHEASSIGNEDAGENT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >WaitForTheAssignedAgent must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="CHAT.ERRORS.WAITFORTHEASSIGNEDAGENT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >WaitForTheAssignedAgent must be a valid greater or equal
-                      than</span
-                    >
-                    <span>2147483</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CHAT.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.chatWebsite.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="chatWebsite-detail-form-container notification md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="CHAT.NOTIFICATION">
-                NOTIFICATION
-              </div>
-            </div>
-            <form name="notificationForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.chatWebsite.notificationSound"
-                  aria-label="notificationSound"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="CHAT.NOTIFICATIONSOUND"
-                    >notificationSound</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.chatWebsite.notificationShake"
-                  aria-label="notificationShake"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="CHAT.NOTIFICATIONSHAKE"
-                    >notificationShake</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <div class="md-block">
-                <label
-                  class="md-caption grey-fg"
-                  translate="CHAT.NOTIFICATIONTEMPLATE"
-                  >notificationTemplate</label
-                >
-                <textarea
-                  aria-label="notificationTemplate notificationTemplate"
-                  ckeditor="{ skin: 'office2013', language: 'en', allowedContent: true, extraPlugins: 'font,colorbutton,autoembed,autocorrect,googlethisterm,pastebase64', toolbarGroups: [{ name: 'styles', groups: ['styles'] }, { name: 'clipboard', groups: ['undo'] }, { name: 'colors', groups: ['colors'] }, { name: 'basicstyles', groups: ['basicstyles'] }, { name: 'paragraph', groups: ['list', 'indent', 'align'] }, { name: 'mode' }], autocorrect_enabled: true, disableNativeSpellChecker: false, fontSize_sizes: '8/8pt;9/9pt;10/10pt;11/11pt;12/12pt;14/14pt;16/16pt;18/18pt;20/20pt;22/22pt;24/24pt;26/26pt;28/28pt;36/36pt;48/48pt;72/72pt',  removePlugins: 'magicline' }"
-                  ng-model="vm.chatWebsite.notificationTemplate"
-                ></textarea>
-              </div>
-            </form>
-          </div>
-          <div
-            class="chatWebsite-detail-form-container transfer md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="CHAT.TRANSFER">
-                TRANSFER
-              </div>
-            </div>
-            <form name="transferForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.chatWebsite.queueTransfer"
-                  aria-label="queueTransfer"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="CHAT.QUEUETRANSFER"
-                    >queueTransfer</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.chatWebsite.queueTransfer == true"
-                class="md-block"
-              >
-                <label translate="CHAT.QUEUETRANSFERTIMEOUT"
-                  >queueTransferTimeout</label
-                >
-                <input
-                  type="number"
-                  name="queueTransferTimeout"
-                  ng-model="vm.chatWebsite.queueTransferTimeout"
-                  min="1"
-                  max="2147483"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="transferForm['queueTransferTimeout'].$error"
-                  ng-show="transferForm['queueTransferTimeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.QUEUETRANSFERTIMEOUT_REQUIRED"
-                      >queueTransferTimeout field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="CHAT.ERRORS.QUEUETRANSFERTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >queueTransferTimeout must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="CHAT.ERRORS.QUEUETRANSFERTIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >queueTransferTimeout must be a valid greater or equal
-                      than</span
-                    >
-                    <span>2147483</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.chatWebsite.agentTransfer"
-                  aria-label="agentTransfer"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="CHAT.AGENTTRANSFER"
-                    >agentTransfer</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.chatWebsite.agentTransfer == true"
-                class="md-block"
-              >
-                <label translate="CHAT.AGENTTRANSFERTIMEOUT"
-                  >agentTransferTimeout</label
-                >
-                <input
-                  type="number"
-                  name="agentTransferTimeout"
-                  ng-model="vm.chatWebsite.agentTransferTimeout"
-                  min="1"
-                  max="2147483"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="transferForm['agentTransferTimeout'].$error"
-                  ng-show="transferForm['agentTransferTimeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.AGENTTRANSFERTIMEOUT_REQUIRED"
-                      >agentTransferTimeout field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="CHAT.ERRORS.AGENTTRANSFERTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >agentTransferTimeout must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="CHAT.ERRORS.AGENTTRANSFERTIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >agentTransferTimeout must be a valid greater or equal
-                      than</span
-                    >
-                    <span>2147483</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="CHAT.ADVANCED">ADVANCED</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="chatWebsite-detail-form-container script md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="ChatWebsiteScriptController as vm_ac"
-              ng-init="vm_ac.init(vm.chatWebsite)"
-              class="content"
-              md-background-bg
-            >
-              <div class="pb-16" layout="row" layout-align="start center">
-                <div class="h2 secondary-text" translate="CHAT.SCRIPT">
-                  SCRIPT
-                </div>
-              </div>
-
-              <form name="scriptForm" flex="100" novalidate>
-                <md-input-container class="md-block">
-                  <label translate="CHAT.TOKEN">Token</label>
-                  <input
-                    type="text"
-                    name="token"
-                    ng-model="vm_ac.chatWebsite.token"
-                    autofocus
-                    ng-disabled="true"
-                  />
-                </md-input-container>
-                <md-input-container class="md-block">
-                  <label translate="CHAT.MOTIONPROXY">MotionProxy</label>
-                  <input
-                    type="url"
-                    name="remote"
-                    ng-model="vm_ac.chatWebsite.remote"
-                    required
-                  />
-                  <div class="hint">
-                    <span translate="CHAT.HELP.MOTIONPROXY"></span>
-                  </div>
-                  <div
-                    ng-messages="scriptForm['remote'].$error"
-                    ng-show="scriptForm['remote'].$touched"
-                    role="alert"
-                  >
-                    <div ng-message="required">
-                      <span translate="CHAT.ERRORS.MOTIONPROXY_REQUIRED"
-                        >Motion Proxy field is required</span
-                      >
-                    </div>
-                    <div ng-message="url">
-                      <span translate="CHAT.ERRORS.MOTIONPROXY_MUST_VALID_URL"
-                        >Motion Proxy must be a valid url e.g.:
-                        http://www.xcally.com</span
-                      >
-                    </div>
-                  </div>
-                </md-input-container>
-                <md-input-container class="md-block">
-                  <label translate="CHAT.WEBSITESCRIPT">WebsiteScript</label>
-                  <div>
-                    <pre style="font-size: 13px">
-            {{vm_ac.start}} {{vm_ac.script}} {{vm_ac.end}}
-          </pre
-                    >
-                  </div>
-                  <div class="hint">
-                    <span translate="CHAT.HELP.COPYSCRIPTTOCLIPBOARD"></span>
-                  </div>
-                </md-input-container>
-              </form>
-            </div>
-          </div>
-          <div
-            class="chatWebsite-detail-form-container interval md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="CHAT.INTERVAL">
-                INTERVAL
-              </div>
-            </div>
-            <form name="intervalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="CHAT.INTERVAL">Interval</label>
-                <md-select
-                  name="IntervalId"
-                  ng-model="vm.chatWebsite.IntervalId"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="null">Always</md-option>
-                  <md-option
-                    ng-value="IntervalId.id"
-                    ng-repeat="IntervalId in vm.interval"
-                    ng-disabled="IntervalId.canSelect === false"
-                    >{{ IntervalId.name }}</md-option
-                  >
-                </md-select>
-                <div
-                  ng-messages="intervalForm['IntervalId'].$error"
-                  ng-show="intervalForm['IntervalId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.INTERVAL_REQUIRED"
-                      >Interval field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CHAT.TIMEZONE">Timezone</label>
-                <ms-timezone
-                  name="timezone"
-                  ng-model="vm.chatWebsite.timezone"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                ></ms-timezone>
-                <div class="hint">
-                  <span translate="CHAT.HELP.TIMEZONE"></span>
-                </div>
-                <div
-                  ng-messages="intervalForm['timezone'].$error"
-                  ng-show="intervalForm[timezone].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.TIMEZONE_REQUIRED"
-                      >Timezone field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="chatWebsite-detail-form-container disposition md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="CHAT.DISPOSITION">
-                DISPOSITION
-              </div>
-            </div>
-            <form name="dispositionForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.chatWebsite.mandatoryDisposition"
-                  aria-label="MandatoryDisposition"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="CHAT.MANDATORYDISPOSITION"
-                    >MandatoryDisposition</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.chatWebsite.mandatoryDisposition"
-                class="md-block"
-              >
-                <label translate="CHAT.MANDATORYDISPOSITIONPAUSEID"
-                  >MandatoryDispositionPauseId</label
-                >
-                <md-select
-                  name="mandatoryDispositionPauseId"
-                  ng-model="vm.chatWebsite.mandatoryDispositionPauseId"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="mandatoryDispositionPauseId.id"
-                    ng-repeat="mandatoryDispositionPauseId in vm.pauses"
-                    ng-disabled="mandatoryDispositionPauseId.canSelect === false"
-                    >{{ mandatoryDispositionPauseId.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span
-                    translate="CHAT.HELP.MANDATORYDISPOSITIONPAUSEID"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="dispositionForm['mandatoryDispositionPauseId'].$error"
-                  ng-show="dispositionForm['mandatoryDispositionPauseId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="CHAT.ERRORS.MANDATORYDISPOSITIONPAUSEID_REQUIRED"
-                      >MandatoryDispositionPauseId field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="CHAT.SNIPPET">SNIPPET</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="chatWebsite-detail-form-container appearance md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="CHAT.APPEARANCE">
-                APPEARANCE
-              </div>
-            </div>
-            <form name="appearanceForm" novalidate>
-              <div
-                flex
-                md-color-picker
-                ng-model="vm.chatWebsite.color"
-                label="{{'CHAT.MAINCOLOR' | translate}}"
-                md-color-hex="true"
-                md-color-rgb="false"
-                md-color-hsl="false"
-                md-color-history="false"
-                md-color-material-palette="false"
-                md-color-alpha-channel="false"
-                open-on-input="true"
-              ></div>
-              <div
-                flex
-                md-color-picker
-                ng-model="vm.chatWebsite.color_button"
-                label="{{'CHAT.BUTTONCOLOR' | translate}}"
-                md-color-hex="true"
-                md-color-rgb="false"
-                md-color-hsl="false"
-                md-color-history="false"
-                md-color-material-palette="false"
-                md-color-alpha-channel="false"
-                open-on-input="true"
-              ></div>
-              <div
-                flex
-                md-color-picker
-                ng-model="vm.chatWebsite.textColor"
-                label="{{'CHAT.TEXTCOLOR' | translate}}"
-                md-color-hex="true"
-                md-color-rgb="false"
-                md-color-hsl="false"
-                md-color-history="false"
-                md-color-material-palette="false"
-                md-color-alpha-channel="false"
-                open-on-input="true"
-              ></div>
-              <div
-                flex
-                md-color-picker
-                ng-model="vm.chatWebsite.backgroundColor"
-                label="{{'CHAT.BACKGROUNDCOLOR' | translate}}"
-                md-color-hex="true"
-                md-color-rgb="false"
-                md-color-hsl="false"
-                md-color-history="false"
-                md-color-material-palette="false"
-                md-color-alpha-channel="false"
-                open-on-input="true"
-              ></div>
-              <md-input-container class="md-block">
-                <label translate="CHAT.FONTSIZE">fontSize</label>
-                <input
-                  type="number"
-                  name="fontSize"
-                  ng-model="vm.chatWebsite.fontSize"
-                  min="0"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="appearanceForm['fontSize'].$error"
-                  ng-show="appearanceForm['fontSize'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.FONTSIZE_REQUIRED"
-                      >fontSize field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="CHAT.ERRORS.FONTSIZE_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >fontSize must be a valid greater or equal than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CHAT.HEADERSHAPE">headershape</label>
-                <md-select
-                  name="header_shape"
-                  ng-model="vm.chatWebsite.header_shape"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'rounded'">
-                    {{ 'CHAT.ROUNDED' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'squared'">
-                    {{ 'CHAT.SQUARED' | translate }}
-                  </md-option>
-                </md-select>
-                <div
-                  ng-messages="appearanceForm['header_shape'].$error"
-                  ng-show="appearanceForm['header_shape'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.HEADERSHAPE_REQUIRED"
-                      >headershape field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.chatWebsite.showAgentAvatar"
-                  aria-label="ShowAgentAvatar"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="CHAT.SHOWAGENTAVATAR"
-                    >ShowAgentAvatar</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.chatWebsite.showCustomerAvatar"
-                  aria-label="showCustomerAvatar"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="CHAT.SHOWCUSTOMERAVATAR"
-                    >showCustomerAvatar</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CHAT.SNIPPETSWIPEOUT">snippetSwipeOut</label>
-                <md-select
-                  name="alignment"
-                  ng-model="vm.chatWebsite.alignment"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'bottom_right'">
-                    {{ 'CHAT.BOTTOM_RIGHT' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'right'">
-                    {{ 'CHAT.RIGHT' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'left'">
-                    {{ 'CHAT.LEFT' | translate }}
-                  </md-option>
-                </md-select>
-                <div
-                  ng-messages="appearanceForm['alignment'].$error"
-                  ng-show="appearanceForm['alignment'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.SNIPPETSWIPEOUT_REQUIRED"
-                      >snippetSwipeOut field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.chatWebsite.alignment !== 'bottom_right'"
-                class="md-block"
-              >
-                <label translate="CHAT.VERTICALPOSITION"
-                  >verticalPosition</label
-                >
-                <input
-                  type="number"
-                  name="verticalAlignment"
-                  ng-model="vm.chatWebsite.verticalAlignment"
-                  min="0"
-                  max="100"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="CHAT.HELP.VERTICALPOSITION"></span>
-                </div>
-                <div
-                  ng-messages="appearanceForm['verticalAlignment'].$error"
-                  ng-show="appearanceForm['verticalAlignment'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.VERTICALPOSITION_REQUIRED"
-                      >verticalPosition field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="CHAT.ERRORS.VERTICALPOSITION_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >verticalPosition must be a valid greater or equal
-                      than</span
-                    >
-                    <span>0</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="CHAT.ERRORS.VERTICALPOSITION_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >verticalPosition must be a valid greater or equal
-                      than</span
-                    >
-                    <span>100</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CHAT.MESSAGESALIGNMENT"
-                  >messagesAlignment</label
-                >
-                <md-select
-                  name="messagesAlignment"
-                  ng-model="vm.chatWebsite.messagesAlignment"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'alternate'">
-                    {{ 'CHAT.ALTERNATE' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'centered'">
-                    {{ 'CHAT.CENTERED' | translate }}
-                  </md-option>
-                </md-select>
-                <div
-                  ng-messages="appearanceForm['messagesAlignment'].$error"
-                  ng-show="appearanceForm['messagesAlignment'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.MESSAGESALIGNMENT_REQUIRED"
-                      >messagesAlignment field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CHAT.DEFAULTTITLE">defaultTitle</label>
-                <input
-                  type="text"
-                  name="defaultTitle"
-                  ng-model="vm.chatWebsite.defaultTitle"
-                  md-maxlength="255"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="appearanceForm['defaultTitle'].$error"
-                  ng-show="appearanceForm['defaultTitle'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.DEFAULTTITLE_REQUIRED"
-                      >defaultTitle field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="CHAT.ERRORS.DEFAULTTITLE_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >defaultTitle must have a maximum length equal to
-                      255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="chatWebsite-detail-form-container onlinestatus md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="CHAT.ONLINESTATUS">
-                ONLINESTATUS
-              </div>
-            </div>
-            <form name="onlinestatusForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="CHAT.HEADER_ONLINE">header_online</label>
-                <input
-                  type="text"
-                  name="header_online"
-                  ng-model="vm.chatWebsite.header_online"
-                  md-maxlength="255"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="onlinestatusForm['header_online'].$error"
-                  ng-show="onlinestatusForm['header_online'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.HEADER_ONLINE_REQUIRED"
-                      >header_online field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="CHAT.ERRORS.HEADER_ONLINE_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >header_online must have a maximum length equal to
-                      255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CHAT.START_CHAT_BUTTON"
-                  >start_chat_button</label
-                >
-                <input
-                  type="text"
-                  name="start_chat_button"
-                  ng-model="vm.chatWebsite.start_chat_button"
-                  md-maxlength="255"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="onlinestatusForm['start_chat_button'].$error"
-                  ng-show="onlinestatusForm['start_chat_button'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.START_CHAT_BUTTON_REQUIRED"
-                      >start_chat_button field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="CHAT.ERRORS.START_CHAT_BUTTON_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >start_chat_button must have a maximum length equal to
-                      255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="chatWebsite-detail-form-container offlinestatus md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="CHAT.OFFLINESTATUS">
-                OFFLINESTATUS
-              </div>
-            </div>
-            <form name="offlinestatusForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.chatWebsite.hideWhenOffline"
-                  aria-label="hideWhenOffline"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="CHAT.HIDEWHENOFFLINE"
-                    >hideWhenOffline</span
-                  ></md-switch
-                >
-
-                <div class="hint">
-                  <span translate="CHAT.HELP.HIDEWHENOFFLINE"></span>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CHAT.HEADER_OFFLINE">header_offline</label>
-                <input
-                  type="text"
-                  name="header_offline"
-                  ng-model="vm.chatWebsite.header_offline"
-                  md-maxlength="255"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="offlinestatusForm['header_offline'].$error"
-                  ng-show="offlinestatusForm['header_offline'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.HEADER_OFFLINE_REQUIRED"
-                      >header_offline field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="CHAT.ERRORS.HEADER_OFFLINE_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >header_offline must have a maximum length equal to
-                      255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CHAT.OFFLINE_CHAT_BUTTON"
-                  >offline_chat_button</label
-                >
-                <input
-                  type="text"
-                  name="offline_chat_button"
-                  ng-model="vm.chatWebsite.offline_chat_button"
-                  md-maxlength="255"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="offlinestatusForm['offline_chat_button'].$error"
-                  ng-show="offlinestatusForm['offline_chat_button'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.OFFLINE_CHAT_BUTTON_REQUIRED"
-                      >offline_chat_button field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="CHAT.ERRORS.OFFLINE_CHAT_BUTTON_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >offline_chat_button must have a maximum length equal to
-                      255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CHAT.OFFLINEMESSAGESUBJECT"
-                  >offlineMessageSubject</label
-                >
-                <input
-                  type="text"
-                  name="offlineMessageSubject"
-                  ng-model="vm.chatWebsite.offlineMessageSubject"
-                  md-maxlength="255"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="offlinestatusForm['offlineMessageSubject'].$error"
-                  ng-show="offlinestatusForm['offlineMessageSubject'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.OFFLINEMESSAGESUBJECT_REQUIRED"
-                      >offlineMessageSubject field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="CHAT.ERRORS.OFFLINEMESSAGESUBJECT_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >offlineMessageSubject must have a maximum length equal to
-                      255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CHAT.OFFLINEMESSAGEBODY"
-                  >offlineMessageBody</label
-                >
-                <input
-                  type="text"
-                  name="offlineMessageBody"
-                  ng-model="vm.chatWebsite.offlineMessageBody"
-                  md-maxlength="255"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="offlinestatusForm['offlineMessageBody'].$error"
-                  ng-show="offlinestatusForm['offlineMessageBody'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.OFFLINEMESSAGEBODY_REQUIRED"
-                      >offlineMessageBody field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="CHAT.ERRORS.OFFLINEMESSAGEBODY_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >offlineMessageBody must have a maximum length equal to
-                      255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="chatWebsite-detail-form-container closingform md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="CHAT.CLOSINGFORM">
-                CLOSINGFORM
-              </div>
-            </div>
-            <form name="closingformForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="CHAT.CLOSINGMESSAGE">closingMessage</label>
-                <textarea
-                  name="closingMessage"
-                  ng-model="vm.chatWebsite.closingMessage"
-                  md-maxlength="255"
-                  required
-                  autofocus
-                ></textarea>
-
-                <div
-                  ng-messages="closingformForm['closingMessage'].$error"
-                  ng-show="closingformForm['closingMessage'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.CLOSINGMESSAGE_REQUIRED"
-                      >closingMessage field is required</span
-                    >
-                  </div>
-
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="CHAT.ERRORS.CLOSINGMESSAGE_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >closingMessage must have a maximum length equal to
-                      255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CHAT.SKIPMESSAGEBUTTON"
-                  >skipMessageButton</label
-                >
-                <input
-                  type="text"
-                  name="skipMessageButton"
-                  ng-model="vm.chatWebsite.skipMessageButton"
-                  md-maxlength="255"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="closingformForm['skipMessageButton'].$error"
-                  ng-show="closingformForm['skipMessageButton'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.SKIPMESSAGEBUTTON_REQUIRED"
-                      >skipMessageButton field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="CHAT.ERRORS.SKIPMESSAGEBUTTON_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >skipMessageButton must have a maximum length equal to
-                      255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.chatWebsite.enableRating"
-                  aria-label="enableRating"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="CHAT.ENABLERATING"
-                    >enableRating</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.chatWebsite.enableRating"
-                class="md-block"
-              >
-                <label translate="CHAT.RATINGTYPE">ratingType</label>
-                <md-select
-                  name="ratingType"
-                  ng-model="vm.chatWebsite.ratingType"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'star'">Star</md-option>
-                  <md-option ng-value="'thumb'">Thumb</md-option>
-                </md-select>
-                <div
-                  ng-messages="closingformForm['ratingType'].$error"
-                  ng-show="closingformForm['ratingType'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.RATINGTYPE_REQUIRED"
-                      >ratingType field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.chatWebsite.enableRating && vm.chatWebsite.ratingType === 'star'"
-                class="md-block"
-              >
-                <label translate="CHAT.RATINGSTARSNUMBER"
-                  >ratingStarsNumber</label
-                >
-                <input
-                  type="number"
-                  name="ratingStarsNumber"
-                  ng-model="vm.chatWebsite.ratingStarsNumber"
-                  min="2"
-                  max="5"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="closingformForm['ratingStarsNumber'].$error"
-                  ng-show="closingformForm['ratingStarsNumber'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.RATINGSTARSNUMBER_REQUIRED"
-                      >ratingStarsNumber field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="CHAT.ERRORS.RATINGSTARSNUMBER_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >ratingStarsNumber must be a valid greater or equal
-                      than</span
-                    >
-                    <span>2</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="CHAT.ERRORS.RATINGSTARSNUMBER_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >ratingStarsNumber must be a valid greater or equal
-                      than</span
-                    >
-                    <span>5</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.chatWebsite.enableFeedback"
-                  aria-label="enableFeedback"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="CHAT.ENABLEFEEDBACK"
-                    >enableFeedback</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.chatWebsite.enableFeedback"
-                class="md-block"
-              >
-                <label translate="CHAT.FEEDBACKTITLE">feedbackTitle</label>
-                <input
-                  type="text"
-                  name="feedbackTitle"
-                  ng-model="vm.chatWebsite.feedbackTitle"
-                  md-maxlength="255"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="closingformForm['feedbackTitle'].$error"
-                  ng-show="closingformForm['feedbackTitle'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.FEEDBACKTITLE_REQUIRED"
-                      >feedbackTitle field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="CHAT.ERRORS.FEEDBACKTITLE_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >feedbackTitle must have a maximum length equal to
-                      255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.chatWebsite.forwardTranscript"
-                  aria-label="forwardTranscript"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="CHAT.FORWARDTRANSCRIPT"
-                    >forwardTranscript</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.chatWebsite.forwardTranscript"
-                class="md-block"
-              >
-                <label translate="CHAT.FORWARDTRANSCRIPTMESSAGE"
-                  >forwardTranscriptMessage</label
-                >
-                <input
-                  type="text"
-                  name="forwardTranscriptMessage"
-                  ng-model="vm.chatWebsite.forwardTranscriptMessage"
-                  md-maxlength="255"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="closingformForm['forwardTranscriptMessage'].$error"
-                  ng-show="closingformForm['forwardTranscriptMessage'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="CHAT.ERRORS.FORWARDTRANSCRIPTMESSAGE_REQUIRED"
-                      >forwardTranscriptMessage field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="CHAT.ERRORS.FORWARDTRANSCRIPTMESSAGE_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >forwardTranscriptMessage must have a maximum length equal
-                      to 255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CHAT.CLOSINGMESSAGEBUTTON"
-                  >closingMessageButton</label
-                >
-                <input
-                  type="text"
-                  name="closingMessageButton"
-                  ng-model="vm.chatWebsite.closingMessageButton"
-                  md-maxlength="255"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="closingformForm['closingMessageButton'].$error"
-                  ng-show="closingformForm['closingMessageButton'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.CLOSINGMESSAGEBUTTON_REQUIRED"
-                      >closingMessageButton field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="CHAT.ERRORS.CLOSINGMESSAGEBUTTON_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >closingMessageButton must have a maximum length equal to
-                      255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="chatWebsite-detail-form-container unmanagedstatus md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="CHAT.UNMANAGEDSTATUS">
-                UNMANAGEDSTATUS
-              </div>
-            </div>
-            <form name="unmanagedstatusForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.chatWebsite.autoclose"
-                  aria-label="autoclose"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="CHAT.AUTOCLOSE">autoclose</span></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.chatWebsite.enableUnmanagedNote"
-                  aria-label="enableUnmanagedNote"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="CHAT.ENABLEUNMANAGEDNOTE"
-                    >enableUnmanagedNote</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CHAT.UNMANAGEDMESSAGE"
-                  >unmanagedMessage</label
-                >
-                <input
-                  type="text"
-                  name="unmanagedMessage"
-                  ng-model="vm.chatWebsite.unmanagedMessage"
-                  md-maxlength="255"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="unmanagedstatusForm['unmanagedMessage'].$error"
-                  ng-show="unmanagedstatusForm['unmanagedMessage'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.UNMANAGEDMESSAGE_REQUIRED"
-                      >unmanagedMessage field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="CHAT.ERRORS.UNMANAGEDMESSAGE_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >unmanagedMessage must have a maximum length equal to
-                      255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CHAT.SKIPUNMANAGED">skipUnmanaged</label>
-                <input
-                  type="text"
-                  name="skipUnmanaged"
-                  ng-model="vm.chatWebsite.skipUnmanaged"
-                  md-maxlength="255"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="unmanagedstatusForm['skipUnmanaged'].$error"
-                  ng-show="unmanagedstatusForm['skipUnmanaged'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.SKIPUNMANAGED_REQUIRED"
-                      >skipUnmanaged field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="CHAT.ERRORS.SKIPUNMANAGED_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >skipUnmanaged must have a maximum length equal to
-                      255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.chatWebsite.enableUnmanagedNote"
-                class="md-block"
-              >
-                <label translate="CHAT.SENDUNMANAGED">sendUnmanaged</label>
-                <input
-                  type="text"
-                  name="sendUnmanaged"
-                  ng-model="vm.chatWebsite.sendUnmanaged"
-                  md-maxlength="255"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="unmanagedstatusForm['sendUnmanaged'].$error"
-                  ng-show="unmanagedstatusForm['sendUnmanaged'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.SENDUNMANAGED_REQUIRED"
-                      >sendUnmanaged field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="CHAT.ERRORS.SENDUNMANAGED_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >sendUnmanaged must have a maximum length equal to
-                      255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.chatWebsite.enableUnmanagedNote"
-                class="md-block"
-              >
-                <label translate="CHAT.NOTETITLE">noteTitle</label>
-                <input
-                  type="text"
-                  name="noteTitle"
-                  ng-model="vm.chatWebsite.noteTitle"
-                  md-maxlength="255"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="unmanagedstatusForm['noteTitle'].$error"
-                  ng-show="unmanagedstatusForm['noteTitle'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.NOTETITLE_REQUIRED"
-                      >noteTitle field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="CHAT.ERRORS.NOTETITLE_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >noteTitle must have a maximum length equal to 255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="chatWebsite-detail-form-container interaction md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="CHAT.INTERACTION">
-                INTERACTION
-              </div>
-            </div>
-            <form name="interactionForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="CHAT.AGENTIDENTIFIER">agentIdentifier</label>
-                <md-select
-                  name="agentIdentifier"
-                  ng-model="vm.chatWebsite.agentIdentifier"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'website_alias'">
-                    {{ 'CHAT.WEBSITEALIAS' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'agent_alias'">
-                    {{ 'CHAT.AGENTALIAS' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'agent_fullname'">
-                    {{ 'CHAT.AGENTFULLNAME' | translate }}
-                  </md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="CHAT.HELP.AGENTIDENTIFIER"></span>
-                </div>
-                <div
-                  ng-messages="interactionForm['agentIdentifier'].$error"
-                  ng-show="interactionForm['agentIdentifier'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.AGENTIDENTIFIER_REQUIRED"
-                      >agentIdentifier field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CHAT.CUSTOMERALIAS">customerAlias</label>
-                <input
-                  type="text"
-                  name="customerAlias"
-                  ng-model="vm.chatWebsite.customerAlias"
-                  md-maxlength="255"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="interactionForm['customerAlias'].$error"
-                  ng-show="interactionForm['customerAlias'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.CUSTOMERALIAS_REQUIRED"
-                      >customerAlias field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="CHAT.ERRORS.CUSTOMERALIAS_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >customerAlias must have a maximum length equal to
-                      255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CHAT.MESSAGEFONTSIZE">messageFontSize</label>
-                <input
-                  type="number"
-                  name="messageFontSize"
-                  ng-model="vm.chatWebsite.messageFontSize"
-                  min="0"
-                  max="20"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="interactionForm['messageFontSize'].$error"
-                  ng-show="interactionForm['messageFontSize'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.MESSAGEFONTSIZE_REQUIRED"
-                      >messageFontSize field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="CHAT.ERRORS.MESSAGEFONTSIZE_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >messageFontSize must be a valid greater or equal
-                      than</span
-                    >
-                    <span>0</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="CHAT.ERRORS.MESSAGEFONTSIZE_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >messageFontSize must be a valid greater or equal
-                      than</span
-                    >
-                    <span>20</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.chatWebsite.agentIdentifier === 'website_alias'"
-                class="md-block"
-              >
-                <label translate="CHAT.WEBSITEALIAS">WebsiteAlias</label>
-                <input
-                  type="text"
-                  name="agentAlias"
-                  ng-model="vm.chatWebsite.agentAlias"
-                  md-maxlength="255"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="CHAT.HELP.WEBSITEALIAS"></span>
-                </div>
-                <div
-                  ng-messages="interactionForm['agentAlias'].$error"
-                  ng-show="interactionForm['agentAlias'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.WEBSITEALIAS_REQUIRED"
-                      >WebsiteAlias field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="CHAT.ERRORS.WEBSITEALIAS_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >WebsiteAlias must have a maximum length equal to
-                      255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CHAT.CLOSINGQUESTION">closingQuestion</label>
-                <input
-                  type="text"
-                  name="closingQuestion"
-                  ng-model="vm.chatWebsite.closingQuestion"
-                  md-maxlength="255"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="interactionForm['closingQuestion'].$error"
-                  ng-show="interactionForm['closingQuestion'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.CLOSINGQUESTION_REQUIRED"
-                      >closingQuestion field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="CHAT.ERRORS.CLOSINGQUESTION_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >closingQuestion must have a maximum length equal to
-                      255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CHAT.FORMSUBMITSUCCESSMESSAGE"
-                  >formSubmitSuccessMessage</label
-                >
-                <input
-                  type="text"
-                  name="formSubmitSuccessMessage"
-                  ng-model="vm.chatWebsite.formSubmitSuccessMessage"
-                  md-maxlength="255"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="interactionForm['formSubmitSuccessMessage'].$error"
-                  ng-show="interactionForm['formSubmitSuccessMessage'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="CHAT.ERRORS.FORMSUBMITSUCCESSMESSAGE_REQUIRED"
-                      >formSubmitSuccessMessage field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="CHAT.ERRORS.FORMSUBMITSUCCESSMESSAGE_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >formSubmitSuccessMessage must have a maximum length equal
-                      to 255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CHAT.FORMSUBMITFAILUREMESSAGE"
-                  >formSubmitFailureMessage</label
-                >
-                <input
-                  type="text"
-                  name="formSubmitFailureMessage"
-                  ng-model="vm.chatWebsite.formSubmitFailureMessage"
-                  md-maxlength="255"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="interactionForm['formSubmitFailureMessage'].$error"
-                  ng-show="interactionForm['formSubmitFailureMessage'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="CHAT.ERRORS.FORMSUBMITFAILUREMESSAGE_REQUIRED"
-                      >formSubmitFailureMessage field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="CHAT.ERRORS.FORMSUBMITFAILUREMESSAGE_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >formSubmitFailureMessage must have a maximum length equal
-                      to 255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.chatWebsite.enableCustomerWriting"
-                  aria-label="enableCustomerWriting"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="CHAT.ENABLECUSTOMERWRITING"
-                    >enableCustomerWriting</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="!vm.chatWebsite.enableCustomerWriting"
-                class="md-block"
-              >
-                <label translate="CHAT.WAITINGTITLE">waitingTitle</label>
-                <input
-                  type="text"
-                  name="waitingTitle"
-                  ng-model="vm.chatWebsite.waitingTitle"
-                  md-maxlength="255"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="interactionForm['waitingTitle'].$error"
-                  ng-show="interactionForm['waitingTitle'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.WAITINGTITLE_REQUIRED"
-                      >waitingTitle field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="CHAT.ERRORS.WAITINGTITLE_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >waitingTitle must have a maximum length equal to
-                      255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="!vm.chatWebsite.enableCustomerWriting"
-                class="md-block"
-              >
-                <label translate="CHAT.WAITINGMESSAGE">waitingMessage</label>
-                <textarea
-                  name="waitingMessage"
-                  ng-model="vm.chatWebsite.waitingMessage"
-                  md-maxlength="255"
-                  required
-                ></textarea>
-
-                <div
-                  ng-messages="interactionForm['waitingMessage'].$error"
-                  ng-show="interactionForm['waitingMessage'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.WAITINGMESSAGE_REQUIRED"
-                      >waitingMessage field is required</span
-                    >
-                  </div>
-
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="CHAT.ERRORS.WAITINGMESSAGE_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >waitingMessage must have a maximum length equal to
-                      255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CHAT.PLACEHOLDERMESSAGE"
-                  >placeholderMessage</label
-                >
-                <input
-                  type="text"
-                  name="placeholderMessage"
-                  ng-model="vm.chatWebsite.placeholderMessage"
-                  md-maxlength="255"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="interactionForm['placeholderMessage'].$error"
-                  ng-show="interactionForm['placeholderMessage'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.PLACEHOLDERMESSAGE_REQUIRED"
-                      >placeholderMessage field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="CHAT.ERRORS.PLACEHOLDERMESSAGE_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >placeholderMessage must have a maximum length equal to
-                      255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.chatWebsite.download_transcript"
-                  aria-label="downloadTranscript"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="CHAT.DOWNLOADTRANSCRIPT"
-                    >downloadTranscript</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.chatWebsite.enableCustomerAttachment"
-                  aria-label="enableCustomerAttachment"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="CHAT.ENABLECUSTOMERATTACHMENT"
-                    >enableCustomerAttachment</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.chatWebsite.enableSendButton"
-                  aria-label="enableSendButton"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="CHAT.ENABLESENDBUTTON"
-                    >enableSendButton</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.chatWebsite.enableCustomerCheckmarks"
-                  aria-label="enableCustomerCheckmarks"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="CHAT.ENABLECUSTOMERCHECKMARKS"
-                    >enableCustomerCheckmarks</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CHAT.SYSTEMALIAS">systemAlias</label>
-                <input
-                  type="text"
-                  name="systemAlias"
-                  ng-model="vm.chatWebsite.systemAlias"
-                  md-maxlength="255"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="interactionForm['systemAlias'].$error"
-                  ng-show="interactionForm['systemAlias'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.SYSTEMALIAS_REQUIRED"
-                      >systemAlias field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="CHAT.ERRORS.SYSTEMALIAS_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >systemAlias must have a maximum length equal to 255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            ng-if="vm.license.custom"
-            class="chatWebsite-detail-form-container whitelabel md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="CHAT.WHITELABEL">
-                WHITELABEL
-              </div>
-            </div>
-            <form name="whitelabelForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.chatWebsite.defaultWhiteLabel"
-                  aria-label="default"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="CHAT.DEFAULT">default</span></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="!vm.chatWebsite.defaultWhiteLabel"
-                class="md-block"
-              >
-                <label translate="CHAT.WHITELABEL">whiteLabel</label>
-                <textarea
-                  name="whiteLabel"
-                  ng-model="vm.chatWebsite.whiteLabel"
-                  md-maxlength="255"
-                  required
-                ></textarea>
-
-                <div
-                  ng-messages="whitelabelForm['whiteLabel'].$error"
-                  ng-show="whitelabelForm['whiteLabel'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.WHITELABEL_REQUIRED"
-                      >whiteLabel field is required</span
-                    >
-                  </div>
-
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="CHAT.ERRORS.WHITELABEL_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >whiteLabel must have a maximum length equal to 255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            ng-if="vm.license.custom"
-            class="chatWebsite-detail-form-container logo md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="CHAT.LOGO">LOGO</div>
-            </div>
-            <div
-              ng-controller="ChatWebsitelogoController as vm_ca"
-              ng-init="vm_ca.init(vm.chatWebsite, vm.crudPermissions)"
-              class="chatWebsite-detail-form-container md-background-bg md-whiteframe-1dp"
-            >
-              <div
-                id="chatWebsite-image-uploader"
-                flow-init="vm_ca.ngFlowOptions"
-                flow-name="vm_ca.ngFlow.flow"
-                flow-files-submitted="vm_ca.upload()"
-                flow-file-added="vm_ca.fileAdded($file)"
-                flow-file-success="vm_ca.fileSuccess($file, $message)"
-                flow-complete="vm_ca.uploadComplete()"
-                flow-drop
-                flow-drag-enter="vm_ca.dropping=true"
-                flow-drag-leave="vm_ca.dropping=false"
-                ng-class="{'dropping':vm.dropping}"
-              >
-                <div
-                  class="drop-text hint-text"
-                  layout="row"
-                  layout-align="center center"
-                >
-                  <span translate="EC.DROP_TO_UPLOAD">Drop to upload</span>
-                </div>
-
-                <div
-                  class="upload-button"
-                  layout="column"
-                  layout-align="center center"
-                >
-                  <md-button
-                    class="md-accent md-raised"
-                    flow-btn
-                    ng-disabled="!vm_ca.crudPermissions.canEdit"
-                  >
-                    Upload
-                  </md-button>
-                  <span class="secondary-text mt-8"
-                    >You can also drop images here to upload. Only PNG, JPG -
-                    Max. 8MB</span
-                  >
-                </div>
-
-                <div layout="row" layout-align="start start" layout-wrap>
-                  <div
-                    ng-repeat="logoimage in vm_ca.chatWebsite.images"
-                    ng-switch="logoimage.type"
-                  >
-                    <div
-                      class="chatWebsite-image uploading"
-                      ng-switch-when="uploading"
-                      layout="row"
-                      layout-align="center center"
-                    >
-                      <div
-                        class="overlay"
-                        layout="column"
-                        layout-align="center center"
-                      >
-                        <md-progress-linear
-                          md-mode="determinate"
-                          value="{{logoimage.file.progress() * 100}}"
-                        >
-                        </md-progress-linear>
-                      </div>
-                      <img class="media" flow-img="logoimage.file" />
-                    </div>
-
-                    <div
-                      class="chatWebsite-image"
-                      ng-switch-when="image"
-                      layout="row"
-                      layout-align="center center"
-                    >
-                      <img class="media" ng-src="{{logoimage.url}}" />
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-          <div
-            class="chatWebsite-detail-form-container agentavatar md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="CHAT.AGENTAVATAR">
-                AGENTAVATAR
-              </div>
-            </div>
-            <div
-              ng-controller="ChatWebsiteagentAvatarController as vm_ca"
-              ng-init="vm_ca.init(vm.chatWebsite, vm.crudPermissions)"
-              class="chatWebsite-detail-form-container md-background-bg md-whiteframe-1dp"
-            >
-              <div
-                id="chatWebsite-image-uploader"
-                flow-init="vm_ca.ngFlowOptions"
-                flow-name="vm_ca.ngFlow.flow"
-                flow-files-submitted="vm_ca.upload()"
-                flow-file-added="vm_ca.fileAdded($file)"
-                flow-file-success="vm_ca.fileSuccess($file, $message)"
-                flow-complete="vm_ca.uploadComplete()"
-                flow-drop
-                flow-drag-enter="vm_ca.dropping=true"
-                flow-drag-leave="vm_ca.dropping=false"
-                ng-class="{'dropping':vm.dropping}"
-              >
-                <div
-                  class="drop-text hint-text"
-                  layout="row"
-                  layout-align="center center"
-                >
-                  <span translate="EC.DROP_TO_UPLOAD">Drop to upload</span>
-                </div>
-
-                <div
-                  class="upload-button"
-                  layout="column"
-                  layout-align="center center"
-                >
-                  <md-button
-                    class="md-accent md-raised"
-                    flow-btn
-                    ng-disabled="!vm_ca.crudPermissions.canEdit"
-                  >
-                    Upload
-                  </md-button>
-                  <span class="secondary-text mt-8"
-                    >You can also drop images here to upload. Only PNG, JPG -
-                    Max. 8MB</span
-                  >
-                </div>
-
-                <div layout="row" layout-align="start start" layout-wrap>
-                  <div
-                    ng-repeat="agentAvatarimage in vm_ca.chatWebsite.images"
-                    ng-switch="agentAvatarimage.type"
-                  >
-                    <div
-                      class="chatWebsite-image uploading"
-                      ng-switch-when="uploading"
-                      layout="row"
-                      layout-align="center center"
-                    >
-                      <div
-                        class="overlay"
-                        layout="column"
-                        layout-align="center center"
-                      >
-                        <md-progress-linear
-                          md-mode="determinate"
-                          value="{{agentAvatarimage.file.progress() * 100}}"
-                        >
-                        </md-progress-linear>
-                      </div>
-                      <img class="media" flow-img="agentAvatarimage.file" />
-                    </div>
-
-                    <div
-                      class="chatWebsite-image"
-                      ng-switch-when="image"
-                      layout="row"
-                      layout-align="center center"
-                    >
-                      <img class="media" ng-src="{{agentAvatarimage.url}}" />
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-          <div
-            class="chatWebsite-detail-form-container customeravatar md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="CHAT.CUSTOMERAVATAR">
-                CUSTOMERAVATAR
-              </div>
-            </div>
-            <div
-              ng-controller="ChatWebsitecustomerAvatarController as vm_ca"
-              ng-init="vm_ca.init(vm.chatWebsite, vm.crudPermissions)"
-              class="chatWebsite-detail-form-container md-background-bg md-whiteframe-1dp"
-            >
-              <div
-                id="chatWebsite-image-uploader"
-                flow-init="vm_ca.ngFlowOptions"
-                flow-name="vm_ca.ngFlow.flow"
-                flow-files-submitted="vm_ca.upload()"
-                flow-file-added="vm_ca.fileAdded($file)"
-                flow-file-success="vm_ca.fileSuccess($file, $message)"
-                flow-complete="vm_ca.uploadComplete()"
-                flow-drop
-                flow-drag-enter="vm_ca.dropping=true"
-                flow-drag-leave="vm_ca.dropping=false"
-                ng-class="{'dropping':vm.dropping}"
-              >
-                <div
-                  class="drop-text hint-text"
-                  layout="row"
-                  layout-align="center center"
-                >
-                  <span translate="EC.DROP_TO_UPLOAD">Drop to upload</span>
-                </div>
-
-                <div
-                  class="upload-button"
-                  layout="column"
-                  layout-align="center center"
-                >
-                  <md-button
-                    class="md-accent md-raised"
-                    flow-btn
-                    ng-disabled="!vm_ca.crudPermissions.canEdit"
-                  >
-                    Upload
-                  </md-button>
-                  <span class="secondary-text mt-8"
-                    >You can also drop images here to upload. Only PNG, JPG -
-                    Max. 8MB</span
-                  >
-                </div>
-
-                <div layout="row" layout-align="start start" layout-wrap>
-                  <div
-                    ng-repeat="customerAvatarimage in vm_ca.chatWebsite.images"
-                    ng-switch="customerAvatarimage.type"
-                  >
-                    <div
-                      class="chatWebsite-image uploading"
-                      ng-switch-when="uploading"
-                      layout="row"
-                      layout-align="center center"
-                    >
-                      <div
-                        class="overlay"
-                        layout="column"
-                        layout-align="center center"
-                      >
-                        <md-progress-linear
-                          md-mode="determinate"
-                          value="{{customerAvatarimage.file.progress() * 100}}"
-                        >
-                        </md-progress-linear>
-                      </div>
-                      <img class="media" flow-img="customerAvatarimage.file" />
-                    </div>
-
-                    <div
-                      class="chatWebsite-image"
-                      ng-switch-when="image"
-                      layout="row"
-                      layout-align="center center"
-                    >
-                      <img class="media" ng-src="{{customerAvatarimage.url}}" />
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-          <div
-            class="chatWebsite-detail-form-container systemavatar md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="CHAT.SYSTEMAVATAR">
-                SYSTEMAVATAR
-              </div>
-            </div>
-            <div
-              ng-controller="ChatWebsitesystemAvatarController as vm_ca"
-              ng-init="vm_ca.init(vm.chatWebsite, vm.crudPermissions)"
-              class="chatWebsite-detail-form-container md-background-bg md-whiteframe-1dp"
-            >
-              <div
-                id="chatWebsite-image-uploader"
-                flow-init="vm_ca.ngFlowOptions"
-                flow-name="vm_ca.ngFlow.flow"
-                flow-files-submitted="vm_ca.upload()"
-                flow-file-added="vm_ca.fileAdded($file)"
-                flow-file-success="vm_ca.fileSuccess($file, $message)"
-                flow-complete="vm_ca.uploadComplete()"
-                flow-drop
-                flow-drag-enter="vm_ca.dropping=true"
-                flow-drag-leave="vm_ca.dropping=false"
-                ng-class="{'dropping':vm.dropping}"
-              >
-                <div
-                  class="drop-text hint-text"
-                  layout="row"
-                  layout-align="center center"
-                >
-                  <span translate="EC.DROP_TO_UPLOAD">Drop to upload</span>
-                </div>
-
-                <div
-                  class="upload-button"
-                  layout="column"
-                  layout-align="center center"
-                >
-                  <md-button
-                    class="md-accent md-raised"
-                    flow-btn
-                    ng-disabled="!vm_ca.crudPermissions.canEdit"
-                  >
-                    Upload
-                  </md-button>
-                  <span class="secondary-text mt-8"
-                    >You can also drop images here to upload. Only PNG, JPG -
-                    Max. 8MB</span
-                  >
-                </div>
-
-                <div layout="row" layout-align="start start" layout-wrap>
-                  <div
-                    ng-repeat="systemAvatarimage in vm_ca.chatWebsite.images"
-                    ng-switch="systemAvatarimage.type"
-                  >
-                    <div
-                      class="chatWebsite-image uploading"
-                      ng-switch-when="uploading"
-                      layout="row"
-                      layout-align="center center"
-                    >
-                      <div
-                        class="overlay"
-                        layout="column"
-                        layout-align="center center"
-                      >
-                        <md-progress-linear
-                          md-mode="determinate"
-                          value="{{systemAvatarimage.file.progress() * 100}}"
-                        >
-                        </md-progress-linear>
-                      </div>
-                      <img class="media" flow-img="systemAvatarimage.file" />
-                    </div>
-
-                    <div
-                      class="chatWebsite-image"
-                      ng-switch-when="image"
-                      layout="row"
-                      layout-align="center center"
-                    >
-                      <img class="media" ng-src="{{systemAvatarimage.url}}" />
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="CHAT.ONLINE">ONLINE</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="chatWebsite-detail-form-container chatformonline md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="ChatWebsiteonlineFormController as vm_fonc"
-              ng-init="vm_fonc.init(vm.chatWebsite)"
-              class="content"
-              md-background-bg
-              layout="column"
-            >
-              <div flex>
-                <!-- START Buttons -->
-                <md-button
-                  aria-label="comment"
-                  class="md-fab md-mini"
-                  ng-click="vm_fonc.add(button.type)"
-                  ng-repeat="button in vm_fonc.buttons"
-                >
-                  <md-tooltip md-direction="top">{{button.name}}</md-tooltip>
-                  <md-icon md-font-icon="{{button.icon}}"></md-icon>
-                </md-button>
-                <!-- END Buttons -->
-              </div>
-
-              <div layout="row" flex>
-                <div flex="50">
-                  <md-card>
-                    <md-card-title>
-                      <md-card-title-text>
-                        <div
-                          class="pb-16"
-                          layout="row"
-                          layout-align="start center"
-                        >
-                          <div
-                            class="h2 secondary-text"
-                            translate="CHAT.BUILDER"
-                          >
-                            BUILDER
-                          </div>
-                        </div>
-                      </md-card-title-text>
-                    </md-card-title>
-                    <md-card-content>
-                      <form name="onlineForm" novalidate>
-                        <!-- START MapKey -->
-                        <md-input-container
-                          class="md-block"
-                          ng-if="vm_fonc.chatWebsite.onlineForm.items.length"
-                        >
-                          <label translate="CHAT.HELP.MAPKEY">MapKey</label>
-                          <md-select ng-model="vm_fonc.chatWebsite.mapKey">
-                            <md-option ng-value="null">None</md-option>
-
-                            <md-optgroup label="standard">
-                              <md-option
-                                ng-repeat="field in vm_fonc.fields"
-                                ng-value="field.key"
-                                >{{ field.value }}</md-option
-                              >
-                            </md-optgroup>
-
-                            <md-optgroup
-                              label="custom"
-                              ng-if="vm_fonc.customFields.length"
-                            >
-                              <md-option
-                                ng-repeat="field in vm_fonc.customFields"
-                                ng-value="field.key"
-                                >{{ field.value }}</md-option
-                              >
-                            </md-optgroup>
-                          </md-select>
-                        </md-input-container>
-                        <!-- END MapKey -->
-
-                        <!-- START FromKey -->
-                        <md-input-container
-                          class="md-block"
-                          ng-if="vm_fonc.chatWebsite.onlineForm.items.length"
-                        >
-                          <label translate="CHAT.HELP.FROMKEY">FromKey</label>
-                          <md-select
-                            ng-model="vm_fonc.chatWebsite.onlineForm.fromKey"
-                            md-selected-text="vm_fonc.chatWebsite.onlineForm.fromKey != null ? vm_fonc.chatWebsite.onlineForm.items[vm_fonc.chatWebsite.onlineForm.fromKey].props.title : 'None'"
-                          >
-                            <md-option ng-value="null">None</md-option>
-                            <md-option
-                              ng-repeat="item in vm_fonc.chatWebsite.onlineForm.items"
-                              ng-if="item.props.title"
-                              ng-value="$index"
-                              >{{ item.props.title }}</md-option
-                            >
-                          </md-select>
-                        </md-input-container>
-                        <!-- END FromKey -->
-
-                        <!-- START EXPANSION PANELS -->
-                        <md-expansion-panel
-                          ng-repeat="item in vm_fonc.chatWebsite.onlineForm.items track by $index"
-                          md-component-id="{{'onlinePanel' + $index}}"
-                        >
-                          <md-expansion-panel-collapsed md-no-sticky="true">
-                            <md-button
-                              class="md-icon-button"
-                              aria-label="Down"
-                              ng-click="vm_fonc.down(item, $index); $event.stopPropagation()"
-                            >
-                              <md-icon
-                                md-font-icon="icon-arrow-down-bold-circle-outline"
-                              ></md-icon>
-                            </md-button>
-                            <md-button
-                              class="md-icon-button"
-                              aria-label="Up"
-                              ng-click="vm_fonc.up(item, $index); $event.stopPropagation()"
-                            >
-                              <md-icon
-                                md-font-icon="icon-arrow-up-bold-circle-outline"
-                              ></md-icon>
-                            </md-button>
-
-                            <div class="md-title">
-                              {{item.props.title || item.type}}
-                            </div>
-
-                            <div flex></div>
-                            <md-button
-                              class="md-icon-button"
-                              aria-label="Collapse"
-                              ng-click="$panel.collapse()"
-                            >
-                              <md-icon
-                                md-font-icon="icon-chevron-down"
-                              ></md-icon>
-                            </md-button>
-                          </md-expansion-panel-collapsed>
-
-                          <md-expansion-panel-expanded>
-                            <md-expansion-panel-header>
-                              <md-button
-                                class="md-icon-button"
-                                aria-label="Down"
-                                ng-click="vm_fonc.down(item, $index)"
-                              >
-                                <md-icon
-                                  md-font-icon="icon-arrow-down-bold-circle-outline"
-                                ></md-icon>
-                              </md-button>
-                              <md-button
-                                class="md-icon-button"
-                                aria-label="Up"
-                                ng-click="vm_fonc.up(item, $index)"
-                              >
-                                <md-icon
-                                  md-font-icon="icon-arrow-up-bold-circle-outline"
-                                ></md-icon>
-                              </md-button>
-
-                              <div class="md-title">
-                                {{item.props.title || item.type}}
-                              </div>
-
-                              <div flex></div>
-
-                              <md-button
-                                class="md-icon-button md-warn"
-                                aria-label="Remove"
-                                ng-click="vm_fonc.remove($index)"
-                              >
-                                <md-icon md-font-icon="icon-delete"></md-icon>
-                              </md-button>
-                              <md-button
-                                class="md-icon-button"
-                                aria-label="Collapse"
-                                ng-click="$panel.collapse()"
-                              >
-                                <md-icon
-                                  md-font-icon="icon-chevron-up"
-                                ></md-icon>
-                              </md-button>
-                            </md-expansion-panel-header>
-
-                            <md-expansion-panel-content>
-                              <form-item
-                                type="{{item.type}}"
-                                item="item"
-                                index="$index"
-                              ></form-item>
-
-                              <md-input-container class="md-block">
-                                <label translate="CHAT.VARIABLE"
-                                  >Variable</label
-                                >
-                                <md-select ng-model="item.variable">
-                                  <md-option ng-value="null">None</md-option>
-                                  <md-option
-                                    ng-repeat="variable in vm_fonc.variables"
-                                    ng-value="variable.name"
-                                    >{{ variable.name }}</md-option
-                                  >
-                                </md-select>
-                              </md-input-container>
-
-                              <md-input-container class="md-block">
-                                <label translate="CHAT.CM_FIELD"
-                                  >Contact Manager Field</label
-                                >
-                                <md-select ng-model="item.cmField">
-                                  <md-option ng-value="null">None</md-option>
-
-                                  <md-optgroup label="standard">
-                                    <md-option
-                                      ng-repeat="field in vm_fonc.fields"
-                                      ng-value="field.key"
-                                      >{{ field.value }}</md-option
-                                    >
-                                  </md-optgroup>
-
-                                  <md-optgroup
-                                    label="custom"
-                                    ng-if="vm_fonc.customFields.length"
-                                  >
-                                    <md-option
-                                      ng-repeat="field in vm_fonc.customFields"
-                                      ng-value="field.key"
-                                      >{{ field.value }}</md-option
-                                    >
-                                  </md-optgroup>
-                                </md-select>
-                              </md-input-container>
-                            </md-expansion-panel-content>
-                          </md-expansion-panel-expanded>
-                        </md-expansion-panel>
-                        <!-- END EXPANSION PANELS -->
-                      </form>
-                    </md-card-content>
-                  </md-card>
-                </div>
-                <div flex="50">
-                  <md-card>
-                    <md-card-title>
-                      <md-card-title-text>
-                        <div
-                          class="pb-16"
-                          layout="row"
-                          layout-align="start center"
-                        >
-                          <div
-                            class="h2 secondary-text"
-                            translate="CHAT.PREVIEW"
-                          >
-                            PREVIEW
-                          </div>
-                        </div>
-                      </md-card-title-text>
-                    </md-card-title>
-                    <md-card-content flex>
-                      <form-view
-                        form="vm_fonc.chatWebsite.onlineForm"
-                        flex="100"
-                      ></form-view>
-                    </md-card-content>
-                  </md-card>
-                </div>
-              </div>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="CHAT.OFFLINE">OFFLINE</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="chatWebsite-detail-form-container chatformoffline md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="ChatWebsiteofflineFormController as vm_fonc"
-              ng-init="vm_fonc.init(vm.chatWebsite)"
-              class="content"
-              md-background-bg
-              layout="column"
-            >
-              <div flex>
-                <!-- START Buttons -->
-                <md-button
-                  aria-label="comment"
-                  class="md-fab md-mini"
-                  ng-click="vm_fonc.add(button.type)"
-                  ng-repeat="button in vm_fonc.buttons"
-                >
-                  <md-tooltip md-direction="top">{{button.name}}</md-tooltip>
-                  <md-icon md-font-icon="{{button.icon}}"></md-icon>
-                </md-button>
-                <!-- END Buttons -->
-              </div>
-
-              <div layout="row" flex>
-                <div flex="50">
-                  <md-card>
-                    <md-card-title>
-                      <md-card-title-text>
-                        <div
-                          class="pb-16"
-                          layout="row"
-                          layout-align="start center"
-                        >
-                          <div
-                            class="h2 secondary-text"
-                            translate="CHAT.BUILDER"
-                          >
-                            BUILDER
-                          </div>
-                        </div>
-                      </md-card-title-text>
-                    </md-card-title>
-                    <md-card-content>
-                      <form name="offlineForm" novalidate>
-                        <md-input-container class="md-block">
-                          <md-switch
-                            ng-model="vm_fonc.chatWebsite.forwardOffline"
-                            aria-label="forwardOffline"
-                            ><span translate="CHAT.FORWARD_OFFLINE"
-                              >forwardOffline</span
-                            ></md-switch
-                          >
-                        </md-input-container>
-
-                        <md-input-container
-                          class="md-block"
-                          ng-if="vm_fonc.chatWebsite.forwardOffline"
-                        >
-                          <label translate="CHAT.FORWARD_OFFLINE_ADDRESS"
-                            >FORWARD OFFLINE ADDRESS</label
-                          >
-                          <input
-                            type="text"
-                            name="forwardOfflineAddress"
-                            ng-model="vm_fonc.chatWebsite.forwardOfflineAddress"
-                          />
-                          <div class="hint">
-                            <span translate="CHAT.HELP.FORWARD_OFFLINE"></span>
-                          </div>
-                          <div
-                            ng-messages="offlineForm['forwardOfflineAddress'].$error"
-                            ng-show="offlineForm['forwardOfflineAddress'].$touched"
-                            role="alert"
-                          >
-                            <div ng-message="email">
-                              <span translate="CHAT.ERRORS.EMAIL_MUST_BE_VALID"
-                                >forwardOffline must be a valid e-mail
-                                address</span
-                              >
-                            </div>
-                          </div>
-                        </md-input-container>
-
-                        <!-- START MapKey -->
-                        <md-input-container
-                          class="md-block"
-                          ng-if="vm_fonc.chatWebsite.offlineForm.items.length"
-                        >
-                          <label translate="CHAT.HELP.MAPKEY">MapKey</label>
-                          <md-select
-                            ng-model="vm_fonc.chatWebsite.mapKeyOffline"
-                          >
-                            <md-option ng-value="null">None</md-option>
-
-                            <md-optgroup label="standard">
-                              <md-option
-                                ng-repeat="field in vm_fonc.fields"
-                                ng-value="field.key"
-                                >{{ field.value }}</md-option
-                              >
-                            </md-optgroup>
-
-                            <md-optgroup
-                              label="custom"
-                              ng-if="vm_fonc.customFields.length"
-                            >
-                              <md-option
-                                ng-repeat="field in vm_fonc.customFields"
-                                ng-value="field.key"
-                                >{{ field.value }}</md-option
-                              >
-                            </md-optgroup>
-                          </md-select>
-                        </md-input-container>
-                        <!-- END MapKey -->
-
-                        <!-- START FromKey -->
-                        <md-input-container
-                          class="md-block"
-                          ng-if="vm_fonc.chatWebsite.offlineForm.items.length"
-                        >
-                          <label translate="CHAT.HELP.FROMKEY">FromKey</label>
-                          <md-select
-                            ng-model="vm_fonc.chatWebsite.offlineForm.fromKey"
-                            md-selected-text="vm_fonc.chatWebsite.offlineForm.fromKey != null ? vm_fonc.chatWebsite.offlineForm.items[vm_fonc.chatWebsite.offlineForm.fromKey].props.title : 'None'"
-                          >
-                            <md-option ng-value="null">None</md-option>
-                            <md-option
-                              ng-repeat="item in vm_fonc.chatWebsite.offlineForm.items"
-                              ng-if="item.props.title"
-                              ng-value="$index"
-                              >{{ item.props.title }}</md-option
-                            >
-                          </md-select>
-                        </md-input-container>
-                        <!-- END FromKey -->
-
-                        <!-- START EXPANSION PANELS -->
-                        <md-expansion-panel
-                          ng-repeat="item in vm_fonc.chatWebsite.offlineForm.items track by $index"
-                          md-component-id="{{'offlinePanel' + $index}}"
-                        >
-                          <md-expansion-panel-collapsed md-no-sticky="true">
-                            <md-button
-                              class="md-icon-button"
-                              aria-label="Down"
-                              ng-click="vm_fonc.down(item, $index); $event.stopPropagation()"
-                            >
-                              <md-icon
-                                md-font-icon="icon-arrow-down-bold-circle-outline"
-                              ></md-icon>
-                            </md-button>
-                            <md-button
-                              class="md-icon-button"
-                              aria-label="Up"
-                              ng-click="vm_fonc.up(item, $index); $event.stopPropagation()"
-                            >
-                              <md-icon
-                                md-font-icon="icon-arrow-up-bold-circle-outline"
-                              ></md-icon>
-                            </md-button>
-
-                            <div class="md-title">
-                              {{item.props.title || item.type}}
-                            </div>
-
-                            <div flex></div>
-                            <md-button
-                              class="md-icon-button"
-                              aria-label="Collapse"
-                              ng-click="$panel.collapse()"
-                            >
-                              <md-icon
-                                md-font-icon="icon-chevron-down"
-                              ></md-icon>
-                            </md-button>
-                          </md-expansion-panel-collapsed>
-
-                          <md-expansion-panel-expanded>
-                            <md-expansion-panel-header>
-                              <md-button
-                                class="md-icon-button"
-                                aria-label="Down"
-                                ng-click="vm_fonc.down(item, $index)"
-                              >
-                                <md-icon
-                                  md-font-icon="icon-arrow-down-bold-circle-outline"
-                                ></md-icon>
-                              </md-button>
-                              <md-button
-                                class="md-icon-button"
-                                aria-label="Up"
-                                ng-click="vm_fonc.up(item, $index)"
-                              >
-                                <md-icon
-                                  md-font-icon="icon-arrow-up-bold-circle-outline"
-                                ></md-icon>
-                              </md-button>
-
-                              <div class="md-title">
-                                {{item.props.title || item.type}}
-                              </div>
-
-                              <div flex></div>
-
-                              <md-button
-                                class="md-icon-button md-warn"
-                                aria-label="Remove"
-                                ng-click="vm_fonc.remove($index)"
-                              >
-                                <md-icon md-font-icon="icon-delete"></md-icon>
-                              </md-button>
-                              <md-button
-                                class="md-icon-button"
-                                aria-label="Collapse"
-                                ng-click="$panel.collapse()"
-                              >
-                                <md-icon
-                                  md-font-icon="icon-chevron-up"
-                                ></md-icon>
-                              </md-button>
-                            </md-expansion-panel-header>
-
-                            <md-expansion-panel-content>
-                              <form-item
-                                type="{{item.type}}"
-                                item="item"
-                                index="$index"
-                              ></form-item>
-
-                              <md-input-container class="md-block">
-                                <label translate="CHAT.CM_FIELD"
-                                  >Contact Manager Field</label
-                                >
-                                <md-select ng-model="item.cmField">
-                                  <md-option ng-value="null">None</md-option>
-
-                                  <md-optgroup label="standard">
-                                    <md-option
-                                      ng-repeat="field in vm_fonc.fields"
-                                      ng-value="field.key"
-                                      >{{ field.value }}</md-option
-                                    >
-                                  </md-optgroup>
-
-                                  <md-optgroup
-                                    label="custom"
-                                    ng-if="vm_fonc.customFields.length"
-                                  >
-                                    <md-option
-                                      ng-repeat="field in vm_fonc.customFields"
-                                      ng-value="field.key"
-                                      >{{ field.value }}</md-option
-                                    >
-                                  </md-optgroup>
-                                </md-select>
-                              </md-input-container>
-                            </md-expansion-panel-content>
-                          </md-expansion-panel-expanded>
-                        </md-expansion-panel>
-                        <!-- END EXPANSION PANELS -->
-                      </form>
-                    </md-card-content>
-                  </md-card>
-                </div>
-                <div flex="50">
-                  <md-card>
-                    <md-card-title>
-                      <md-card-title-text>
-                        <div
-                          class="pb-16"
-                          layout="row"
-                          layout-align="start center"
-                        >
-                          <div
-                            class="h2 secondary-text"
-                            translate="CHAT.PREVIEW"
-                          >
-                            PREVIEW
-                          </div>
-                        </div>
-                      </md-card-title-text>
-                    </md-card-title>
-                    <md-card-content flex>
-                      <form-view
-                        form="vm_fonc.chatWebsite.offlineForm"
-                        flex="100"
-                      ></form-view>
-                    </md-card-content>
-                  </md-card>
-                </div>
-              </div>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="CHAT.PROACTIVEACTIONS">PROACTIVEACTIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="chatWebsite-detail-form-container proactive md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="ChatWebsiteProactiveActionsController as vm_dc"
-              ng-init="vm_dc.init(vm.chatWebsite, vm.crudPermissions)"
-            >
-              <md-toolbar
-                class="md-table-toolbar md-default"
-                ng-hide="vm_dc.selectedChatWebsiteProactiveActions.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead" translate="CHAT.PROACTIVEACTIONS"
-                    >ProactiveActions</span
-                  >
-                  <ms-search-bar
-                    on-search="vm_dc.query.filter = query"
-                    on-collapse="vm_dc.query.filter = undefined"
-                    debounce="300"
-                    direction="down"
-                  ></ms-search-bar>
-                  <div flex></div>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canEdit"
-                    class="md-icon-button"
-                    ng-click="vm_dc.createOrEditChatWebsiteChatProactiveAction($event)"
-                    aria-label="add chatProactiveAction"
-                    translate
-                    translate-attr-label="CHAT.ADD_CHATPROACTIVEACTION"
-                  >
-                    <md-icon md-font-icon="icon-plus"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-toolbar
-                class="md-table-toolbar md-accent"
-                ng-show="vm_dc.selectedChatWebsiteProactiveActions.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead"
-                    >{{vm_dc.selectedChatWebsiteProactiveActions.length}}
-                    {{vm_dc.selectedChatWebsiteProactiveActions.length > 1 ?
-                    'items' : 'item'}} selected</span
-                  >
-                  <div flex></div>
-                  <button
-                    class="md-icon-button"
-                    ng-csv="vm_dc.exportSelectedChatWebsiteProactiveActions"
-                    csv-label="true"
-                    filename="chatWebsites.csv"
-                  >
-                    <md-icon md-font-icon="icon-file-excel"></md-icon>
-                  </button>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canDelete"
-                    class="md-icon-button"
-                    ng-click="vm_dc.deleteSelectedChatWebsiteProactiveActions($event)"
-                    aria-label="delete selected"
-                    translate
-                    translate-attr-label="CHAT.DELETE_SELECTED"
-                  >
-                    <md-icon md-font-icon="icon-delete"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-table-container class="font-size-12">
-                <table
-                  md-table
-                  md-row-select
-                  multiple
-                  ng-model="vm_dc.selectedChatWebsiteProactiveActions"
-                  md-progress="vm_dc.promise"
-                >
-                  <thead
-                    md-head
-                    md-order="vm_dc.query.sort"
-                    md-on-reorder="vm_dc.getChatWebsiteProactiveActions"
-                  >
-                    <tr md-row>
-                      <th md-column md-order-by="id">
-                        {{ 'CHAT.ID' | translate }}
-                      </th>
-                      <th md-column md-order-by="name">
-                        {{ 'CHAT.NAME' | translate }}
-                      </th>
-                      <th md-column md-order-by="type">
-                        {{ 'CHAT.TYPE' | translate }}
-                      </th>
-                      <th md-column md-order-by="selector">
-                        {{ 'CHAT.SELECTOR' | translate }}
-                      </th>
-                      <th md-column md-order-by="timeout">
-                        {{ 'CHAT.TIMEOUT' | translate }}
-                      </th>
-                      <th md-column md-order-by="createdAt">
-                        {{ 'CHAT.CREATED_AT' | translate }}
-                      </th>
-                      <th md-column width="10px"></th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr
-                      md-row
-                      md-select="chatProactiveAction"
-                      md-select-id="id"
-                      ng-repeat="chatProactiveAction in vm_dc.chatWebsiteProactiveActions.rows"
-                    >
-                      <td
-                        ng-click="vm_dc.createOrEditChatWebsiteChatProactiveAction($event, chatProactiveAction)"
-                        md-cell
-                      >
-                        {{chatProactiveAction.id}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditChatWebsiteChatProactiveAction($event, chatProactiveAction)"
-                        md-cell
-                      >
-                        {{chatProactiveAction.name}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditChatWebsiteChatProactiveAction($event, chatProactiveAction)"
-                        md-cell
-                      >
-                        {{ 'CHAT.' +
-                        vm_dc.arraytype[chatProactiveAction.type].option |
-                        uppercase | translate }}
-                      </td>
-
-                      <td
-                        ng-click="vm_dc.createOrEditChatWebsiteChatProactiveAction($event, chatProactiveAction)"
-                        md-cell
-                      >
-                        {{chatProactiveAction.selector}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditChatWebsiteChatProactiveAction($event, chatProactiveAction)"
-                        md-cell
-                      >
-                        {{chatProactiveAction.timeout}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditChatWebsiteChatProactiveAction($event, chatProactiveAction)"
-                        md-cell
-                      >
-                        {{ chatProactiveAction.createdAt | formatdate }}
-                      </td>
-                      <td
-                        md-cell
-                        class="actions"
-                        ng-if="!vm_dc.crudPermissions.readOnly"
-                      >
-                        <md-menu>
-                          <md-button
-                            class="md-icon-button"
-                            aria-label="More"
-                            translate
-                            translate-attr-aria-label="CHAT.MORE"
-                            ng-click="$mdOpenMenu($event)"
-                          >
-                            <md-icon
-                              md-font-icon="icon-dots-vertical"
-                            ></md-icon>
-                          </md-button>
-
-                          <md-menu-content width="3">
-                            <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
-                              <md-button
-                                ng-click="vm_dc.createOrEditChatWebsiteChatProactiveAction($event, chatProactiveAction)"
-                                translate="CHAT.EDIT_CHATPROACTIVEACTION"
-                              >
-                                Edit ChatProactiveAction
-                              </md-button>
-                            </md-menu-item>
-                            <md-menu-item
-                              ng-if="vm_dc.crudPermissions.canDelete"
-                            >
-                              <md-button
-                                ng-click="vm_dc.deleteConfirm(chatProactiveAction, $event)"
-                                translate="CHAT.DELETE_CHATPROACTIVEACTION"
-                              >
-                                Delete ChatProactiveAction
-                              </md-button>
-                            </md-menu-item>
-                          </md-menu-content>
-                        </md-menu>
-                      </td>
-                    </tr>
-                    <tr
-                      md-row
-                      ng-if="!vm_dc.chatWebsiteProactiveActions.rows.length"
-                    >
-                      <td md-cell colspan="8">
-                        <div layout="row" layout-align="center center">
-                          <span
-                            class="text-boxed-light"
-                            translate="CHAT.NO_CHATPROACTIVEACTION_AVAILABLE"
-                            >No chatproactiveaction available</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-              <md-table-pagination
-                md-label="{page: '{{'CHAT.PAGE' | translate}}:', rowsPerPage: '{{'CHAT.ROWSPERPAGE' | translate}}:', of: '{{'CHAT.OF' | translate}}'}"
-                md-limit="vm_dc.query.limit"
-                md-limit-options="[10, 15, 20, 50, 100, 250]"
-                md-page="vm_dc.query.page"
-                md-total="{{vm_dc.chatWebsiteProactiveActions.count}}"
-                md-on-paginate="vm_dc.getChatWebsiteProactiveActions"
-                md-page-select
-              ></md-table-pagination>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="CHAT.DISPOSITIONS">DISPOSITIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            ng-controller="ChatWebsiteDispositionsController as vm_dc"
-            ng-init="vm_dc.init(vm.chatWebsite, vm.crudPermissions)"
-          >
-            <div layout="row">
-              <div class="column" flex="20">
-                <md-card class="mt-0">
-                  <md-card-content>
-                    <button
-                      layout-align="center center"
-                      md-mini-fab
-                      ng-click="vm_dc.query.level = null; vm_dc.getDispositions()"
-                    >
-                      <div layout="row" layout-align="start center">
-                        <md-icon md-font-icon="icon-refresh"></md-icon>
-                        <span class="ph-5"
-                          >{{ 'TOOLS.ALL_DISPOSITIONS' | translate }}</span
-                        >
-                      </div>
-                    </button>
-                  </md-card-content>
-                </md-card>
-                <md-card>
-                  <md-card-content>
-                    <md-input-container class="md-block" flex-gt-sm="">
-                      <label translate="TOOLS.SELECT_LEVEL"
-                        >Select a level</label
-                      >
-                      <md-select
-                        placeholder="{{ 'TOOLS.SELECT_LEVEL' | translate }}"
-                        ng-model="vm_dc.query.level"
-                        ng-change="vm_dc.getDispositions()"
-                      >
-                        <md-option ng-value="null"
-                          ><em translate="TOOLS.ALL">All</em></md-option
-                        >
-                        <md-option
-                          ng-value="key"
-                          ng-repeat="(key, value) in vm_dc.levels"
-                          >{{ value }}</md-option
-                        >
-                      </md-select>
-                    </md-input-container>
-                  </md-card-content>
-                </md-card>
-              </div>
-              <div
-                class="chatWebsite-detail-form-container chatdispositions md-background-bg md-whiteframe-1dp"
-                flex="80"
-              >
-                <md-toolbar
-                  class="md-table-toolbar md-default"
-                  ng-hide="vm_dc.selectedChatWebsiteDispositions.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead" translate="CHAT.DISPOSITIONS"
-                      >Dispositions</span
-                    >
-                    <ms-search-bar
-                      on-search="vm_dc.query.filter = query"
-                      on-collapse="vm_dc.query.filter = undefined"
-                      debounce="300"
-                      direction="down"
-                    ></ms-search-bar>
-                    <div flex></div>
-                    <md-button
-                      ng-if="vm_dc.crudPermissions.canEdit"
-                      class="md-icon-button"
-                      ng-click="vm_dc.createOrEditDisposition($event)"
-                      aria-label="Add chat dispositions"
-                      translate
-                      translate-attr-label="CHAT.ADD_DISPOSITION"
-                    >
-                      <md-icon md-font-icon="icon-plus"></md-icon>
-                    </md-button>
-                  </div>
-                </md-toolbar>
-                <md-toolbar
-                  class="md-table-toolbar md-accent"
-                  ng-show="vm_dc.selectedDispositions.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead"
-                      >{{vm_dc.selectedDispositions.length}}
-                      {{vm_dc.selectedDispositions.length > 1 ? 'items' :
-                      'item'}} selected</span
-                    >
-                    <div flex></div>
-                    <button
-                      class="md-icon-button"
-                      ng-csv="vm_dc.exportSelectedDispositions"
-                      csv-label="true"
-                      filename="chatWebsites.csv"
-                    >
-                      <md-icon md-font-icon="icon-file-excel"></md-icon>
-                    </button>
-                    <md-button
-                      ng-if="vm_dc.crudPermissions.canDelete"
-                      class="md-icon-button"
-                      ng-click="vm_dc.deleteSelectedDispositions($event)"
-                      aria-label="delete selected"
-                      translate
-                      translate-attr-label="CHAT.DELETE_SELECTED"
-                    >
-                      <md-icon md-font-icon="icon-delete"></md-icon>
-                    </md-button>
-                  </div>
-                </md-toolbar>
-                <md-table-container>
-                  <table
-                    md-table
-                    md-row-select
-                    multiple
-                    ng-model="vm_dc.selectedDispositions"
-                    md-progress="vm_dc.promise"
-                  >
-                    <thead
-                      md-head
-                      md-order="vm_dc.query.sort"
-                      md-on-reorder="vm_dc.getDispositions"
-                    >
-                      <tr md-row>
-                        <th md-column md-order-by="id">
-                          {{ 'CHAT.ID' | translate }}
-                        </th>
-                        <th md-column md-order-by="level">
-                          {{ 'TOOLS.LEVEL' | translate }}
-                        </th>
-                        <th md-column md-order-by="name">
-                          {{ 'CHAT.NAME' | translate }}
-                        </th>
-                        <th md-column md-order-by="description">
-                          {{ 'CHAT.DESCRIPTION' | translate }}
-                        </th>
-                        <th md-column width="10px"></th>
-                      </tr>
-                    </thead>
-                    <tbody md-body>
-                      <tr md-row ng-hide="vm_dc.dispositions.rows.length">
-                        <td md-cell colspan="5">
-                          <div layout="row" layout-align="center center">
-                            <span translate="CHAT.NO_AVAILABLE_INFO"
-                              >No Available Info</span
-                            >
-                          </div>
-                        </td>
-                      </tr>
-                      <tr
-                        md-row
-                        md-select="disposition"
-                        md-select-id="id"
-                        ng-repeat="disposition in vm_dc.dispositions.rows"
-                      >
-                        <td
-                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                          md-cell
-                          class="id"
-                        >
-                          {{disposition.id}}
-                        </td>
-                        <td
-                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                          md-cell
-                          class="level"
-                        >
-                          {{ vm_dc.levels[disposition.level] }}
-                        </td>
-                        <td
-                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                          md-cell
-                          class="name"
-                        >
-                          {{disposition.name}}
-                        </td>
-                        <td
-                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                          md-cell
-                          class="description"
-                        >
-                          {{disposition.description}}
-                        </td>
-                        <td
-                          md-cell
-                          class="actions"
-                          ng-if="!vm_dc.crudPermissions.readOnly"
-                        >
-                          <md-menu>
-                            <md-button
-                              class="md-icon-button"
-                              aria-label="More"
-                              translate
-                              translate-attr-aria-label="CHAT.MORE"
-                              ng-click="$mdOpenMenu($event)"
-                            >
-                              <md-icon
-                                md-font-icon="icon-dots-vertical"
-                              ></md-icon>
-                            </md-button>
-                            <md-menu-content width="3">
-                              <!-- SUBACTIONS -->
-                              <!-- ACTIONS -->
-                              <md-menu-item
-                                ng-if="vm_dc.crudPermissions.canEdit"
-                              >
-                                <md-button
-                                  ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                                  translate="TOOLS.EDIT_DISPOSITION"
-                                >
-                                  Edit Disposition
-                                </md-button>
-                              </md-menu-item>
-                              <!-- SUBACTIONS -->
-                              <!-- ACTIONS -->
-                              <md-menu-item
-                                ng-if="vm_dc.crudPermissions.canDelete"
-                              >
-                                <md-button
-                                  ng-click="vm_dc.deleteConfirm(disposition, $event)"
-                                  translate="TOOLS.DELETE_DISPOSITION"
-                                >
-                                  Delete Disposition
-                                </md-button>
-                              </md-menu-item>
-                            </md-menu-content>
-                          </md-menu>
-                        </td>
-                      </tr>
-                    </tbody>
-                  </table>
-                </md-table-container>
-                <md-table-pagination
-                  md-label="{page: '{{'CHAT.PAGE' | translate}}:', rowsPerPage: '{{'CHAT.ROWSPERPAGE' | translate}}:', of: '{{'CHAT.OF' | translate}}'}"
-                  md-limit="vm_dc.query.limit"
-                  md-limit-options="[10, 15, 20, 50, 100, 250]"
-                  md-page="vm_dc.query.page"
-                  md-total="{{vm_dc.dispositions.count}}"
-                  md-on-paginate="vm_dc.getDispositions"
-                  md-page-select
-                >
-                </md-table-pagination>
-              </div>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="CHAT.CANNEDANSWERS">CANNEDANSWERS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="chatWebsite-detail-form-container chatcannedanswers md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="ChatWebsiteChatCannedAnswersController as vm_dc"
-              ng-init="vm_dc.init(vm.chatWebsite, vm.crudPermissions)"
-            >
-              <md-toolbar
-                class="md-table-toolbar md-default"
-                ng-hide="vm_dc.selectedChatWebsiteChatCannedAnswers.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead" translate="CHAT.CHATCANNEDANSWERS"
-                    >ChatCannedAnswers</span
-                  >
-                  <ms-search-bar
-                    on-search="vm_dc.query.filter = query"
-                    on-collapse="vm_dc.query.filter = undefined"
-                    debounce="300"
-                    direction="down"
-                  ></ms-search-bar>
-                  <div flex></div>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canEdit"
-                    class="md-icon-button"
-                    ng-click="vm_dc.createOrEditChatWebsiteChatCannedAnswer($event)"
-                    aria-label="add chatCannedAnswer"
-                    translate
-                    translate-attr-label="CHAT.ADD_CHATCANNEDANSWER"
-                  >
-                    <md-icon md-font-icon="icon-plus"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-toolbar
-                class="md-table-toolbar md-accent"
-                ng-show="vm_dc.selectedChatWebsiteChatCannedAnswers.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead"
-                    >{{vm_dc.selectedChatWebsiteChatCannedAnswers.length}}
-                    {{vm_dc.selectedChatWebsiteChatCannedAnswers.length > 1 ?
-                    'items' : 'item'}} selected</span
-                  >
-                  <div flex></div>
-                  <button
-                    class="md-icon-button"
-                    ng-csv="vm_dc.exportSelectedChatWebsiteChatCannedAnswers"
-                    csv-label="true"
-                    filename="chatWebsites.csv"
-                  >
-                    <md-icon md-font-icon="icon-file-excel"></md-icon>
-                  </button>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canDelete"
-                    class="md-icon-button"
-                    ng-click="vm_dc.deleteSelectedChatWebsiteChatCannedAnswers($event)"
-                    aria-label="delete selected"
-                    translate
-                    translate-attr-label="CHAT.DELETE_SELECTED"
-                  >
-                    <md-icon md-font-icon="icon-delete"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-table-container class="font-size-12">
-                <table
-                  md-table
-                  md-row-select
-                  multiple
-                  ng-model="vm_dc.selectedChatWebsiteChatCannedAnswers"
-                  md-progress="vm_dc.promise"
-                >
-                  <thead
-                    md-head
-                    md-order="vm_dc.query.sort"
-                    md-on-reorder="vm_dc.getChatWebsiteChatCannedAnswers"
-                  >
-                    <tr md-row>
-                      <th md-column md-order-by="id">
-                        {{ 'CHAT.ID' | translate }}
-                      </th>
-                      <th md-column md-order-by="key">
-                        {{ 'CHAT.KEY' | translate }}
-                      </th>
-                      <th md-column md-order-by="value">
-                        {{ 'CHAT.VALUE' | translate }}
-                      </th>
-                      <th md-column md-order-by="description">
-                        {{ 'CHAT.DESCRIPTION' | translate }}
-                      </th>
-                      <th md-column md-order-by="createdAt">
-                        {{ 'CHAT.CREATED_AT' | translate }}
-                      </th>
-                      <th md-column width="10px"></th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr
-                      md-row
-                      md-select="chatCannedAnswer"
-                      md-select-id="id"
-                      ng-repeat="chatCannedAnswer in vm_dc.chatWebsiteChatCannedAnswers.rows"
-                    >
-                      <td
-                        ng-click="vm_dc.createOrEditChatWebsiteChatCannedAnswer($event, chatCannedAnswer)"
-                        md-cell
-                      >
-                        {{chatCannedAnswer.id}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditChatWebsiteChatCannedAnswer($event, chatCannedAnswer)"
-                        md-cell
-                      >
-                        {{chatCannedAnswer.key}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditChatWebsiteChatCannedAnswer($event, chatCannedAnswer)"
-                        md-cell
-                      >
-                        {{chatCannedAnswer.value}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditChatWebsiteChatCannedAnswer($event, chatCannedAnswer)"
-                        md-cell
-                      >
-                        {{chatCannedAnswer.description}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditChatWebsiteChatCannedAnswer($event, chatCannedAnswer)"
-                        md-cell
-                      >
-                        {{ chatCannedAnswer.createdAt | formatdate }}
-                      </td>
-                      <td
-                        md-cell
-                        class="actions"
-                        ng-if="!vm_dc.crudPermissions.readOnly"
-                      >
-                        <md-menu>
-                          <md-button
-                            class="md-icon-button"
-                            aria-label="More"
-                            translate
-                            translate-attr-aria-label="CHAT.MORE"
-                            ng-click="$mdOpenMenu($event)"
-                          >
-                            <md-icon
-                              md-font-icon="icon-dots-vertical"
-                            ></md-icon>
-                          </md-button>
-
-                          <md-menu-content width="3">
-                            <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
-                              <md-button
-                                ng-click="vm_dc.createOrEditChatWebsiteChatCannedAnswer($event, chatCannedAnswer)"
-                                translate="CHAT.EDIT_CHATCANNEDANSWER"
-                              >
-                                Edit ChatCannedAnswer
-                              </md-button>
-                            </md-menu-item>
-                            <md-menu-item
-                              ng-if="vm_dc.crudPermissions.canDelete"
-                            >
-                              <md-button
-                                ng-click="vm_dc.deleteConfirm(chatCannedAnswer, $event)"
-                                translate="CHAT.DELETE_CHATCANNEDANSWER"
-                              >
-                                Delete ChatCannedAnswer
-                              </md-button>
-                            </md-menu-item>
-                          </md-menu-content>
-                        </md-menu>
-                      </td>
-                    </tr>
-                    <tr
-                      md-row
-                      ng-if="!vm_dc.chatWebsiteChatCannedAnswers.rows.length"
-                    >
-                      <td md-cell colspan="7">
-                        <div layout="row" layout-align="center center">
-                          <span
-                            class="text-boxed-light"
-                            translate="CHAT.NO_CHATCANNEDANSWER_AVAILABLE"
-                            >No chatcannedanswer available</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-              <md-table-pagination
-                md-label="{page: '{{'CHAT.PAGE' | translate}}:', rowsPerPage: '{{'CHAT.ROWSPERPAGE' | translate}}:', of: '{{'CHAT.OF' | translate}}'}"
-                md-limit="vm_dc.query.limit"
-                md-limit-options="[10, 15, 20, 50, 100, 250]"
-                md-page="vm_dc.query.page"
-                md-total="{{vm_dc.chatWebsiteChatCannedAnswers.count}}"
-                md-on-paginate="vm_dc.getChatWebsiteChatCannedAnswers"
-                md-page-select
-              ></md-table-pagination>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="CHAT.VIDEO">VIDEO</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="chatWebsite-detail-form-container vidaoo md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="CHAT.VIDAOO">
-                VIDAOO
-              </div>
-            </div>
-            <form name="vidaooForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.chatWebsite.vidaooEscalation"
-                  aria-label="vidaooEscalation"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="CHAT.VIDAOOESCALATION"
-                    >vidaooEscalation</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.chatWebsite.vidaooEscalation == true"
-                class="md-block"
-              >
-                <label translate="CHAT.VIDAOOAPIKEY">vidaooApiKey</label>
-                <input
-                  type="text"
-                  name="vidaooApiKey"
-                  ng-model="vm.chatWebsite.vidaooApiKey"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="vidaooForm['vidaooApiKey'].$error"
-                  ng-show="vidaooForm['vidaooApiKey'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CHAT.ERRORS.VIDAOOAPIKEY_REQUIRED"
-                      >vidaooApiKey field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="CHAT.ACTIONS">ACTIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="chatWebsite-detail-form-container actions md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="ChatWebsiteActionsController as vm_ac"
-              ng-init="vm_ac.init(vm.chatWebsite, vm.crudPermissions)"
-              class="content"
-              md-background-bg
-              layout="row"
-              layout-align="start start"
-            >
-              <!-- SIDENAV -->
-              <div
-                class="navigation-simple sidenav main-sidenav md-background-bg md-whiteframe-1dp"
-                ms-scroll
-                layout="column"
-                flex="20"
-                ng-if="vm_ac.crudPermissions.canEdit"
-              >
-                <!-- SIDENAV CONTENT -->
-                <md-list class="no-padding">
-                  <md-subheader class="md-no-sticky">
-                    <span translate="VOICE.APPLICATIONS_LIST">
-                      Applications List
-                    </span>
-                  </md-subheader>
-                </md-list>
-                <md-divider></md-divider>
-                <md-list ng-sortable="vm_ac.list">
-                  <md-list-item class="handle" ng-repeat="a in vm_ac.apps">
-                    <md-icon md-font-icon="{{a.icon}}" class="s16"></md-icon>
-                    <p
-                      class="text-truncate"
-                      translate="CHAT.{{(a.alias || a.appType) | uppercase}}"
-                    >
-                      {{a.alias || a.appType}}
-                    </p>
-                  </md-list-item>
-                </md-list>
-                <!-- / SIDENAV CONTENT -->
-              </div>
-              <!-- / SIDENAV -->
-              <div flex></div>
-              <!-- MAIN -->
-              <div
-                class="main scrollable md-background-bg md-whiteframe-1dp"
-                ms-scroll
-                layout="column"
-                flex="{{vm_ac.crudPermissions.canEdit ? 75 : 100}}"
-              >
-                <md-toolbar
-                  class="md-table-toolbar md-default"
-                  ng-hide="vm_ac.selectedChatWebsiteApps.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead">Drag & Drop Routing</span>
-                    <div flex></div>
-                    <ms-search-bar
-                      on-search="vm_ac.query.filter = query"
-                      on-collapse="vm_ac.query.filter = undefined"
-                      debounce="300"
-                    ></ms-search-bar>
-                  </div>
-                </md-toolbar>
-                <md-toolbar
-                  class="md-table-toolbar md-accent"
-                  ng-show="vm_ac.selectedChatWebsiteApps.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead"
-                      >{{vm_ac.selectedChatWebsiteApps.length}}
-                      {{vm_ac.selectedChatWebsiteApps.length > 1 ? 'items' :
-                      'item'}} selected</span
-                    >
-                    <div flex></div>
-                    <md-button
-                      ng-if="vm_ac.crudPermissions.canDelete"
-                      class="md-icon-button"
-                      ng-click="vm_ac.deleteSelectedChatWebsiteApps($event)"
-                      aria-label="delete selected"
-                      translate
-                      translate-attr-label="CHAT.DELETE_SELECTED"
-                    >
-                      <md-icon md-font-icon="icon-delete"></md-icon>
-                    </md-button>
-                  </div>
-                </md-toolbar>
-
-                <!-- QUEUES TABLE -->
-                <md-table-container>
-                  <table
-                    md-table
-                    md-row-select
-                    multiple
-                    ng-model="vm_ac.selectedChatWebsiteApps"
-                  >
-                    <thead md-head>
-                      <tr md-row>
-                        <th md-column width="10px"></th>
-                        <th md-column width="10px">
-                          <span translate="VOICE.PRIORITY">Priority</span>
-                        </th>
-                        <th md-column>
-                          <span>Type</span>
-                        </th>
-                        <th md-column>
-                          <span>Appdata</span>
-                        </th>
-                        <th md-column>
-                          <span>Interval</span>
-                        </th>
-                        <th md-column width="10px"></th>
-                        <th md-column width="10px"></th>
-                      </tr>
-                    </thead>
-                    <tbody md-body ng-sortable="vm_ac.applications">
-                      <tr
-                        md-row
-                        md-select="app"
-                        md-select-id="id"
-                        ng-repeat="app in vm_ac.chatWebsiteApps.rows | filter: vm_ac.query.filter"
-                      >
-                        <td md-cell>
-                          <md-icon
-                            md-font-icon="icon-drag-vertical"
-                            class="s16 handle"
-                          ></md-icon>
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editChatWebsiteApp($event, $index)"
-                        >
-                          <span>{{app.priority}}</span>
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editChatWebsiteApp($event, $index)"
-                        >
-                          {{app.app.toLowerCase() === 'agi' ? 'Cally-Square' :
-                          app.app | ucfirst}}<span
-                            ng-if="app.appType.toLowerCase() === 'custom'"
-                            >*</span
-                          >
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editChatWebsiteApp($event, $index)"
-                        >
-                          <span class="text-truncate" style="width: 200px"
-                            >{{app.appdata}}</span
-                          >
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editInterval($event, $index)"
-                        >
-                          {{app.IntervalId ? 'From List' : app.interval}}
-                        </td>
-                        <td md-cell>
-                          <md-button
-                            ng-click="vm_ac.editInterval($event, $index)"
-                            class="md-icon-button"
-                            aria-label="Interval"
-                          >
-                            <md-icon md-font-icon="icon-timer"></md-icon>
-                            <md-tooltip>
-                              {{app.IntervalId ? 'From List' : (app.interval ===
-                              '*,*,*,*' ? 'Always' : 'Custom')}}
-                            </md-tooltip>
-                          </md-button>
-                        </td>
-                        <td
-                          md-cell
-                          class="actions"
-                          ng-if="!vm_ac.crudPermissions.readOnly"
-                        >
-                          <md-menu>
-                            <md-button
-                              class="md-icon-button"
-                              aria-label="More"
-                              translate
-                              translate-attr-aria-label="VOICE.MORE"
-                              ng-click="$mdOpenMenu($event)"
-                            >
-                              <md-icon
-                                md-font-icon="icon-dots-vertical"
-                              ></md-icon>
-                            </md-button>
-
-                            <md-menu-content width="3">
-                              <md-menu-item
-                                ng-if="vm_ac.crudPermissions.canEdit"
-                              >
-                                <md-button
-                                  ng-click="vm_ac.editChatWebsiteApp($event, $index)"
-                                  translate="VOICE.EDIT_APP"
-                                >
-                                  Edit App
-                                </md-button>
-                              </md-menu-item>
-                              <md-menu-item
-                                ng-if="vm_ac.crudPermissions.canEdit"
-                              >
-                                <md-button
-                                  ng-click="vm_ac.editInterval($event, $index)"
-                                  translate="VOICE.EDIT_INTERVAL"
-                                >
-                                  Edit Interval
-                                </md-button>
-                              </md-menu-item>
-                              <md-menu-item
-                                ng-if="vm_ac.crudPermissions.canDelete"
-                              >
-                                <md-button
-                                  ng-click="vm_ac.deleteConfirm(app, $index, $event)"
-                                  translate="VOICE.DELETE_APP"
-                                >
-                                  Delete App
-                                </md-button>
-                              </md-menu-item>
-                            </md-menu-content>
-                          </md-menu>
-                        </td>
-                      </tr>
-                      <tr md-row ng-hide="vm_ac.chatWebsiteApps.rows.length">
-                        <td md-cell colspan="7">
-                          <span
-                            class="text-boxed-light"
-                            translate="VOICE.NO_APPS_AVAILABLE"
-                            >No apps available</span
-                          >
-                        </td>
-                      </tr>
-                    </tbody>
-                  </table>
-                </md-table-container>
-                <!-- / QUEUES TABLE -->
-
-                <!-- NO RESULTS -->
-
-                <!-- / NO RESULTS -->
-              </div>
-              <!-- / MAIN -->
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="CHAT.INTERACTIONS">INTERACTIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="chatWebsite-detail-form-container interactions md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="ChatWebsiteInteractionsController as vm_dc"
-              ng-init="vm_dc.init(vm.chatWebsite, vm.crudPermissions)"
-            >
-              <md-toolbar
-                class="md-table-toolbar md-default"
-                ng-hide="vm_dc.selectedChatWebsiteInteractions.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead" translate="CHAT.INTERACTIONS"
-                    >Interactions</span
-                  >
-                  <ms-search-bar
-                    on-search="vm_dc.query.filter = query"
-                    on-collapse="vm_dc.query.filter = undefined"
-                    debounce="300"
-                    direction="down"
-                  ></ms-search-bar>
-                  <div flex></div>
-                  <ms-quick-filter
-                    filters="vm_dc.quickFilters"
-                    query="vm_dc.query"
-                    search="vm_dc.getChatWebsiteInteractions()"
-                  ></ms-quick-filter>
-                  <div layout="column">
-                    <md-button
-                      class="md-icon-button advanced-search"
-                      ng-class="{ 'md-fab md-mini md-accent-bg': vm_dc.query.search }"
-                      aria-label="Filter"
-                      translate
-                      translate-attr-aria-label="DASHBOARDS.FILTER"
-                      ng-click="vm_dc.openAdvancedSearch()"
-                    >
-                      <md-icon
-                        md-font-icon="{{ vm_dc.query.search ? 'icon-filter' : 'icon-filter-outline' }}"
-                        ng-class="{ 'blink': vm_dc.query.search }"
-                      ></md-icon>
-                    </md-button>
-                  </div>
-                  <md-button
-                    class="md-icon-button"
-                    ng-click="vm_dc.getChatWebsiteInteractions()"
-                    aria-label="refresh Interactions"
-                    translate
-                    translate-attr-label="CHAT.REFRESH_INTERACTIONS"
-                  >
-                    <md-icon md-font-icon="icon-refresh"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-toolbar
-                class="md-table-toolbar md-accent"
-                ng-show="vm_dc.selectedChatWebsiteInteractions.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead"
-                    >{{vm_dc.selectedChatWebsiteInteractions.length}}
-                    {{vm_dc.selectedChatWebsiteInteractions.length > 1 ? 'items'
-                    : 'item'}} selected</span
-                  >
-                  <div flex></div>
-                  <button
-                    class="md-icon-button"
-                    ng-csv="vm_dc.exportSelectedChatWebsiteInteractions"
-                    csv-label="true"
-                    filename="chatWebsites.csv"
-                  >
-                    <md-icon md-font-icon="icon-file-excel"></md-icon>
-                  </button>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canDelete"
-                    class="md-icon-button"
-                    ng-click="vm_dc.deleteSelectedChatWebsiteInteractions($event)"
-                    aria-label="delete selected"
-                    translate
-                    translate-attr-label="CHAT.DELETE_SELECTED"
-                  >
-                    <md-icon md-font-icon="icon-delete"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-table-container class="font-size-12">
-                <table
-                  md-table
-                  md-row-select
-                  multiple
-                  ng-model="vm_dc.selectedChatWebsiteInteractions"
-                  md-progress="vm_dc.promise"
-                >
-                  <thead
-                    md-head
-                    md-order="vm_dc.query.sort"
-                    md-on-reorder="vm_dc.getChatWebsiteInteractions"
-                  >
-                    <tr md-row>
-                      <th md-column md-order-by="id">
-                        {{ 'CHAT.ID' | translate }}
-                      </th>
-                      <th md-column class="no-padding">
-                        <md-icon md-font-icon="icon-eye" class="s16"></md-icon>
-                      </th>
-                      <th md-column class="no-padding"></th>
-                      <th md-column class="no-padding"></th>
-                      <th md-column>{{ 'CHAT.CONTACT' | translate }}</th>
-                      <th md-column md-order-by="createdAt">
-                        {{ 'CHAT.STARTEDAT' | translate }}
-                      </th>
-                      <th md-column md-order-by="lastMsgAt">
-                        {{ 'CHAT.LASTMESSAGE' | translate }}
-                      </th>
-                      <th md-column md-order-by="closed">
-                        {{ 'CHAT.STATUS' | translate }}
-                      </th>
-                      <th md-column>{{ 'CHAT.AGENT' | translate }}</th>
-                      <th md-column md-order-by="tag">
-                        {{ 'CHAT.TAGS' | translate }}
-                      </th>
-                      <th md-column width="10px"></th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr
-                      md-row
-                      md-select="interaction"
-                      md-select-id="id"
-                      ng-repeat="interaction in vm_dc.chatWebsiteInteractions.rows"
-                      ng-class="{'text-bold text-italic': interaction.unreadMessages > 0}"
-                    >
-                      <td md-cell>{{interaction.id}}</td>
-                      <td md-cell class="no-padding">
-                        <div
-                          ng-if="!interaction.closed && interaction.Users.length"
-                        >
-                          <md-icon
-                            md-font-icon="icon-eye"
-                            class="s16"
-                          ></md-icon>
-                          <md-tooltip>
-                            <span ng-repeat="user in interaction.Users"
-                              >{{ user.fullname | translate }}
-                              <span ng-if="!$last">, </span>
-                            </span>
-                          </md-tooltip>
-                        </div>
-                      </td>
-                      <td md-cell class="no-padding">
-                        <div
-                          ng-if="interaction.unreadMessages > 0"
-                          layout="row"
-                          layout-align="start center"
-                        >
-                          <span
-                            class="badge white-fg md-primary-bg"
-                            layout-margin
-                            >{{ interaction.unreadMessages}}</span
-                          >
-                        </div>
-                      </td>
-                      <td md-cell class="no-padding">
-                        <div ng-if="interaction.attach">
-                          <md-icon
-                            md-font-icon="icon-paperclip"
-                            class="s16"
-                          ></md-icon>
-                        </div>
-                      </td>
-                      <td md-cell>
-                        <div layout="column" layout-align="start start">
-                          <span
-                            class="font-size-12 text-truncate contact-text"
-                            ng-class="{'margin-bottom-0' : interaction.contactInfo}"
-                            layout-margin
-                            >{{ interaction.contactName }}</span
-                          >
-                          <span
-                            ng-if="interaction.contactInfo"
-                            class="font-size-12 text-truncate contact-text margin-top-0"
-                            layout-margin
-                            >{{ interaction.contactInfo }}</span
-                          >
-                        </div>
-                      </td>
-                      <td md-cell>{{ interaction.createdAt | formatdate }}</td>
-                      <td md-cell>
-                        <div layout="row">
-                          <span>
-                            <md-icon
-                              md-font-icon="{{interaction.lastMsgDirection == 'in' ? 'icon-arrow-down-bold blue-grey-800-fg' : 'icon-arrow-up-bold blue-grey-300-fg'}}"
-                            ></md-icon>
-                          </span>
-                          <div layout="column" layout-align="center center">
-                            <span class="text-truncate"
-                              >{{ interaction.lastMsgAt | formatdate }}</span
-                            >
-                          </div>
-                        </div>
-                      </td>
-                      <td md-cell>
-                        <span ng-if="interaction.closed === 0" class="green-fg">
-                          {{ 'CHAT.OPENED' | translate }}
-                          <span ng-if="interaction.substatus">
-                            - {{ interaction.substatus }}
-                          </span>
-                        </span>
-                        <span ng-if="interaction.closed === 1" class="red-fg">
-                          {{ 'CHAT.CLOSED' | translate }}
-                          <span ng-if="interaction.disposition">
-                            - {{ interaction.thirdDisposition ||
-                            interaction.secondDisposition ||
-                            interaction.disposition }}
-                          </span>
-                          <md-tooltip class="multiline">
-                            <div layout="column">
-                              <div layout="column">
-                                <span
-                                  >{{ 'DASHBOARDS.CLOSED_AT' |
-                                  translate}}:</span
-                                >
-                                <span class="text-bold"
-                                  >{{ interaction.closedAt | formatdate }}</span
-                                >
-                              </div>
-                              <div
-                                ng-if="interaction.disposition"
-                                layout="column"
-                              >
-                                <span
-                                  >{{ 'DASHBOARDS.DISPOSITION' |
-                                  translate}}:</span
-                                >
-                                <span class="text-bold"
-                                  >{{ interaction.disposition }}</span
-                                >
-                              </div>
-                              <div
-                                ng-if="interaction.secondDisposition"
-                                layout="column"
-                              >
-                                <span
-                                  >{{ 'DASHBOARDS.SECOND_LEVEL_DISPOSITION' |
-                                  translate}}:</span
-                                >
-                                <span class="text-bold"
-                                  >{{ interaction.secondDisposition }}</span
-                                >
-                              </div>
-                              <div
-                                ng-if="interaction.thirdDisposition"
-                                layout="column"
-                              >
-                                <span
-                                  >{{ 'DASHBOARDS.THIRD_LEVEL_DISPOSITION' |
-                                  translate}}:</span
-                                >
-                                <span class="text-bold"
-                                  >{{ interaction.thirdDisposition }}</span
-                                >
-                              </div>
-                            </div>
-                          </md-tooltip>
-                        </span>
-                      </td>
-
-                      <td md-cell>{{interaction.Owner.name}}</td>
-                      <td md-cell>
-                        <div ng-if="interaction.Tags.length">
-                          <md-tooltip md-direction="left" layout="row">
-                            <span ng-repeat="tag in interaction.Tags"
-                              >{{tag.name}}<span ng-if="!$last">, </span></span
-                            >
-                          </md-tooltip>
-                          <md-icon
-                            md-font-icon="icon-tag"
-                            ng-style="{'color': interaction.Tags.length == 1 && interaction.Tags[0].color }"
-                          >
-                          </md-icon>
-                        </div>
-                      </td>
-                      <td md-cell class="actions">
-                        <md-menu>
-                          <md-button
-                            class="md-icon-button"
-                            aria-label="More"
-                            translate
-                            translate-attr-aria-label="CHAT.MORE"
-                            ng-click="$mdOpenMenu($event)"
-                          >
-                            <md-icon
-                              md-font-icon="icon-dots-vertical"
-                            ></md-icon>
-                          </md-button>
-
-                          <md-menu-content width="3">
-                            <md-menu-item>
-                              <md-button
-                                ng-click="vm_dc.spychatInteraction($event, interaction)"
-                                translate="CHAT.SPYINTERACTION"
-                              >
-                                Spy Interaction
-                              </md-button>
-                            </md-menu-item>
-                            <md-menu-item>
-                              <md-button
-                                class="md-primary"
-                                ng-click="vm_dc.chatInteractionDownload(interaction, $event, true)"
-                                translate="CHAT.DOWNLOAD_WITH_ATTACHMENTS"
-                              >
-                                Download with attachments
-                              </md-button>
-                            </md-menu-item>
-                            <md-menu-item>
-                              <md-button
-                                class="md-primary"
-                                ng-click="vm_dc.chatInteractionDownload(interaction, $event)"
-                                translate="CHAT.DOWNLOAD_WITHOUT_ATTACHMENTS"
-                              >
-                                Download without attachments
-                              </md-button>
-                            </md-menu-item>
-                            <md-menu-item
-                              ng-if="vm_dc.crudPermissions.canDelete"
-                            >
-                              <md-button
-                                ng-click="vm_dc.deleteConfirm(interaction, $event)"
-                                translate="CHAT.DELETE_INTERACTION"
-                              >
-                                Delete Interaction
-                              </md-button>
-                            </md-menu-item>
-                          </md-menu-content>
-                        </md-menu>
-                      </td>
-                    </tr>
-                    <tr
-                      md-row
-                      ng-if="!vm_dc.chatWebsiteInteractions.rows.length"
-                    >
-                      <td md-cell colspan="12">
-                        <div layout="row" layout-align="center center">
-                          <span
-                            class="text-boxed-light"
-                            translate="CHAT.NO_INTERACTION_AVAILABLE"
-                            >No interaction available</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-              <md-table-pagination
-                md-label="{page: '{{'CHAT.PAGE' | translate}}:', rowsPerPage: '{{'CHAT.ROWSPERPAGE' | translate}}:', of: '{{'CHAT.OF' | translate}}'}"
-                md-limit="vm_dc.query.limit"
-                md-limit-options="[10, 15, 20, 50, 100, 250]"
-                md-page="vm_dc.query.page"
-                md-total="{{vm_dc.chatWebsiteInteractions.count}}"
-                md-on-paginate="vm_dc.getChatWebsiteInteractions"
-                md-page-select
-              ></md-table-pagination>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="CHAT.OFFLINEMESSAGES">OFFLINEMESSAGES</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="chatWebsite-detail-form-container offlinemessages md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="ChatWebsiteOfflineMessagesController as vm_dc"
-              ng-init="vm_dc.init(vm.chatWebsite, vm.crudPermissions)"
-            >
-              <md-toolbar
-                class="md-table-toolbar md-default"
-                ng-hide="vm_dc.selectedChatWebsiteOfflineMessages.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead" translate="CHAT.OFFLINEMESSAGES"
-                    >OfflineMessages</span
-                  >
-                  <ms-search-bar
-                    on-search="vm_dc.query.filter = query"
-                    on-collapse="vm_dc.query.filter = undefined"
-                    debounce="300"
-                    direction="down"
-                  ></ms-search-bar>
-                  <div flex></div>
-                </div>
-              </md-toolbar>
-              <md-toolbar
-                class="md-table-toolbar md-accent"
-                ng-show="vm_dc.selectedChatWebsiteOfflineMessages.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead"
-                    >{{vm_dc.selectedChatWebsiteOfflineMessages.length}}
-                    {{vm_dc.selectedChatWebsiteOfflineMessages.length > 1 ?
-                    'items' : 'item'}} selected</span
-                  >
-                  <div flex></div>
-                  <button
-                    class="md-icon-button"
-                    ng-csv="vm_dc.exportSelectedChatWebsiteOfflineMessages"
-                    csv-label="true"
-                    filename="chatWebsites.csv"
-                  >
-                    <md-icon md-font-icon="icon-file-excel"></md-icon>
-                  </button>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canDelete"
-                    class="md-icon-button"
-                    ng-click="vm_dc.deleteSelectedChatWebsiteOfflineMessages($event)"
-                    aria-label="delete selected"
-                    translate
-                    translate-attr-label="CHAT.DELETE_SELECTED"
-                  >
-                    <md-icon md-font-icon="icon-delete"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-table-container class="font-size-12">
-                <table
-                  md-table
-                  md-row-select
-                  multiple
-                  ng-model="vm_dc.selectedChatWebsiteOfflineMessages"
-                  md-progress="vm_dc.promise"
-                >
-                  <thead
-                    md-head
-                    md-order="vm_dc.query.sort"
-                    md-on-reorder="vm_dc.getChatWebsiteOfflineMessages"
-                  >
-                    <tr md-row>
-                      <th md-column md-order-by="id">
-                        {{ 'CHAT.ID' | translate }}
-                      </th>
-                      <th md-column>{{ 'CHAT.CONTACT' | translate }}</th>
-                      <th md-column md-order-by="createdAt">
-                        {{ 'CHAT.CREATED_AT' | translate }}
-                      </th>
-                      <th md-column width="10px"></th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr
-                      md-row
-                      md-select="offlineMessage"
-                      md-select-id="id"
-                      ng-repeat="offlineMessage in vm_dc.chatWebsiteOfflineMessages.rows"
-                    >
-                      <td md-cell>{{offlineMessage.id}}</td>
-                      <td md-cell>{{offlineMessage.Contact.firstName}}</td>
-                      <td md-cell>
-                        {{ offlineMessage.createdAt | formatdate }}
-                      </td>
-                      <td md-cell class="actions">
-                        <md-menu>
-                          <md-button
-                            class="md-icon-button"
-                            aria-label="More"
-                            translate
-                            translate-attr-aria-label="CHAT.MORE"
-                            ng-click="$mdOpenMenu($event)"
-                          >
-                            <md-icon
-                              md-font-icon="icon-dots-vertical"
-                            ></md-icon>
-                          </md-button>
-
-                          <md-menu-content width="3">
-                            <md-menu-item>
-                              <md-button
-                                ng-click="vm_dc.showOfflineMessageChatWebsiteOfflineMessage($event, offlineMessage)"
-                                translate="CHAT.SHOW_OFFLINEMESSAGE"
-                              >
-                                SHOW OfflineMessage
-                              </md-button>
-                            </md-menu-item>
-                            <md-menu-item
-                              ng-if="vm_dc.crudPermissions.canDelete"
-                            >
-                              <md-button
-                                ng-click="vm_dc.deleteConfirm(offlineMessage, $event)"
-                                translate="CHAT.DELETE_OFFLINEMESSAGE"
-                              >
-                                Delete OfflineMessage
-                              </md-button>
-                            </md-menu-item>
-                          </md-menu-content>
-                        </md-menu>
-                      </td>
-                    </tr>
-                    <tr
-                      md-row
-                      ng-if="!vm_dc.chatWebsiteOfflineMessages.rows.length"
-                    >
-                      <td md-cell colspan="5">
-                        <div layout="row" layout-align="center center">
-                          <span
-                            class="text-boxed-light"
-                            translate="CHAT.NO_OFFLINEMESSAGE_AVAILABLE"
-                            >No offlinemessage available</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-              <md-table-pagination
-                md-label="{page: '{{'CHAT.PAGE' | translate}}:', rowsPerPage: '{{'CHAT.ROWSPERPAGE' | translate}}:', of: '{{'CHAT.OF' | translate}}'}"
-                md-limit="vm_dc.query.limit"
-                md-limit-options="[10, 15, 20, 50, 100, 250]"
-                md-page="vm_dc.query.page"
-                md-total="{{vm_dc.chatWebsiteOfflineMessages.count}}"
-                md-on-paginate="vm_dc.getChatWebsiteOfflineMessages"
-                md-page-select
-              ></md-table-pagination>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/view.html/view.html b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/view.html/view.html
new file mode 100644
index 0000000..ecbe469
--- /dev/null
+++ b/public/src/js/modules/main/apps/chat/views/chatWebsites/edit/view.html/view.html
@@ -0,0 +1,4540 @@
+<div id="chat-chatWebsite" class="page-layout simple tabbed" layout="column">
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-chatWebsites-button md-icon-button"
+        aria-label="Go to chatWebsites"
+        ng-click="vm.gotoChatWebsites()"
+        translate
+        translate-attr-aria-label="CHAT.GO_TO_CHATWEBSITES"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="chatWebsite-image" hide-xs>
+          <img ng-src="assets/images/business/chatWebsites.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.chatWebsite.id}}
+            <span ng-if="vm.chatWebsite.name">{{vm.chatWebsite.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="CHAT.CREATED_AT"></span>
+            <span>{{vm.chatWebsite.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.agentadddialog(vm.chatWebsite, $event)"
+        class="md-fab md-warn md-icon-button"
+        aria-label="agentadd"
+      >
+        <md-tooltip
+          ><span translate="CHAT.AGENTADD_CHATWEBSITE"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
+      </md-button>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveChatWebsite()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        translate="CHAT.SAVE"
+        translate-attr-aria-label="CHAT.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="CHAT.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="chatWebsite-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="CHAT.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="CHAT.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.chatWebsite.name"
+                  ng-required="true"
+                  autofocus
+                  disabled
+                />
+
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CHAT.KEY">key</label>
+                <input
+                  type="text"
+                  name="key"
+                  ng-model="vm.chatWebsite.key"
+                  md-maxlength="5"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['key'].$error"
+                  ng-show="generalForm['key'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.KEY_REQUIRED"
+                      >key field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="CHAT.ERRORS.KEY_MAX_LENGTH"
+                      translate-values="{max: 5}"
+                      >key must have a maximum length equal to 5</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CHAT.MOTIONADDRESS">MotionAddress</label>
+                <input
+                  type="url"
+                  name="address"
+                  ng-model="vm.chatWebsite.address"
+                  md-maxlength="255"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['address'].$error"
+                  ng-show="generalForm['address'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.MOTIONADDRESS_REQUIRED"
+                      >MotionAddress field is required</span
+                    >
+                  </div>
+                  <div ng-message="url">
+                    <span translate="CHAT.ERRORS.MOTIONADDRESS_MUST_VALID_URL"
+                      >MotionAddress must be a valid url
+                      http://www.xcally.com</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="CHAT.ERRORS.MOTIONADDRESS_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >MotionAddress must have a maximum length equal to
+                      255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CHAT.LIST">List</label>
+                <md-select
+                  name="ListId"
+                  ng-model="vm.chatWebsite.ListId"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="ListId.id"
+                    ng-repeat="ListId in vm.lists"
+                    ng-disabled="ListId.canSelect === false"
+                    >{{ ListId.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint"><span translate="CHAT.HELP.LIST"></span></div>
+                <div
+                  ng-messages="generalForm['ListId'].$error"
+                  ng-show="generalForm['ListId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.LIST_REQUIRED"
+                      >List field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.chatWebsite.fidelity"
+                class="md-block"
+              >
+                <label translate="CHAT.TIMEOUT">Timeout</label>
+                <input
+                  type="number"
+                  name="timeout"
+                  ng-model="vm.chatWebsite.timeout"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['timeout'].$error"
+                  ng-show="generalForm['timeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.TIMEOUT_REQUIRED"
+                      >Timeout field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CHAT.WAITFORTHEASSIGNEDAGENT"
+                  >WaitForTheAssignedAgent</label
+                >
+                <input
+                  type="number"
+                  name="waitForTheAssignedAgent"
+                  ng-model="vm.chatWebsite.waitForTheAssignedAgent"
+                  min="1"
+                  max="2147483"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['waitForTheAssignedAgent'].$error"
+                  ng-show="generalForm['waitForTheAssignedAgent'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="CHAT.ERRORS.WAITFORTHEASSIGNEDAGENT_REQUIRED"
+                      >WaitForTheAssignedAgent field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="CHAT.ERRORS.WAITFORTHEASSIGNEDAGENT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >WaitForTheAssignedAgent must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="CHAT.ERRORS.WAITFORTHEASSIGNEDAGENT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >WaitForTheAssignedAgent must be a valid greater or equal
+                      than</span
+                    >
+                    <span>2147483</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CHAT.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.chatWebsite.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="chatWebsite-detail-form-container notification md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="CHAT.NOTIFICATION">
+                NOTIFICATION
+              </div>
+            </div>
+            <form name="notificationForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.chatWebsite.notificationSound"
+                  aria-label="notificationSound"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="CHAT.NOTIFICATIONSOUND"
+                    >notificationSound</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.chatWebsite.notificationShake"
+                  aria-label="notificationShake"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="CHAT.NOTIFICATIONSHAKE"
+                    >notificationShake</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <div class="md-block">
+                <label
+                  class="md-caption grey-fg"
+                  translate="CHAT.NOTIFICATIONTEMPLATE"
+                  >notificationTemplate</label
+                >
+                <textarea
+                  aria-label="notificationTemplate notificationTemplate"
+                  ckeditor="{ skin: 'office2013', language: 'en', allowedContent: true, extraPlugins: 'font,colorbutton,autoembed,autocorrect,googlethisterm,pastebase64', toolbarGroups: [{ name: 'styles', groups: ['styles'] }, { name: 'clipboard', groups: ['undo'] }, { name: 'colors', groups: ['colors'] }, { name: 'basicstyles', groups: ['basicstyles'] }, { name: 'paragraph', groups: ['list', 'indent', 'align'] }, { name: 'mode' }], autocorrect_enabled: true, disableNativeSpellChecker: false, fontSize_sizes: '8/8pt;9/9pt;10/10pt;11/11pt;12/12pt;14/14pt;16/16pt;18/18pt;20/20pt;22/22pt;24/24pt;26/26pt;28/28pt;36/36pt;48/48pt;72/72pt',  removePlugins: 'magicline' }"
+                  ng-model="vm.chatWebsite.notificationTemplate"
+                ></textarea>
+              </div>
+            </form>
+          </div>
+          <div
+            class="chatWebsite-detail-form-container transfer md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="CHAT.TRANSFER">
+                TRANSFER
+              </div>
+            </div>
+            <form name="transferForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.chatWebsite.queueTransfer"
+                  aria-label="queueTransfer"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="CHAT.QUEUETRANSFER"
+                    >queueTransfer</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.chatWebsite.queueTransfer == true"
+                class="md-block"
+              >
+                <label translate="CHAT.QUEUETRANSFERTIMEOUT"
+                  >queueTransferTimeout</label
+                >
+                <input
+                  type="number"
+                  name="queueTransferTimeout"
+                  ng-model="vm.chatWebsite.queueTransferTimeout"
+                  min="1"
+                  max="2147483"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="transferForm['queueTransferTimeout'].$error"
+                  ng-show="transferForm['queueTransferTimeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.QUEUETRANSFERTIMEOUT_REQUIRED"
+                      >queueTransferTimeout field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="CHAT.ERRORS.QUEUETRANSFERTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >queueTransferTimeout must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="CHAT.ERRORS.QUEUETRANSFERTIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >queueTransferTimeout must be a valid greater or equal
+                      than</span
+                    >
+                    <span>2147483</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.chatWebsite.agentTransfer"
+                  aria-label="agentTransfer"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="CHAT.AGENTTRANSFER"
+                    >agentTransfer</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.chatWebsite.agentTransfer == true"
+                class="md-block"
+              >
+                <label translate="CHAT.AGENTTRANSFERTIMEOUT"
+                  >agentTransferTimeout</label
+                >
+                <input
+                  type="number"
+                  name="agentTransferTimeout"
+                  ng-model="vm.chatWebsite.agentTransferTimeout"
+                  min="1"
+                  max="2147483"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="transferForm['agentTransferTimeout'].$error"
+                  ng-show="transferForm['agentTransferTimeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.AGENTTRANSFERTIMEOUT_REQUIRED"
+                      >agentTransferTimeout field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="CHAT.ERRORS.AGENTTRANSFERTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >agentTransferTimeout must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="CHAT.ERRORS.AGENTTRANSFERTIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >agentTransferTimeout must be a valid greater or equal
+                      than</span
+                    >
+                    <span>2147483</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="CHAT.ADVANCED">ADVANCED</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="chatWebsite-detail-form-container script md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="ChatWebsiteScriptController as vm_ac"
+              ng-init="vm_ac.init(vm.chatWebsite)"
+              class="content"
+              md-background-bg
+            >
+              <div class="pb-16" layout="row" layout-align="start center">
+                <div class="h2 secondary-text" translate="CHAT.SCRIPT">
+                  SCRIPT
+                </div>
+              </div>
+
+              <form name="scriptForm" flex="100" novalidate>
+                <md-input-container class="md-block">
+                  <label translate="CHAT.TOKEN">Token</label>
+                  <input
+                    type="text"
+                    name="token"
+                    ng-model="vm_ac.chatWebsite.token"
+                    autofocus
+                    ng-disabled="true"
+                  />
+                </md-input-container>
+                <md-input-container class="md-block">
+                  <label translate="CHAT.MOTIONPROXY">MotionProxy</label>
+                  <input
+                    type="url"
+                    name="remote"
+                    ng-model="vm_ac.chatWebsite.remote"
+                    required
+                  />
+                  <div class="hint">
+                    <span translate="CHAT.HELP.MOTIONPROXY"></span>
+                  </div>
+                  <div
+                    ng-messages="scriptForm['remote'].$error"
+                    ng-show="scriptForm['remote'].$touched"
+                    role="alert"
+                  >
+                    <div ng-message="required">
+                      <span translate="CHAT.ERRORS.MOTIONPROXY_REQUIRED"
+                        >Motion Proxy field is required</span
+                      >
+                    </div>
+                    <div ng-message="url">
+                      <span translate="CHAT.ERRORS.MOTIONPROXY_MUST_VALID_URL"
+                        >Motion Proxy must be a valid url e.g.:
+                        http://www.xcally.com</span
+                      >
+                    </div>
+                  </div>
+                </md-input-container>
+                <md-input-container class="md-block">
+                  <label translate="CHAT.WEBSITESCRIPT">WebsiteScript</label>
+                  <div>
+                    <pre style="font-size: 13px">
+            {{vm_ac.start}} {{vm_ac.script}} {{vm_ac.end}}
+          </pre
+                    >
+                  </div>
+                  <div class="hint">
+                    <span translate="CHAT.HELP.COPYSCRIPTTOCLIPBOARD"></span>
+                  </div>
+                </md-input-container>
+              </form>
+            </div>
+          </div>
+          <div
+            class="chatWebsite-detail-form-container interval md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="CHAT.INTERVAL">
+                INTERVAL
+              </div>
+            </div>
+            <form name="intervalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="CHAT.INTERVAL">Interval</label>
+                <md-select
+                  name="IntervalId"
+                  ng-model="vm.chatWebsite.IntervalId"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="null">Always</md-option>
+                  <md-option
+                    ng-value="IntervalId.id"
+                    ng-repeat="IntervalId in vm.interval"
+                    ng-disabled="IntervalId.canSelect === false"
+                    >{{ IntervalId.name }}</md-option
+                  >
+                </md-select>
+                <div
+                  ng-messages="intervalForm['IntervalId'].$error"
+                  ng-show="intervalForm['IntervalId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.INTERVAL_REQUIRED"
+                      >Interval field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CHAT.TIMEZONE">Timezone</label>
+                <ms-timezone
+                  name="timezone"
+                  ng-model="vm.chatWebsite.timezone"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                ></ms-timezone>
+                <div class="hint">
+                  <span translate="CHAT.HELP.TIMEZONE"></span>
+                </div>
+                <div
+                  ng-messages="intervalForm['timezone'].$error"
+                  ng-show="intervalForm[timezone].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.TIMEZONE_REQUIRED"
+                      >Timezone field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="chatWebsite-detail-form-container disposition md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="CHAT.DISPOSITION">
+                DISPOSITION
+              </div>
+            </div>
+            <form name="dispositionForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.chatWebsite.mandatoryDisposition"
+                  aria-label="MandatoryDisposition"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="CHAT.MANDATORYDISPOSITION"
+                    >MandatoryDisposition</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.chatWebsite.mandatoryDisposition"
+                class="md-block"
+              >
+                <label translate="CHAT.MANDATORYDISPOSITIONPAUSEID"
+                  >MandatoryDispositionPauseId</label
+                >
+                <md-select
+                  name="mandatoryDispositionPauseId"
+                  ng-model="vm.chatWebsite.mandatoryDispositionPauseId"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="mandatoryDispositionPauseId.id"
+                    ng-repeat="mandatoryDispositionPauseId in vm.pauses"
+                    ng-disabled="mandatoryDispositionPauseId.canSelect === false"
+                    >{{ mandatoryDispositionPauseId.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span
+                    translate="CHAT.HELP.MANDATORYDISPOSITIONPAUSEID"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="dispositionForm['mandatoryDispositionPauseId'].$error"
+                  ng-show="dispositionForm['mandatoryDispositionPauseId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="CHAT.ERRORS.MANDATORYDISPOSITIONPAUSEID_REQUIRED"
+                      >MandatoryDispositionPauseId field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="CHAT.SNIPPET">SNIPPET</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="chatWebsite-detail-form-container appearance md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="CHAT.APPEARANCE">
+                APPEARANCE
+              </div>
+            </div>
+            <form name="appearanceForm" novalidate>
+              <div
+                flex
+                md-color-picker
+                ng-model="vm.chatWebsite.color"
+                label="{{'CHAT.MAINCOLOR' | translate}}"
+                md-color-hex="true"
+                md-color-rgb="false"
+                md-color-hsl="false"
+                md-color-history="false"
+                md-color-material-palette="false"
+                md-color-alpha-channel="false"
+                open-on-input="true"
+              ></div>
+              <div
+                flex
+                md-color-picker
+                ng-model="vm.chatWebsite.color_button"
+                label="{{'CHAT.BUTTONCOLOR' | translate}}"
+                md-color-hex="true"
+                md-color-rgb="false"
+                md-color-hsl="false"
+                md-color-history="false"
+                md-color-material-palette="false"
+                md-color-alpha-channel="false"
+                open-on-input="true"
+              ></div>
+              <div
+                flex
+                md-color-picker
+                ng-model="vm.chatWebsite.textColor"
+                label="{{'CHAT.TEXTCOLOR' | translate}}"
+                md-color-hex="true"
+                md-color-rgb="false"
+                md-color-hsl="false"
+                md-color-history="false"
+                md-color-material-palette="false"
+                md-color-alpha-channel="false"
+                open-on-input="true"
+              ></div>
+              <div
+                flex
+                md-color-picker
+                ng-model="vm.chatWebsite.backgroundColor"
+                label="{{'CHAT.BACKGROUNDCOLOR' | translate}}"
+                md-color-hex="true"
+                md-color-rgb="false"
+                md-color-hsl="false"
+                md-color-history="false"
+                md-color-material-palette="false"
+                md-color-alpha-channel="false"
+                open-on-input="true"
+              ></div>
+              <md-input-container class="md-block">
+                <label translate="CHAT.FONTSIZE">fontSize</label>
+                <input
+                  type="number"
+                  name="fontSize"
+                  ng-model="vm.chatWebsite.fontSize"
+                  min="0"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="appearanceForm['fontSize'].$error"
+                  ng-show="appearanceForm['fontSize'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.FONTSIZE_REQUIRED"
+                      >fontSize field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="CHAT.ERRORS.FONTSIZE_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >fontSize must be a valid greater or equal than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CHAT.HEADERSHAPE">headershape</label>
+                <md-select
+                  name="header_shape"
+                  ng-model="vm.chatWebsite.header_shape"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'rounded'">
+                    {{ 'CHAT.ROUNDED' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'squared'">
+                    {{ 'CHAT.SQUARED' | translate }}
+                  </md-option>
+                </md-select>
+                <div
+                  ng-messages="appearanceForm['header_shape'].$error"
+                  ng-show="appearanceForm['header_shape'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.HEADERSHAPE_REQUIRED"
+                      >headershape field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.chatWebsite.showAgentAvatar"
+                  aria-label="ShowAgentAvatar"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="CHAT.SHOWAGENTAVATAR"
+                    >ShowAgentAvatar</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.chatWebsite.showCustomerAvatar"
+                  aria-label="showCustomerAvatar"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="CHAT.SHOWCUSTOMERAVATAR"
+                    >showCustomerAvatar</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CHAT.SNIPPETSWIPEOUT">snippetSwipeOut</label>
+                <md-select
+                  name="alignment"
+                  ng-model="vm.chatWebsite.alignment"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'bottom_right'">
+                    {{ 'CHAT.BOTTOM_RIGHT' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'right'">
+                    {{ 'CHAT.RIGHT' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'left'">
+                    {{ 'CHAT.LEFT' | translate }}
+                  </md-option>
+                </md-select>
+                <div
+                  ng-messages="appearanceForm['alignment'].$error"
+                  ng-show="appearanceForm['alignment'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.SNIPPETSWIPEOUT_REQUIRED"
+                      >snippetSwipeOut field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.chatWebsite.alignment !== 'bottom_right'"
+                class="md-block"
+              >
+                <label translate="CHAT.VERTICALPOSITION"
+                  >verticalPosition</label
+                >
+                <input
+                  type="number"
+                  name="verticalAlignment"
+                  ng-model="vm.chatWebsite.verticalAlignment"
+                  min="0"
+                  max="100"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="CHAT.HELP.VERTICALPOSITION"></span>
+                </div>
+                <div
+                  ng-messages="appearanceForm['verticalAlignment'].$error"
+                  ng-show="appearanceForm['verticalAlignment'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.VERTICALPOSITION_REQUIRED"
+                      >verticalPosition field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="CHAT.ERRORS.VERTICALPOSITION_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >verticalPosition must be a valid greater or equal
+                      than</span
+                    >
+                    <span>0</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="CHAT.ERRORS.VERTICALPOSITION_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >verticalPosition must be a valid greater or equal
+                      than</span
+                    >
+                    <span>100</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CHAT.MESSAGESALIGNMENT"
+                  >messagesAlignment</label
+                >
+                <md-select
+                  name="messagesAlignment"
+                  ng-model="vm.chatWebsite.messagesAlignment"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'alternate'">
+                    {{ 'CHAT.ALTERNATE' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'centered'">
+                    {{ 'CHAT.CENTERED' | translate }}
+                  </md-option>
+                </md-select>
+                <div
+                  ng-messages="appearanceForm['messagesAlignment'].$error"
+                  ng-show="appearanceForm['messagesAlignment'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.MESSAGESALIGNMENT_REQUIRED"
+                      >messagesAlignment field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CHAT.DEFAULTTITLE">defaultTitle</label>
+                <input
+                  type="text"
+                  name="defaultTitle"
+                  ng-model="vm.chatWebsite.defaultTitle"
+                  md-maxlength="255"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="appearanceForm['defaultTitle'].$error"
+                  ng-show="appearanceForm['defaultTitle'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.DEFAULTTITLE_REQUIRED"
+                      >defaultTitle field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="CHAT.ERRORS.DEFAULTTITLE_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >defaultTitle must have a maximum length equal to
+                      255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="chatWebsite-detail-form-container onlinestatus md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="CHAT.ONLINESTATUS">
+                ONLINESTATUS
+              </div>
+            </div>
+            <form name="onlinestatusForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="CHAT.HEADER_ONLINE">header_online</label>
+                <input
+                  type="text"
+                  name="header_online"
+                  ng-model="vm.chatWebsite.header_online"
+                  md-maxlength="255"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="onlinestatusForm['header_online'].$error"
+                  ng-show="onlinestatusForm['header_online'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.HEADER_ONLINE_REQUIRED"
+                      >header_online field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="CHAT.ERRORS.HEADER_ONLINE_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >header_online must have a maximum length equal to
+                      255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CHAT.START_CHAT_BUTTON"
+                  >start_chat_button</label
+                >
+                <input
+                  type="text"
+                  name="start_chat_button"
+                  ng-model="vm.chatWebsite.start_chat_button"
+                  md-maxlength="255"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="onlinestatusForm['start_chat_button'].$error"
+                  ng-show="onlinestatusForm['start_chat_button'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.START_CHAT_BUTTON_REQUIRED"
+                      >start_chat_button field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="CHAT.ERRORS.START_CHAT_BUTTON_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >start_chat_button must have a maximum length equal to
+                      255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="chatWebsite-detail-form-container offlinestatus md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="CHAT.OFFLINESTATUS">
+                OFFLINESTATUS
+              </div>
+            </div>
+            <form name="offlinestatusForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.chatWebsite.hideWhenOffline"
+                  aria-label="hideWhenOffline"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="CHAT.HIDEWHENOFFLINE"
+                    >hideWhenOffline</span
+                  ></md-switch
+                >
+
+                <div class="hint">
+                  <span translate="CHAT.HELP.HIDEWHENOFFLINE"></span>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CHAT.HEADER_OFFLINE">header_offline</label>
+                <input
+                  type="text"
+                  name="header_offline"
+                  ng-model="vm.chatWebsite.header_offline"
+                  md-maxlength="255"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="offlinestatusForm['header_offline'].$error"
+                  ng-show="offlinestatusForm['header_offline'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.HEADER_OFFLINE_REQUIRED"
+                      >header_offline field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="CHAT.ERRORS.HEADER_OFFLINE_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >header_offline must have a maximum length equal to
+                      255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CHAT.OFFLINE_CHAT_BUTTON"
+                  >offline_chat_button</label
+                >
+                <input
+                  type="text"
+                  name="offline_chat_button"
+                  ng-model="vm.chatWebsite.offline_chat_button"
+                  md-maxlength="255"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="offlinestatusForm['offline_chat_button'].$error"
+                  ng-show="offlinestatusForm['offline_chat_button'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.OFFLINE_CHAT_BUTTON_REQUIRED"
+                      >offline_chat_button field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="CHAT.ERRORS.OFFLINE_CHAT_BUTTON_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >offline_chat_button must have a maximum length equal to
+                      255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CHAT.OFFLINEMESSAGESUBJECT"
+                  >offlineMessageSubject</label
+                >
+                <input
+                  type="text"
+                  name="offlineMessageSubject"
+                  ng-model="vm.chatWebsite.offlineMessageSubject"
+                  md-maxlength="255"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="offlinestatusForm['offlineMessageSubject'].$error"
+                  ng-show="offlinestatusForm['offlineMessageSubject'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.OFFLINEMESSAGESUBJECT_REQUIRED"
+                      >offlineMessageSubject field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="CHAT.ERRORS.OFFLINEMESSAGESUBJECT_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >offlineMessageSubject must have a maximum length equal to
+                      255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CHAT.OFFLINEMESSAGEBODY"
+                  >offlineMessageBody</label
+                >
+                <input
+                  type="text"
+                  name="offlineMessageBody"
+                  ng-model="vm.chatWebsite.offlineMessageBody"
+                  md-maxlength="255"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="offlinestatusForm['offlineMessageBody'].$error"
+                  ng-show="offlinestatusForm['offlineMessageBody'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.OFFLINEMESSAGEBODY_REQUIRED"
+                      >offlineMessageBody field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="CHAT.ERRORS.OFFLINEMESSAGEBODY_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >offlineMessageBody must have a maximum length equal to
+                      255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="chatWebsite-detail-form-container closingform md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="CHAT.CLOSINGFORM">
+                CLOSINGFORM
+              </div>
+            </div>
+            <form name="closingformForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="CHAT.CLOSINGMESSAGE">closingMessage</label>
+                <textarea
+                  name="closingMessage"
+                  ng-model="vm.chatWebsite.closingMessage"
+                  md-maxlength="255"
+                  required
+                  autofocus
+                ></textarea>
+
+                <div
+                  ng-messages="closingformForm['closingMessage'].$error"
+                  ng-show="closingformForm['closingMessage'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.CLOSINGMESSAGE_REQUIRED"
+                      >closingMessage field is required</span
+                    >
+                  </div>
+
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="CHAT.ERRORS.CLOSINGMESSAGE_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >closingMessage must have a maximum length equal to
+                      255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CHAT.SKIPMESSAGEBUTTON"
+                  >skipMessageButton</label
+                >
+                <input
+                  type="text"
+                  name="skipMessageButton"
+                  ng-model="vm.chatWebsite.skipMessageButton"
+                  md-maxlength="255"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="closingformForm['skipMessageButton'].$error"
+                  ng-show="closingformForm['skipMessageButton'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.SKIPMESSAGEBUTTON_REQUIRED"
+                      >skipMessageButton field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="CHAT.ERRORS.SKIPMESSAGEBUTTON_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >skipMessageButton must have a maximum length equal to
+                      255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.chatWebsite.enableRating"
+                  aria-label="enableRating"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="CHAT.ENABLERATING"
+                    >enableRating</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.chatWebsite.enableRating"
+                class="md-block"
+              >
+                <label translate="CHAT.RATINGTYPE">ratingType</label>
+                <md-select
+                  name="ratingType"
+                  ng-model="vm.chatWebsite.ratingType"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'star'">Star</md-option>
+                  <md-option ng-value="'thumb'">Thumb</md-option>
+                </md-select>
+                <div
+                  ng-messages="closingformForm['ratingType'].$error"
+                  ng-show="closingformForm['ratingType'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.RATINGTYPE_REQUIRED"
+                      >ratingType field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.chatWebsite.enableRating && vm.chatWebsite.ratingType === 'star'"
+                class="md-block"
+              >
+                <label translate="CHAT.RATINGSTARSNUMBER"
+                  >ratingStarsNumber</label
+                >
+                <input
+                  type="number"
+                  name="ratingStarsNumber"
+                  ng-model="vm.chatWebsite.ratingStarsNumber"
+                  min="2"
+                  max="5"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="closingformForm['ratingStarsNumber'].$error"
+                  ng-show="closingformForm['ratingStarsNumber'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.RATINGSTARSNUMBER_REQUIRED"
+                      >ratingStarsNumber field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="CHAT.ERRORS.RATINGSTARSNUMBER_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >ratingStarsNumber must be a valid greater or equal
+                      than</span
+                    >
+                    <span>2</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="CHAT.ERRORS.RATINGSTARSNUMBER_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >ratingStarsNumber must be a valid greater or equal
+                      than</span
+                    >
+                    <span>5</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.chatWebsite.enableFeedback"
+                  aria-label="enableFeedback"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="CHAT.ENABLEFEEDBACK"
+                    >enableFeedback</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.chatWebsite.enableFeedback"
+                class="md-block"
+              >
+                <label translate="CHAT.FEEDBACKTITLE">feedbackTitle</label>
+                <input
+                  type="text"
+                  name="feedbackTitle"
+                  ng-model="vm.chatWebsite.feedbackTitle"
+                  md-maxlength="255"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="closingformForm['feedbackTitle'].$error"
+                  ng-show="closingformForm['feedbackTitle'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.FEEDBACKTITLE_REQUIRED"
+                      >feedbackTitle field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="CHAT.ERRORS.FEEDBACKTITLE_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >feedbackTitle must have a maximum length equal to
+                      255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.chatWebsite.forwardTranscript"
+                  aria-label="forwardTranscript"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="CHAT.FORWARDTRANSCRIPT"
+                    >forwardTranscript</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.chatWebsite.forwardTranscript"
+                class="md-block"
+              >
+                <label translate="CHAT.FORWARDTRANSCRIPTMESSAGE"
+                  >forwardTranscriptMessage</label
+                >
+                <input
+                  type="text"
+                  name="forwardTranscriptMessage"
+                  ng-model="vm.chatWebsite.forwardTranscriptMessage"
+                  md-maxlength="255"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="closingformForm['forwardTranscriptMessage'].$error"
+                  ng-show="closingformForm['forwardTranscriptMessage'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="CHAT.ERRORS.FORWARDTRANSCRIPTMESSAGE_REQUIRED"
+                      >forwardTranscriptMessage field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="CHAT.ERRORS.FORWARDTRANSCRIPTMESSAGE_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >forwardTranscriptMessage must have a maximum length equal
+                      to 255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CHAT.CLOSINGMESSAGEBUTTON"
+                  >closingMessageButton</label
+                >
+                <input
+                  type="text"
+                  name="closingMessageButton"
+                  ng-model="vm.chatWebsite.closingMessageButton"
+                  md-maxlength="255"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="closingformForm['closingMessageButton'].$error"
+                  ng-show="closingformForm['closingMessageButton'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.CLOSINGMESSAGEBUTTON_REQUIRED"
+                      >closingMessageButton field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="CHAT.ERRORS.CLOSINGMESSAGEBUTTON_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >closingMessageButton must have a maximum length equal to
+                      255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="chatWebsite-detail-form-container unmanagedstatus md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="CHAT.UNMANAGEDSTATUS">
+                UNMANAGEDSTATUS
+              </div>
+            </div>
+            <form name="unmanagedstatusForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.chatWebsite.autoclose"
+                  aria-label="autoclose"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="CHAT.AUTOCLOSE">autoclose</span></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.chatWebsite.enableUnmanagedNote"
+                  aria-label="enableUnmanagedNote"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="CHAT.ENABLEUNMANAGEDNOTE"
+                    >enableUnmanagedNote</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CHAT.UNMANAGEDMESSAGE"
+                  >unmanagedMessage</label
+                >
+                <input
+                  type="text"
+                  name="unmanagedMessage"
+                  ng-model="vm.chatWebsite.unmanagedMessage"
+                  md-maxlength="255"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="unmanagedstatusForm['unmanagedMessage'].$error"
+                  ng-show="unmanagedstatusForm['unmanagedMessage'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.UNMANAGEDMESSAGE_REQUIRED"
+                      >unmanagedMessage field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="CHAT.ERRORS.UNMANAGEDMESSAGE_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >unmanagedMessage must have a maximum length equal to
+                      255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CHAT.SKIPUNMANAGED">skipUnmanaged</label>
+                <input
+                  type="text"
+                  name="skipUnmanaged"
+                  ng-model="vm.chatWebsite.skipUnmanaged"
+                  md-maxlength="255"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="unmanagedstatusForm['skipUnmanaged'].$error"
+                  ng-show="unmanagedstatusForm['skipUnmanaged'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.SKIPUNMANAGED_REQUIRED"
+                      >skipUnmanaged field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="CHAT.ERRORS.SKIPUNMANAGED_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >skipUnmanaged must have a maximum length equal to
+                      255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.chatWebsite.enableUnmanagedNote"
+                class="md-block"
+              >
+                <label translate="CHAT.SENDUNMANAGED">sendUnmanaged</label>
+                <input
+                  type="text"
+                  name="sendUnmanaged"
+                  ng-model="vm.chatWebsite.sendUnmanaged"
+                  md-maxlength="255"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="unmanagedstatusForm['sendUnmanaged'].$error"
+                  ng-show="unmanagedstatusForm['sendUnmanaged'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.SENDUNMANAGED_REQUIRED"
+                      >sendUnmanaged field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="CHAT.ERRORS.SENDUNMANAGED_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >sendUnmanaged must have a maximum length equal to
+                      255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.chatWebsite.enableUnmanagedNote"
+                class="md-block"
+              >
+                <label translate="CHAT.NOTETITLE">noteTitle</label>
+                <input
+                  type="text"
+                  name="noteTitle"
+                  ng-model="vm.chatWebsite.noteTitle"
+                  md-maxlength="255"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="unmanagedstatusForm['noteTitle'].$error"
+                  ng-show="unmanagedstatusForm['noteTitle'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.NOTETITLE_REQUIRED"
+                      >noteTitle field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="CHAT.ERRORS.NOTETITLE_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >noteTitle must have a maximum length equal to 255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="chatWebsite-detail-form-container interaction md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="CHAT.INTERACTION">
+                INTERACTION
+              </div>
+            </div>
+            <form name="interactionForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="CHAT.AGENTIDENTIFIER">agentIdentifier</label>
+                <md-select
+                  name="agentIdentifier"
+                  ng-model="vm.chatWebsite.agentIdentifier"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'website_alias'">
+                    {{ 'CHAT.WEBSITEALIAS' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'agent_alias'">
+                    {{ 'CHAT.AGENTALIAS' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'agent_fullname'">
+                    {{ 'CHAT.AGENTFULLNAME' | translate }}
+                  </md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="CHAT.HELP.AGENTIDENTIFIER"></span>
+                </div>
+                <div
+                  ng-messages="interactionForm['agentIdentifier'].$error"
+                  ng-show="interactionForm['agentIdentifier'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.AGENTIDENTIFIER_REQUIRED"
+                      >agentIdentifier field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CHAT.CUSTOMERALIAS">customerAlias</label>
+                <input
+                  type="text"
+                  name="customerAlias"
+                  ng-model="vm.chatWebsite.customerAlias"
+                  md-maxlength="255"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="interactionForm['customerAlias'].$error"
+                  ng-show="interactionForm['customerAlias'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.CUSTOMERALIAS_REQUIRED"
+                      >customerAlias field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="CHAT.ERRORS.CUSTOMERALIAS_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >customerAlias must have a maximum length equal to
+                      255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CHAT.MESSAGEFONTSIZE">messageFontSize</label>
+                <input
+                  type="number"
+                  name="messageFontSize"
+                  ng-model="vm.chatWebsite.messageFontSize"
+                  min="0"
+                  max="20"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="interactionForm['messageFontSize'].$error"
+                  ng-show="interactionForm['messageFontSize'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.MESSAGEFONTSIZE_REQUIRED"
+                      >messageFontSize field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="CHAT.ERRORS.MESSAGEFONTSIZE_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >messageFontSize must be a valid greater or equal
+                      than</span
+                    >
+                    <span>0</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="CHAT.ERRORS.MESSAGEFONTSIZE_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >messageFontSize must be a valid greater or equal
+                      than</span
+                    >
+                    <span>20</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.chatWebsite.agentIdentifier === 'website_alias'"
+                class="md-block"
+              >
+                <label translate="CHAT.WEBSITEALIAS">WebsiteAlias</label>
+                <input
+                  type="text"
+                  name="agentAlias"
+                  ng-model="vm.chatWebsite.agentAlias"
+                  md-maxlength="255"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="CHAT.HELP.WEBSITEALIAS"></span>
+                </div>
+                <div
+                  ng-messages="interactionForm['agentAlias'].$error"
+                  ng-show="interactionForm['agentAlias'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.WEBSITEALIAS_REQUIRED"
+                      >WebsiteAlias field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="CHAT.ERRORS.WEBSITEALIAS_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >WebsiteAlias must have a maximum length equal to
+                      255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CHAT.CLOSINGQUESTION">closingQuestion</label>
+                <input
+                  type="text"
+                  name="closingQuestion"
+                  ng-model="vm.chatWebsite.closingQuestion"
+                  md-maxlength="255"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="interactionForm['closingQuestion'].$error"
+                  ng-show="interactionForm['closingQuestion'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.CLOSINGQUESTION_REQUIRED"
+                      >closingQuestion field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="CHAT.ERRORS.CLOSINGQUESTION_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >closingQuestion must have a maximum length equal to
+                      255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CHAT.FORMSUBMITSUCCESSMESSAGE"
+                  >formSubmitSuccessMessage</label
+                >
+                <input
+                  type="text"
+                  name="formSubmitSuccessMessage"
+                  ng-model="vm.chatWebsite.formSubmitSuccessMessage"
+                  md-maxlength="255"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="interactionForm['formSubmitSuccessMessage'].$error"
+                  ng-show="interactionForm['formSubmitSuccessMessage'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="CHAT.ERRORS.FORMSUBMITSUCCESSMESSAGE_REQUIRED"
+                      >formSubmitSuccessMessage field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="CHAT.ERRORS.FORMSUBMITSUCCESSMESSAGE_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >formSubmitSuccessMessage must have a maximum length equal
+                      to 255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CHAT.FORMSUBMITFAILUREMESSAGE"
+                  >formSubmitFailureMessage</label
+                >
+                <input
+                  type="text"
+                  name="formSubmitFailureMessage"
+                  ng-model="vm.chatWebsite.formSubmitFailureMessage"
+                  md-maxlength="255"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="interactionForm['formSubmitFailureMessage'].$error"
+                  ng-show="interactionForm['formSubmitFailureMessage'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="CHAT.ERRORS.FORMSUBMITFAILUREMESSAGE_REQUIRED"
+                      >formSubmitFailureMessage field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="CHAT.ERRORS.FORMSUBMITFAILUREMESSAGE_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >formSubmitFailureMessage must have a maximum length equal
+                      to 255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.chatWebsite.enableCustomerWriting"
+                  aria-label="enableCustomerWriting"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="CHAT.ENABLECUSTOMERWRITING"
+                    >enableCustomerWriting</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="!vm.chatWebsite.enableCustomerWriting"
+                class="md-block"
+              >
+                <label translate="CHAT.WAITINGTITLE">waitingTitle</label>
+                <input
+                  type="text"
+                  name="waitingTitle"
+                  ng-model="vm.chatWebsite.waitingTitle"
+                  md-maxlength="255"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="interactionForm['waitingTitle'].$error"
+                  ng-show="interactionForm['waitingTitle'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.WAITINGTITLE_REQUIRED"
+                      >waitingTitle field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="CHAT.ERRORS.WAITINGTITLE_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >waitingTitle must have a maximum length equal to
+                      255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="!vm.chatWebsite.enableCustomerWriting"
+                class="md-block"
+              >
+                <label translate="CHAT.WAITINGMESSAGE">waitingMessage</label>
+                <textarea
+                  name="waitingMessage"
+                  ng-model="vm.chatWebsite.waitingMessage"
+                  md-maxlength="255"
+                  required
+                ></textarea>
+
+                <div
+                  ng-messages="interactionForm['waitingMessage'].$error"
+                  ng-show="interactionForm['waitingMessage'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.WAITINGMESSAGE_REQUIRED"
+                      >waitingMessage field is required</span
+                    >
+                  </div>
+
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="CHAT.ERRORS.WAITINGMESSAGE_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >waitingMessage must have a maximum length equal to
+                      255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CHAT.PLACEHOLDERMESSAGE"
+                  >placeholderMessage</label
+                >
+                <input
+                  type="text"
+                  name="placeholderMessage"
+                  ng-model="vm.chatWebsite.placeholderMessage"
+                  md-maxlength="255"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="interactionForm['placeholderMessage'].$error"
+                  ng-show="interactionForm['placeholderMessage'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.PLACEHOLDERMESSAGE_REQUIRED"
+                      >placeholderMessage field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="CHAT.ERRORS.PLACEHOLDERMESSAGE_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >placeholderMessage must have a maximum length equal to
+                      255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.chatWebsite.download_transcript"
+                  aria-label="downloadTranscript"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="CHAT.DOWNLOADTRANSCRIPT"
+                    >downloadTranscript</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.chatWebsite.enableCustomerAttachment"
+                  aria-label="enableCustomerAttachment"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="CHAT.ENABLECUSTOMERATTACHMENT"
+                    >enableCustomerAttachment</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.chatWebsite.enableSendButton"
+                  aria-label="enableSendButton"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="CHAT.ENABLESENDBUTTON"
+                    >enableSendButton</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.chatWebsite.enableCustomerCheckmarks"
+                  aria-label="enableCustomerCheckmarks"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="CHAT.ENABLECUSTOMERCHECKMARKS"
+                    >enableCustomerCheckmarks</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CHAT.SYSTEMALIAS">systemAlias</label>
+                <input
+                  type="text"
+                  name="systemAlias"
+                  ng-model="vm.chatWebsite.systemAlias"
+                  md-maxlength="255"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="interactionForm['systemAlias'].$error"
+                  ng-show="interactionForm['systemAlias'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.SYSTEMALIAS_REQUIRED"
+                      >systemAlias field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="CHAT.ERRORS.SYSTEMALIAS_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >systemAlias must have a maximum length equal to 255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            ng-if="vm.license.custom"
+            class="chatWebsite-detail-form-container whitelabel md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="CHAT.WHITELABEL">
+                WHITELABEL
+              </div>
+            </div>
+            <form name="whitelabelForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.chatWebsite.defaultWhiteLabel"
+                  aria-label="default"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="CHAT.DEFAULT">default</span></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="!vm.chatWebsite.defaultWhiteLabel"
+                class="md-block"
+              >
+                <label translate="CHAT.WHITELABEL">whiteLabel</label>
+                <textarea
+                  name="whiteLabel"
+                  ng-model="vm.chatWebsite.whiteLabel"
+                  md-maxlength="255"
+                  required
+                ></textarea>
+
+                <div
+                  ng-messages="whitelabelForm['whiteLabel'].$error"
+                  ng-show="whitelabelForm['whiteLabel'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.WHITELABEL_REQUIRED"
+                      >whiteLabel field is required</span
+                    >
+                  </div>
+
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="CHAT.ERRORS.WHITELABEL_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >whiteLabel must have a maximum length equal to 255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            ng-if="vm.license.custom"
+            class="chatWebsite-detail-form-container logo md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="CHAT.LOGO">LOGO</div>
+            </div>
+            <div
+              ng-controller="ChatWebsitelogoController as vm_ca"
+              ng-init="vm_ca.init(vm.chatWebsite, vm.crudPermissions)"
+              class="chatWebsite-detail-form-container md-background-bg md-whiteframe-1dp"
+            >
+              <div
+                id="chatWebsite-image-uploader"
+                flow-init="vm_ca.ngFlowOptions"
+                flow-name="vm_ca.ngFlow.flow"
+                flow-files-submitted="vm_ca.upload()"
+                flow-file-added="vm_ca.fileAdded($file)"
+                flow-file-success="vm_ca.fileSuccess($file, $message)"
+                flow-complete="vm_ca.uploadComplete()"
+                flow-drop
+                flow-drag-enter="vm_ca.dropping=true"
+                flow-drag-leave="vm_ca.dropping=false"
+                ng-class="{'dropping':vm.dropping}"
+              >
+                <div
+                  class="drop-text hint-text"
+                  layout="row"
+                  layout-align="center center"
+                >
+                  <span translate="EC.DROP_TO_UPLOAD">Drop to upload</span>
+                </div>
+
+                <div
+                  class="upload-button"
+                  layout="column"
+                  layout-align="center center"
+                >
+                  <md-button
+                    class="md-accent md-raised"
+                    flow-btn
+                    ng-disabled="!vm_ca.crudPermissions.canEdit"
+                  >
+                    Upload
+                  </md-button>
+                  <span class="secondary-text mt-8"
+                    >You can also drop images here to upload. Only PNG, JPG -
+                    Max. 8MB</span
+                  >
+                </div>
+
+                <div layout="row" layout-align="start start" layout-wrap>
+                  <div
+                    ng-repeat="logoimage in vm_ca.chatWebsite.images"
+                    ng-switch="logoimage.type"
+                  >
+                    <div
+                      class="chatWebsite-image uploading"
+                      ng-switch-when="uploading"
+                      layout="row"
+                      layout-align="center center"
+                    >
+                      <div
+                        class="overlay"
+                        layout="column"
+                        layout-align="center center"
+                      >
+                        <md-progress-linear
+                          md-mode="determinate"
+                          value="{{logoimage.file.progress() * 100}}"
+                        >
+                        </md-progress-linear>
+                      </div>
+                      <img class="media" flow-img="logoimage.file" />
+                    </div>
+
+                    <div
+                      class="chatWebsite-image"
+                      ng-switch-when="image"
+                      layout="row"
+                      layout-align="center center"
+                    >
+                      <img class="media" ng-src="{{logoimage.url}}" />
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            class="chatWebsite-detail-form-container agentavatar md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="CHAT.AGENTAVATAR">
+                AGENTAVATAR
+              </div>
+            </div>
+            <div
+              ng-controller="ChatWebsiteagentAvatarController as vm_ca"
+              ng-init="vm_ca.init(vm.chatWebsite, vm.crudPermissions)"
+              class="chatWebsite-detail-form-container md-background-bg md-whiteframe-1dp"
+            >
+              <div
+                id="chatWebsite-image-uploader"
+                flow-init="vm_ca.ngFlowOptions"
+                flow-name="vm_ca.ngFlow.flow"
+                flow-files-submitted="vm_ca.upload()"
+                flow-file-added="vm_ca.fileAdded($file)"
+                flow-file-success="vm_ca.fileSuccess($file, $message)"
+                flow-complete="vm_ca.uploadComplete()"
+                flow-drop
+                flow-drag-enter="vm_ca.dropping=true"
+                flow-drag-leave="vm_ca.dropping=false"
+                ng-class="{'dropping':vm.dropping}"
+              >
+                <div
+                  class="drop-text hint-text"
+                  layout="row"
+                  layout-align="center center"
+                >
+                  <span translate="EC.DROP_TO_UPLOAD">Drop to upload</span>
+                </div>
+
+                <div
+                  class="upload-button"
+                  layout="column"
+                  layout-align="center center"
+                >
+                  <md-button
+                    class="md-accent md-raised"
+                    flow-btn
+                    ng-disabled="!vm_ca.crudPermissions.canEdit"
+                  >
+                    Upload
+                  </md-button>
+                  <span class="secondary-text mt-8"
+                    >You can also drop images here to upload. Only PNG, JPG -
+                    Max. 8MB</span
+                  >
+                </div>
+
+                <div layout="row" layout-align="start start" layout-wrap>
+                  <div
+                    ng-repeat="agentAvatarimage in vm_ca.chatWebsite.images"
+                    ng-switch="agentAvatarimage.type"
+                  >
+                    <div
+                      class="chatWebsite-image uploading"
+                      ng-switch-when="uploading"
+                      layout="row"
+                      layout-align="center center"
+                    >
+                      <div
+                        class="overlay"
+                        layout="column"
+                        layout-align="center center"
+                      >
+                        <md-progress-linear
+                          md-mode="determinate"
+                          value="{{agentAvatarimage.file.progress() * 100}}"
+                        >
+                        </md-progress-linear>
+                      </div>
+                      <img class="media" flow-img="agentAvatarimage.file" />
+                    </div>
+
+                    <div
+                      class="chatWebsite-image"
+                      ng-switch-when="image"
+                      layout="row"
+                      layout-align="center center"
+                    >
+                      <img class="media" ng-src="{{agentAvatarimage.url}}" />
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            class="chatWebsite-detail-form-container customeravatar md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="CHAT.CUSTOMERAVATAR">
+                CUSTOMERAVATAR
+              </div>
+            </div>
+            <div
+              ng-controller="ChatWebsitecustomerAvatarController as vm_ca"
+              ng-init="vm_ca.init(vm.chatWebsite, vm.crudPermissions)"
+              class="chatWebsite-detail-form-container md-background-bg md-whiteframe-1dp"
+            >
+              <div
+                id="chatWebsite-image-uploader"
+                flow-init="vm_ca.ngFlowOptions"
+                flow-name="vm_ca.ngFlow.flow"
+                flow-files-submitted="vm_ca.upload()"
+                flow-file-added="vm_ca.fileAdded($file)"
+                flow-file-success="vm_ca.fileSuccess($file, $message)"
+                flow-complete="vm_ca.uploadComplete()"
+                flow-drop
+                flow-drag-enter="vm_ca.dropping=true"
+                flow-drag-leave="vm_ca.dropping=false"
+                ng-class="{'dropping':vm.dropping}"
+              >
+                <div
+                  class="drop-text hint-text"
+                  layout="row"
+                  layout-align="center center"
+                >
+                  <span translate="EC.DROP_TO_UPLOAD">Drop to upload</span>
+                </div>
+
+                <div
+                  class="upload-button"
+                  layout="column"
+                  layout-align="center center"
+                >
+                  <md-button
+                    class="md-accent md-raised"
+                    flow-btn
+                    ng-disabled="!vm_ca.crudPermissions.canEdit"
+                  >
+                    Upload
+                  </md-button>
+                  <span class="secondary-text mt-8"
+                    >You can also drop images here to upload. Only PNG, JPG -
+                    Max. 8MB</span
+                  >
+                </div>
+
+                <div layout="row" layout-align="start start" layout-wrap>
+                  <div
+                    ng-repeat="customerAvatarimage in vm_ca.chatWebsite.images"
+                    ng-switch="customerAvatarimage.type"
+                  >
+                    <div
+                      class="chatWebsite-image uploading"
+                      ng-switch-when="uploading"
+                      layout="row"
+                      layout-align="center center"
+                    >
+                      <div
+                        class="overlay"
+                        layout="column"
+                        layout-align="center center"
+                      >
+                        <md-progress-linear
+                          md-mode="determinate"
+                          value="{{customerAvatarimage.file.progress() * 100}}"
+                        >
+                        </md-progress-linear>
+                      </div>
+                      <img class="media" flow-img="customerAvatarimage.file" />
+                    </div>
+
+                    <div
+                      class="chatWebsite-image"
+                      ng-switch-when="image"
+                      layout="row"
+                      layout-align="center center"
+                    >
+                      <img class="media" ng-src="{{customerAvatarimage.url}}" />
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            class="chatWebsite-detail-form-container systemavatar md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="CHAT.SYSTEMAVATAR">
+                SYSTEMAVATAR
+              </div>
+            </div>
+            <div
+              ng-controller="ChatWebsitesystemAvatarController as vm_ca"
+              ng-init="vm_ca.init(vm.chatWebsite, vm.crudPermissions)"
+              class="chatWebsite-detail-form-container md-background-bg md-whiteframe-1dp"
+            >
+              <div
+                id="chatWebsite-image-uploader"
+                flow-init="vm_ca.ngFlowOptions"
+                flow-name="vm_ca.ngFlow.flow"
+                flow-files-submitted="vm_ca.upload()"
+                flow-file-added="vm_ca.fileAdded($file)"
+                flow-file-success="vm_ca.fileSuccess($file, $message)"
+                flow-complete="vm_ca.uploadComplete()"
+                flow-drop
+                flow-drag-enter="vm_ca.dropping=true"
+                flow-drag-leave="vm_ca.dropping=false"
+                ng-class="{'dropping':vm.dropping}"
+              >
+                <div
+                  class="drop-text hint-text"
+                  layout="row"
+                  layout-align="center center"
+                >
+                  <span translate="EC.DROP_TO_UPLOAD">Drop to upload</span>
+                </div>
+
+                <div
+                  class="upload-button"
+                  layout="column"
+                  layout-align="center center"
+                >
+                  <md-button
+                    class="md-accent md-raised"
+                    flow-btn
+                    ng-disabled="!vm_ca.crudPermissions.canEdit"
+                  >
+                    Upload
+                  </md-button>
+                  <span class="secondary-text mt-8"
+                    >You can also drop images here to upload. Only PNG, JPG -
+                    Max. 8MB</span
+                  >
+                </div>
+
+                <div layout="row" layout-align="start start" layout-wrap>
+                  <div
+                    ng-repeat="systemAvatarimage in vm_ca.chatWebsite.images"
+                    ng-switch="systemAvatarimage.type"
+                  >
+                    <div
+                      class="chatWebsite-image uploading"
+                      ng-switch-when="uploading"
+                      layout="row"
+                      layout-align="center center"
+                    >
+                      <div
+                        class="overlay"
+                        layout="column"
+                        layout-align="center center"
+                      >
+                        <md-progress-linear
+                          md-mode="determinate"
+                          value="{{systemAvatarimage.file.progress() * 100}}"
+                        >
+                        </md-progress-linear>
+                      </div>
+                      <img class="media" flow-img="systemAvatarimage.file" />
+                    </div>
+
+                    <div
+                      class="chatWebsite-image"
+                      ng-switch-when="image"
+                      layout="row"
+                      layout-align="center center"
+                    >
+                      <img class="media" ng-src="{{systemAvatarimage.url}}" />
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="CHAT.ONLINE">ONLINE</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="chatWebsite-detail-form-container chatformonline md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="ChatWebsiteonlineFormController as vm_fonc"
+              ng-init="vm_fonc.init(vm.chatWebsite)"
+              class="content"
+              md-background-bg
+              layout="column"
+            >
+              <div flex>
+                <!-- START Buttons -->
+                <md-button
+                  aria-label="comment"
+                  class="md-fab md-mini"
+                  ng-click="vm_fonc.add(button.type)"
+                  ng-repeat="button in vm_fonc.buttons"
+                >
+                  <md-tooltip md-direction="top">{{button.name}}</md-tooltip>
+                  <md-icon md-font-icon="{{button.icon}}"></md-icon>
+                </md-button>
+                <!-- END Buttons -->
+              </div>
+
+              <div layout="row" flex>
+                <div flex="50">
+                  <md-card>
+                    <md-card-title>
+                      <md-card-title-text>
+                        <div
+                          class="pb-16"
+                          layout="row"
+                          layout-align="start center"
+                        >
+                          <div
+                            class="h2 secondary-text"
+                            translate="CHAT.BUILDER"
+                          >
+                            BUILDER
+                          </div>
+                        </div>
+                      </md-card-title-text>
+                    </md-card-title>
+                    <md-card-content>
+                      <form name="onlineForm" novalidate>
+                        <!-- START MapKey -->
+                        <md-input-container
+                          class="md-block"
+                          ng-if="vm_fonc.chatWebsite.onlineForm.items.length"
+                        >
+                          <label translate="CHAT.HELP.MAPKEY">MapKey</label>
+                          <md-select ng-model="vm_fonc.chatWebsite.mapKey">
+                            <md-option ng-value="null">None</md-option>
+
+                            <md-optgroup label="standard">
+                              <md-option
+                                ng-repeat="field in vm_fonc.fields"
+                                ng-value="field.key"
+                                >{{ field.value }}</md-option
+                              >
+                            </md-optgroup>
+
+                            <md-optgroup
+                              label="custom"
+                              ng-if="vm_fonc.customFields.length"
+                            >
+                              <md-option
+                                ng-repeat="field in vm_fonc.customFields"
+                                ng-value="field.key"
+                                >{{ field.value }}</md-option
+                              >
+                            </md-optgroup>
+                          </md-select>
+                        </md-input-container>
+                        <!-- END MapKey -->
+
+                        <!-- START FromKey -->
+                        <md-input-container
+                          class="md-block"
+                          ng-if="vm_fonc.chatWebsite.onlineForm.items.length"
+                        >
+                          <label translate="CHAT.HELP.FROMKEY">FromKey</label>
+                          <md-select
+                            ng-model="vm_fonc.chatWebsite.onlineForm.fromKey"
+                            md-selected-text="vm_fonc.chatWebsite.onlineForm.fromKey != null ? vm_fonc.chatWebsite.onlineForm.items[vm_fonc.chatWebsite.onlineForm.fromKey].props.title : 'None'"
+                          >
+                            <md-option ng-value="null">None</md-option>
+                            <md-option
+                              ng-repeat="item in vm_fonc.chatWebsite.onlineForm.items"
+                              ng-if="item.props.title"
+                              ng-value="$index"
+                              >{{ item.props.title }}</md-option
+                            >
+                          </md-select>
+                        </md-input-container>
+                        <!-- END FromKey -->
+
+                        <!-- START EXPANSION PANELS -->
+                        <md-expansion-panel
+                          ng-repeat="item in vm_fonc.chatWebsite.onlineForm.items track by $index"
+                          md-component-id="{{'onlinePanel' + $index}}"
+                        >
+                          <md-expansion-panel-collapsed md-no-sticky="true">
+                            <md-button
+                              class="md-icon-button"
+                              aria-label="Down"
+                              ng-click="vm_fonc.down(item, $index); $event.stopPropagation()"
+                            >
+                              <md-icon
+                                md-font-icon="icon-arrow-down-bold-circle-outline"
+                              ></md-icon>
+                            </md-button>
+                            <md-button
+                              class="md-icon-button"
+                              aria-label="Up"
+                              ng-click="vm_fonc.up(item, $index); $event.stopPropagation()"
+                            >
+                              <md-icon
+                                md-font-icon="icon-arrow-up-bold-circle-outline"
+                              ></md-icon>
+                            </md-button>
+
+                            <div class="md-title">
+                              {{item.props.title || item.type}}
+                            </div>
+
+                            <div flex></div>
+                            <md-button
+                              class="md-icon-button"
+                              aria-label="Collapse"
+                              ng-click="$panel.collapse()"
+                            >
+                              <md-icon
+                                md-font-icon="icon-chevron-down"
+                              ></md-icon>
+                            </md-button>
+                          </md-expansion-panel-collapsed>
+
+                          <md-expansion-panel-expanded>
+                            <md-expansion-panel-header>
+                              <md-button
+                                class="md-icon-button"
+                                aria-label="Down"
+                                ng-click="vm_fonc.down(item, $index)"
+                              >
+                                <md-icon
+                                  md-font-icon="icon-arrow-down-bold-circle-outline"
+                                ></md-icon>
+                              </md-button>
+                              <md-button
+                                class="md-icon-button"
+                                aria-label="Up"
+                                ng-click="vm_fonc.up(item, $index)"
+                              >
+                                <md-icon
+                                  md-font-icon="icon-arrow-up-bold-circle-outline"
+                                ></md-icon>
+                              </md-button>
+
+                              <div class="md-title">
+                                {{item.props.title || item.type}}
+                              </div>
+
+                              <div flex></div>
+
+                              <md-button
+                                class="md-icon-button md-warn"
+                                aria-label="Remove"
+                                ng-click="vm_fonc.remove($index)"
+                              >
+                                <md-icon md-font-icon="icon-delete"></md-icon>
+                              </md-button>
+                              <md-button
+                                class="md-icon-button"
+                                aria-label="Collapse"
+                                ng-click="$panel.collapse()"
+                              >
+                                <md-icon
+                                  md-font-icon="icon-chevron-up"
+                                ></md-icon>
+                              </md-button>
+                            </md-expansion-panel-header>
+
+                            <md-expansion-panel-content>
+                              <form-item
+                                type="{{item.type}}"
+                                item="item"
+                                index="$index"
+                              ></form-item>
+
+                              <md-input-container class="md-block">
+                                <label translate="CHAT.VARIABLE"
+                                  >Variable</label
+                                >
+                                <md-select ng-model="item.variable">
+                                  <md-option ng-value="null">None</md-option>
+                                  <md-option
+                                    ng-repeat="variable in vm_fonc.variables"
+                                    ng-value="variable.name"
+                                    >{{ variable.name }}</md-option
+                                  >
+                                </md-select>
+                              </md-input-container>
+
+                              <md-input-container class="md-block">
+                                <label translate="CHAT.CM_FIELD"
+                                  >Contact Manager Field</label
+                                >
+                                <md-select ng-model="item.cmField">
+                                  <md-option ng-value="null">None</md-option>
+
+                                  <md-optgroup label="standard">
+                                    <md-option
+                                      ng-repeat="field in vm_fonc.fields"
+                                      ng-value="field.key"
+                                      >{{ field.value }}</md-option
+                                    >
+                                  </md-optgroup>
+
+                                  <md-optgroup
+                                    label="custom"
+                                    ng-if="vm_fonc.customFields.length"
+                                  >
+                                    <md-option
+                                      ng-repeat="field in vm_fonc.customFields"
+                                      ng-value="field.key"
+                                      >{{ field.value }}</md-option
+                                    >
+                                  </md-optgroup>
+                                </md-select>
+                              </md-input-container>
+                            </md-expansion-panel-content>
+                          </md-expansion-panel-expanded>
+                        </md-expansion-panel>
+                        <!-- END EXPANSION PANELS -->
+                      </form>
+                    </md-card-content>
+                  </md-card>
+                </div>
+                <div flex="50">
+                  <md-card>
+                    <md-card-title>
+                      <md-card-title-text>
+                        <div
+                          class="pb-16"
+                          layout="row"
+                          layout-align="start center"
+                        >
+                          <div
+                            class="h2 secondary-text"
+                            translate="CHAT.PREVIEW"
+                          >
+                            PREVIEW
+                          </div>
+                        </div>
+                      </md-card-title-text>
+                    </md-card-title>
+                    <md-card-content flex>
+                      <form-view
+                        form="vm_fonc.chatWebsite.onlineForm"
+                        flex="100"
+                      ></form-view>
+                    </md-card-content>
+                  </md-card>
+                </div>
+              </div>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="CHAT.OFFLINE">OFFLINE</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="chatWebsite-detail-form-container chatformoffline md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="ChatWebsiteofflineFormController as vm_fonc"
+              ng-init="vm_fonc.init(vm.chatWebsite)"
+              class="content"
+              md-background-bg
+              layout="column"
+            >
+              <div flex>
+                <!-- START Buttons -->
+                <md-button
+                  aria-label="comment"
+                  class="md-fab md-mini"
+                  ng-click="vm_fonc.add(button.type)"
+                  ng-repeat="button in vm_fonc.buttons"
+                >
+                  <md-tooltip md-direction="top">{{button.name}}</md-tooltip>
+                  <md-icon md-font-icon="{{button.icon}}"></md-icon>
+                </md-button>
+                <!-- END Buttons -->
+              </div>
+
+              <div layout="row" flex>
+                <div flex="50">
+                  <md-card>
+                    <md-card-title>
+                      <md-card-title-text>
+                        <div
+                          class="pb-16"
+                          layout="row"
+                          layout-align="start center"
+                        >
+                          <div
+                            class="h2 secondary-text"
+                            translate="CHAT.BUILDER"
+                          >
+                            BUILDER
+                          </div>
+                        </div>
+                      </md-card-title-text>
+                    </md-card-title>
+                    <md-card-content>
+                      <form name="offlineForm" novalidate>
+                        <md-input-container class="md-block">
+                          <md-switch
+                            ng-model="vm_fonc.chatWebsite.forwardOffline"
+                            aria-label="forwardOffline"
+                            ><span translate="CHAT.FORWARD_OFFLINE"
+                              >forwardOffline</span
+                            ></md-switch
+                          >
+                        </md-input-container>
+
+                        <md-input-container
+                          class="md-block"
+                          ng-if="vm_fonc.chatWebsite.forwardOffline"
+                        >
+                          <label translate="CHAT.FORWARD_OFFLINE_ADDRESS"
+                            >FORWARD OFFLINE ADDRESS</label
+                          >
+                          <input
+                            type="text"
+                            name="forwardOfflineAddress"
+                            ng-model="vm_fonc.chatWebsite.forwardOfflineAddress"
+                          />
+                          <div class="hint">
+                            <span translate="CHAT.HELP.FORWARD_OFFLINE"></span>
+                          </div>
+                          <div
+                            ng-messages="offlineForm['forwardOfflineAddress'].$error"
+                            ng-show="offlineForm['forwardOfflineAddress'].$touched"
+                            role="alert"
+                          >
+                            <div ng-message="email">
+                              <span translate="CHAT.ERRORS.EMAIL_MUST_BE_VALID"
+                                >forwardOffline must be a valid e-mail
+                                address</span
+                              >
+                            </div>
+                          </div>
+                        </md-input-container>
+
+                        <!-- START MapKey -->
+                        <md-input-container
+                          class="md-block"
+                          ng-if="vm_fonc.chatWebsite.offlineForm.items.length"
+                        >
+                          <label translate="CHAT.HELP.MAPKEY">MapKey</label>
+                          <md-select
+                            ng-model="vm_fonc.chatWebsite.mapKeyOffline"
+                          >
+                            <md-option ng-value="null">None</md-option>
+
+                            <md-optgroup label="standard">
+                              <md-option
+                                ng-repeat="field in vm_fonc.fields"
+                                ng-value="field.key"
+                                >{{ field.value }}</md-option
+                              >
+                            </md-optgroup>
+
+                            <md-optgroup
+                              label="custom"
+                              ng-if="vm_fonc.customFields.length"
+                            >
+                              <md-option
+                                ng-repeat="field in vm_fonc.customFields"
+                                ng-value="field.key"
+                                >{{ field.value }}</md-option
+                              >
+                            </md-optgroup>
+                          </md-select>
+                        </md-input-container>
+                        <!-- END MapKey -->
+
+                        <!-- START FromKey -->
+                        <md-input-container
+                          class="md-block"
+                          ng-if="vm_fonc.chatWebsite.offlineForm.items.length"
+                        >
+                          <label translate="CHAT.HELP.FROMKEY">FromKey</label>
+                          <md-select
+                            ng-model="vm_fonc.chatWebsite.offlineForm.fromKey"
+                            md-selected-text="vm_fonc.chatWebsite.offlineForm.fromKey != null ? vm_fonc.chatWebsite.offlineForm.items[vm_fonc.chatWebsite.offlineForm.fromKey].props.title : 'None'"
+                          >
+                            <md-option ng-value="null">None</md-option>
+                            <md-option
+                              ng-repeat="item in vm_fonc.chatWebsite.offlineForm.items"
+                              ng-if="item.props.title"
+                              ng-value="$index"
+                              >{{ item.props.title }}</md-option
+                            >
+                          </md-select>
+                        </md-input-container>
+                        <!-- END FromKey -->
+
+                        <!-- START EXPANSION PANELS -->
+                        <md-expansion-panel
+                          ng-repeat="item in vm_fonc.chatWebsite.offlineForm.items track by $index"
+                          md-component-id="{{'offlinePanel' + $index}}"
+                        >
+                          <md-expansion-panel-collapsed md-no-sticky="true">
+                            <md-button
+                              class="md-icon-button"
+                              aria-label="Down"
+                              ng-click="vm_fonc.down(item, $index); $event.stopPropagation()"
+                            >
+                              <md-icon
+                                md-font-icon="icon-arrow-down-bold-circle-outline"
+                              ></md-icon>
+                            </md-button>
+                            <md-button
+                              class="md-icon-button"
+                              aria-label="Up"
+                              ng-click="vm_fonc.up(item, $index); $event.stopPropagation()"
+                            >
+                              <md-icon
+                                md-font-icon="icon-arrow-up-bold-circle-outline"
+                              ></md-icon>
+                            </md-button>
+
+                            <div class="md-title">
+                              {{item.props.title || item.type}}
+                            </div>
+
+                            <div flex></div>
+                            <md-button
+                              class="md-icon-button"
+                              aria-label="Collapse"
+                              ng-click="$panel.collapse()"
+                            >
+                              <md-icon
+                                md-font-icon="icon-chevron-down"
+                              ></md-icon>
+                            </md-button>
+                          </md-expansion-panel-collapsed>
+
+                          <md-expansion-panel-expanded>
+                            <md-expansion-panel-header>
+                              <md-button
+                                class="md-icon-button"
+                                aria-label="Down"
+                                ng-click="vm_fonc.down(item, $index)"
+                              >
+                                <md-icon
+                                  md-font-icon="icon-arrow-down-bold-circle-outline"
+                                ></md-icon>
+                              </md-button>
+                              <md-button
+                                class="md-icon-button"
+                                aria-label="Up"
+                                ng-click="vm_fonc.up(item, $index)"
+                              >
+                                <md-icon
+                                  md-font-icon="icon-arrow-up-bold-circle-outline"
+                                ></md-icon>
+                              </md-button>
+
+                              <div class="md-title">
+                                {{item.props.title || item.type}}
+                              </div>
+
+                              <div flex></div>
+
+                              <md-button
+                                class="md-icon-button md-warn"
+                                aria-label="Remove"
+                                ng-click="vm_fonc.remove($index)"
+                              >
+                                <md-icon md-font-icon="icon-delete"></md-icon>
+                              </md-button>
+                              <md-button
+                                class="md-icon-button"
+                                aria-label="Collapse"
+                                ng-click="$panel.collapse()"
+                              >
+                                <md-icon
+                                  md-font-icon="icon-chevron-up"
+                                ></md-icon>
+                              </md-button>
+                            </md-expansion-panel-header>
+
+                            <md-expansion-panel-content>
+                              <form-item
+                                type="{{item.type}}"
+                                item="item"
+                                index="$index"
+                              ></form-item>
+
+                              <md-input-container class="md-block">
+                                <label translate="CHAT.CM_FIELD"
+                                  >Contact Manager Field</label
+                                >
+                                <md-select ng-model="item.cmField">
+                                  <md-option ng-value="null">None</md-option>
+
+                                  <md-optgroup label="standard">
+                                    <md-option
+                                      ng-repeat="field in vm_fonc.fields"
+                                      ng-value="field.key"
+                                      >{{ field.value }}</md-option
+                                    >
+                                  </md-optgroup>
+
+                                  <md-optgroup
+                                    label="custom"
+                                    ng-if="vm_fonc.customFields.length"
+                                  >
+                                    <md-option
+                                      ng-repeat="field in vm_fonc.customFields"
+                                      ng-value="field.key"
+                                      >{{ field.value }}</md-option
+                                    >
+                                  </md-optgroup>
+                                </md-select>
+                              </md-input-container>
+                            </md-expansion-panel-content>
+                          </md-expansion-panel-expanded>
+                        </md-expansion-panel>
+                        <!-- END EXPANSION PANELS -->
+                      </form>
+                    </md-card-content>
+                  </md-card>
+                </div>
+                <div flex="50">
+                  <md-card>
+                    <md-card-title>
+                      <md-card-title-text>
+                        <div
+                          class="pb-16"
+                          layout="row"
+                          layout-align="start center"
+                        >
+                          <div
+                            class="h2 secondary-text"
+                            translate="CHAT.PREVIEW"
+                          >
+                            PREVIEW
+                          </div>
+                        </div>
+                      </md-card-title-text>
+                    </md-card-title>
+                    <md-card-content flex>
+                      <form-view
+                        form="vm_fonc.chatWebsite.offlineForm"
+                        flex="100"
+                      ></form-view>
+                    </md-card-content>
+                  </md-card>
+                </div>
+              </div>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="CHAT.PROACTIVEACTIONS">PROACTIVEACTIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="chatWebsite-detail-form-container proactive md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="ChatWebsiteProactiveActionsController as vm_dc"
+              ng-init="vm_dc.init(vm.chatWebsite, vm.crudPermissions)"
+            >
+              <md-toolbar
+                class="md-table-toolbar md-default"
+                ng-hide="vm_dc.selectedChatWebsiteProactiveActions.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead" translate="CHAT.PROACTIVEACTIONS"
+                    >ProactiveActions</span
+                  >
+                  <ms-search-bar
+                    on-search="vm_dc.query.filter = query"
+                    on-collapse="vm_dc.query.filter = undefined"
+                    debounce="300"
+                    direction="down"
+                  ></ms-search-bar>
+                  <div flex></div>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canEdit"
+                    class="md-icon-button"
+                    ng-click="vm_dc.createOrEditChatWebsiteChatProactiveAction($event)"
+                    aria-label="add chatProactiveAction"
+                    translate
+                    translate-attr-label="CHAT.ADD_CHATPROACTIVEACTION"
+                  >
+                    <md-icon md-font-icon="icon-plus"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-toolbar
+                class="md-table-toolbar md-accent"
+                ng-show="vm_dc.selectedChatWebsiteProactiveActions.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead"
+                    >{{vm_dc.selectedChatWebsiteProactiveActions.length}}
+                    {{vm_dc.selectedChatWebsiteProactiveActions.length > 1 ?
+                    'items' : 'item'}} selected</span
+                  >
+                  <div flex></div>
+                  <button
+                    class="md-icon-button"
+                    ng-csv="vm_dc.exportSelectedChatWebsiteProactiveActions"
+                    csv-label="true"
+                    filename="chatWebsites.csv"
+                  >
+                    <md-icon md-font-icon="icon-file-excel"></md-icon>
+                  </button>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canDelete"
+                    class="md-icon-button"
+                    ng-click="vm_dc.deleteSelectedChatWebsiteProactiveActions($event)"
+                    aria-label="delete selected"
+                    translate
+                    translate-attr-label="CHAT.DELETE_SELECTED"
+                  >
+                    <md-icon md-font-icon="icon-delete"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-table-container class="font-size-12">
+                <table
+                  md-table
+                  md-row-select
+                  multiple
+                  ng-model="vm_dc.selectedChatWebsiteProactiveActions"
+                  md-progress="vm_dc.promise"
+                >
+                  <thead
+                    md-head
+                    md-order="vm_dc.query.sort"
+                    md-on-reorder="vm_dc.getChatWebsiteProactiveActions"
+                  >
+                    <tr md-row>
+                      <th md-column md-order-by="id">
+                        {{ 'CHAT.ID' | translate }}
+                      </th>
+                      <th md-column md-order-by="name">
+                        {{ 'CHAT.NAME' | translate }}
+                      </th>
+                      <th md-column md-order-by="type">
+                        {{ 'CHAT.TYPE' | translate }}
+                      </th>
+                      <th md-column md-order-by="selector">
+                        {{ 'CHAT.SELECTOR' | translate }}
+                      </th>
+                      <th md-column md-order-by="timeout">
+                        {{ 'CHAT.TIMEOUT' | translate }}
+                      </th>
+                      <th md-column md-order-by="createdAt">
+                        {{ 'CHAT.CREATED_AT' | translate }}
+                      </th>
+                      <th md-column width="10px"></th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr
+                      md-row
+                      md-select="chatProactiveAction"
+                      md-select-id="id"
+                      ng-repeat="chatProactiveAction in vm_dc.chatWebsiteProactiveActions.rows"
+                    >
+                      <td
+                        ng-click="vm_dc.createOrEditChatWebsiteChatProactiveAction($event, chatProactiveAction)"
+                        md-cell
+                      >
+                        {{chatProactiveAction.id}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditChatWebsiteChatProactiveAction($event, chatProactiveAction)"
+                        md-cell
+                      >
+                        {{chatProactiveAction.name}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditChatWebsiteChatProactiveAction($event, chatProactiveAction)"
+                        md-cell
+                      >
+                        {{ 'CHAT.' +
+                        vm_dc.arraytype[chatProactiveAction.type].option |
+                        uppercase | translate }}
+                      </td>
+
+                      <td
+                        ng-click="vm_dc.createOrEditChatWebsiteChatProactiveAction($event, chatProactiveAction)"
+                        md-cell
+                      >
+                        {{chatProactiveAction.selector}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditChatWebsiteChatProactiveAction($event, chatProactiveAction)"
+                        md-cell
+                      >
+                        {{chatProactiveAction.timeout}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditChatWebsiteChatProactiveAction($event, chatProactiveAction)"
+                        md-cell
+                      >
+                        {{ chatProactiveAction.createdAt | formatdate }}
+                      </td>
+                      <td
+                        md-cell
+                        class="actions"
+                        ng-if="!vm_dc.crudPermissions.readOnly"
+                      >
+                        <md-menu>
+                          <md-button
+                            class="md-icon-button"
+                            aria-label="More"
+                            translate
+                            translate-attr-aria-label="CHAT.MORE"
+                            ng-click="$mdOpenMenu($event)"
+                          >
+                            <md-icon
+                              md-font-icon="icon-dots-vertical"
+                            ></md-icon>
+                          </md-button>
+
+                          <md-menu-content width="3">
+                            <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
+                              <md-button
+                                ng-click="vm_dc.createOrEditChatWebsiteChatProactiveAction($event, chatProactiveAction)"
+                                translate="CHAT.EDIT_CHATPROACTIVEACTION"
+                              >
+                                Edit ChatProactiveAction
+                              </md-button>
+                            </md-menu-item>
+                            <md-menu-item
+                              ng-if="vm_dc.crudPermissions.canDelete"
+                            >
+                              <md-button
+                                ng-click="vm_dc.deleteConfirm(chatProactiveAction, $event)"
+                                translate="CHAT.DELETE_CHATPROACTIVEACTION"
+                              >
+                                Delete ChatProactiveAction
+                              </md-button>
+                            </md-menu-item>
+                          </md-menu-content>
+                        </md-menu>
+                      </td>
+                    </tr>
+                    <tr
+                      md-row
+                      ng-if="!vm_dc.chatWebsiteProactiveActions.rows.length"
+                    >
+                      <td md-cell colspan="8">
+                        <div layout="row" layout-align="center center">
+                          <span
+                            class="text-boxed-light"
+                            translate="CHAT.NO_CHATPROACTIVEACTION_AVAILABLE"
+                            >No chatproactiveaction available</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+              <md-table-pagination
+                md-label="{page: '{{'CHAT.PAGE' | translate}}:', rowsPerPage: '{{'CHAT.ROWSPERPAGE' | translate}}:', of: '{{'CHAT.OF' | translate}}'}"
+                md-limit="vm_dc.query.limit"
+                md-limit-options="[10, 15, 20, 50, 100, 250]"
+                md-page="vm_dc.query.page"
+                md-total="{{vm_dc.chatWebsiteProactiveActions.count}}"
+                md-on-paginate="vm_dc.getChatWebsiteProactiveActions"
+                md-page-select
+              ></md-table-pagination>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="CHAT.DISPOSITIONS">DISPOSITIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            ng-controller="ChatWebsiteDispositionsController as vm_dc"
+            ng-init="vm_dc.init(vm.chatWebsite, vm.crudPermissions)"
+          >
+            <div layout="row">
+              <div class="column" flex="20">
+                <md-card class="mt-0">
+                  <md-card-content>
+                    <button
+                      layout-align="center center"
+                      md-mini-fab
+                      ng-click="vm_dc.query.level = null; vm_dc.getDispositions()"
+                    >
+                      <div layout="row" layout-align="start center">
+                        <md-icon md-font-icon="icon-refresh"></md-icon>
+                        <span class="ph-5"
+                          >{{ 'TOOLS.ALL_DISPOSITIONS' | translate }}</span
+                        >
+                      </div>
+                    </button>
+                  </md-card-content>
+                </md-card>
+                <md-card>
+                  <md-card-content>
+                    <md-input-container class="md-block" flex-gt-sm="">
+                      <label translate="TOOLS.SELECT_LEVEL"
+                        >Select a level</label
+                      >
+                      <md-select
+                        placeholder="{{ 'TOOLS.SELECT_LEVEL' | translate }}"
+                        ng-model="vm_dc.query.level"
+                        ng-change="vm_dc.getDispositions()"
+                      >
+                        <md-option ng-value="null"
+                          ><em translate="TOOLS.ALL">All</em></md-option
+                        >
+                        <md-option
+                          ng-value="key"
+                          ng-repeat="(key, value) in vm_dc.levels"
+                          >{{ value }}</md-option
+                        >
+                      </md-select>
+                    </md-input-container>
+                  </md-card-content>
+                </md-card>
+              </div>
+              <div
+                class="chatWebsite-detail-form-container chatdispositions md-background-bg md-whiteframe-1dp"
+                flex="80"
+              >
+                <md-toolbar
+                  class="md-table-toolbar md-default"
+                  ng-hide="vm_dc.selectedChatWebsiteDispositions.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead" translate="CHAT.DISPOSITIONS"
+                      >Dispositions</span
+                    >
+                    <ms-search-bar
+                      on-search="vm_dc.query.filter = query"
+                      on-collapse="vm_dc.query.filter = undefined"
+                      debounce="300"
+                      direction="down"
+                    ></ms-search-bar>
+                    <div flex></div>
+                    <md-button
+                      ng-if="vm_dc.crudPermissions.canEdit"
+                      class="md-icon-button"
+                      ng-click="vm_dc.createOrEditDisposition($event)"
+                      aria-label="Add chat dispositions"
+                      translate
+                      translate-attr-label="CHAT.ADD_DISPOSITION"
+                    >
+                      <md-icon md-font-icon="icon-plus"></md-icon>
+                    </md-button>
+                  </div>
+                </md-toolbar>
+                <md-toolbar
+                  class="md-table-toolbar md-accent"
+                  ng-show="vm_dc.selectedDispositions.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead"
+                      >{{vm_dc.selectedDispositions.length}}
+                      {{vm_dc.selectedDispositions.length > 1 ? 'items' :
+                      'item'}} selected</span
+                    >
+                    <div flex></div>
+                    <button
+                      class="md-icon-button"
+                      ng-csv="vm_dc.exportSelectedDispositions"
+                      csv-label="true"
+                      filename="chatWebsites.csv"
+                    >
+                      <md-icon md-font-icon="icon-file-excel"></md-icon>
+                    </button>
+                    <md-button
+                      ng-if="vm_dc.crudPermissions.canDelete"
+                      class="md-icon-button"
+                      ng-click="vm_dc.deleteSelectedDispositions($event)"
+                      aria-label="delete selected"
+                      translate
+                      translate-attr-label="CHAT.DELETE_SELECTED"
+                    >
+                      <md-icon md-font-icon="icon-delete"></md-icon>
+                    </md-button>
+                  </div>
+                </md-toolbar>
+                <md-table-container>
+                  <table
+                    md-table
+                    md-row-select
+                    multiple
+                    ng-model="vm_dc.selectedDispositions"
+                    md-progress="vm_dc.promise"
+                  >
+                    <thead
+                      md-head
+                      md-order="vm_dc.query.sort"
+                      md-on-reorder="vm_dc.getDispositions"
+                    >
+                      <tr md-row>
+                        <th md-column md-order-by="id">
+                          {{ 'CHAT.ID' | translate }}
+                        </th>
+                        <th md-column md-order-by="level">
+                          {{ 'TOOLS.LEVEL' | translate }}
+                        </th>
+                        <th md-column md-order-by="name">
+                          {{ 'CHAT.NAME' | translate }}
+                        </th>
+                        <th md-column md-order-by="description">
+                          {{ 'CHAT.DESCRIPTION' | translate }}
+                        </th>
+                        <th md-column width="10px"></th>
+                      </tr>
+                    </thead>
+                    <tbody md-body>
+                      <tr md-row ng-hide="vm_dc.dispositions.rows.length">
+                        <td md-cell colspan="5">
+                          <div layout="row" layout-align="center center">
+                            <span translate="CHAT.NO_AVAILABLE_INFO"
+                              >No Available Info</span
+                            >
+                          </div>
+                        </td>
+                      </tr>
+                      <tr
+                        md-row
+                        md-select="disposition"
+                        md-select-id="id"
+                        ng-repeat="disposition in vm_dc.dispositions.rows"
+                      >
+                        <td
+                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                          md-cell
+                          class="id"
+                        >
+                          {{disposition.id}}
+                        </td>
+                        <td
+                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                          md-cell
+                          class="level"
+                        >
+                          {{ vm_dc.levels[disposition.level] }}
+                        </td>
+                        <td
+                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                          md-cell
+                          class="name"
+                        >
+                          {{disposition.name}}
+                        </td>
+                        <td
+                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                          md-cell
+                          class="description"
+                        >
+                          {{disposition.description}}
+                        </td>
+                        <td
+                          md-cell
+                          class="actions"
+                          ng-if="!vm_dc.crudPermissions.readOnly"
+                        >
+                          <md-menu>
+                            <md-button
+                              class="md-icon-button"
+                              aria-label="More"
+                              translate
+                              translate-attr-aria-label="CHAT.MORE"
+                              ng-click="$mdOpenMenu($event)"
+                            >
+                              <md-icon
+                                md-font-icon="icon-dots-vertical"
+                              ></md-icon>
+                            </md-button>
+                            <md-menu-content width="3">
+                              <!-- SUBACTIONS -->
+                              <!-- ACTIONS -->
+                              <md-menu-item
+                                ng-if="vm_dc.crudPermissions.canEdit"
+                              >
+                                <md-button
+                                  ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                                  translate="TOOLS.EDIT_DISPOSITION"
+                                >
+                                  Edit Disposition
+                                </md-button>
+                              </md-menu-item>
+                              <!-- SUBACTIONS -->
+                              <!-- ACTIONS -->
+                              <md-menu-item
+                                ng-if="vm_dc.crudPermissions.canDelete"
+                              >
+                                <md-button
+                                  ng-click="vm_dc.deleteConfirm(disposition, $event)"
+                                  translate="TOOLS.DELETE_DISPOSITION"
+                                >
+                                  Delete Disposition
+                                </md-button>
+                              </md-menu-item>
+                            </md-menu-content>
+                          </md-menu>
+                        </td>
+                      </tr>
+                    </tbody>
+                  </table>
+                </md-table-container>
+                <md-table-pagination
+                  md-label="{page: '{{'CHAT.PAGE' | translate}}:', rowsPerPage: '{{'CHAT.ROWSPERPAGE' | translate}}:', of: '{{'CHAT.OF' | translate}}'}"
+                  md-limit="vm_dc.query.limit"
+                  md-limit-options="[10, 15, 20, 50, 100, 250]"
+                  md-page="vm_dc.query.page"
+                  md-total="{{vm_dc.dispositions.count}}"
+                  md-on-paginate="vm_dc.getDispositions"
+                  md-page-select
+                >
+                </md-table-pagination>
+              </div>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="CHAT.CANNEDANSWERS">CANNEDANSWERS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="chatWebsite-detail-form-container chatcannedanswers md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="ChatWebsiteChatCannedAnswersController as vm_dc"
+              ng-init="vm_dc.init(vm.chatWebsite, vm.crudPermissions)"
+            >
+              <md-toolbar
+                class="md-table-toolbar md-default"
+                ng-hide="vm_dc.selectedChatWebsiteChatCannedAnswers.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead" translate="CHAT.CHATCANNEDANSWERS"
+                    >ChatCannedAnswers</span
+                  >
+                  <ms-search-bar
+                    on-search="vm_dc.query.filter = query"
+                    on-collapse="vm_dc.query.filter = undefined"
+                    debounce="300"
+                    direction="down"
+                  ></ms-search-bar>
+                  <div flex></div>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canEdit"
+                    class="md-icon-button"
+                    ng-click="vm_dc.createOrEditChatWebsiteChatCannedAnswer($event)"
+                    aria-label="add chatCannedAnswer"
+                    translate
+                    translate-attr-label="CHAT.ADD_CHATCANNEDANSWER"
+                  >
+                    <md-icon md-font-icon="icon-plus"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-toolbar
+                class="md-table-toolbar md-accent"
+                ng-show="vm_dc.selectedChatWebsiteChatCannedAnswers.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead"
+                    >{{vm_dc.selectedChatWebsiteChatCannedAnswers.length}}
+                    {{vm_dc.selectedChatWebsiteChatCannedAnswers.length > 1 ?
+                    'items' : 'item'}} selected</span
+                  >
+                  <div flex></div>
+                  <button
+                    class="md-icon-button"
+                    ng-csv="vm_dc.exportSelectedChatWebsiteChatCannedAnswers"
+                    csv-label="true"
+                    filename="chatWebsites.csv"
+                  >
+                    <md-icon md-font-icon="icon-file-excel"></md-icon>
+                  </button>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canDelete"
+                    class="md-icon-button"
+                    ng-click="vm_dc.deleteSelectedChatWebsiteChatCannedAnswers($event)"
+                    aria-label="delete selected"
+                    translate
+                    translate-attr-label="CHAT.DELETE_SELECTED"
+                  >
+                    <md-icon md-font-icon="icon-delete"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-table-container class="font-size-12">
+                <table
+                  md-table
+                  md-row-select
+                  multiple
+                  ng-model="vm_dc.selectedChatWebsiteChatCannedAnswers"
+                  md-progress="vm_dc.promise"
+                >
+                  <thead
+                    md-head
+                    md-order="vm_dc.query.sort"
+                    md-on-reorder="vm_dc.getChatWebsiteChatCannedAnswers"
+                  >
+                    <tr md-row>
+                      <th md-column md-order-by="id">
+                        {{ 'CHAT.ID' | translate }}
+                      </th>
+                      <th md-column md-order-by="key">
+                        {{ 'CHAT.KEY' | translate }}
+                      </th>
+                      <th md-column md-order-by="value">
+                        {{ 'CHAT.VALUE' | translate }}
+                      </th>
+                      <th md-column md-order-by="description">
+                        {{ 'CHAT.DESCRIPTION' | translate }}
+                      </th>
+                      <th md-column md-order-by="createdAt">
+                        {{ 'CHAT.CREATED_AT' | translate }}
+                      </th>
+                      <th md-column width="10px"></th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr
+                      md-row
+                      md-select="chatCannedAnswer"
+                      md-select-id="id"
+                      ng-repeat="chatCannedAnswer in vm_dc.chatWebsiteChatCannedAnswers.rows"
+                    >
+                      <td
+                        ng-click="vm_dc.createOrEditChatWebsiteChatCannedAnswer($event, chatCannedAnswer)"
+                        md-cell
+                      >
+                        {{chatCannedAnswer.id}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditChatWebsiteChatCannedAnswer($event, chatCannedAnswer)"
+                        md-cell
+                      >
+                        {{chatCannedAnswer.key}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditChatWebsiteChatCannedAnswer($event, chatCannedAnswer)"
+                        md-cell
+                      >
+                        {{chatCannedAnswer.value}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditChatWebsiteChatCannedAnswer($event, chatCannedAnswer)"
+                        md-cell
+                      >
+                        {{chatCannedAnswer.description}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditChatWebsiteChatCannedAnswer($event, chatCannedAnswer)"
+                        md-cell
+                      >
+                        {{ chatCannedAnswer.createdAt | formatdate }}
+                      </td>
+                      <td
+                        md-cell
+                        class="actions"
+                        ng-if="!vm_dc.crudPermissions.readOnly"
+                      >
+                        <md-menu>
+                          <md-button
+                            class="md-icon-button"
+                            aria-label="More"
+                            translate
+                            translate-attr-aria-label="CHAT.MORE"
+                            ng-click="$mdOpenMenu($event)"
+                          >
+                            <md-icon
+                              md-font-icon="icon-dots-vertical"
+                            ></md-icon>
+                          </md-button>
+
+                          <md-menu-content width="3">
+                            <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
+                              <md-button
+                                ng-click="vm_dc.createOrEditChatWebsiteChatCannedAnswer($event, chatCannedAnswer)"
+                                translate="CHAT.EDIT_CHATCANNEDANSWER"
+                              >
+                                Edit ChatCannedAnswer
+                              </md-button>
+                            </md-menu-item>
+                            <md-menu-item
+                              ng-if="vm_dc.crudPermissions.canDelete"
+                            >
+                              <md-button
+                                ng-click="vm_dc.deleteConfirm(chatCannedAnswer, $event)"
+                                translate="CHAT.DELETE_CHATCANNEDANSWER"
+                              >
+                                Delete ChatCannedAnswer
+                              </md-button>
+                            </md-menu-item>
+                          </md-menu-content>
+                        </md-menu>
+                      </td>
+                    </tr>
+                    <tr
+                      md-row
+                      ng-if="!vm_dc.chatWebsiteChatCannedAnswers.rows.length"
+                    >
+                      <td md-cell colspan="7">
+                        <div layout="row" layout-align="center center">
+                          <span
+                            class="text-boxed-light"
+                            translate="CHAT.NO_CHATCANNEDANSWER_AVAILABLE"
+                            >No chatcannedanswer available</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+              <md-table-pagination
+                md-label="{page: '{{'CHAT.PAGE' | translate}}:', rowsPerPage: '{{'CHAT.ROWSPERPAGE' | translate}}:', of: '{{'CHAT.OF' | translate}}'}"
+                md-limit="vm_dc.query.limit"
+                md-limit-options="[10, 15, 20, 50, 100, 250]"
+                md-page="vm_dc.query.page"
+                md-total="{{vm_dc.chatWebsiteChatCannedAnswers.count}}"
+                md-on-paginate="vm_dc.getChatWebsiteChatCannedAnswers"
+                md-page-select
+              ></md-table-pagination>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="CHAT.VIDEO">VIDEO</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="chatWebsite-detail-form-container vidaoo md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="CHAT.VIDAOO">
+                VIDAOO
+              </div>
+            </div>
+            <form name="vidaooForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.chatWebsite.vidaooEscalation"
+                  aria-label="vidaooEscalation"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="CHAT.VIDAOOESCALATION"
+                    >vidaooEscalation</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.chatWebsite.vidaooEscalation == true"
+                class="md-block"
+              >
+                <label translate="CHAT.VIDAOOAPIKEY">vidaooApiKey</label>
+                <input
+                  type="text"
+                  name="vidaooApiKey"
+                  ng-model="vm.chatWebsite.vidaooApiKey"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="vidaooForm['vidaooApiKey'].$error"
+                  ng-show="vidaooForm['vidaooApiKey'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CHAT.ERRORS.VIDAOOAPIKEY_REQUIRED"
+                      >vidaooApiKey field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="CHAT.ACTIONS">ACTIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="chatWebsite-detail-form-container actions md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="ChatWebsiteActionsController as vm_ac"
+              ng-init="vm_ac.init(vm.chatWebsite, vm.crudPermissions)"
+              class="content"
+              md-background-bg
+              layout="row"
+              layout-align="start start"
+            >
+              <!-- SIDENAV -->
+              <div
+                class="navigation-simple sidenav main-sidenav md-background-bg md-whiteframe-1dp"
+                ms-scroll
+                layout="column"
+                flex="20"
+                ng-if="vm_ac.crudPermissions.canEdit"
+              >
+                <!-- SIDENAV CONTENT -->
+                <md-list class="no-padding">
+                  <md-subheader class="md-no-sticky">
+                    <span translate="VOICE.APPLICATIONS_LIST">
+                      Applications List
+                    </span>
+                  </md-subheader>
+                </md-list>
+                <md-divider></md-divider>
+                <md-list ng-sortable="vm_ac.list">
+                  <md-list-item class="handle" ng-repeat="a in vm_ac.apps">
+                    <md-icon md-font-icon="{{a.icon}}" class="s16"></md-icon>
+                    <p
+                      class="text-truncate"
+                      translate="CHAT.{{(a.alias || a.appType) | uppercase}}"
+                    >
+                      {{a.alias || a.appType}}
+                    </p>
+                  </md-list-item>
+                </md-list>
+                <!-- / SIDENAV CONTENT -->
+              </div>
+              <!-- / SIDENAV -->
+              <div flex></div>
+              <!-- MAIN -->
+              <div
+                class="main scrollable md-background-bg md-whiteframe-1dp"
+                ms-scroll
+                layout="column"
+                flex="{{vm_ac.crudPermissions.canEdit ? 75 : 100}}"
+              >
+                <md-toolbar
+                  class="md-table-toolbar md-default"
+                  ng-hide="vm_ac.selectedChatWebsiteApps.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead">Drag & Drop Routing</span>
+                    <div flex></div>
+                    <ms-search-bar
+                      on-search="vm_ac.query.filter = query"
+                      on-collapse="vm_ac.query.filter = undefined"
+                      debounce="300"
+                    ></ms-search-bar>
+                  </div>
+                </md-toolbar>
+                <md-toolbar
+                  class="md-table-toolbar md-accent"
+                  ng-show="vm_ac.selectedChatWebsiteApps.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead"
+                      >{{vm_ac.selectedChatWebsiteApps.length}}
+                      {{vm_ac.selectedChatWebsiteApps.length > 1 ? 'items' :
+                      'item'}} selected</span
+                    >
+                    <div flex></div>
+                    <md-button
+                      ng-if="vm_ac.crudPermissions.canDelete"
+                      class="md-icon-button"
+                      ng-click="vm_ac.deleteSelectedChatWebsiteApps($event)"
+                      aria-label="delete selected"
+                      translate
+                      translate-attr-label="CHAT.DELETE_SELECTED"
+                    >
+                      <md-icon md-font-icon="icon-delete"></md-icon>
+                    </md-button>
+                  </div>
+                </md-toolbar>
+
+                <!-- QUEUES TABLE -->
+                <md-table-container>
+                  <table
+                    md-table
+                    md-row-select
+                    multiple
+                    ng-model="vm_ac.selectedChatWebsiteApps"
+                  >
+                    <thead md-head>
+                      <tr md-row>
+                        <th md-column width="10px"></th>
+                        <th md-column width="10px">
+                          <span translate="VOICE.PRIORITY">Priority</span>
+                        </th>
+                        <th md-column>
+                          <span>Type</span>
+                        </th>
+                        <th md-column>
+                          <span>Appdata</span>
+                        </th>
+                        <th md-column>
+                          <span>Interval</span>
+                        </th>
+                        <th md-column width="10px"></th>
+                        <th md-column width="10px"></th>
+                      </tr>
+                    </thead>
+                    <tbody md-body ng-sortable="vm_ac.applications">
+                      <tr
+                        md-row
+                        md-select="app"
+                        md-select-id="id"
+                        ng-repeat="app in vm_ac.chatWebsiteApps.rows | filter: vm_ac.query.filter"
+                      >
+                        <td md-cell>
+                          <md-icon
+                            md-font-icon="icon-drag-vertical"
+                            class="s16 handle"
+                          ></md-icon>
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editChatWebsiteApp($event, $index)"
+                        >
+                          <span>{{app.priority}}</span>
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editChatWebsiteApp($event, $index)"
+                        >
+                          {{app.app.toLowerCase() === 'agi' ? 'Cally-Square' :
+                          app.app | ucfirst}}<span
+                            ng-if="app.appType.toLowerCase() === 'custom'"
+                            >*</span
+                          >
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editChatWebsiteApp($event, $index)"
+                        >
+                          <span class="text-truncate" style="width: 200px"
+                            >{{app.appdata}}</span
+                          >
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editInterval($event, $index)"
+                        >
+                          {{app.IntervalId ? 'From List' : app.interval}}
+                        </td>
+                        <td md-cell>
+                          <md-button
+                            ng-click="vm_ac.editInterval($event, $index)"
+                            class="md-icon-button"
+                            aria-label="Interval"
+                          >
+                            <md-icon md-font-icon="icon-timer"></md-icon>
+                            <md-tooltip>
+                              {{app.IntervalId ? 'From List' : (app.interval ===
+                              '*,*,*,*' ? 'Always' : 'Custom')}}
+                            </md-tooltip>
+                          </md-button>
+                        </td>
+                        <td
+                          md-cell
+                          class="actions"
+                          ng-if="!vm_ac.crudPermissions.readOnly"
+                        >
+                          <md-menu>
+                            <md-button
+                              class="md-icon-button"
+                              aria-label="More"
+                              translate
+                              translate-attr-aria-label="VOICE.MORE"
+                              ng-click="$mdOpenMenu($event)"
+                            >
+                              <md-icon
+                                md-font-icon="icon-dots-vertical"
+                              ></md-icon>
+                            </md-button>
+
+                            <md-menu-content width="3">
+                              <md-menu-item
+                                ng-if="vm_ac.crudPermissions.canEdit"
+                              >
+                                <md-button
+                                  ng-click="vm_ac.editChatWebsiteApp($event, $index)"
+                                  translate="VOICE.EDIT_APP"
+                                >
+                                  Edit App
+                                </md-button>
+                              </md-menu-item>
+                              <md-menu-item
+                                ng-if="vm_ac.crudPermissions.canEdit"
+                              >
+                                <md-button
+                                  ng-click="vm_ac.editInterval($event, $index)"
+                                  translate="VOICE.EDIT_INTERVAL"
+                                >
+                                  Edit Interval
+                                </md-button>
+                              </md-menu-item>
+                              <md-menu-item
+                                ng-if="vm_ac.crudPermissions.canDelete"
+                              >
+                                <md-button
+                                  ng-click="vm_ac.deleteConfirm(app, $index, $event)"
+                                  translate="VOICE.DELETE_APP"
+                                >
+                                  Delete App
+                                </md-button>
+                              </md-menu-item>
+                            </md-menu-content>
+                          </md-menu>
+                        </td>
+                      </tr>
+                      <tr md-row ng-hide="vm_ac.chatWebsiteApps.rows.length">
+                        <td md-cell colspan="7">
+                          <span
+                            class="text-boxed-light"
+                            translate="VOICE.NO_APPS_AVAILABLE"
+                            >No apps available</span
+                          >
+                        </td>
+                      </tr>
+                    </tbody>
+                  </table>
+                </md-table-container>
+                <!-- / QUEUES TABLE -->
+
+                <!-- NO RESULTS -->
+
+                <!-- / NO RESULTS -->
+              </div>
+              <!-- / MAIN -->
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="CHAT.INTERACTIONS">INTERACTIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="chatWebsite-detail-form-container interactions md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="ChatWebsiteInteractionsController as vm_dc"
+              ng-init="vm_dc.init(vm.chatWebsite, vm.crudPermissions)"
+            >
+              <md-toolbar
+                class="md-table-toolbar md-default"
+                ng-hide="vm_dc.selectedChatWebsiteInteractions.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead" translate="CHAT.INTERACTIONS"
+                    >Interactions</span
+                  >
+                  <ms-search-bar
+                    on-search="vm_dc.query.filter = query"
+                    on-collapse="vm_dc.query.filter = undefined"
+                    debounce="300"
+                    direction="down"
+                  ></ms-search-bar>
+                  <div flex></div>
+                  <ms-quick-filter
+                    filters="vm_dc.quickFilters"
+                    query="vm_dc.query"
+                    search="vm_dc.getChatWebsiteInteractions()"
+                  ></ms-quick-filter>
+                  <div layout="column">
+                    <md-button
+                      class="md-icon-button advanced-search"
+                      ng-class="{ 'md-fab md-mini md-accent-bg': vm_dc.query.search }"
+                      aria-label="Filter"
+                      translate
+                      translate-attr-aria-label="DASHBOARDS.FILTER"
+                      ng-click="vm_dc.openAdvancedSearch()"
+                    >
+                      <md-icon
+                        md-font-icon="{{ vm_dc.query.search ? 'icon-filter' : 'icon-filter-outline' }}"
+                        ng-class="{ 'blink': vm_dc.query.search }"
+                      ></md-icon>
+                    </md-button>
+                  </div>
+                  <md-button
+                    class="md-icon-button"
+                    ng-click="vm_dc.getChatWebsiteInteractions()"
+                    aria-label="refresh Interactions"
+                    translate
+                    translate-attr-label="CHAT.REFRESH_INTERACTIONS"
+                  >
+                    <md-icon md-font-icon="icon-refresh"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-toolbar
+                class="md-table-toolbar md-accent"
+                ng-show="vm_dc.selectedChatWebsiteInteractions.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead"
+                    >{{vm_dc.selectedChatWebsiteInteractions.length}}
+                    {{vm_dc.selectedChatWebsiteInteractions.length > 1 ? 'items'
+                    : 'item'}} selected</span
+                  >
+                  <div flex></div>
+                  <button
+                    class="md-icon-button"
+                    ng-csv="vm_dc.exportSelectedChatWebsiteInteractions"
+                    csv-label="true"
+                    filename="chatWebsites.csv"
+                  >
+                    <md-icon md-font-icon="icon-file-excel"></md-icon>
+                  </button>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canDelete"
+                    class="md-icon-button"
+                    ng-click="vm_dc.deleteSelectedChatWebsiteInteractions($event)"
+                    aria-label="delete selected"
+                    translate
+                    translate-attr-label="CHAT.DELETE_SELECTED"
+                  >
+                    <md-icon md-font-icon="icon-delete"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-table-container class="font-size-12">
+                <table
+                  md-table
+                  md-row-select
+                  multiple
+                  ng-model="vm_dc.selectedChatWebsiteInteractions"
+                  md-progress="vm_dc.promise"
+                >
+                  <thead
+                    md-head
+                    md-order="vm_dc.query.sort"
+                    md-on-reorder="vm_dc.getChatWebsiteInteractions"
+                  >
+                    <tr md-row>
+                      <th md-column md-order-by="id">
+                        {{ 'CHAT.ID' | translate }}
+                      </th>
+                      <th md-column class="no-padding">
+                        <md-icon md-font-icon="icon-eye" class="s16"></md-icon>
+                      </th>
+                      <th md-column class="no-padding"></th>
+                      <th md-column class="no-padding"></th>
+                      <th md-column>{{ 'CHAT.CONTACT' | translate }}</th>
+                      <th md-column md-order-by="createdAt">
+                        {{ 'CHAT.STARTEDAT' | translate }}
+                      </th>
+                      <th md-column md-order-by="lastMsgAt">
+                        {{ 'CHAT.LASTMESSAGE' | translate }}
+                      </th>
+                      <th md-column md-order-by="closed">
+                        {{ 'CHAT.STATUS' | translate }}
+                      </th>
+                      <th md-column>{{ 'CHAT.AGENT' | translate }}</th>
+                      <th md-column md-order-by="tag">
+                        {{ 'CHAT.TAGS' | translate }}
+                      </th>
+                      <th md-column width="10px"></th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr
+                      md-row
+                      md-select="interaction"
+                      md-select-id="id"
+                      ng-repeat="interaction in vm_dc.chatWebsiteInteractions.rows"
+                      ng-class="{'text-bold text-italic': interaction.unreadMessages > 0}"
+                    >
+                      <td md-cell>{{interaction.id}}</td>
+                      <td md-cell class="no-padding">
+                        <div
+                          ng-if="!interaction.closed && interaction.Users.length"
+                        >
+                          <md-icon
+                            md-font-icon="icon-eye"
+                            class="s16"
+                          ></md-icon>
+                          <md-tooltip>
+                            <span ng-repeat="user in interaction.Users"
+                              >{{ user.fullname | translate }}
+                              <span ng-if="!$last">, </span>
+                            </span>
+                          </md-tooltip>
+                        </div>
+                      </td>
+                      <td md-cell class="no-padding">
+                        <div
+                          ng-if="interaction.unreadMessages > 0"
+                          layout="row"
+                          layout-align="start center"
+                        >
+                          <span
+                            class="badge white-fg md-primary-bg"
+                            layout-margin
+                            >{{ interaction.unreadMessages}}</span
+                          >
+                        </div>
+                      </td>
+                      <td md-cell class="no-padding">
+                        <div ng-if="interaction.attach">
+                          <md-icon
+                            md-font-icon="icon-paperclip"
+                            class="s16"
+                          ></md-icon>
+                        </div>
+                      </td>
+                      <td md-cell>
+                        <div layout="column" layout-align="start start">
+                          <span
+                            class="font-size-12 text-truncate contact-text"
+                            ng-class="{'margin-bottom-0' : interaction.contactInfo}"
+                            layout-margin
+                            >{{ interaction.contactName }}</span
+                          >
+                          <span
+                            ng-if="interaction.contactInfo"
+                            class="font-size-12 text-truncate contact-text margin-top-0"
+                            layout-margin
+                            >{{ interaction.contactInfo }}</span
+                          >
+                        </div>
+                      </td>
+                      <td md-cell>{{ interaction.createdAt | formatdate }}</td>
+                      <td md-cell>
+                        <div layout="row">
+                          <span>
+                            <md-icon
+                              md-font-icon="{{interaction.lastMsgDirection == 'in' ? 'icon-arrow-down-bold blue-grey-800-fg' : 'icon-arrow-up-bold blue-grey-300-fg'}}"
+                            ></md-icon>
+                          </span>
+                          <div layout="column" layout-align="center center">
+                            <span class="text-truncate"
+                              >{{ interaction.lastMsgAt | formatdate }}</span
+                            >
+                          </div>
+                        </div>
+                      </td>
+                      <td md-cell>
+                        <span ng-if="interaction.closed === 0" class="green-fg">
+                          {{ 'CHAT.OPENED' | translate }}
+                          <span ng-if="interaction.substatus">
+                            - {{ interaction.substatus }}
+                          </span>
+                        </span>
+                        <span ng-if="interaction.closed === 1" class="red-fg">
+                          {{ 'CHAT.CLOSED' | translate }}
+                          <span ng-if="interaction.disposition">
+                            - {{ interaction.thirdDisposition ||
+                            interaction.secondDisposition ||
+                            interaction.disposition }}
+                          </span>
+                          <md-tooltip class="multiline">
+                            <div layout="column">
+                              <div layout="column">
+                                <span
+                                  >{{ 'DASHBOARDS.CLOSED_AT' |
+                                  translate}}:</span
+                                >
+                                <span class="text-bold"
+                                  >{{ interaction.closedAt | formatdate }}</span
+                                >
+                              </div>
+                              <div
+                                ng-if="interaction.disposition"
+                                layout="column"
+                              >
+                                <span
+                                  >{{ 'DASHBOARDS.DISPOSITION' |
+                                  translate}}:</span
+                                >
+                                <span class="text-bold"
+                                  >{{ interaction.disposition }}</span
+                                >
+                              </div>
+                              <div
+                                ng-if="interaction.secondDisposition"
+                                layout="column"
+                              >
+                                <span
+                                  >{{ 'DASHBOARDS.SECOND_LEVEL_DISPOSITION' |
+                                  translate}}:</span
+                                >
+                                <span class="text-bold"
+                                  >{{ interaction.secondDisposition }}</span
+                                >
+                              </div>
+                              <div
+                                ng-if="interaction.thirdDisposition"
+                                layout="column"
+                              >
+                                <span
+                                  >{{ 'DASHBOARDS.THIRD_LEVEL_DISPOSITION' |
+                                  translate}}:</span
+                                >
+                                <span class="text-bold"
+                                  >{{ interaction.thirdDisposition }}</span
+                                >
+                              </div>
+                            </div>
+                          </md-tooltip>
+                        </span>
+                      </td>
+
+                      <td md-cell>{{interaction.Owner.name}}</td>
+                      <td md-cell>
+                        <div ng-if="interaction.Tags.length">
+                          <md-tooltip md-direction="left" layout="row">
+                            <span ng-repeat="tag in interaction.Tags"
+                              >{{tag.name}}<span ng-if="!$last">, </span></span
+                            >
+                          </md-tooltip>
+                          <md-icon
+                            md-font-icon="icon-tag"
+                            ng-style="{'color': interaction.Tags.length == 1 && interaction.Tags[0].color }"
+                          >
+                          </md-icon>
+                        </div>
+                      </td>
+                      <td md-cell class="actions">
+                        <md-menu>
+                          <md-button
+                            class="md-icon-button"
+                            aria-label="More"
+                            translate
+                            translate-attr-aria-label="CHAT.MORE"
+                            ng-click="$mdOpenMenu($event)"
+                          >
+                            <md-icon
+                              md-font-icon="icon-dots-vertical"
+                            ></md-icon>
+                          </md-button>
+
+                          <md-menu-content width="3">
+                            <md-menu-item>
+                              <md-button
+                                ng-click="vm_dc.spychatInteraction($event, interaction)"
+                                translate="CHAT.SPYINTERACTION"
+                              >
+                                Spy Interaction
+                              </md-button>
+                            </md-menu-item>
+                            <md-menu-item>
+                              <md-button
+                                class="md-primary"
+                                ng-click="vm_dc.chatInteractionDownload(interaction, $event, true)"
+                                translate="CHAT.DOWNLOAD_WITH_ATTACHMENTS"
+                              >
+                                Download with attachments
+                              </md-button>
+                            </md-menu-item>
+                            <md-menu-item>
+                              <md-button
+                                class="md-primary"
+                                ng-click="vm_dc.chatInteractionDownload(interaction, $event)"
+                                translate="CHAT.DOWNLOAD_WITHOUT_ATTACHMENTS"
+                              >
+                                Download without attachments
+                              </md-button>
+                            </md-menu-item>
+                            <md-menu-item
+                              ng-if="vm_dc.crudPermissions.canDelete"
+                            >
+                              <md-button
+                                ng-click="vm_dc.deleteConfirm(interaction, $event)"
+                                translate="CHAT.DELETE_INTERACTION"
+                              >
+                                Delete Interaction
+                              </md-button>
+                            </md-menu-item>
+                          </md-menu-content>
+                        </md-menu>
+                      </td>
+                    </tr>
+                    <tr
+                      md-row
+                      ng-if="!vm_dc.chatWebsiteInteractions.rows.length"
+                    >
+                      <td md-cell colspan="12">
+                        <div layout="row" layout-align="center center">
+                          <span
+                            class="text-boxed-light"
+                            translate="CHAT.NO_INTERACTION_AVAILABLE"
+                            >No interaction available</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+              <md-table-pagination
+                md-label="{page: '{{'CHAT.PAGE' | translate}}:', rowsPerPage: '{{'CHAT.ROWSPERPAGE' | translate}}:', of: '{{'CHAT.OF' | translate}}'}"
+                md-limit="vm_dc.query.limit"
+                md-limit-options="[10, 15, 20, 50, 100, 250]"
+                md-page="vm_dc.query.page"
+                md-total="{{vm_dc.chatWebsiteInteractions.count}}"
+                md-on-paginate="vm_dc.getChatWebsiteInteractions"
+                md-page-select
+              ></md-table-pagination>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="CHAT.OFFLINEMESSAGES">OFFLINEMESSAGES</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="chatWebsite-detail-form-container offlinemessages md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="ChatWebsiteOfflineMessagesController as vm_dc"
+              ng-init="vm_dc.init(vm.chatWebsite, vm.crudPermissions)"
+            >
+              <md-toolbar
+                class="md-table-toolbar md-default"
+                ng-hide="vm_dc.selectedChatWebsiteOfflineMessages.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead" translate="CHAT.OFFLINEMESSAGES"
+                    >OfflineMessages</span
+                  >
+                  <ms-search-bar
+                    on-search="vm_dc.query.filter = query"
+                    on-collapse="vm_dc.query.filter = undefined"
+                    debounce="300"
+                    direction="down"
+                  ></ms-search-bar>
+                  <div flex></div>
+                </div>
+              </md-toolbar>
+              <md-toolbar
+                class="md-table-toolbar md-accent"
+                ng-show="vm_dc.selectedChatWebsiteOfflineMessages.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead"
+                    >{{vm_dc.selectedChatWebsiteOfflineMessages.length}}
+                    {{vm_dc.selectedChatWebsiteOfflineMessages.length > 1 ?
+                    'items' : 'item'}} selected</span
+                  >
+                  <div flex></div>
+                  <button
+                    class="md-icon-button"
+                    ng-csv="vm_dc.exportSelectedChatWebsiteOfflineMessages"
+                    csv-label="true"
+                    filename="chatWebsites.csv"
+                  >
+                    <md-icon md-font-icon="icon-file-excel"></md-icon>
+                  </button>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canDelete"
+                    class="md-icon-button"
+                    ng-click="vm_dc.deleteSelectedChatWebsiteOfflineMessages($event)"
+                    aria-label="delete selected"
+                    translate
+                    translate-attr-label="CHAT.DELETE_SELECTED"
+                  >
+                    <md-icon md-font-icon="icon-delete"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-table-container class="font-size-12">
+                <table
+                  md-table
+                  md-row-select
+                  multiple
+                  ng-model="vm_dc.selectedChatWebsiteOfflineMessages"
+                  md-progress="vm_dc.promise"
+                >
+                  <thead
+                    md-head
+                    md-order="vm_dc.query.sort"
+                    md-on-reorder="vm_dc.getChatWebsiteOfflineMessages"
+                  >
+                    <tr md-row>
+                      <th md-column md-order-by="id">
+                        {{ 'CHAT.ID' | translate }}
+                      </th>
+                      <th md-column>{{ 'CHAT.CONTACT' | translate }}</th>
+                      <th md-column md-order-by="createdAt">
+                        {{ 'CHAT.CREATED_AT' | translate }}
+                      </th>
+                      <th md-column width="10px"></th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr
+                      md-row
+                      md-select="offlineMessage"
+                      md-select-id="id"
+                      ng-repeat="offlineMessage in vm_dc.chatWebsiteOfflineMessages.rows"
+                    >
+                      <td md-cell>{{offlineMessage.id}}</td>
+                      <td md-cell>{{offlineMessage.Contact.firstName}}</td>
+                      <td md-cell>
+                        {{ offlineMessage.createdAt | formatdate }}
+                      </td>
+                      <td md-cell class="actions">
+                        <md-menu>
+                          <md-button
+                            class="md-icon-button"
+                            aria-label="More"
+                            translate
+                            translate-attr-aria-label="CHAT.MORE"
+                            ng-click="$mdOpenMenu($event)"
+                          >
+                            <md-icon
+                              md-font-icon="icon-dots-vertical"
+                            ></md-icon>
+                          </md-button>
+
+                          <md-menu-content width="3">
+                            <md-menu-item>
+                              <md-button
+                                ng-click="vm_dc.showOfflineMessageChatWebsiteOfflineMessage($event, offlineMessage)"
+                                translate="CHAT.SHOW_OFFLINEMESSAGE"
+                              >
+                                SHOW OfflineMessage
+                              </md-button>
+                            </md-menu-item>
+                            <md-menu-item
+                              ng-if="vm_dc.crudPermissions.canDelete"
+                            >
+                              <md-button
+                                ng-click="vm_dc.deleteConfirm(offlineMessage, $event)"
+                                translate="CHAT.DELETE_OFFLINEMESSAGE"
+                              >
+                                Delete OfflineMessage
+                              </md-button>
+                            </md-menu-item>
+                          </md-menu-content>
+                        </md-menu>
+                      </td>
+                    </tr>
+                    <tr
+                      md-row
+                      ng-if="!vm_dc.chatWebsiteOfflineMessages.rows.length"
+                    >
+                      <td md-cell colspan="5">
+                        <div layout="row" layout-align="center center">
+                          <span
+                            class="text-boxed-light"
+                            translate="CHAT.NO_OFFLINEMESSAGE_AVAILABLE"
+                            >No offlinemessage available</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+              <md-table-pagination
+                md-label="{page: '{{'CHAT.PAGE' | translate}}:', rowsPerPage: '{{'CHAT.ROWSPERPAGE' | translate}}:', of: '{{'CHAT.OF' | translate}}'}"
+                md-limit="vm_dc.query.limit"
+                md-limit-options="[10, 15, 20, 50, 100, 250]"
+                md-page="vm_dc.query.page"
+                md-total="{{vm_dc.chatWebsiteOfflineMessages.count}}"
+                md-on-paginate="vm_dc.getChatWebsiteOfflineMessages"
+                md-page-select
+              ></md-table-pagination>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/chat/views/realtime/agents/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/chat/views/realtime/agents/view.html/view-[chunkhash].html
deleted file mode 100644
index da2546c..0000000
--- a/public/src/js/modules/main/apps/chat/views/realtime/agents/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,517 +0,0 @@
-<!-- MAIN -->
-<md-toolbar class="md-table-toolbar md-default">
-  <div class="md-toolbar-tools">
-    <span class="md-subhead" translate="CHAT.AGENTS">Agents</span>
-    <div flex></div>
-    <ms-search-bar
-      on-search="vm.query.filter = query; vm.onInit()"
-      on-collapse="vm.query.filter = undefined; vm.onInit()"
-      debounce="300"
-    ></ms-search-bar>
-    <md-select
-      ng-model="vm.query.globalStatusFilter"
-      class="md-caption"
-      ng-change="vm.query.pauseTypeFilter = ''; vm.onInit()"
-    >
-      <md-option ng-value="''">{{ 'CHAT.ALL' | translate }}</md-option>
-      <md-option value="pause">{{ 'CHAT.PAUSE' | translate }}</md-option>
-      <md-option value="*pause"
-        >{{ 'CHAT.PARTIALPAUSE' | translate }}</md-option
-      >
-      <md-option value="busy">{{ 'CHAT.BUSY' | translate }}</md-option>
-      <md-option value="idle">{{ 'CHAT.IDLE' | translate }}</md-option>
-    </md-select>
-
-    <md-select
-      ng-if="vm.isPause(vm.query.globalStatusFilter)"
-      ng-model="vm.query.pauseTypeFilter"
-      class="md-caption"
-      ng-change="vm.onInit()"
-    >
-      <md-option ng-value="''">All</md-option>
-      <md-option value="DEFAULT PAUSE">DEFAULT PAUSE</md-option>
-      <md-option value="ACW">ACW</md-option>
-      <md-option value="LOGININPAUSE">LOGININPAUSE</md-option>
-      <md-option value="Auto-Pause">AUTOPAUSE</md-option>
-      <md-option ng-value="pause.name" ng-repeat="pause in vm.pauses.rows"
-        >{{pause.name}}</md-option
-      >
-    </md-select>
-  </div>
-</md-toolbar>
-
-<!-- AGENT TABLE -->
-<md-table-container>
-  <table md-table multiple md-progress="vm.promise">
-    <thead md-head md-order="vm.query.order" md-on-reorder="vm.onInit">
-      <tr md-row border="1">
-        <th class="bv text-center" colspan="5">
-          {{ 'CHAT.AGENT' | translate }}
-        </th>
-        <th class="bv bl text-center" colspan="2">
-          {{ 'VOICE.VOICE' | translate }}
-        </th>
-        <th ng-if="vm.license.chat" class="bv bl text-center" colspan="2">
-          {{ 'CHAT.CHAT' | translate }}
-        </th>
-        <th ng-if="vm.license.mail" class="bv bl text-center" colspan="2">
-          {{ 'MAIL.MAIL' | translate }}
-        </th>
-        <th ng-if="vm.license.messaging" class="bv bl text-center" colspan="2">
-          {{ 'SMS.SMS' | translate }}
-        </th>
-        <th
-          ng-if="vm.license.openchannel"
-          class="bv bl text-center"
-          colspan="2"
-        >
-          {{ 'OPENCHANNEL.OPENCHANNEL' | translate }}
-        </th>
-        <th ng-if="vm.license.fax" class="bv bl text-center" colspan="2">
-          {{ 'FAX.FAX' | translate }}
-        </th>
-        <th ng-if="vm.license.whatsapp" class="bv bl text-center" colspan="2">
-          {{ 'WHATSAPP.WHATSAPP' | translate }}
-        </th>
-        <th width="10px" class="bt bl" rowspan="2"></th>
-      </tr>
-      <tr md-row>
-        <th class="bl" colspan="2" md-column md-order-by="fullname">
-          {{ 'CHAT.NAME' | translate }}
-        </th>
-        <th class="bl custom-column" md-column md-order-by="globalStatus">
-          {{ 'CHAT.STATUS' | translate }}
-        </th>
-        <th class="bl custom-column" md-column md-order-by="lastLoginAt">
-          {{ 'CHAT.LOGIN_TIME' | translate }}
-        </th>
-        <th class="bl custom-column" md-column md-order-by="lastPauseAt">
-          {{ 'CHAT.PAUSE_TIME' | translate }}
-        </th>
-
-        <th class="bl custom-column">{{ 'VOICE.STATUS' | translate }}</th>
-        <th class="bl custom-column">Info</th>
-
-        <th ng-if="vm.license.chat" class="bl text-center">
-          {{ 'CHAT.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.chat" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'CHAT.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.mail" class="bl text-center">
-          {{ 'MAIL.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.mail" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'MAIL.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.messaging" class="bl text-center">
-          {{ 'SMS.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.messaging" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'SMS.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.openchannel" class="bl text-center">
-          {{ 'OPENCHANNEL.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.openchannel" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'OPENCHANNEL.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.fax" class="bl text-center">
-          {{ 'FAX.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.fax" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'FAX.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.whatsapp" class="bl text-center">
-          {{ 'WHATSAPP.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.whatsapp" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'WHATSAPP.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-      </tr>
-    </thead>
-    <tbody md-body>
-      <tr md-row ng-hide="vm.order.length">
-        <td md-cell colspan="19">
-          <div layout="row" layout-align="center center">
-            <span>{{ 'CHAT.NO_AGENT_ONLINE' | translate }}</span>
-          </div>
-        </td>
-      </tr>
-      <tr
-        md-select="vm.agents[value]"
-        md-select-id="id"
-        ng-repeat="(id, value) in vm.order"
-      >
-        <td class="bt padding-5">
-          <div layout="row" layout-align="start center">
-            <img
-              class="avatar"
-              ng-src="{{vm.agents[value].userpic && 'api/users/'+vm.agents[value].id+'/avatar' || 'assets/images/avatars/profile.png'}}"
-            />
-            <div layout="column">
-              <span>{{vm.agents[value].fullname}}</span>
-              <span>{{vm.agents[value].internal}}</span>
-            </div>
-          </div>
-        </td>
-        <td class="bt padding-5">
-          <div
-            layout="row"
-            layout-align="start center"
-            ng-if="vm.license.screenrecording && (vm.agents[value].phoneBarEnableScreenRecordingByAgent || vm.agents[value].phoneBarEnableAutomaticScreenRecording)"
-          >
-            <div class="column" ng-if="vm.agents[value].screenrecording">
-              <span>
-                <md-icon
-                  md-font-icon="icon-camcorder-box"
-                  style="color: green; font-size: 36px"
-                  aria-label="icon-camcorder-box26"
-                >
-                  <md-tooltip>
-                    {{ 'CHAT.TOOLTIP_SCREENRECORDING_ON' | translate }}
-                  </md-tooltip>
-                </md-icon>
-              </span>
-            </div>
-            <div class="column" ng-if="!vm.agents[value].screenrecording">
-              <span>
-                <md-icon
-                  md-font-icon="icon-camcorder-box"
-                  style="color: gray"
-                  aria-label="icon-camcorder-box26"
-                >
-                  <md-tooltip>
-                    {{ 'CHAT.TOOLTIP_SCREENRECORDING_OFF' | translate }}
-                  </md-tooltip>
-                </md-icon>
-              </span>
-            </div>
-          </div>
-        </td>
-
-        <td class="bt">
-          <span
-            class="text-boxed md-background-bg bl bt padding-5"
-            ng-class="{'idle':'lime-300-bg','busy':'indigo-100-bg','*pause':'amber-50-bg','pause':'amber-200-bg'}[vm.agents[value].globalStatus]"
-            >{{ vm.isPause(vm.agents[value].globalStatus) ? '' :
-            vm.agents[value].globalStatus | uppercase }} {{
-            vm.isPause(vm.agents[value].globalStatus) ?
-            (vm.isPartialPause(vm.agents[value].globalStatus) ?
-            '*'+vm.agents[value].pauseType || 'DEFAULT PAUSE' :
-            vm.agents[value].pauseType || 'DEFAULT PAUSE') : ''}}</span
-          >
-        </td>
-        <td class="bt custom-column">
-          <timer start-time="vm.agents[value].lastLoginAt" interval="1000"
-            >{{ days > 0 ? days + 'd' : '' }}
-            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
-          >
-        </td>
-        <td class="bt custom-column">
-          <timer
-            ng-if="vm.isPause(vm.agents[value].globalStatus) || vm.isPartialPause(vm.agents[value].globalStatus)"
-            start-time="vm.agents[value].lastPauseAt"
-            interval="1000"
-            >{{ days > 0 ? days + 'd' : '' }}
-            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
-          >
-        </td>
-        <td class="bt bl">
-          <div layout="row">
-            <span
-              ng-if="!vm.agents[value].onhold"
-              class="text-boxed md-background-bg bl bt padding-5"
-              ng-class="{'idle':'lime-300-bg','talking':'indigo-100-bg','ringing':'orange-400-bg','pause':'amber-200-bg'}[vm.agents[value].voiceStatus]"
-              >{{ vm.agents[value].voiceStatus | uppercase }}</span
-            >
-            <span
-              ng-if="vm.agents[value].onhold"
-              class="text-boxed md-background-bg bl bt padding-5 orange-400-bg"
-              >ONHOLD</span
-            >
-          </div>
-        </td>
-        <td class="bt bl">
-          <div layout="column">
-            <span
-              ng-if="vm.agents[value].queue"
-              class="padding-5"
-              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
-              >{{ vm.agents[value].queue }}</span
-            >
-            <span
-              ng-if="vm.agents[value].destconnectedlinenum"
-              class="padding-5"
-              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
-              >{{ vm.agents[value].destconnectedlinenum }}</span
-            >
-            <span
-              class="padding-5"
-              ng-if="vm.agents[value].queue || vm.agents[value].destconnectedlinenum"
-            >
-              <timer
-                start-time="vm.agents[value].voiceStatusTime"
-                interval="1000"
-                ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
-              >
-                {{hhours}}:{{mminutes}}:{{sseconds}}</timer
-              >
-            </span>
-          </div>
-        </td>
-
-        <td class="bt bl" ng-if="vm.license.chat">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].chatStatus]"
-                >{{ vm.agents[value].chatStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          md-number
-          class="bt text-center font-size-20"
-          ng-if="vm.license.chat"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].chatStatus]"
-        >
-          {{ vm.agents[value].chatCurrentCapacity }}
-        </td>
-
-        <td class="bl bt" ng-if="vm.license.mail">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].mailStatus]"
-                >{{ vm.agents[value].mailStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.mail"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].mailStatus]"
-        >
-          {{ vm.agents[value].mailCurrentCapacity }}
-        </td>
-
-        <td class="bl bt" ng-if="vm.license.messaging">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].smsStatus]"
-                >{{ vm.agents[value].smsStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.messaging"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].smsStatus]"
-        >
-          {{ vm.agents[value].smsCurrentCapacity }}
-        </td>
-
-        <td class="bt bl" ng-if="vm.license.openchannel">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].openchannelStatus]"
-                >{{ vm.agents[value].openchannelStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.openchannel"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].openchannelStatus]"
-        >
-          {{ vm.agents[value].openchannelCurrentCapacity }}
-        </td>
-
-        <td class="bt bl" ng-if="vm.license.fax">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].faxStatus]"
-                >{{ vm.agents[value].faxStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.fax"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].faxStatus]"
-        >
-          {{ vm.agents[value].faxCurrentCapacity }}
-        </td>
-
-        <td class="bl bt" ng-if="vm.license.whatsapp">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].whatsappStatus]"
-                >{{ vm.agents[value].whatsappStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.whatsapp"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].whatsappStatus]"
-        >
-          {{ vm.agents[value].whatsappCurrentCapacity }}
-        </td>
-
-        <td
-          class="bl bt padding-5 text-center"
-          ng-if="vm.crudPermissions.canEdit"
-        >
-          <md-menu>
-            <md-button
-              class="md-icon-button"
-              aria-label="More"
-              translate
-              translate-attr-aria-label="STAFF.MORE"
-              ng-click="$mdMenu.open($event)"
-            >
-              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-            </md-button>
-
-            <md-menu-content width="4">
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.logout(vm.agents[value], $event)"
-                  translate="CHAT.LOGOUT"
-                >
-                  Logout
-                </md-button>
-              </md-menu-item>
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.queueAdd(vm.agents[value], $event)"
-                  translate="CHAT.AGENTADD_QUEUE"
-                >
-                  Add Agent In Queue
-                </md-button>
-              </md-menu-item>
-
-              <md-menu-item
-                ng-if="vm.license.screenrecording && vm.agents[value].phoneBarEnableScreenRecordingByAgent"
-              >
-                <md-menu>
-                  <md-button
-                    ng-click="$mdMenu.open()"
-                    class="text-capitalize"
-                    translate="CHAT.SCREENRECORDING"
-                    >Screen Recording
-                  </md-button>
-                  <md-menu-content>
-                    <md-menu-item ng-if="!vm.agents[value].screenrecording">
-                      <md-button
-                        ng-click="vm.screenRecording(vm.agents[value], true)"
-                        ><em translate="CHAT.START_SCREENRECORDING"
-                          >Start Screen Recording</em
-                        ></md-button
-                      >
-                    </md-menu-item>
-                    <md-menu-item ng-if="vm.agents[value].screenrecording">
-                      <md-button
-                        ng-click="vm.screenRecording(vm.agents[value], false)"
-                        ><em translate="CHAT.STOP_SCREENRECORDING"
-                          >Stop Screen Recording</em
-                        ></md-button
-                      >
-                    </md-menu-item>
-                  </md-menu-content>
-                </md-menu>
-              </md-menu-item>
-
-              <md-menu-item>
-                <md-menu>
-                  <md-button
-                    ng-click="$mdMenu.open()"
-                    class="text-capitalize"
-                    translate="CHAT.PAUSE"
-                    >Pause</md-button
-                  >
-                  <md-menu-content>
-                    <md-menu-item>
-                      <md-button
-                        ng-disabled=" vm.agents[value].voicePause && 'DEFAULT PAUSE' === vm.agents[value].pauseType"
-                        ng-click="vm.pause(vm.agents[value])"
-                        ><em translate="CHAT.DEFAULT_PAUSE"
-                          >Default Pause</em
-                        ></md-button
-                      >
-                    </md-menu-item>
-                    <md-menu-item
-                      ng-if="vm.pauses.rows.length"
-                      ng-repeat="pause in vm.pauses.rows"
-                    >
-                      <md-button
-                        ng-disabled="vm.agents[value].voicePause && pause.name === vm.agents[value].pauseType"
-                        ng-click="vm.pause(vm.agents[value], pause.name)"
-                        >{{pause.name}}
-                      </md-button>
-                    </md-menu-item>
-                  </md-menu-content>
-                </md-menu>
-              </md-menu-item>
-              <md-menu-item ng-if="vm.isPause(vm.agents[value].globalStatus)">
-                <md-button
-                  ng-click="vm.unPause(vm.agents[value])"
-                  translate="CHAT.UNPAUSE"
-                >
-                  Unpause
-                </md-button>
-              </md-menu-item>
-            </md-menu-content>
-          </md-menu>
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</md-table-container>
-
-<md-table-pagination
-  md-label="{page: '{{'CHAT.PAGE' | translate}}:', rowsPerPage: '{{'CHAT.ROWSPERPAGE' | translate}}:', of: '{{'CHAT.OF' | translate}}'}"
-  md-limit="vm.query.limit"
-  md-limit-options="[10, 15, 20, 50, 100, 250]"
-  md-page="vm.query.page"
-  md-total="{{vm.filteredAgents.length}}"
-  md-on-paginate="vm.onInit"
-  md-page-select
-></md-table-pagination>
-<!-- / AGENT TABLE -->
-<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/chat/views/realtime/agents/view.html/view.html b/public/src/js/modules/main/apps/chat/views/realtime/agents/view.html/view.html
new file mode 100644
index 0000000..da2546c
--- /dev/null
+++ b/public/src/js/modules/main/apps/chat/views/realtime/agents/view.html/view.html
@@ -0,0 +1,517 @@
+<!-- MAIN -->
+<md-toolbar class="md-table-toolbar md-default">
+  <div class="md-toolbar-tools">
+    <span class="md-subhead" translate="CHAT.AGENTS">Agents</span>
+    <div flex></div>
+    <ms-search-bar
+      on-search="vm.query.filter = query; vm.onInit()"
+      on-collapse="vm.query.filter = undefined; vm.onInit()"
+      debounce="300"
+    ></ms-search-bar>
+    <md-select
+      ng-model="vm.query.globalStatusFilter"
+      class="md-caption"
+      ng-change="vm.query.pauseTypeFilter = ''; vm.onInit()"
+    >
+      <md-option ng-value="''">{{ 'CHAT.ALL' | translate }}</md-option>
+      <md-option value="pause">{{ 'CHAT.PAUSE' | translate }}</md-option>
+      <md-option value="*pause"
+        >{{ 'CHAT.PARTIALPAUSE' | translate }}</md-option
+      >
+      <md-option value="busy">{{ 'CHAT.BUSY' | translate }}</md-option>
+      <md-option value="idle">{{ 'CHAT.IDLE' | translate }}</md-option>
+    </md-select>
+
+    <md-select
+      ng-if="vm.isPause(vm.query.globalStatusFilter)"
+      ng-model="vm.query.pauseTypeFilter"
+      class="md-caption"
+      ng-change="vm.onInit()"
+    >
+      <md-option ng-value="''">All</md-option>
+      <md-option value="DEFAULT PAUSE">DEFAULT PAUSE</md-option>
+      <md-option value="ACW">ACW</md-option>
+      <md-option value="LOGININPAUSE">LOGININPAUSE</md-option>
+      <md-option value="Auto-Pause">AUTOPAUSE</md-option>
+      <md-option ng-value="pause.name" ng-repeat="pause in vm.pauses.rows"
+        >{{pause.name}}</md-option
+      >
+    </md-select>
+  </div>
+</md-toolbar>
+
+<!-- AGENT TABLE -->
+<md-table-container>
+  <table md-table multiple md-progress="vm.promise">
+    <thead md-head md-order="vm.query.order" md-on-reorder="vm.onInit">
+      <tr md-row border="1">
+        <th class="bv text-center" colspan="5">
+          {{ 'CHAT.AGENT' | translate }}
+        </th>
+        <th class="bv bl text-center" colspan="2">
+          {{ 'VOICE.VOICE' | translate }}
+        </th>
+        <th ng-if="vm.license.chat" class="bv bl text-center" colspan="2">
+          {{ 'CHAT.CHAT' | translate }}
+        </th>
+        <th ng-if="vm.license.mail" class="bv bl text-center" colspan="2">
+          {{ 'MAIL.MAIL' | translate }}
+        </th>
+        <th ng-if="vm.license.messaging" class="bv bl text-center" colspan="2">
+          {{ 'SMS.SMS' | translate }}
+        </th>
+        <th
+          ng-if="vm.license.openchannel"
+          class="bv bl text-center"
+          colspan="2"
+        >
+          {{ 'OPENCHANNEL.OPENCHANNEL' | translate }}
+        </th>
+        <th ng-if="vm.license.fax" class="bv bl text-center" colspan="2">
+          {{ 'FAX.FAX' | translate }}
+        </th>
+        <th ng-if="vm.license.whatsapp" class="bv bl text-center" colspan="2">
+          {{ 'WHATSAPP.WHATSAPP' | translate }}
+        </th>
+        <th width="10px" class="bt bl" rowspan="2"></th>
+      </tr>
+      <tr md-row>
+        <th class="bl" colspan="2" md-column md-order-by="fullname">
+          {{ 'CHAT.NAME' | translate }}
+        </th>
+        <th class="bl custom-column" md-column md-order-by="globalStatus">
+          {{ 'CHAT.STATUS' | translate }}
+        </th>
+        <th class="bl custom-column" md-column md-order-by="lastLoginAt">
+          {{ 'CHAT.LOGIN_TIME' | translate }}
+        </th>
+        <th class="bl custom-column" md-column md-order-by="lastPauseAt">
+          {{ 'CHAT.PAUSE_TIME' | translate }}
+        </th>
+
+        <th class="bl custom-column">{{ 'VOICE.STATUS' | translate }}</th>
+        <th class="bl custom-column">Info</th>
+
+        <th ng-if="vm.license.chat" class="bl text-center">
+          {{ 'CHAT.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.chat" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'CHAT.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.mail" class="bl text-center">
+          {{ 'MAIL.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.mail" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'MAIL.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.messaging" class="bl text-center">
+          {{ 'SMS.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.messaging" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'SMS.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.openchannel" class="bl text-center">
+          {{ 'OPENCHANNEL.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.openchannel" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'OPENCHANNEL.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.fax" class="bl text-center">
+          {{ 'FAX.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.fax" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'FAX.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.whatsapp" class="bl text-center">
+          {{ 'WHATSAPP.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.whatsapp" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'WHATSAPP.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+      </tr>
+    </thead>
+    <tbody md-body>
+      <tr md-row ng-hide="vm.order.length">
+        <td md-cell colspan="19">
+          <div layout="row" layout-align="center center">
+            <span>{{ 'CHAT.NO_AGENT_ONLINE' | translate }}</span>
+          </div>
+        </td>
+      </tr>
+      <tr
+        md-select="vm.agents[value]"
+        md-select-id="id"
+        ng-repeat="(id, value) in vm.order"
+      >
+        <td class="bt padding-5">
+          <div layout="row" layout-align="start center">
+            <img
+              class="avatar"
+              ng-src="{{vm.agents[value].userpic && 'api/users/'+vm.agents[value].id+'/avatar' || 'assets/images/avatars/profile.png'}}"
+            />
+            <div layout="column">
+              <span>{{vm.agents[value].fullname}}</span>
+              <span>{{vm.agents[value].internal}}</span>
+            </div>
+          </div>
+        </td>
+        <td class="bt padding-5">
+          <div
+            layout="row"
+            layout-align="start center"
+            ng-if="vm.license.screenrecording && (vm.agents[value].phoneBarEnableScreenRecordingByAgent || vm.agents[value].phoneBarEnableAutomaticScreenRecording)"
+          >
+            <div class="column" ng-if="vm.agents[value].screenrecording">
+              <span>
+                <md-icon
+                  md-font-icon="icon-camcorder-box"
+                  style="color: green; font-size: 36px"
+                  aria-label="icon-camcorder-box26"
+                >
+                  <md-tooltip>
+                    {{ 'CHAT.TOOLTIP_SCREENRECORDING_ON' | translate }}
+                  </md-tooltip>
+                </md-icon>
+              </span>
+            </div>
+            <div class="column" ng-if="!vm.agents[value].screenrecording">
+              <span>
+                <md-icon
+                  md-font-icon="icon-camcorder-box"
+                  style="color: gray"
+                  aria-label="icon-camcorder-box26"
+                >
+                  <md-tooltip>
+                    {{ 'CHAT.TOOLTIP_SCREENRECORDING_OFF' | translate }}
+                  </md-tooltip>
+                </md-icon>
+              </span>
+            </div>
+          </div>
+        </td>
+
+        <td class="bt">
+          <span
+            class="text-boxed md-background-bg bl bt padding-5"
+            ng-class="{'idle':'lime-300-bg','busy':'indigo-100-bg','*pause':'amber-50-bg','pause':'amber-200-bg'}[vm.agents[value].globalStatus]"
+            >{{ vm.isPause(vm.agents[value].globalStatus) ? '' :
+            vm.agents[value].globalStatus | uppercase }} {{
+            vm.isPause(vm.agents[value].globalStatus) ?
+            (vm.isPartialPause(vm.agents[value].globalStatus) ?
+            '*'+vm.agents[value].pauseType || 'DEFAULT PAUSE' :
+            vm.agents[value].pauseType || 'DEFAULT PAUSE') : ''}}</span
+          >
+        </td>
+        <td class="bt custom-column">
+          <timer start-time="vm.agents[value].lastLoginAt" interval="1000"
+            >{{ days > 0 ? days + 'd' : '' }}
+            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
+          >
+        </td>
+        <td class="bt custom-column">
+          <timer
+            ng-if="vm.isPause(vm.agents[value].globalStatus) || vm.isPartialPause(vm.agents[value].globalStatus)"
+            start-time="vm.agents[value].lastPauseAt"
+            interval="1000"
+            >{{ days > 0 ? days + 'd' : '' }}
+            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
+          >
+        </td>
+        <td class="bt bl">
+          <div layout="row">
+            <span
+              ng-if="!vm.agents[value].onhold"
+              class="text-boxed md-background-bg bl bt padding-5"
+              ng-class="{'idle':'lime-300-bg','talking':'indigo-100-bg','ringing':'orange-400-bg','pause':'amber-200-bg'}[vm.agents[value].voiceStatus]"
+              >{{ vm.agents[value].voiceStatus | uppercase }}</span
+            >
+            <span
+              ng-if="vm.agents[value].onhold"
+              class="text-boxed md-background-bg bl bt padding-5 orange-400-bg"
+              >ONHOLD</span
+            >
+          </div>
+        </td>
+        <td class="bt bl">
+          <div layout="column">
+            <span
+              ng-if="vm.agents[value].queue"
+              class="padding-5"
+              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
+              >{{ vm.agents[value].queue }}</span
+            >
+            <span
+              ng-if="vm.agents[value].destconnectedlinenum"
+              class="padding-5"
+              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
+              >{{ vm.agents[value].destconnectedlinenum }}</span
+            >
+            <span
+              class="padding-5"
+              ng-if="vm.agents[value].queue || vm.agents[value].destconnectedlinenum"
+            >
+              <timer
+                start-time="vm.agents[value].voiceStatusTime"
+                interval="1000"
+                ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
+              >
+                {{hhours}}:{{mminutes}}:{{sseconds}}</timer
+              >
+            </span>
+          </div>
+        </td>
+
+        <td class="bt bl" ng-if="vm.license.chat">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].chatStatus]"
+                >{{ vm.agents[value].chatStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          md-number
+          class="bt text-center font-size-20"
+          ng-if="vm.license.chat"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].chatStatus]"
+        >
+          {{ vm.agents[value].chatCurrentCapacity }}
+        </td>
+
+        <td class="bl bt" ng-if="vm.license.mail">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].mailStatus]"
+                >{{ vm.agents[value].mailStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.mail"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].mailStatus]"
+        >
+          {{ vm.agents[value].mailCurrentCapacity }}
+        </td>
+
+        <td class="bl bt" ng-if="vm.license.messaging">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].smsStatus]"
+                >{{ vm.agents[value].smsStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.messaging"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].smsStatus]"
+        >
+          {{ vm.agents[value].smsCurrentCapacity }}
+        </td>
+
+        <td class="bt bl" ng-if="vm.license.openchannel">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].openchannelStatus]"
+                >{{ vm.agents[value].openchannelStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.openchannel"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].openchannelStatus]"
+        >
+          {{ vm.agents[value].openchannelCurrentCapacity }}
+        </td>
+
+        <td class="bt bl" ng-if="vm.license.fax">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].faxStatus]"
+                >{{ vm.agents[value].faxStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.fax"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].faxStatus]"
+        >
+          {{ vm.agents[value].faxCurrentCapacity }}
+        </td>
+
+        <td class="bl bt" ng-if="vm.license.whatsapp">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].whatsappStatus]"
+                >{{ vm.agents[value].whatsappStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.whatsapp"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].whatsappStatus]"
+        >
+          {{ vm.agents[value].whatsappCurrentCapacity }}
+        </td>
+
+        <td
+          class="bl bt padding-5 text-center"
+          ng-if="vm.crudPermissions.canEdit"
+        >
+          <md-menu>
+            <md-button
+              class="md-icon-button"
+              aria-label="More"
+              translate
+              translate-attr-aria-label="STAFF.MORE"
+              ng-click="$mdMenu.open($event)"
+            >
+              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+            </md-button>
+
+            <md-menu-content width="4">
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.logout(vm.agents[value], $event)"
+                  translate="CHAT.LOGOUT"
+                >
+                  Logout
+                </md-button>
+              </md-menu-item>
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.queueAdd(vm.agents[value], $event)"
+                  translate="CHAT.AGENTADD_QUEUE"
+                >
+                  Add Agent In Queue
+                </md-button>
+              </md-menu-item>
+
+              <md-menu-item
+                ng-if="vm.license.screenrecording && vm.agents[value].phoneBarEnableScreenRecordingByAgent"
+              >
+                <md-menu>
+                  <md-button
+                    ng-click="$mdMenu.open()"
+                    class="text-capitalize"
+                    translate="CHAT.SCREENRECORDING"
+                    >Screen Recording
+                  </md-button>
+                  <md-menu-content>
+                    <md-menu-item ng-if="!vm.agents[value].screenrecording">
+                      <md-button
+                        ng-click="vm.screenRecording(vm.agents[value], true)"
+                        ><em translate="CHAT.START_SCREENRECORDING"
+                          >Start Screen Recording</em
+                        ></md-button
+                      >
+                    </md-menu-item>
+                    <md-menu-item ng-if="vm.agents[value].screenrecording">
+                      <md-button
+                        ng-click="vm.screenRecording(vm.agents[value], false)"
+                        ><em translate="CHAT.STOP_SCREENRECORDING"
+                          >Stop Screen Recording</em
+                        ></md-button
+                      >
+                    </md-menu-item>
+                  </md-menu-content>
+                </md-menu>
+              </md-menu-item>
+
+              <md-menu-item>
+                <md-menu>
+                  <md-button
+                    ng-click="$mdMenu.open()"
+                    class="text-capitalize"
+                    translate="CHAT.PAUSE"
+                    >Pause</md-button
+                  >
+                  <md-menu-content>
+                    <md-menu-item>
+                      <md-button
+                        ng-disabled=" vm.agents[value].voicePause && 'DEFAULT PAUSE' === vm.agents[value].pauseType"
+                        ng-click="vm.pause(vm.agents[value])"
+                        ><em translate="CHAT.DEFAULT_PAUSE"
+                          >Default Pause</em
+                        ></md-button
+                      >
+                    </md-menu-item>
+                    <md-menu-item
+                      ng-if="vm.pauses.rows.length"
+                      ng-repeat="pause in vm.pauses.rows"
+                    >
+                      <md-button
+                        ng-disabled="vm.agents[value].voicePause && pause.name === vm.agents[value].pauseType"
+                        ng-click="vm.pause(vm.agents[value], pause.name)"
+                        >{{pause.name}}
+                      </md-button>
+                    </md-menu-item>
+                  </md-menu-content>
+                </md-menu>
+              </md-menu-item>
+              <md-menu-item ng-if="vm.isPause(vm.agents[value].globalStatus)">
+                <md-button
+                  ng-click="vm.unPause(vm.agents[value])"
+                  translate="CHAT.UNPAUSE"
+                >
+                  Unpause
+                </md-button>
+              </md-menu-item>
+            </md-menu-content>
+          </md-menu>
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</md-table-container>
+
+<md-table-pagination
+  md-label="{page: '{{'CHAT.PAGE' | translate}}:', rowsPerPage: '{{'CHAT.ROWSPERPAGE' | translate}}:', of: '{{'CHAT.OF' | translate}}'}"
+  md-limit="vm.query.limit"
+  md-limit-options="[10, 15, 20, 50, 100, 250]"
+  md-page="vm.query.page"
+  md-total="{{vm.filteredAgents.length}}"
+  md-on-paginate="vm.onInit"
+  md-page-select
+></md-table-pagination>
+<!-- / AGENT TABLE -->
+<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/chat/views/realtime/queues/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/chat/views/realtime/queues/view.html/view-[chunkhash].html
deleted file mode 100644
index 9d59667..0000000
--- a/public/src/js/modules/main/apps/chat/views/realtime/queues/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,110 +0,0 @@
-<!-- MAIN -->
-<md-toolbar class="md-table-toolbar md-default">
-  <div class="md-toolbar-tools">
-    <span class="md-subhead" translate="CHAT.QUEUES">Queues</span>
-    <div flex></div>
-    <ms-search-bar
-      on-search="vm.query.filter = query;"
-      on-collapse="vm.query.filter = undefined;"
-      debounce="300"
-    ></ms-search-bar>
-  </div>
-</md-toolbar>
-
-<!-- QUEUE TABLE -->
-<md-table-container>
-  <table md-table multiple md-progress="vm.promise">
-    <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getQueues">
-      <tr md-row>
-        <th md-column md-order-by="name">{{ 'CHAT.NAME' | translate }}</th>
-        <th md-column>{{ 'CHAT.LOGGED_IN' | translate }}</th>
-        <th md-column>{{ 'CHAT.PAUSED' | translate }}</th>
-        <th md-column>{{ 'CHAT.READY' | translate }}</th>
-        <th md-column>{{ 'CHAT.WAITING' | translate }}</th>
-        <th md-column width="10px"></th>
-      </tr>
-    </thead>
-    <tbody md-body>
-      <tr md-row ng-hide="vm.queues">
-        <td md-cell colspan="7">
-          <div layout="row" layout-align="center center">
-            <span translate="CHAT.NO_AVAILABLE_INFO">No Available Info</span>
-          </div>
-        </td>
-      </tr>
-      <tr
-        md-row
-        md-select="vm.queues[value]"
-        md-select-id="id"
-        ng-repeat="(id, value) in vm.order"
-      >
-        <td md-cell>{{vm.queues[value].name}}</td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{vm.queues[value].loggedInDb || 0}} ({{vm.queues[value].loggedIn
-            || 0}})</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{vm.queues[value].paused || 0}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-16 grey-fg"
-            >{{vm.queues[value].available || 0}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{vm.queues[value].waiting || 0}}</span
-          >
-        </td>
-        <td md-cell class="actions" ng-if="vm.crudPermissions.canEdit">
-          <md-menu>
-            <md-button
-              class="md-icon-button"
-              aria-label="More"
-              translate
-              translate-attr-aria-label="CHAT.MORE"
-              ng-click="$mdMenu.open($event)"
-            >
-              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-            </md-button>
-
-            <md-menu-content width="3">
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.createOrEditChatQueue($event, vm.queues[value])"
-                  translate="CHAT.EDIT_QUEUE"
-                >
-                  Edit Queue
-                </md-button>
-              </md-menu-item>
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.agentAdd($event, vm.queues[value])"
-                  translate="CHAT.AGENTSADD_QUEUE"
-                >
-                  Add Agents to queue
-                </md-button>
-              </md-menu-item>
-            </md-menu-content>
-          </md-menu>
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</md-table-container>
-
-<md-table-pagination
-  md-label="{page: '{{'CHAT.PAGE' | translate}}:', rowsPerPage: '{{'CHAT.ROWSPERPAGE' | translate}}:', of: '{{'CHAT.OF' | translate}}'}"
-  md-limit="vm.query.limit"
-  md-limit-options="[10, 15, 20, 50, 100, 250]"
-  md-page="vm.query.page"
-  md-total="{{vm.count}}"
-  md-on-paginate="vm.getQueues"
-  md-page-select
-></md-table-pagination>
-<!-- / QUEUE TABLE -->
-<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/chat/views/realtime/queues/view.html/view.html b/public/src/js/modules/main/apps/chat/views/realtime/queues/view.html/view.html
new file mode 100644
index 0000000..9d59667
--- /dev/null
+++ b/public/src/js/modules/main/apps/chat/views/realtime/queues/view.html/view.html
@@ -0,0 +1,110 @@
+<!-- MAIN -->
+<md-toolbar class="md-table-toolbar md-default">
+  <div class="md-toolbar-tools">
+    <span class="md-subhead" translate="CHAT.QUEUES">Queues</span>
+    <div flex></div>
+    <ms-search-bar
+      on-search="vm.query.filter = query;"
+      on-collapse="vm.query.filter = undefined;"
+      debounce="300"
+    ></ms-search-bar>
+  </div>
+</md-toolbar>
+
+<!-- QUEUE TABLE -->
+<md-table-container>
+  <table md-table multiple md-progress="vm.promise">
+    <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getQueues">
+      <tr md-row>
+        <th md-column md-order-by="name">{{ 'CHAT.NAME' | translate }}</th>
+        <th md-column>{{ 'CHAT.LOGGED_IN' | translate }}</th>
+        <th md-column>{{ 'CHAT.PAUSED' | translate }}</th>
+        <th md-column>{{ 'CHAT.READY' | translate }}</th>
+        <th md-column>{{ 'CHAT.WAITING' | translate }}</th>
+        <th md-column width="10px"></th>
+      </tr>
+    </thead>
+    <tbody md-body>
+      <tr md-row ng-hide="vm.queues">
+        <td md-cell colspan="7">
+          <div layout="row" layout-align="center center">
+            <span translate="CHAT.NO_AVAILABLE_INFO">No Available Info</span>
+          </div>
+        </td>
+      </tr>
+      <tr
+        md-row
+        md-select="vm.queues[value]"
+        md-select-id="id"
+        ng-repeat="(id, value) in vm.order"
+      >
+        <td md-cell>{{vm.queues[value].name}}</td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{vm.queues[value].loggedInDb || 0}} ({{vm.queues[value].loggedIn
+            || 0}})</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{vm.queues[value].paused || 0}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-16 grey-fg"
+            >{{vm.queues[value].available || 0}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{vm.queues[value].waiting || 0}}</span
+          >
+        </td>
+        <td md-cell class="actions" ng-if="vm.crudPermissions.canEdit">
+          <md-menu>
+            <md-button
+              class="md-icon-button"
+              aria-label="More"
+              translate
+              translate-attr-aria-label="CHAT.MORE"
+              ng-click="$mdMenu.open($event)"
+            >
+              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+            </md-button>
+
+            <md-menu-content width="3">
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.createOrEditChatQueue($event, vm.queues[value])"
+                  translate="CHAT.EDIT_QUEUE"
+                >
+                  Edit Queue
+                </md-button>
+              </md-menu-item>
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.agentAdd($event, vm.queues[value])"
+                  translate="CHAT.AGENTSADD_QUEUE"
+                >
+                  Add Agents to queue
+                </md-button>
+              </md-menu-item>
+            </md-menu-content>
+          </md-menu>
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</md-table-container>
+
+<md-table-pagination
+  md-label="{page: '{{'CHAT.PAGE' | translate}}:', rowsPerPage: '{{'CHAT.ROWSPERPAGE' | translate}}:', of: '{{'CHAT.OF' | translate}}'}"
+  md-limit="vm.query.limit"
+  md-limit-options="[10, 15, 20, 50, 100, 250]"
+  md-page="vm.query.page"
+  md-total="{{vm.count}}"
+  md-on-paginate="vm.getQueues"
+  md-page-select
+></md-table-pagination>
+<!-- / QUEUE TABLE -->
+<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/chat/views/realtime/realtime.html/realtime-[chunkhash].html b/public/src/js/modules/main/apps/chat/views/realtime/realtime.html/realtime-[chunkhash].html
deleted file mode 100644
index e83bca8..0000000
--- a/public/src/js/modules/main/apps/chat/views/realtime/realtime.html/realtime-[chunkhash].html
+++ /dev/null
@@ -1,26 +0,0 @@
-<div id="realtime" class="page-layout simple tabbed" layout="column" ng-cloak>
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="CHAT.AGENTS">Agents</span>
-        </md-tab-label>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="CHAT.QUEUES">Queues</span>
-        </md-tab-label>
-      </md-tab>
-    </md-tabs>
-
-    <md-card ui-view></md-card>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/chat/views/realtime/realtime.html/realtime.html b/public/src/js/modules/main/apps/chat/views/realtime/realtime.html/realtime.html
new file mode 100644
index 0000000..e83bca8
--- /dev/null
+++ b/public/src/js/modules/main/apps/chat/views/realtime/realtime.html/realtime.html
@@ -0,0 +1,26 @@
+<div id="realtime" class="page-layout simple tabbed" layout="column" ng-cloak>
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="CHAT.AGENTS">Agents</span>
+        </md-tab-label>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="CHAT.QUEUES">Queues</span>
+        </md-tab-label>
+      </md-tab>
+    </md-tabs>
+
+    <md-card ui-view></md-card>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/companies/companies.html/companies-[chunkhash].html b/public/src/js/modules/main/apps/contactmanager/views/companies/companies.html/companies-[chunkhash].html
deleted file mode 100644
index 5908cea..0000000
--- a/public/src/js/modules/main/apps/contactmanager/views/companies/companies.html/companies-[chunkhash].html
+++ /dev/null
@@ -1,310 +0,0 @@
-<div
-  id="companies"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-account-circle" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="CONTACTMANAGER.COMPANIES"
-          >Companies</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="CONTACTMANAGER.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedCompanies.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedCompanies =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="CONTACTMANAGER.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-companies-count">
-          <span>{{vm.selectedCompanies.length}}</span>
-          <span translate="CONTACTMANAGER.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="CONTACTMANAGER.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllCompanies()"
-                translate="CONTACTMANAGER.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectCompanies()"
-                translate="CONTACTMANAGER.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedCompanies"
-          csv-label="true"
-          filename="companies.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedCompanies($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="CONTACTMANAGER.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- COMPANY TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedCompanies"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getCompanies"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">
-                  {{ 'CONTACTMANAGER.ID' | translate }}
-                </th>
-                <th md-column md-order-by="name">
-                  {{ 'CONTACTMANAGER.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'CONTACTMANAGER.DESCRIPTION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.companies.rows.length">
-                <td md-cell colspan="4">
-                  <div layout="row" layout-align="center center">
-                    <span translate="CONTACTMANAGER.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="company"
-                md-select-id="id"
-                ng-repeat="company in vm.companies.rows"
-              >
-                <td md-cell ng-if="company.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{company.name}}"
-                    ng-src="api/users/{{company.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!company.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{company.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(company, ev) : vm.createOrEditCompany($event, company)"
-                  md-cell
-                  class="id"
-                >
-                  {{company.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(company, ev) : vm.createOrEditCompany($event, company)"
-                  md-cell
-                  class="name"
-                >
-                  {{company.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(company, ev) : vm.createOrEditCompany($event, company)"
-                  md-cell
-                  class="description"
-                >
-                  {{company.description}}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="CONTACTMANAGER.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(company, $event    )"
-                          translate="CONTACTMANAGER.EDIT_COMPANY"
-                        >
-                          Edit Company
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.gotocontactsgoto(company, $event    )"
-                          translate="CONTACTMANAGER.GOTOCONTACTS_COMPANY"
-                        >
-                          goToContacts Company
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(company, $event    )"
-                          translate="CONTACTMANAGER.DELETE_COMPANY"
-                        >
-                          Delete Company
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'CONTACTMANAGER.PAGE' | translate}}:', rowsPerPage: '{{'CONTACTMANAGER.ROWSPERPAGE' | translate}}:', of: '{{'CONTACTMANAGER.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.companies.count}}"
-          md-on-paginate="vm.getCompanies"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / COMPANY TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD COMPANY BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-company-button"
-    ng-click="vm.createOrEditCompany($event)"
-    aria-label="add company"
-    translate
-    translate-attr-aria-label="CONTACTMANAGER.ADD_COMPANY"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD COMPANY BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/companies/companies.html/companies.html b/public/src/js/modules/main/apps/contactmanager/views/companies/companies.html/companies.html
new file mode 100644
index 0000000..5908cea
--- /dev/null
+++ b/public/src/js/modules/main/apps/contactmanager/views/companies/companies.html/companies.html
@@ -0,0 +1,310 @@
+<div
+  id="companies"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-account-circle" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="CONTACTMANAGER.COMPANIES"
+          >Companies</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="CONTACTMANAGER.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedCompanies.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedCompanies =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="CONTACTMANAGER.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-companies-count">
+          <span>{{vm.selectedCompanies.length}}</span>
+          <span translate="CONTACTMANAGER.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="CONTACTMANAGER.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllCompanies()"
+                translate="CONTACTMANAGER.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectCompanies()"
+                translate="CONTACTMANAGER.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedCompanies"
+          csv-label="true"
+          filename="companies.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedCompanies($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="CONTACTMANAGER.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- COMPANY TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedCompanies"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getCompanies"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">
+                  {{ 'CONTACTMANAGER.ID' | translate }}
+                </th>
+                <th md-column md-order-by="name">
+                  {{ 'CONTACTMANAGER.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'CONTACTMANAGER.DESCRIPTION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.companies.rows.length">
+                <td md-cell colspan="4">
+                  <div layout="row" layout-align="center center">
+                    <span translate="CONTACTMANAGER.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="company"
+                md-select-id="id"
+                ng-repeat="company in vm.companies.rows"
+              >
+                <td md-cell ng-if="company.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{company.name}}"
+                    ng-src="api/users/{{company.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!company.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{company.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(company, ev) : vm.createOrEditCompany($event, company)"
+                  md-cell
+                  class="id"
+                >
+                  {{company.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(company, ev) : vm.createOrEditCompany($event, company)"
+                  md-cell
+                  class="name"
+                >
+                  {{company.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(company, ev) : vm.createOrEditCompany($event, company)"
+                  md-cell
+                  class="description"
+                >
+                  {{company.description}}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="CONTACTMANAGER.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(company, $event    )"
+                          translate="CONTACTMANAGER.EDIT_COMPANY"
+                        >
+                          Edit Company
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.gotocontactsgoto(company, $event    )"
+                          translate="CONTACTMANAGER.GOTOCONTACTS_COMPANY"
+                        >
+                          goToContacts Company
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(company, $event    )"
+                          translate="CONTACTMANAGER.DELETE_COMPANY"
+                        >
+                          Delete Company
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'CONTACTMANAGER.PAGE' | translate}}:', rowsPerPage: '{{'CONTACTMANAGER.ROWSPERPAGE' | translate}}:', of: '{{'CONTACTMANAGER.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.companies.count}}"
+          md-on-paginate="vm.getCompanies"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / COMPANY TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD COMPANY BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-company-button"
+    ng-click="vm.createOrEditCompany($event)"
+    aria-label="add company"
+    translate
+    translate-attr-aria-label="CONTACTMANAGER.ADD_COMPANY"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD COMPANY BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/companies/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/contactmanager/views/companies/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index c19ba1f..0000000
--- a/public/src/js/modules/main/apps/contactmanager/views/companies/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,303 +0,0 @@
-<md-dialog class="company-dialog" aria-label="New Company">
-  <form name="companyForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="CONTACTMANAGER.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.company.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="companyForm['name'].$error"
-          ng-show="companyForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CONTACTMANAGER.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CONTACTMANAGER.PHONE">Phone</label>
-        <input type="text" name="phone" ng-model="vm.company.phone" />
-
-        <div
-          ng-messages="companyForm['phone'].$error"
-          ng-show="companyForm['phone'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CONTACTMANAGER.ERRORS.PHONE_REQUIRED"
-              >Phone field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CONTACTMANAGER.VAT">Vat</label>
-        <input type="text" name="vat" ng-model="vm.company.vat" />
-
-        <div
-          ng-messages="companyForm['vat'].$error"
-          ng-show="companyForm['vat'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CONTACTMANAGER.ERRORS.VAT_REQUIRED"
-              >Vat field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CONTACTMANAGER.FAX">Fax</label>
-        <input type="text" name="fax" ng-model="vm.company.fax" />
-
-        <div
-          ng-messages="companyForm['fax'].$error"
-          ng-show="companyForm['fax'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CONTACTMANAGER.ERRORS.FAX_REQUIRED"
-              >Fax field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CONTACTMANAGER.COMPANYID">CompanyId</label>
-        <input type="text" name="companyId" ng-model="vm.company.companyId" />
-
-        <div
-          ng-messages="companyForm['companyId'].$error"
-          ng-show="companyForm['companyId'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CONTACTMANAGER.ERRORS.COMPANYID_REQUIRED"
-              >CompanyId field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CONTACTMANAGER.TYPE">Type</label>
-        <input type="text" name="type" ng-model="vm.company.type" />
-
-        <div
-          ng-messages="companyForm['type'].$error"
-          ng-show="companyForm['type'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CONTACTMANAGER.ERRORS.TYPE_REQUIRED"
-              >Type field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CONTACTMANAGER.WEBSITE">Website</label>
-        <input
-          type="text"
-          name="website"
-          ng-model="vm.company.website"
-          md-maxlength="255"
-        />
-
-        <div
-          ng-messages="companyForm['website'].$error"
-          ng-show="companyForm['website'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CONTACTMANAGER.ERRORS.WEBSITE_REQUIRED"
-              >Website field is required</span
-            >
-          </div>
-          <div ng-message="md-maxlength">
-            <span
-              translate="CONTACTMANAGER.ERRORS.WEBSITE_MAX_LENGTH"
-              translate-values="{max: 255}"
-              >Website must have a maximum length equal to 255</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CONTACTMANAGER.EMAIL_DOMAIN">Email_Domain</label>
-        <input
-          type="text"
-          name="emailDomain"
-          ng-model="vm.company.emailDomain"
-        />
-
-        <div
-          ng-messages="companyForm['emailDomain'].$error"
-          ng-show="companyForm['emailDomain'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CONTACTMANAGER.ERRORS.EMAIL_DOMAIN_REQUIRED"
-              >Email_Domain field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CONTACTMANAGER.EMAIL">Email</label>
-        <input type="email" name="email" ng-model="vm.company.email" />
-
-        <div
-          ng-messages="companyForm['email'].$error"
-          ng-show="companyForm['email'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CONTACTMANAGER.ERRORS.EMAIL_REQUIRED"
-              >Email field is required</span
-            >
-          </div>
-          <div ng-message="email">
-            <span translate="CONTACTMANAGER.ERRORS.EMAIL_MUST_VALID"
-              >Email must be a valid e-mail address</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CONTACTMANAGER.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.company.description"
-        />
-
-        <div
-          ng-messages="companyForm['description'].$error"
-          ng-show="companyForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CONTACTMANAGER.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newCompany"
-          ng-click="vm.saveCompany()"
-          class="send-button md-accent md-raised"
-          ng-disabled="companyForm.$invalid || companyForm.$pristine"
-          aria-label="SAVE"
-          translate="CONTACTMANAGER.SAVE"
-          translate-attr-aria-label="CONTACTMANAGER.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newCompany"
-          ng-click="vm.addNewCompany()"
-          class="send-button md-accent md-raised"
-          ng-disabled="companyForm.$invalid"
-          aria-label="ADD"
-          translate="CONTACTMANAGER.ADD_COMPANY"
-          translate-attr-aria-label="CONTACTMANAGER.ADD_COMPANY"
-        >
-          ADD COMPANY
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newCompany"
-          ng-click="vm.deleteCompany($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="CONTACTMANAGER.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="CONTACTMANAGER.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/companies/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/contactmanager/views/companies/create/dialog.html/dialog.html
new file mode 100644
index 0000000..c19ba1f
--- /dev/null
+++ b/public/src/js/modules/main/apps/contactmanager/views/companies/create/dialog.html/dialog.html
@@ -0,0 +1,303 @@
+<md-dialog class="company-dialog" aria-label="New Company">
+  <form name="companyForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="CONTACTMANAGER.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.company.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="companyForm['name'].$error"
+          ng-show="companyForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CONTACTMANAGER.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CONTACTMANAGER.PHONE">Phone</label>
+        <input type="text" name="phone" ng-model="vm.company.phone" />
+
+        <div
+          ng-messages="companyForm['phone'].$error"
+          ng-show="companyForm['phone'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CONTACTMANAGER.ERRORS.PHONE_REQUIRED"
+              >Phone field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CONTACTMANAGER.VAT">Vat</label>
+        <input type="text" name="vat" ng-model="vm.company.vat" />
+
+        <div
+          ng-messages="companyForm['vat'].$error"
+          ng-show="companyForm['vat'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CONTACTMANAGER.ERRORS.VAT_REQUIRED"
+              >Vat field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CONTACTMANAGER.FAX">Fax</label>
+        <input type="text" name="fax" ng-model="vm.company.fax" />
+
+        <div
+          ng-messages="companyForm['fax'].$error"
+          ng-show="companyForm['fax'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CONTACTMANAGER.ERRORS.FAX_REQUIRED"
+              >Fax field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CONTACTMANAGER.COMPANYID">CompanyId</label>
+        <input type="text" name="companyId" ng-model="vm.company.companyId" />
+
+        <div
+          ng-messages="companyForm['companyId'].$error"
+          ng-show="companyForm['companyId'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CONTACTMANAGER.ERRORS.COMPANYID_REQUIRED"
+              >CompanyId field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CONTACTMANAGER.TYPE">Type</label>
+        <input type="text" name="type" ng-model="vm.company.type" />
+
+        <div
+          ng-messages="companyForm['type'].$error"
+          ng-show="companyForm['type'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CONTACTMANAGER.ERRORS.TYPE_REQUIRED"
+              >Type field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CONTACTMANAGER.WEBSITE">Website</label>
+        <input
+          type="text"
+          name="website"
+          ng-model="vm.company.website"
+          md-maxlength="255"
+        />
+
+        <div
+          ng-messages="companyForm['website'].$error"
+          ng-show="companyForm['website'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CONTACTMANAGER.ERRORS.WEBSITE_REQUIRED"
+              >Website field is required</span
+            >
+          </div>
+          <div ng-message="md-maxlength">
+            <span
+              translate="CONTACTMANAGER.ERRORS.WEBSITE_MAX_LENGTH"
+              translate-values="{max: 255}"
+              >Website must have a maximum length equal to 255</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CONTACTMANAGER.EMAIL_DOMAIN">Email_Domain</label>
+        <input
+          type="text"
+          name="emailDomain"
+          ng-model="vm.company.emailDomain"
+        />
+
+        <div
+          ng-messages="companyForm['emailDomain'].$error"
+          ng-show="companyForm['emailDomain'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CONTACTMANAGER.ERRORS.EMAIL_DOMAIN_REQUIRED"
+              >Email_Domain field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CONTACTMANAGER.EMAIL">Email</label>
+        <input type="email" name="email" ng-model="vm.company.email" />
+
+        <div
+          ng-messages="companyForm['email'].$error"
+          ng-show="companyForm['email'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CONTACTMANAGER.ERRORS.EMAIL_REQUIRED"
+              >Email field is required</span
+            >
+          </div>
+          <div ng-message="email">
+            <span translate="CONTACTMANAGER.ERRORS.EMAIL_MUST_VALID"
+              >Email must be a valid e-mail address</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CONTACTMANAGER.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.company.description"
+        />
+
+        <div
+          ng-messages="companyForm['description'].$error"
+          ng-show="companyForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CONTACTMANAGER.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newCompany"
+          ng-click="vm.saveCompany()"
+          class="send-button md-accent md-raised"
+          ng-disabled="companyForm.$invalid || companyForm.$pristine"
+          aria-label="SAVE"
+          translate="CONTACTMANAGER.SAVE"
+          translate-attr-aria-label="CONTACTMANAGER.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newCompany"
+          ng-click="vm.addNewCompany()"
+          class="send-button md-accent md-raised"
+          ng-disabled="companyForm.$invalid"
+          aria-label="ADD"
+          translate="CONTACTMANAGER.ADD_COMPANY"
+          translate-attr-aria-label="CONTACTMANAGER.ADD_COMPANY"
+        >
+          ADD COMPANY
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newCompany"
+          ng-click="vm.deleteCompany($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="CONTACTMANAGER.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="CONTACTMANAGER.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/companies/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/contactmanager/views/companies/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index 0ca8700..0000000
--- a/public/src/js/modules/main/apps/contactmanager/views/companies/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,540 +0,0 @@
-<div
-  id="contactmanager-company"
-  class="page-layout simple tabbed"
-  layout="column"
->
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-companies-button md-icon-button"
-        aria-label="Go to companies"
-        ng-click="vm.gotoCompanies()"
-        translate
-        translate-attr-aria-label="CONTACTMANAGER.GO_TO_COMPANIES"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="company-image" hide-xs>
-          <img ng-src="assets/images/business/companies.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.company.id}}
-            <span ng-if="vm.company.name">{{vm.company.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="CONTACTMANAGER.CREATED_AT"></span>
-            <span>{{vm.company.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.gotogoto(vm.company, $event)"
-        class="md-fab md-warn md-icon-button"
-        aria-label="goto"
-      >
-        <md-tooltip
-          ><span translate="CONTACTMANAGER.GOTO_COMPANY"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-forward"></md-icon>
-      </md-button>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveCompany()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (addressForm.$invalid) || (shipmentAddressForm.$invalid)"
-        translate="CONTACTMANAGER.SAVE"
-        translate-attr-aria-label="CONTACTMANAGER.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="CONTACTMANAGER.GENERAL">GENERAL</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="company-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="CONTACTMANAGER.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="CONTACTMANAGER.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.company.name"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CONTACTMANAGER.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CONTACTMANAGER.PHONE">Phone</label>
-                <input
-                  type="text"
-                  name="phone"
-                  ng-model="vm.company.phone"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['phone'].$error"
-                  ng-show="generalForm['phone'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CONTACTMANAGER.ERRORS.PHONE_REQUIRED"
-                      >Phone field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CONTACTMANAGER.VAT">Vat</label>
-                <input
-                  type="text"
-                  name="vat"
-                  ng-model="vm.company.vat"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['vat'].$error"
-                  ng-show="generalForm['vat'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CONTACTMANAGER.ERRORS.VAT_REQUIRED"
-                      >Vat field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CONTACTMANAGER.FAX">Fax</label>
-                <input
-                  type="text"
-                  name="fax"
-                  ng-model="vm.company.fax"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['fax'].$error"
-                  ng-show="generalForm['fax'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CONTACTMANAGER.ERRORS.FAX_REQUIRED"
-                      >Fax field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CONTACTMANAGER.COMPANYID">CompanyId</label>
-                <input
-                  type="text"
-                  name="companyId"
-                  ng-model="vm.company.companyId"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['companyId'].$error"
-                  ng-show="generalForm['companyId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CONTACTMANAGER.ERRORS.COMPANYID_REQUIRED"
-                      >CompanyId field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CONTACTMANAGER.TYPE">Type</label>
-                <input
-                  type="text"
-                  name="type"
-                  ng-model="vm.company.type"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['type'].$error"
-                  ng-show="generalForm['type'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CONTACTMANAGER.ERRORS.TYPE_REQUIRED"
-                      >Type field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CONTACTMANAGER.WEBSITE">Website</label>
-                <input
-                  type="text"
-                  name="website"
-                  ng-model="vm.company.website"
-                  md-maxlength="255"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['website'].$error"
-                  ng-show="generalForm['website'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CONTACTMANAGER.ERRORS.WEBSITE_REQUIRED"
-                      >Website field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="CONTACTMANAGER.ERRORS.WEBSITE_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >Website must have a maximum length equal to 255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CONTACTMANAGER.EMAIL_DOMAIN"
-                  >Email_Domain</label
-                >
-                <input
-                  type="text"
-                  name="emailDomain"
-                  ng-model="vm.company.emailDomain"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['emailDomain'].$error"
-                  ng-show="generalForm['emailDomain'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="CONTACTMANAGER.ERRORS.EMAIL_DOMAIN_REQUIRED"
-                      >Email_Domain field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CONTACTMANAGER.EMAIL">Email</label>
-                <input
-                  type="email"
-                  name="email"
-                  ng-model="vm.company.email"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['email'].$error"
-                  ng-show="generalForm['email'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CONTACTMANAGER.ERRORS.EMAIL_REQUIRED"
-                      >Email field is required</span
-                    >
-                  </div>
-                  <div ng-message="email">
-                    <span translate="CONTACTMANAGER.ERRORS.EMAIL_MUST_VALID"
-                      >Email must be a valid e-mail address</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CONTACTMANAGER.DESCRIPTION"
-                  >Description</label
-                >
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.company.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CONTACTMANAGER.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="CONTACTMANAGER.ADDRESS">ADDRESS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="company-detail-form-container address md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="CONTACTMANAGER.ADDRESS">
-                ADDRESS
-              </div>
-            </div>
-            <form name="addressForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="CONTACTMANAGER.STREET">Street</label>
-                <input
-                  type="text"
-                  name="street"
-                  ng-model="vm.company.street"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="addressForm['street'].$error"
-                  ng-show="addressForm['street'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CONTACTMANAGER.ERRORS.STREET_REQUIRED"
-                      >Street field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CONTACTMANAGER.POSTAL_CODE"
-                  >Postal_Code</label
-                >
-                <input
-                  type="text"
-                  name="postalCode"
-                  ng-model="vm.company.postalCode"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="addressForm['postalCode'].$error"
-                  ng-show="addressForm['postalCode'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CONTACTMANAGER.ERRORS.POSTAL_CODE_REQUIRED"
-                      >Postal_Code field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CONTACTMANAGER.CITY">City</label>
-                <input
-                  type="text"
-                  name="city"
-                  ng-model="vm.company.city"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="addressForm['city'].$error"
-                  ng-show="addressForm['city'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CONTACTMANAGER.ERRORS.CITY_REQUIRED"
-                      >City field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CONTACTMANAGER.COUNTRY">Country</label>
-                <input
-                  type="text"
-                  name="country"
-                  ng-model="vm.company.country"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="addressForm['country'].$error"
-                  ng-show="addressForm['country'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CONTACTMANAGER.ERRORS.COUNTRY_REQUIRED"
-                      >Country field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="CONTACTMANAGER.SHIPMENTADDRESS"
-            >SHIPMENTADDRESS</span
-          >
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="company-detail-form-container shipmentaddress md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div
-                class="h2 secondary-text"
-                translate="CONTACTMANAGER.SHIPMENTADDRESS"
-              >
-                SHIPMENTADDRESS
-              </div>
-            </div>
-            <form name="shipmentAddressForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="CONTACTMANAGER.STREET">Street</label>
-                <input
-                  type="text"
-                  name="sStreet"
-                  ng-model="vm.company.sStreet"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="shipmentAddressForm['sStreet'].$error"
-                  ng-show="shipmentAddressForm['sStreet'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CONTACTMANAGER.ERRORS.STREET_REQUIRED"
-                      >Street field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CONTACTMANAGER.POSTAL_CODE"
-                  >Postal_Code</label
-                >
-                <input
-                  type="text"
-                  name="sPostalCode"
-                  ng-model="vm.company.sPostalCode"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="shipmentAddressForm['sPostalCode'].$error"
-                  ng-show="shipmentAddressForm['sPostalCode'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CONTACTMANAGER.ERRORS.POSTAL_CODE_REQUIRED"
-                      >Postal_Code field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CONTACTMANAGER.CITY">City</label>
-                <input
-                  type="text"
-                  name="sCity"
-                  ng-model="vm.company.sCity"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="shipmentAddressForm['sCity'].$error"
-                  ng-show="shipmentAddressForm['sCity'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CONTACTMANAGER.ERRORS.CITY_REQUIRED"
-                      >City field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CONTACTMANAGER.COUNTRY">Country</label>
-                <input
-                  type="text"
-                  name="sCountry"
-                  ng-model="vm.company.sCountry"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="shipmentAddressForm['sCountry'].$error"
-                  ng-show="shipmentAddressForm['sCountry'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CONTACTMANAGER.ERRORS.COUNTRY_REQUIRED"
-                      >Country field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/companies/edit/view.html/view.html b/public/src/js/modules/main/apps/contactmanager/views/companies/edit/view.html/view.html
new file mode 100644
index 0000000..0ca8700
--- /dev/null
+++ b/public/src/js/modules/main/apps/contactmanager/views/companies/edit/view.html/view.html
@@ -0,0 +1,540 @@
+<div
+  id="contactmanager-company"
+  class="page-layout simple tabbed"
+  layout="column"
+>
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-companies-button md-icon-button"
+        aria-label="Go to companies"
+        ng-click="vm.gotoCompanies()"
+        translate
+        translate-attr-aria-label="CONTACTMANAGER.GO_TO_COMPANIES"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="company-image" hide-xs>
+          <img ng-src="assets/images/business/companies.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.company.id}}
+            <span ng-if="vm.company.name">{{vm.company.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="CONTACTMANAGER.CREATED_AT"></span>
+            <span>{{vm.company.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.gotogoto(vm.company, $event)"
+        class="md-fab md-warn md-icon-button"
+        aria-label="goto"
+      >
+        <md-tooltip
+          ><span translate="CONTACTMANAGER.GOTO_COMPANY"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-forward"></md-icon>
+      </md-button>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveCompany()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (addressForm.$invalid) || (shipmentAddressForm.$invalid)"
+        translate="CONTACTMANAGER.SAVE"
+        translate-attr-aria-label="CONTACTMANAGER.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="CONTACTMANAGER.GENERAL">GENERAL</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="company-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="CONTACTMANAGER.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="CONTACTMANAGER.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.company.name"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CONTACTMANAGER.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CONTACTMANAGER.PHONE">Phone</label>
+                <input
+                  type="text"
+                  name="phone"
+                  ng-model="vm.company.phone"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['phone'].$error"
+                  ng-show="generalForm['phone'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CONTACTMANAGER.ERRORS.PHONE_REQUIRED"
+                      >Phone field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CONTACTMANAGER.VAT">Vat</label>
+                <input
+                  type="text"
+                  name="vat"
+                  ng-model="vm.company.vat"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['vat'].$error"
+                  ng-show="generalForm['vat'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CONTACTMANAGER.ERRORS.VAT_REQUIRED"
+                      >Vat field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CONTACTMANAGER.FAX">Fax</label>
+                <input
+                  type="text"
+                  name="fax"
+                  ng-model="vm.company.fax"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['fax'].$error"
+                  ng-show="generalForm['fax'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CONTACTMANAGER.ERRORS.FAX_REQUIRED"
+                      >Fax field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CONTACTMANAGER.COMPANYID">CompanyId</label>
+                <input
+                  type="text"
+                  name="companyId"
+                  ng-model="vm.company.companyId"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['companyId'].$error"
+                  ng-show="generalForm['companyId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CONTACTMANAGER.ERRORS.COMPANYID_REQUIRED"
+                      >CompanyId field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CONTACTMANAGER.TYPE">Type</label>
+                <input
+                  type="text"
+                  name="type"
+                  ng-model="vm.company.type"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['type'].$error"
+                  ng-show="generalForm['type'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CONTACTMANAGER.ERRORS.TYPE_REQUIRED"
+                      >Type field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CONTACTMANAGER.WEBSITE">Website</label>
+                <input
+                  type="text"
+                  name="website"
+                  ng-model="vm.company.website"
+                  md-maxlength="255"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['website'].$error"
+                  ng-show="generalForm['website'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CONTACTMANAGER.ERRORS.WEBSITE_REQUIRED"
+                      >Website field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="CONTACTMANAGER.ERRORS.WEBSITE_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >Website must have a maximum length equal to 255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CONTACTMANAGER.EMAIL_DOMAIN"
+                  >Email_Domain</label
+                >
+                <input
+                  type="text"
+                  name="emailDomain"
+                  ng-model="vm.company.emailDomain"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['emailDomain'].$error"
+                  ng-show="generalForm['emailDomain'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="CONTACTMANAGER.ERRORS.EMAIL_DOMAIN_REQUIRED"
+                      >Email_Domain field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CONTACTMANAGER.EMAIL">Email</label>
+                <input
+                  type="email"
+                  name="email"
+                  ng-model="vm.company.email"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['email'].$error"
+                  ng-show="generalForm['email'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CONTACTMANAGER.ERRORS.EMAIL_REQUIRED"
+                      >Email field is required</span
+                    >
+                  </div>
+                  <div ng-message="email">
+                    <span translate="CONTACTMANAGER.ERRORS.EMAIL_MUST_VALID"
+                      >Email must be a valid e-mail address</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CONTACTMANAGER.DESCRIPTION"
+                  >Description</label
+                >
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.company.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CONTACTMANAGER.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="CONTACTMANAGER.ADDRESS">ADDRESS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="company-detail-form-container address md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="CONTACTMANAGER.ADDRESS">
+                ADDRESS
+              </div>
+            </div>
+            <form name="addressForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="CONTACTMANAGER.STREET">Street</label>
+                <input
+                  type="text"
+                  name="street"
+                  ng-model="vm.company.street"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="addressForm['street'].$error"
+                  ng-show="addressForm['street'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CONTACTMANAGER.ERRORS.STREET_REQUIRED"
+                      >Street field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CONTACTMANAGER.POSTAL_CODE"
+                  >Postal_Code</label
+                >
+                <input
+                  type="text"
+                  name="postalCode"
+                  ng-model="vm.company.postalCode"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="addressForm['postalCode'].$error"
+                  ng-show="addressForm['postalCode'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CONTACTMANAGER.ERRORS.POSTAL_CODE_REQUIRED"
+                      >Postal_Code field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CONTACTMANAGER.CITY">City</label>
+                <input
+                  type="text"
+                  name="city"
+                  ng-model="vm.company.city"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="addressForm['city'].$error"
+                  ng-show="addressForm['city'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CONTACTMANAGER.ERRORS.CITY_REQUIRED"
+                      >City field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CONTACTMANAGER.COUNTRY">Country</label>
+                <input
+                  type="text"
+                  name="country"
+                  ng-model="vm.company.country"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="addressForm['country'].$error"
+                  ng-show="addressForm['country'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CONTACTMANAGER.ERRORS.COUNTRY_REQUIRED"
+                      >Country field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="CONTACTMANAGER.SHIPMENTADDRESS"
+            >SHIPMENTADDRESS</span
+          >
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="company-detail-form-container shipmentaddress md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div
+                class="h2 secondary-text"
+                translate="CONTACTMANAGER.SHIPMENTADDRESS"
+              >
+                SHIPMENTADDRESS
+              </div>
+            </div>
+            <form name="shipmentAddressForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="CONTACTMANAGER.STREET">Street</label>
+                <input
+                  type="text"
+                  name="sStreet"
+                  ng-model="vm.company.sStreet"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="shipmentAddressForm['sStreet'].$error"
+                  ng-show="shipmentAddressForm['sStreet'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CONTACTMANAGER.ERRORS.STREET_REQUIRED"
+                      >Street field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CONTACTMANAGER.POSTAL_CODE"
+                  >Postal_Code</label
+                >
+                <input
+                  type="text"
+                  name="sPostalCode"
+                  ng-model="vm.company.sPostalCode"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="shipmentAddressForm['sPostalCode'].$error"
+                  ng-show="shipmentAddressForm['sPostalCode'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CONTACTMANAGER.ERRORS.POSTAL_CODE_REQUIRED"
+                      >Postal_Code field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CONTACTMANAGER.CITY">City</label>
+                <input
+                  type="text"
+                  name="sCity"
+                  ng-model="vm.company.sCity"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="shipmentAddressForm['sCity'].$error"
+                  ng-show="shipmentAddressForm['sCity'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CONTACTMANAGER.ERRORS.CITY_REQUIRED"
+                      >City field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CONTACTMANAGER.COUNTRY">Country</label>
+                <input
+                  type="text"
+                  name="sCountry"
+                  ng-model="vm.company.sCountry"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="shipmentAddressForm['sCountry'].$error"
+                  ng-show="shipmentAddressForm['sCountry'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CONTACTMANAGER.ERRORS.COUNTRY_REQUIRED"
+                      >Country field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/contacts/contacts.html/contacts-[chunkhash].html b/public/src/js/modules/main/apps/contactmanager/views/contacts/contacts.html/contacts-[chunkhash].html
deleted file mode 100644
index cc6b0ab..0000000
--- a/public/src/js/modules/main/apps/contactmanager/views/contacts/contacts.html/contacts-[chunkhash].html
+++ /dev/null
@@ -1,475 +0,0 @@
-<div id="contacts" class="page-layout simple left-sidenav inner-sidenav">
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-account-multiple" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="CONTACTMANAGER.CONTACTS"
-          >Contacts</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <!-- SEARCH -->
-    <div class="search-input-wrapper" layout="row" layout-align="start center">
-      <label for="search">
-        <md-icon md-font-icon="icon-magnify"></md-icon>
-      </label>
-      <md-input-container md-no-float class="m-0">
-        <input
-          id="search"
-          placeholder="Search for anyone"
-          type="text"
-          ng-model="vm.query.filter"
-          ng-model-options="{ debounce: 1000 }"
-          translate
-          translate-attr-placeholder="CONTACTMANAGER.SEARCH_FOR_ANYONE"
-        />
-      </md-input-container>
-    </div>
-    <!-- / SEARCH -->
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedContacts.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedContacts =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="CONTACTMANAGER.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-contacts-count">
-          <span>{{vm.selectedContacts.length}}</span>
-          <span translate="CONTACTMANAGER.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdOpenMenu($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="CONTACTS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllContacts()"
-                translate="CONTACTMANAGER.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectContacts()"
-                translate="CONTACTMANAGER.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedContacts"
-          csv-label="true"
-          filename="contacts.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          ng-if="vm.crudPermissions.canDelete"
-          class="md-icon-button"
-          ng-click="vm.deleteSelectedContacts($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="CONTACTS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <div layout="row">
-        <div class="column" flex="20">
-          <md-card>
-            <md-card-content>
-              <button
-                layout-align="center center"
-                md-mini-fab
-                ng-click="vm.selectedList = null; vm.selectedCompany = null; vm.selectedTags = []"
-              >
-                <md-icon md-font-icon="icon-refresh"></md-icon>{{
-                'CONTACTMANAGER.ALL_CONTACTS' | translate }}
-              </button>
-            </md-card-content>
-          </md-card>
-          <md-card>
-            <md-card-content>
-              <md-input-container class="md-block" flex-gt-sm="">
-                <label translate="CONTACTMANAGER.SELECT_LIST"
-                  >Select a list</label
-                >
-                <md-select
-                  placeholder="Select a list"
-                  ng-model="vm.selectedList"
-                  ng-disabled="vm.lists.count === 0"
-                >
-                  <md-option ng-value="null"
-                    ><em translate="CONTACTMANAGER.ALL">All</em></md-option
-                  >
-                  <md-option
-                    ng-value="list.id"
-                    ng-repeat="list in vm.lists.rows"
-                    >{{list.name}}</md-option
-                  >
-                </md-select>
-              </md-input-container>
-            </md-card-content>
-          </md-card>
-          <md-card>
-            <md-card-content>
-              <md-input-container class="md-block" flex-gt-sm="">
-                <label translate="CONTACTMANAGER.SELECT_COMPANY"
-                  >Select a company</label
-                >
-                <md-select
-                  placeholder="Select a company"
-                  flex="100"
-                  ng-model="vm.selectedCompany"
-                  ng-disabled="vm.companies.count === 0"
-                >
-                  <md-option ng-value="null"
-                    ><em translate="CONTACTMANAGER.ALL">All</em></md-option
-                  >
-                  <md-option
-                    ng-value="company.id"
-                    ng-repeat="company in vm.companies.rows"
-                    >{{company.name}}</md-option
-                  >
-                </md-select>
-              </md-input-container>
-            </md-card-content>
-          </md-card>
-          <md-card>
-            <md-card-content>
-              <md-input-container class="md-block" flex-gt-sm="">
-                <label translate="CONTACTMANAGER.SELECT_TAGS"
-                  >Select one or more tags</label
-                >
-                <md-select
-                  multiple
-                  placeholder="Select one or more tags"
-                  flex="100"
-                  ng-model="vm.query.tag"
-                  ng-change="vm.getContacts()"
-                >
-                  <md-option ng-value="tag.id" ng-repeat="tag in vm.tags.rows"
-                    >{{tag.name}}</md-option
-                  >
-                </md-select>
-              </md-input-container>
-            </md-card-content>
-          </md-card>
-        </div>
-
-        <!-- USER TABLE -->
-        <md-card flex="80">
-          <md-table-container ng-init="vm.getAssignedCompanies()">
-            <table
-              md-table
-              md-row-select
-              multiple
-              ng-model="vm.selectedContacts"
-              md-progress="vm.promise"
-            >
-              <thead
-                md-head
-                md-order="vm.query.sort"
-                md-on-reorder="vm.getContacts"
-              >
-                <tr md-row>
-                  <th md-column md-order-by="id">ID</th>
-                  <th md-column md-order-by="firstName">
-                    {{'CONTACTMANAGER.FULLNAME' | translate}}
-                  </th>
-                  <th md-column md-order-by="phone">
-                    {{'CONTACTMANAGER.PHONE' | translate}}
-                  </th>
-                  <th md-column md-order-by="email">
-                    {{'CONTACTMANAGER.EMAIL' | translate}}
-                  </th>
-                  <th md-column md-order-by="createdAt">
-                    {{'CONTACTMANAGER.CREATED_AT' | translate}}
-                  </th>
-                  <th md-column md-order-by="ListId">
-                    {{'CONTACTMANAGER.LIST' | translate}}
-                  </th>
-                  <th md-column md-order-by="CompanyId">
-                    {{'CONTACTMANAGER.COMPANY' | translate}}
-                  </th>
-                  <th md-column md-order-by="tags">
-                    {{'CONTACTMANAGER.TAGS' | translate}}
-                  </th>
-                  <th md-column width="10px"></th>
-                </tr>
-              </thead>
-              <tbody md-body>
-                <tr md-row ng-hide="vm.contacts.rows.length">
-                  <td md-cell colspan="8">
-                    <div layout="row" layout-align="center center">
-                      <span translate="CONTACTMANAGER.NO_AVAILABLE_INFO"
-                        >No Available Info</span
-                      >
-                    </div>
-                  </td>
-                </tr>
-                <tr
-                  md-row
-                  md-select="contact"
-                  md-select-id="id"
-                  ng-repeat="contact in vm.contacts.rows"
-                >
-                  <td
-                    ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editdialog(contact, ev) : vm.createOrEditContact($event, contact)"
-                    md-cell
-                    class="id"
-                  >
-                    {{contact.id}}
-                  </td>
-                  <td
-                    ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editdialog(contact, ev) : vm.createOrEditContact($event, contact)"
-                    md-cell
-                    class="firstName"
-                  >
-                    {{contact.firstName}} {{contact.lastName}}
-                  </td>
-                  <td
-                    ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editdialog(contact, ev) : vm.createOrEditContact($event, contact)"
-                    md-cell
-                    class="phone"
-                  >
-                    {{contact.phone}}
-                  </td>
-                  <td
-                    ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editdialog(contact, ev) : vm.createOrEditContact($event, contact)"
-                    md-cell
-                    class="email"
-                  >
-                    {{contact.email}}
-                  </td>
-                  <td
-                    ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editdialog(contact, ev) : vm.createOrEditContact($event, contact)"
-                    md-cell
-                    class="createdAt"
-                  >
-                    {{contact.createdAt | date:'medium'}}
-                  </td>
-                  <td
-                    ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editdialog(contact, ev) : vm.createOrEditContact($event, contact)"
-                    md-cell
-                    class="list"
-                  >
-                    {{vm.listsMap[contact.ListId]}}
-                  </td>
-                  <td
-                    ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editdialog(contact, ev) : vm.createOrEditContact($event, contact)"
-                    md-cell
-                    class="company"
-                  >
-                    {{vm.companiesMap[contact.CompanyId]}}
-                  </td>
-                  <td md-cell class="tag">
-                    <div ng-if="contact.Tags.length">
-                      <div
-                        ng-if="contact.Tags.length == 1"
-                        layout="column"
-                        layout-align="center center"
-                      >
-                        <md-icon
-                          md-font-icon="icon-tag"
-                          ng-style="{'color': contact.Tags[0].color }"
-                        ></md-icon>
-                        <span class="text-truncate"
-                          >{{contact.Tags[0].name}}</span
-                        >
-                      </div>
-                      <div
-                        ng-if="contact.Tags.length > 1"
-                        layout="column"
-                        layout-align="center center"
-                      >
-                        <md-tooltip md-direction="left" layout="row">
-                          <span ng-repeat="tag in contact.Tags"
-                            >{{tag.name}}<span ng-if="!$last">, </span></span
-                          >
-                        </md-tooltip>
-                        <md-icon md-font-icon="icon-tag"></md-icon>
-                      </div>
-                    </div>
-                  </td>
-                  <td
-                    md-cell
-                    class="actions"
-                    ng-if="!vm.crudPermissions.readOnly"
-                  >
-                    <md-menu>
-                      <md-button
-                        class="md-icon-button"
-                        aria-label="More"
-                        translate
-                        translate-attr-aria-label="CONTACTMANAGER.MORE"
-                        ng-click="$mdOpenMenu($event)"
-                      >
-                        <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                      </md-button>
-
-                      <md-menu-content width="3">
-                        <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                          <md-button
-                            ng-click="vm.editdialog(contact, ev)"
-                            translate="CONTACTMANAGER.EDIT_CONTACT"
-                          >
-                            Edit Contact
-                          </md-button>
-                        </md-menu-item>
-                        <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                          <md-button
-                            ng-click="vm.mergeContact(ev, contact)"
-                            translate="CONTACTMANAGER.MERGE_CONTACT"
-                          >
-                            Merge Contact
-                          </md-button>
-                        </md-menu-item>
-                        <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                          <md-button
-                            ng-click="vm.duplicateContact(ev, contact)"
-                            translate="CONTACTMANAGER.DUPLICATE_CONTACT"
-                          >
-                            Duplicate Contact
-                          </md-button>
-                        </md-menu-item>
-                        <md-menu-divider
-                          ng-if="vm.crudPermissions.canEdit && vm.crudPermissions.canDelete"
-                        >
-                        </md-menu-divider>
-                        <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                          <md-button
-                            ng-click="vm.deleteconfirm(contact, ev)"
-                            translate="CONTACTMANAGER.DELETE_CONTACT"
-                          >
-                            Delete Contact
-                          </md-button>
-                        </md-menu-item>
-                      </md-menu-content>
-                    </md-menu>
-                  </td>
-                </tr>
-              </tbody>
-            </table>
-          </md-table-container>
-
-          <md-table-pagination
-            md-label="{page: '{{'CONTACTMANAGER.PAGE' | translate}}:', rowsPerPage: '{{'CONTACTMANAGER.ROWSPERPAGE' | translate}}:', of: '{{'CONTACTMANAGER.OF' | translate}}'}"
-            md-limit="vm.query.limit"
-            md-limit-options="[10, 15, 20, 50, 100, 250]"
-            md-page="vm.query.page"
-            md-total="{{vm.contacts.count}}"
-            md-on-paginate="vm.getContacts"
-            md-page-select
-          ></md-table-pagination>
-        </md-card>
-        <!-- / USER TABLE -->
-      </div>
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD USER BUTTON -->
-  <md-fab-speed-dial
-    id="add-contact-button"
-    ng-if="vm.crudPermissions.canEdit"
-    ng-hide="vm.options.hidden"
-    md-direction="up"
-    md-open="vm.options.isOpen"
-    class="md-scale md-fab"
-    ng-class="{ 'md-hover-full': vm.options.hover }"
-    ng-mouseenter="vm.options.isOpen=true"
-    ng-mouseleave="vm.options.isOpen=false"
-  >
-    <md-fab-trigger>
-      <md-button aria-label="menu" class="md-fab md-accent">
-        <md-icon md-font-icon="icon-plus"></md-icon>
-      </md-button>
-    </md-fab-trigger>
-    <md-fab-actions>
-      <md-button
-        class="md-fab md-mini md-warn"
-        flow-btn
-        flow-init="vm.ngFlowOptions"
-        flow-files-submitted="$flow.upload()"
-        flow-file-success="vm.importContacts($file, $message, $flow)"
-        flow-file-added="vm.fileAdded($file)"
-        aria-label="Select File"
-        translate
-        translate-attr-aria-label="CONTACTMANAGER.IMPORT_CONTACTS"
-      >
-        <md-tooltip
-          md-direction="left"
-          md-visible="tooltipVisible"
-          md-autohide="false"
-        >
-          {{'CONTACTMANAGER.IMPORT_CONTACTS' | translate}}
-        </md-tooltip>
-        <md-icon md-font-icon="icon-upload"></md-icon>
-      </md-button>
-      <md-button
-        class="md-fab md-mini md-accent"
-        ng-click="vm.createOrEditContact($event)"
-        aria-label="add contact"
-        translate
-        translate-attr-aria-label="CONTACTMANAGER.ADD_CONTACT"
-      >
-        <md-tooltip
-          md-direction="left"
-          md-visible="tooltipVisible"
-          md-autohide="false"
-        >
-          {{'CONTACTMANAGER.ADD_CONTACT' | translate}}
-        </md-tooltip>
-        <md-icon md-font-icon="icon-account-plus"></md-icon>
-      </md-button>
-    </md-fab-actions>
-  </md-fab-speed-dial>
-  <!-- / ADD USER BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/contacts/contacts.html/contacts.html b/public/src/js/modules/main/apps/contactmanager/views/contacts/contacts.html/contacts.html
new file mode 100644
index 0000000..cc6b0ab
--- /dev/null
+++ b/public/src/js/modules/main/apps/contactmanager/views/contacts/contacts.html/contacts.html
@@ -0,0 +1,475 @@
+<div id="contacts" class="page-layout simple left-sidenav inner-sidenav">
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-account-multiple" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="CONTACTMANAGER.CONTACTS"
+          >Contacts</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <!-- SEARCH -->
+    <div class="search-input-wrapper" layout="row" layout-align="start center">
+      <label for="search">
+        <md-icon md-font-icon="icon-magnify"></md-icon>
+      </label>
+      <md-input-container md-no-float class="m-0">
+        <input
+          id="search"
+          placeholder="Search for anyone"
+          type="text"
+          ng-model="vm.query.filter"
+          ng-model-options="{ debounce: 1000 }"
+          translate
+          translate-attr-placeholder="CONTACTMANAGER.SEARCH_FOR_ANYONE"
+        />
+      </md-input-container>
+    </div>
+    <!-- / SEARCH -->
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedContacts.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedContacts =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="CONTACTMANAGER.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-contacts-count">
+          <span>{{vm.selectedContacts.length}}</span>
+          <span translate="CONTACTMANAGER.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdOpenMenu($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="CONTACTS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllContacts()"
+                translate="CONTACTMANAGER.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectContacts()"
+                translate="CONTACTMANAGER.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedContacts"
+          csv-label="true"
+          filename="contacts.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          ng-if="vm.crudPermissions.canDelete"
+          class="md-icon-button"
+          ng-click="vm.deleteSelectedContacts($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="CONTACTS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <div layout="row">
+        <div class="column" flex="20">
+          <md-card>
+            <md-card-content>
+              <button
+                layout-align="center center"
+                md-mini-fab
+                ng-click="vm.selectedList = null; vm.selectedCompany = null; vm.selectedTags = []"
+              >
+                <md-icon md-font-icon="icon-refresh"></md-icon>{{
+                'CONTACTMANAGER.ALL_CONTACTS' | translate }}
+              </button>
+            </md-card-content>
+          </md-card>
+          <md-card>
+            <md-card-content>
+              <md-input-container class="md-block" flex-gt-sm="">
+                <label translate="CONTACTMANAGER.SELECT_LIST"
+                  >Select a list</label
+                >
+                <md-select
+                  placeholder="Select a list"
+                  ng-model="vm.selectedList"
+                  ng-disabled="vm.lists.count === 0"
+                >
+                  <md-option ng-value="null"
+                    ><em translate="CONTACTMANAGER.ALL">All</em></md-option
+                  >
+                  <md-option
+                    ng-value="list.id"
+                    ng-repeat="list in vm.lists.rows"
+                    >{{list.name}}</md-option
+                  >
+                </md-select>
+              </md-input-container>
+            </md-card-content>
+          </md-card>
+          <md-card>
+            <md-card-content>
+              <md-input-container class="md-block" flex-gt-sm="">
+                <label translate="CONTACTMANAGER.SELECT_COMPANY"
+                  >Select a company</label
+                >
+                <md-select
+                  placeholder="Select a company"
+                  flex="100"
+                  ng-model="vm.selectedCompany"
+                  ng-disabled="vm.companies.count === 0"
+                >
+                  <md-option ng-value="null"
+                    ><em translate="CONTACTMANAGER.ALL">All</em></md-option
+                  >
+                  <md-option
+                    ng-value="company.id"
+                    ng-repeat="company in vm.companies.rows"
+                    >{{company.name}}</md-option
+                  >
+                </md-select>
+              </md-input-container>
+            </md-card-content>
+          </md-card>
+          <md-card>
+            <md-card-content>
+              <md-input-container class="md-block" flex-gt-sm="">
+                <label translate="CONTACTMANAGER.SELECT_TAGS"
+                  >Select one or more tags</label
+                >
+                <md-select
+                  multiple
+                  placeholder="Select one or more tags"
+                  flex="100"
+                  ng-model="vm.query.tag"
+                  ng-change="vm.getContacts()"
+                >
+                  <md-option ng-value="tag.id" ng-repeat="tag in vm.tags.rows"
+                    >{{tag.name}}</md-option
+                  >
+                </md-select>
+              </md-input-container>
+            </md-card-content>
+          </md-card>
+        </div>
+
+        <!-- USER TABLE -->
+        <md-card flex="80">
+          <md-table-container ng-init="vm.getAssignedCompanies()">
+            <table
+              md-table
+              md-row-select
+              multiple
+              ng-model="vm.selectedContacts"
+              md-progress="vm.promise"
+            >
+              <thead
+                md-head
+                md-order="vm.query.sort"
+                md-on-reorder="vm.getContacts"
+              >
+                <tr md-row>
+                  <th md-column md-order-by="id">ID</th>
+                  <th md-column md-order-by="firstName">
+                    {{'CONTACTMANAGER.FULLNAME' | translate}}
+                  </th>
+                  <th md-column md-order-by="phone">
+                    {{'CONTACTMANAGER.PHONE' | translate}}
+                  </th>
+                  <th md-column md-order-by="email">
+                    {{'CONTACTMANAGER.EMAIL' | translate}}
+                  </th>
+                  <th md-column md-order-by="createdAt">
+                    {{'CONTACTMANAGER.CREATED_AT' | translate}}
+                  </th>
+                  <th md-column md-order-by="ListId">
+                    {{'CONTACTMANAGER.LIST' | translate}}
+                  </th>
+                  <th md-column md-order-by="CompanyId">
+                    {{'CONTACTMANAGER.COMPANY' | translate}}
+                  </th>
+                  <th md-column md-order-by="tags">
+                    {{'CONTACTMANAGER.TAGS' | translate}}
+                  </th>
+                  <th md-column width="10px"></th>
+                </tr>
+              </thead>
+              <tbody md-body>
+                <tr md-row ng-hide="vm.contacts.rows.length">
+                  <td md-cell colspan="8">
+                    <div layout="row" layout-align="center center">
+                      <span translate="CONTACTMANAGER.NO_AVAILABLE_INFO"
+                        >No Available Info</span
+                      >
+                    </div>
+                  </td>
+                </tr>
+                <tr
+                  md-row
+                  md-select="contact"
+                  md-select-id="id"
+                  ng-repeat="contact in vm.contacts.rows"
+                >
+                  <td
+                    ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editdialog(contact, ev) : vm.createOrEditContact($event, contact)"
+                    md-cell
+                    class="id"
+                  >
+                    {{contact.id}}
+                  </td>
+                  <td
+                    ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editdialog(contact, ev) : vm.createOrEditContact($event, contact)"
+                    md-cell
+                    class="firstName"
+                  >
+                    {{contact.firstName}} {{contact.lastName}}
+                  </td>
+                  <td
+                    ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editdialog(contact, ev) : vm.createOrEditContact($event, contact)"
+                    md-cell
+                    class="phone"
+                  >
+                    {{contact.phone}}
+                  </td>
+                  <td
+                    ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editdialog(contact, ev) : vm.createOrEditContact($event, contact)"
+                    md-cell
+                    class="email"
+                  >
+                    {{contact.email}}
+                  </td>
+                  <td
+                    ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editdialog(contact, ev) : vm.createOrEditContact($event, contact)"
+                    md-cell
+                    class="createdAt"
+                  >
+                    {{contact.createdAt | date:'medium'}}
+                  </td>
+                  <td
+                    ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editdialog(contact, ev) : vm.createOrEditContact($event, contact)"
+                    md-cell
+                    class="list"
+                  >
+                    {{vm.listsMap[contact.ListId]}}
+                  </td>
+                  <td
+                    ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editdialog(contact, ev) : vm.createOrEditContact($event, contact)"
+                    md-cell
+                    class="company"
+                  >
+                    {{vm.companiesMap[contact.CompanyId]}}
+                  </td>
+                  <td md-cell class="tag">
+                    <div ng-if="contact.Tags.length">
+                      <div
+                        ng-if="contact.Tags.length == 1"
+                        layout="column"
+                        layout-align="center center"
+                      >
+                        <md-icon
+                          md-font-icon="icon-tag"
+                          ng-style="{'color': contact.Tags[0].color }"
+                        ></md-icon>
+                        <span class="text-truncate"
+                          >{{contact.Tags[0].name}}</span
+                        >
+                      </div>
+                      <div
+                        ng-if="contact.Tags.length > 1"
+                        layout="column"
+                        layout-align="center center"
+                      >
+                        <md-tooltip md-direction="left" layout="row">
+                          <span ng-repeat="tag in contact.Tags"
+                            >{{tag.name}}<span ng-if="!$last">, </span></span
+                          >
+                        </md-tooltip>
+                        <md-icon md-font-icon="icon-tag"></md-icon>
+                      </div>
+                    </div>
+                  </td>
+                  <td
+                    md-cell
+                    class="actions"
+                    ng-if="!vm.crudPermissions.readOnly"
+                  >
+                    <md-menu>
+                      <md-button
+                        class="md-icon-button"
+                        aria-label="More"
+                        translate
+                        translate-attr-aria-label="CONTACTMANAGER.MORE"
+                        ng-click="$mdOpenMenu($event)"
+                      >
+                        <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                      </md-button>
+
+                      <md-menu-content width="3">
+                        <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                          <md-button
+                            ng-click="vm.editdialog(contact, ev)"
+                            translate="CONTACTMANAGER.EDIT_CONTACT"
+                          >
+                            Edit Contact
+                          </md-button>
+                        </md-menu-item>
+                        <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                          <md-button
+                            ng-click="vm.mergeContact(ev, contact)"
+                            translate="CONTACTMANAGER.MERGE_CONTACT"
+                          >
+                            Merge Contact
+                          </md-button>
+                        </md-menu-item>
+                        <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                          <md-button
+                            ng-click="vm.duplicateContact(ev, contact)"
+                            translate="CONTACTMANAGER.DUPLICATE_CONTACT"
+                          >
+                            Duplicate Contact
+                          </md-button>
+                        </md-menu-item>
+                        <md-menu-divider
+                          ng-if="vm.crudPermissions.canEdit && vm.crudPermissions.canDelete"
+                        >
+                        </md-menu-divider>
+                        <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                          <md-button
+                            ng-click="vm.deleteconfirm(contact, ev)"
+                            translate="CONTACTMANAGER.DELETE_CONTACT"
+                          >
+                            Delete Contact
+                          </md-button>
+                        </md-menu-item>
+                      </md-menu-content>
+                    </md-menu>
+                  </td>
+                </tr>
+              </tbody>
+            </table>
+          </md-table-container>
+
+          <md-table-pagination
+            md-label="{page: '{{'CONTACTMANAGER.PAGE' | translate}}:', rowsPerPage: '{{'CONTACTMANAGER.ROWSPERPAGE' | translate}}:', of: '{{'CONTACTMANAGER.OF' | translate}}'}"
+            md-limit="vm.query.limit"
+            md-limit-options="[10, 15, 20, 50, 100, 250]"
+            md-page="vm.query.page"
+            md-total="{{vm.contacts.count}}"
+            md-on-paginate="vm.getContacts"
+            md-page-select
+          ></md-table-pagination>
+        </md-card>
+        <!-- / USER TABLE -->
+      </div>
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD USER BUTTON -->
+  <md-fab-speed-dial
+    id="add-contact-button"
+    ng-if="vm.crudPermissions.canEdit"
+    ng-hide="vm.options.hidden"
+    md-direction="up"
+    md-open="vm.options.isOpen"
+    class="md-scale md-fab"
+    ng-class="{ 'md-hover-full': vm.options.hover }"
+    ng-mouseenter="vm.options.isOpen=true"
+    ng-mouseleave="vm.options.isOpen=false"
+  >
+    <md-fab-trigger>
+      <md-button aria-label="menu" class="md-fab md-accent">
+        <md-icon md-font-icon="icon-plus"></md-icon>
+      </md-button>
+    </md-fab-trigger>
+    <md-fab-actions>
+      <md-button
+        class="md-fab md-mini md-warn"
+        flow-btn
+        flow-init="vm.ngFlowOptions"
+        flow-files-submitted="$flow.upload()"
+        flow-file-success="vm.importContacts($file, $message, $flow)"
+        flow-file-added="vm.fileAdded($file)"
+        aria-label="Select File"
+        translate
+        translate-attr-aria-label="CONTACTMANAGER.IMPORT_CONTACTS"
+      >
+        <md-tooltip
+          md-direction="left"
+          md-visible="tooltipVisible"
+          md-autohide="false"
+        >
+          {{'CONTACTMANAGER.IMPORT_CONTACTS' | translate}}
+        </md-tooltip>
+        <md-icon md-font-icon="icon-upload"></md-icon>
+      </md-button>
+      <md-button
+        class="md-fab md-mini md-accent"
+        ng-click="vm.createOrEditContact($event)"
+        aria-label="add contact"
+        translate
+        translate-attr-aria-label="CONTACTMANAGER.ADD_CONTACT"
+      >
+        <md-tooltip
+          md-direction="left"
+          md-visible="tooltipVisible"
+          md-autohide="false"
+        >
+          {{'CONTACTMANAGER.ADD_CONTACT' | translate}}
+        </md-tooltip>
+        <md-icon md-font-icon="icon-account-plus"></md-icon>
+      </md-button>
+    </md-fab-actions>
+  </md-fab-speed-dial>
+  <!-- / ADD USER BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/contacts/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/contactmanager/views/contacts/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 948e0e8..0000000
--- a/public/src/js/modules/main/apps/contactmanager/views/contacts/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,335 +0,0 @@
-<md-dialog class="cm-contact-dialog" aria-label="New Contact">
-  <form name="contactForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <md-input-container class="md-block">
-        <label translate="CONTACTMANAGER.FIRSTNAME">First name</label>
-        <input
-          name="firstName"
-          ng-model="vm.contact.firstName"
-          required
-          md-autofocus
-        />
-
-        <div
-          ng-messages="contactForm.firstName.$error"
-          ng-show="contactForm.firstName.$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CONTACTMANAGER.ERRORS.FIRSTNAME_REQUIRED"
-              >First name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <md-input-container class="md-block">
-        <label translate="CONTACTMANAGER.LASTNAME">Last name</label>
-        <input name="lastName" ng-model="vm.contact.lastName" />
-      </md-input-container>
-
-      <md-input-container class="md-block">
-        <label translate="CONTACTMANAGER.PHONE">Phone</label>
-        <input name="phone" ng-model="vm.contact.phone" />
-      </md-input-container>
-
-      <md-input-container class="md-block">
-        <label translate="CONTACTMANAGER.EMAIL">Email</label>
-        <input name="email" type="email" ng-model="vm.contact.email" />
-      </md-input-container>
-
-      <md-input-container class="md-block">
-        <label translate="CONTACTMANAGER.MOBILE">Mobile</label>
-        <input name="mobile" ng-model="vm.contact.mobile" />
-      </md-input-container>
-
-      <md-input-container class="md-block">
-        <label translate="CONTACTMANAGER.FAX">Fax</label>
-        <input name="fax" ng-model="vm.contact.fax" />
-      </md-input-container>
-
-      <md-input-container class="md-block">
-        <label translate="CONTACTMANAGER.LIST">List</label>
-        <md-select
-          name="list"
-          ng-model="vm.contact.ListId"
-          ng-disabled="vm.contact.id && vm.contact.ListId"
-          ng-init="vm.getCustomFields(vm.contact.ListId)"
-          ng-change="vm.getCustomFields(vm.contact.ListId)"
-          required
-        >
-          <md-optgroup label="Lists">
-            <md-option ng-value="list.id" ng-repeat="list in vm.lists.rows"
-              >{{list.name}}</md-option
-            >
-            <md-option ng-value="null"
-              ><em translate="CONTACTMANAGER.NONE">None</em></md-option
-            >
-          </md-optgroup>
-        </md-select>
-
-        <div
-          ng-messages="contactForm.list.$error"
-          ng-show="contactForm.list.$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CONTACTMANAGER.ERRORS.LIST_REQUIRED"
-              >List field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div
-        ng-repeat="customField in vm.customFields.rows"
-        class="md-block"
-        ng-switch="customField.type"
-      >
-        <div ng-switch-when="datetime">
-          <label>{{customField.alias}}</label>
-
-          <div
-            ng-init="vm.contact['cf_' + customField.id] = vm.getDateFromString(vm.contact['cf_' + customField.id])"
-          >
-            <mdp-date-picker
-              mdp-open-on-click
-              ng-required="customField.required"
-              mdp-format="YYYY-MM-DD"
-              ng-model="vm.contact['cf_' + customField.id]"
-            ></mdp-date-picker>
-            <mdp-time-picker
-              mdp-open-on-click
-              mdp-placeholder="Time"
-              ng-required="customField.required"
-              mdp-format="HH:mm:ss"
-              mdp-auto-switch="true"
-              ng-model="vm.contact['cf_' + customField.id]"
-            ></mdp-time-picker>
-          </div>
-        </div>
-
-        <div ng-switch-when="select">
-          <label>{{customField.alias}}</label>
-
-          <md-select
-            ng-model="vm.contact['cf_' + customField.id]"
-            ng-required="customField.required"
-          >
-            <md-option
-              ng-repeat="value in customField.values"
-              ng-value="value.value"
-              >{{value.value}}</md-option
-            >
-            <md-option ng-value="null"
-              ><em translate="CONTACTMANAGER.NONE">None</em></md-option
-            >
-          </md-select>
-        </div>
-
-        <div ng-switch-when="switch">
-          <md-switch
-            aria-label="{{customField.alias}}"
-            ng-model="vm.contact['cf_' + customField.id]"
-            ng-true-value="1"
-            ng-false-value="0"
-          >
-            {{customField.alias}}
-          </md-switch>
-        </div>
-
-        <md-input-container ng-switch-default>
-          <label>{{customField.alias}}</label>
-
-          <input
-            type="{{customField.type}}"
-            ng-model="vm.contact['cf_' + customField.id]"
-            ng-required="customField.required"
-          />
-        </md-input-container>
-      </div>
-
-      <md-input-container class="md-block">
-        <label translate="CONTACTMANAGER.COMPANY">Company</label>
-        <md-select name="company" ng-model="vm.contact.CompanyId">
-          <md-option
-            ng-value="company.id"
-            ng-repeat="company in vm.companies.rows"
-            ng-hide="!vm.contact.CompanyId && company.canSelect === false"
-            ng-disabled="company.canSelect === false"
-            >{{company.name}}</md-option
-          >
-        </md-select>
-      </md-input-container>
-
-      <div ng-if="!vm.allFields" layout="row" layout-align="center center">
-        <md-button
-          class="md-accent"
-          ng-click="vm.allFields = true"
-          translate="CONTACTMANAGER.SHOW_ALL_FIELDS"
-          >Show All Fields</md-button
-        >
-      </div>
-
-      <md-input-container
-        class="md-block"
-        ng-if="vm.allFields"
-        flex-gt-sm=""
-        ng-init="vm.contact.dateOfBirth = vm.getDateFromString(vm.contact.dateOfBirth)"
-      >
-        <label translate="CONTACTMANAGER.DATE_OF_BIRTH">Date of Birth</label>
-        <mdp-date-picker
-          mdp-open-on-click
-          mdp-format="YYYY-MM-DD"
-          name="dateOfBirth"
-          ng-model="vm.contact.dateOfBirth"
-        ></mdp-date-picker>
-      </md-input-container>
-
-      <md-input-container class="md-block" ng-if="vm.allFields">
-        <label translate="CONTACTMANAGER.COUNTRY">Country</label>
-        <input type="text" name="country" ng-model="vm.contact.country" />
-      </md-input-container>
-
-      <md-input-container class="md-block" ng-if="vm.allFields">
-        <label translate="CONTACTMANAGER.CITY">City</label>
-        <input type="text" name="city" ng-model="vm.contact.city" />
-      </md-input-container>
-
-      <md-input-container class="md-block" ng-if="vm.allFields">
-        <label translate="CONTACTMANAGER.STREET">Street</label>
-        <input type="text" name="street" ng-model="vm.contact.street" />
-      </md-input-container>
-
-      <md-input-container class="md-block" ng-if="vm.allFields">
-        <label translate="CONTACTMANAGER.POSTAL_CODE">Postal Code</label>
-        <input type="text" name="postalCode" ng-model="vm.contact.postalCode" />
-      </md-input-container>
-
-      <md-input-container class="md-block" ng-if="vm.allFields">
-        <label translate="CONTACTMANAGER.NOTES">Notes</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.contact.description"
-        />
-      </md-input-container>
-
-      <div ng-if="vm.allFields" layout="row" layout-align="center center">
-        <md-button
-          class="md-accent"
-          ng-click="vm.allFields = false"
-          translate="CONTACTMANAGER.FEWER_FIELDS"
-          >Fewer Fields</md-button
-        >
-      </div>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-if="!vm.newContact"
-          ng-click="vm.saveContact()"
-          class="send-button md-accent md-raised"
-          ng-disabled="contactForm.$invalid || contactForm.$pristine"
-          aria-label="SAVE"
-          translate="CONTACTMANAGER.SAVE"
-          translate-attr-aria-label="CONTACTMANAGER.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.newContact"
-          ng-click="vm.addNewContact()"
-          class="send-button md-accent md-raised"
-          ng-disabled="contactForm.$invalid || contactForm.$pristine"
-          aria-label="ADD"
-          translate="CONTACTMANAGER.ADD_CONTACT"
-          translate-attr-aria-label="CONTACTMANAGER.ADD_CONTACT"
-        >
-          ADD CONTACT
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newContact"
-          ng-click="vm.deleteContact($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="CONTACTMANAGER.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="CONTACTMANAGER.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/contacts/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/contactmanager/views/contacts/create/dialog.html/dialog.html
new file mode 100644
index 0000000..948e0e8
--- /dev/null
+++ b/public/src/js/modules/main/apps/contactmanager/views/contacts/create/dialog.html/dialog.html
@@ -0,0 +1,335 @@
+<md-dialog class="cm-contact-dialog" aria-label="New Contact">
+  <form name="contactForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <md-input-container class="md-block">
+        <label translate="CONTACTMANAGER.FIRSTNAME">First name</label>
+        <input
+          name="firstName"
+          ng-model="vm.contact.firstName"
+          required
+          md-autofocus
+        />
+
+        <div
+          ng-messages="contactForm.firstName.$error"
+          ng-show="contactForm.firstName.$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CONTACTMANAGER.ERRORS.FIRSTNAME_REQUIRED"
+              >First name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <md-input-container class="md-block">
+        <label translate="CONTACTMANAGER.LASTNAME">Last name</label>
+        <input name="lastName" ng-model="vm.contact.lastName" />
+      </md-input-container>
+
+      <md-input-container class="md-block">
+        <label translate="CONTACTMANAGER.PHONE">Phone</label>
+        <input name="phone" ng-model="vm.contact.phone" />
+      </md-input-container>
+
+      <md-input-container class="md-block">
+        <label translate="CONTACTMANAGER.EMAIL">Email</label>
+        <input name="email" type="email" ng-model="vm.contact.email" />
+      </md-input-container>
+
+      <md-input-container class="md-block">
+        <label translate="CONTACTMANAGER.MOBILE">Mobile</label>
+        <input name="mobile" ng-model="vm.contact.mobile" />
+      </md-input-container>
+
+      <md-input-container class="md-block">
+        <label translate="CONTACTMANAGER.FAX">Fax</label>
+        <input name="fax" ng-model="vm.contact.fax" />
+      </md-input-container>
+
+      <md-input-container class="md-block">
+        <label translate="CONTACTMANAGER.LIST">List</label>
+        <md-select
+          name="list"
+          ng-model="vm.contact.ListId"
+          ng-disabled="vm.contact.id && vm.contact.ListId"
+          ng-init="vm.getCustomFields(vm.contact.ListId)"
+          ng-change="vm.getCustomFields(vm.contact.ListId)"
+          required
+        >
+          <md-optgroup label="Lists">
+            <md-option ng-value="list.id" ng-repeat="list in vm.lists.rows"
+              >{{list.name}}</md-option
+            >
+            <md-option ng-value="null"
+              ><em translate="CONTACTMANAGER.NONE">None</em></md-option
+            >
+          </md-optgroup>
+        </md-select>
+
+        <div
+          ng-messages="contactForm.list.$error"
+          ng-show="contactForm.list.$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CONTACTMANAGER.ERRORS.LIST_REQUIRED"
+              >List field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div
+        ng-repeat="customField in vm.customFields.rows"
+        class="md-block"
+        ng-switch="customField.type"
+      >
+        <div ng-switch-when="datetime">
+          <label>{{customField.alias}}</label>
+
+          <div
+            ng-init="vm.contact['cf_' + customField.id] = vm.getDateFromString(vm.contact['cf_' + customField.id])"
+          >
+            <mdp-date-picker
+              mdp-open-on-click
+              ng-required="customField.required"
+              mdp-format="YYYY-MM-DD"
+              ng-model="vm.contact['cf_' + customField.id]"
+            ></mdp-date-picker>
+            <mdp-time-picker
+              mdp-open-on-click
+              mdp-placeholder="Time"
+              ng-required="customField.required"
+              mdp-format="HH:mm:ss"
+              mdp-auto-switch="true"
+              ng-model="vm.contact['cf_' + customField.id]"
+            ></mdp-time-picker>
+          </div>
+        </div>
+
+        <div ng-switch-when="select">
+          <label>{{customField.alias}}</label>
+
+          <md-select
+            ng-model="vm.contact['cf_' + customField.id]"
+            ng-required="customField.required"
+          >
+            <md-option
+              ng-repeat="value in customField.values"
+              ng-value="value.value"
+              >{{value.value}}</md-option
+            >
+            <md-option ng-value="null"
+              ><em translate="CONTACTMANAGER.NONE">None</em></md-option
+            >
+          </md-select>
+        </div>
+
+        <div ng-switch-when="switch">
+          <md-switch
+            aria-label="{{customField.alias}}"
+            ng-model="vm.contact['cf_' + customField.id]"
+            ng-true-value="1"
+            ng-false-value="0"
+          >
+            {{customField.alias}}
+          </md-switch>
+        </div>
+
+        <md-input-container ng-switch-default>
+          <label>{{customField.alias}}</label>
+
+          <input
+            type="{{customField.type}}"
+            ng-model="vm.contact['cf_' + customField.id]"
+            ng-required="customField.required"
+          />
+        </md-input-container>
+      </div>
+
+      <md-input-container class="md-block">
+        <label translate="CONTACTMANAGER.COMPANY">Company</label>
+        <md-select name="company" ng-model="vm.contact.CompanyId">
+          <md-option
+            ng-value="company.id"
+            ng-repeat="company in vm.companies.rows"
+            ng-hide="!vm.contact.CompanyId && company.canSelect === false"
+            ng-disabled="company.canSelect === false"
+            >{{company.name}}</md-option
+          >
+        </md-select>
+      </md-input-container>
+
+      <div ng-if="!vm.allFields" layout="row" layout-align="center center">
+        <md-button
+          class="md-accent"
+          ng-click="vm.allFields = true"
+          translate="CONTACTMANAGER.SHOW_ALL_FIELDS"
+          >Show All Fields</md-button
+        >
+      </div>
+
+      <md-input-container
+        class="md-block"
+        ng-if="vm.allFields"
+        flex-gt-sm=""
+        ng-init="vm.contact.dateOfBirth = vm.getDateFromString(vm.contact.dateOfBirth)"
+      >
+        <label translate="CONTACTMANAGER.DATE_OF_BIRTH">Date of Birth</label>
+        <mdp-date-picker
+          mdp-open-on-click
+          mdp-format="YYYY-MM-DD"
+          name="dateOfBirth"
+          ng-model="vm.contact.dateOfBirth"
+        ></mdp-date-picker>
+      </md-input-container>
+
+      <md-input-container class="md-block" ng-if="vm.allFields">
+        <label translate="CONTACTMANAGER.COUNTRY">Country</label>
+        <input type="text" name="country" ng-model="vm.contact.country" />
+      </md-input-container>
+
+      <md-input-container class="md-block" ng-if="vm.allFields">
+        <label translate="CONTACTMANAGER.CITY">City</label>
+        <input type="text" name="city" ng-model="vm.contact.city" />
+      </md-input-container>
+
+      <md-input-container class="md-block" ng-if="vm.allFields">
+        <label translate="CONTACTMANAGER.STREET">Street</label>
+        <input type="text" name="street" ng-model="vm.contact.street" />
+      </md-input-container>
+
+      <md-input-container class="md-block" ng-if="vm.allFields">
+        <label translate="CONTACTMANAGER.POSTAL_CODE">Postal Code</label>
+        <input type="text" name="postalCode" ng-model="vm.contact.postalCode" />
+      </md-input-container>
+
+      <md-input-container class="md-block" ng-if="vm.allFields">
+        <label translate="CONTACTMANAGER.NOTES">Notes</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.contact.description"
+        />
+      </md-input-container>
+
+      <div ng-if="vm.allFields" layout="row" layout-align="center center">
+        <md-button
+          class="md-accent"
+          ng-click="vm.allFields = false"
+          translate="CONTACTMANAGER.FEWER_FIELDS"
+          >Fewer Fields</md-button
+        >
+      </div>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-if="!vm.newContact"
+          ng-click="vm.saveContact()"
+          class="send-button md-accent md-raised"
+          ng-disabled="contactForm.$invalid || contactForm.$pristine"
+          aria-label="SAVE"
+          translate="CONTACTMANAGER.SAVE"
+          translate-attr-aria-label="CONTACTMANAGER.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.newContact"
+          ng-click="vm.addNewContact()"
+          class="send-button md-accent md-raised"
+          ng-disabled="contactForm.$invalid || contactForm.$pristine"
+          aria-label="ADD"
+          translate="CONTACTMANAGER.ADD_CONTACT"
+          translate-attr-aria-label="CONTACTMANAGER.ADD_CONTACT"
+        >
+          ADD CONTACT
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newContact"
+          ng-click="vm.deleteContact($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="CONTACTMANAGER.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="CONTACTMANAGER.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/contacts/duplicate/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/contactmanager/views/contacts/duplicate/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index f1d6981..0000000
--- a/public/src/js/modules/main/apps/contactmanager/views/contacts/duplicate/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,103 +0,0 @@
-<md-dialog
-  class="cm-contact-dialog"
-  aria-label="{{ 'CONTACTMANAGER.DUPLICATE_CONTACT' | translate }}"
->
-  <form name="contactForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <md-input-container class="md-block">
-        <label translate="CONTACTMANAGER.LIST">List</label>
-        <md-select name="list" ng-model="vm.contact.ListId">
-          <md-option ng-value="list.id" ng-repeat="list in vm.lists.rows"
-            >{{list.name}}</md-option
-          >
-        </md-select>
-
-        <div
-          ng-messages="contactForm.list.$error"
-          ng-show="contactForm.list.$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CONTACTMANAGER.ERRORS.LIST_REQUIRED"
-              >List field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-click="vm.addNewContact()"
-          class="send-button md-accent md-raised"
-          ng-disabled="contactForm.$invalid"
-          aria-label="ADD"
-          translate="CONTACTMANAGER.ADD_CONTACT"
-          translate-attr-aria-label="CONTACTMANAGER.ADD_CONTACT"
-        >
-          ADD CONTACT
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/contacts/duplicate/dialog.html/dialog.html b/public/src/js/modules/main/apps/contactmanager/views/contacts/duplicate/dialog.html/dialog.html
new file mode 100644
index 0000000..f1d6981
--- /dev/null
+++ b/public/src/js/modules/main/apps/contactmanager/views/contacts/duplicate/dialog.html/dialog.html
@@ -0,0 +1,103 @@
+<md-dialog
+  class="cm-contact-dialog"
+  aria-label="{{ 'CONTACTMANAGER.DUPLICATE_CONTACT' | translate }}"
+>
+  <form name="contactForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <md-input-container class="md-block">
+        <label translate="CONTACTMANAGER.LIST">List</label>
+        <md-select name="list" ng-model="vm.contact.ListId">
+          <md-option ng-value="list.id" ng-repeat="list in vm.lists.rows"
+            >{{list.name}}</md-option
+          >
+        </md-select>
+
+        <div
+          ng-messages="contactForm.list.$error"
+          ng-show="contactForm.list.$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CONTACTMANAGER.ERRORS.LIST_REQUIRED"
+              >List field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-click="vm.addNewContact()"
+          class="send-button md-accent md-raised"
+          ng-disabled="contactForm.$invalid"
+          aria-label="ADD"
+          translate="CONTACTMANAGER.ADD_CONTACT"
+          translate-attr-aria-label="CONTACTMANAGER.ADD_CONTACT"
+        >
+          ADD CONTACT
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/contacts/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/contactmanager/views/contacts/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index f417c29..0000000
--- a/public/src/js/modules/main/apps/contactmanager/views/contacts/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,1114 +0,0 @@
-<div
-  id="cm-contact"
-  class="page-layout simple tabbed"
-  layout="column"
-  ng-init="vm.onInit()"
->
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-contacts-button md-icon-button"
-        aria-label="Go to contacts"
-        ng-click="vm.gotoContacts()"
-        translate
-        translate-attr-aria-label="CONTACTMANAGER.GO_TO_CONTACTS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="contact-image" hide-xs>
-          <img ng-src="assets/images/business/contacts.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.contact.id}} {{vm.contact.firstName}} {{vm.contact.lastName}}
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="CONTACTMANAGER.CREATED_AT"></span>
-            <span>{{vm.contact.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div
-      ng-if="vm.contact.role && vm.contact.role !== 'admin'"
-      ng-controller="ContactQueueAddButtonController as vm_contact_qa"
-      ng-cloak
-    >
-      <md-fab-speed-dial
-        ng-hide="vm_contact_qa.hidden"
-        md-direction="left"
-        md-open="vm_contact_qa.isOpen"
-        class="md-scale md-fab"
-        ng-class="{ 'md-hover-full': vm_contact_qa.hover }"
-        ng-mouseenter="vm_contact_qa.isOpen=true"
-        ng-mouseleave="vm_contact_qa.isOpen=false"
-      >
-        <md-fab-trigger>
-          <md-button aria-label="menu" class="md-fab md-primary md-icon-button">
-            <md-tooltip md-direction="top" md-visible="tooltipVisible"
-              >Channels</md-tooltip
-            >
-            <md-icon md-font-icon="icon-eye" aria-label="channels"></md-icon>
-          </md-button>
-        </md-fab-trigger>
-        <md-fab-actions>
-          <div ng-repeat="channel in vm_contact_qa.channels">
-            <md-button
-              aria-label="{{channel.name}}"
-              class="md-fab md-raised md-icon-button md-mini"
-              ng-click="vm_contact_qa.openDialog($event, vm.contact, channel)"
-            >
-              <md-tooltip
-                md-direction="{{channel.direction}}"
-                md-visible="tooltipVisible"
-                md-autohide="false"
-              >
-                {{channel.name}}
-              </md-tooltip>
-              <md-icon
-                md-font-icon="{{channel.icon}}"
-                aria-label="{{channel.name}}"
-              ></md-icon>
-            </md-button>
-          </div>
-        </md-fab-actions>
-      </md-fab-speed-dial>
-    </div>
-
-    <div ng-if="vm.crudPermissions.canEdit">
-      <md-button
-        ng-click="vm.duplicateContact($event)"
-        class="md-fab md-warn md-icon-button"
-        aria-label="DUPLICATE"
-      >
-        <md-icon md-font-icon="icon-file-multiple"></md-icon>
-      </md-button>
-      <md-button
-        type="submit"
-        ng-click="vm.saveContact()"
-        class="send-button md-accent md-raised"
-        ng-disabled="detailForm.$pristine && customFieldsForm.$pristine && socialForm.$pristine"
-        translate="CONTACTMANAGER.SAVE"
-        translate-attr-aria-label="CONTACTMANAGER.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="CONTACTMANAGER.DETAIL">DETAIL</span>
-        </md-tab-label>
-
-        <md-tab-body>
-          <div layout="row">
-            <div layout="column" flex="70">
-              <md-card
-                class="contact-detail-form-container personal_info md-background-bg md-whiteframe-1dp"
-              >
-                <div class="pb-16" layout="row" layout-align="start center">
-                  <div
-                    class="h2 secondary-text text-truncate"
-                    translate="CONTACTMANAGER.PERSONAL_INFO"
-                  >
-                    PERSONAL_INFO
-                  </div>
-                </div>
-                <form name="detailForm" novalidate>
-                  <div layout-gt-sm="row" class="layout-gt-sm-row">
-                    <!-- fistName -->
-                    <md-input-container class="md-block" flex-gt-sm="">
-                      <label translate="CONTACTMANAGER.FIRSTNAME"
-                        >First Name</label
-                      >
-                      <md-icon
-                        md-font-icon="icon-account"
-                        class="firstname"
-                      ></md-icon>
-                      <input
-                        type="text"
-                        name="firstName"
-                        ng-model="vm.contact.firstName"
-                        class="text-truncate"
-                        required
-                        ng-disabled="!vm.crudPermissions.canEdit"
-                      />
-
-                      <div
-                        ng-messages="detailForm.firstName.$error"
-                        ng-show="detailForm.firstName.$touched"
-                        role="alert"
-                      >
-                        <div ng-message="required">
-                          <span
-                            translate="CONTACTMANAGER.ERRORS.FIRSTNAME_REQUIRED"
-                            >First name field is required</span
-                          >
-                        </div>
-                      </div>
-                    </md-input-container>
-                    <div flex="5"></div>
-                    <!-- lastName -->
-                    <md-input-container class="md-block" flex-gt-sm="">
-                      <label translate="CONTACTMANAGER.LASTNAME"
-                        >Last Name</label
-                      >
-                      <input
-                        type="text"
-                        name="lastName"
-                        ng-model="vm.contact.lastName"
-                        class="text-truncate"
-                        ng-disabled="!vm.crudPermissions.canEdit"
-                      />
-                    </md-input-container>
-                  </div>
-
-                  <div layout-gt-sm="row" class="layout-gt-sm-row">
-                    <!-- phone -->
-                    <md-input-container class="md-block" flex-gt-sm="">
-                      <label translate="CONTACTMANAGER.PHONE">Phone</label>
-                      <md-icon md-font-icon="icon-phone"></md-icon>
-                      <input
-                        type="text"
-                        name="phone"
-                        ng-model="vm.contact.phone"
-                        class="text-truncate"
-                        ng-disabled="!vm.crudPermissions.canEdit"
-                      />
-                    </md-input-container>
-                    <div flex="5"></div>
-                    <!-- mobile -->
-                    <md-input-container class="md-block" flex-gt-sm="">
-                      <label translate="CONTACTMANAGER.MOBILE">Mobile</label>
-                      <md-icon md-font-icon="icon-cellphone-iphone"></md-icon>
-                      <input
-                        type="text"
-                        name="mobile"
-                        ng-model="vm.contact.mobile"
-                        class="text-truncate"
-                        ng-disabled="!vm.crudPermissions.canEdit"
-                      />
-                    </md-input-container>
-                  </div>
-
-                  <div layout-gt-sm="row" class="layout-gt-sm-row">
-                    <!-- email -->
-                    <md-input-container class="md-block" flex-gt-sm="">
-                      <label translate="CONTACTMANAGER.EMAIL">Email</label>
-                      <md-icon
-                        md-font-icon="icon-email"
-                        class="email"
-                      ></md-icon>
-                      <input
-                        type="email"
-                        name="email"
-                        ng-model="vm.contact.email"
-                        class="text-truncate"
-                        ng-disabled="!vm.crudPermissions.canEdit"
-                      />
-                      <div
-                        ng-messages="detailForm.firstName.$error"
-                        ng-show="detailForm.firstName.$touched"
-                        role="alert"
-                      >
-                        <div ng-message="email">
-                          <span
-                            translate="CONTACTMANAGER.ERRORS.EMAIL_MUST_VALID"
-                            >Email must be a valid e-mail address</span
-                          >
-                        </div>
-                      </div>
-                    </md-input-container>
-                    <div flex="5"></div>
-                    <!-- fax -->
-                    <md-input-container class="md-block" flex-gt-sm="">
-                      <label translate="CONTACTMANAGER.FAX">Fax</label>
-                      <md-icon md-font-icon="icon-deskphone"></md-icon>
-                      <input
-                        type="text"
-                        name="fax"
-                        ng-model="vm.contact.fax"
-                        ng-disabled="!vm.crudPermissions.canEdit"
-                      />
-                    </md-input-container>
-                  </div>
-
-                  <div layout-gt-sm="row" class="layout-gt-sm-row">
-                    <md-input-container
-                      class="md-block"
-                      flex-gt-sm=""
-                      ng-init="vm.contact.dateOfBirth = vm.getDateFromString(vm.contact.dateOfBirth)"
-                    >
-                      <label translate="CONTACTMANAGER.DATE_OF_BIRTH"
-                        >Date of Birth</label
-                      >
-                      <mdp-date-picker
-                        mdp-open-on-click
-                        mdp-format="YYYY-MM-DD"
-                        name="dateOfBirth"
-                        ng-model="vm.contact.dateOfBirth"
-                        mdp-disabled="!vm.crudPermissions.canEdit"
-                      ></mdp-date-picker>
-                    </md-input-container>
-                  </div>
-
-                  <div layout-gt-sm="row" class="layout-gt-sm-row">
-                    <md-input-container
-                      ng-if="vm.companies.rows.length"
-                      class="md-block"
-                      flex-gt-sm=""
-                    >
-                      <label translate="CONTACTMANAGER.COMPANY">Company</label>
-                      <md-icon md-font-icon="icon-domain"></md-icon>
-                      <md-select
-                        name="company"
-                        ng-model="vm.contact.CompanyId"
-                        ng-disabled="!vm.crudPermissions.canEdit"
-                      >
-                        <md-optgroup label="Companies">
-                          <md-option
-                            ng-value="company.id"
-                            ng-repeat="company in vm.companies.rows"
-                            ng-disabled="company.canSelect === false"
-                            >{{company.name}}</md-option
-                          >
-                          <md-option ng-value="null"
-                            ><em translate="CONTACTMANAGER.NONE"
-                              >None</em
-                            ></md-option
-                          >
-                        </md-optgroup>
-                      </md-select>
-                      <md-icon
-                        class="pointer"
-                        ng-show="vm.contact.CompanyId"
-                        md-font-icon="icon-information-outline"
-                        ng-click="vm.editCompany($event, vm.contact.CompanyId)"
-                      ></md-icon>
-                    </md-input-container>
-                    <section ng-if="!vm.companies.rows.length" flex-gt-sm="">
-                      <md-icon md-font-icon="icon-briefcase"></md-icon>
-                      <label translate="CONTACTMANAGER.NO_COMPANIES"
-                        >No Companies</label
-                      >
-                    </section>
-                  </div>
-
-                  <div layout-gt-sm="row" class="layout-gt-sm-row">
-                    <md-input-container
-                      ng-if="vm.tags.rows.length"
-                      class="md-block"
-                      flex-gt-sm=""
-                    >
-                      <label translate="CONTACTMANAGER.TAGS">Tags</label>
-                      <md-icon md-font-icon="icon-tag"></md-icon>
-                      <md-select
-                        ng-model="vm.Tags"
-                        multiple
-                        ng-disabled="!vm.crudPermissions.canEdit"
-                      >
-                        <md-optgroup label="Tags">
-                          <md-option
-                            ng-value="tag.id"
-                            ng-repeat="tag in vm.tags.rows"
-                            ng-disabled="tag.canSelect === false"
-                            >{{tag.name}}</md-option
-                          >
-                        </md-optgroup>
-                      </md-select>
-                    </md-input-container>
-                    <section ng-if="!vm.tags.rows.length" flex-gt-sm="">
-                      <md-icon md-font-icon="icon-tag"></md-icon>
-                      <label translate="CONTACTMANAGER.NO_TAG">No Tags</label>
-                      <md-button
-                        class="md-accent"
-                        translate="CONTACTMANAGER.ADD_TAG"
-                        >Add Tag</md-button
-                      >
-                    </section>
-                  </div>
-
-                  <div
-                    ng-if="!vm.allFields"
-                    layout="row"
-                    layout-align="center center"
-                  >
-                    <md-button
-                      class="md-accent"
-                      ng-click="vm.allFields = true"
-                      translate="CONTACTMANAGER.SHOW_ALL_FIELDS"
-                      >Show All Fields</md-button
-                    >
-                  </div>
-
-                  <div ng-if="vm.allFields">
-                    <div layout-gt-sm="row" class="layout-gt-sm-row">
-                      <!-- country -->
-                      <md-input-container class="md-block" flex-gt-sm="">
-                        <label translate="CONTACTMANAGER.COUNTRY"
-                          >Country</label
-                        >
-                        <md-icon
-                          md-font-icon="icon-home"
-                          class="country"
-                        ></md-icon>
-                        <input
-                          type="text"
-                          name="country"
-                          ng-model="vm.contact.country"
-                          class="text-truncate"
-                          ng-disabled="!vm.crudPermissions.canEdit"
-                        />
-                      </md-input-container>
-                      <div flex="5"></div>
-                      <!-- city -->
-                      <md-input-container class="md-block" flex-gt-sm="">
-                        <label translate="CONTACTMANAGER.CITY">City</label>
-                        <input
-                          type="text"
-                          name="city"
-                          ng-model="vm.contact.city"
-                          ng-disabled="!vm.crudPermissions.canEdit"
-                        />
-                      </md-input-container>
-                    </div>
-
-                    <div layout-gt-sm="row" class="layout-gt-sm-row">
-                      <div flex="5"></div>
-                      <!-- street -->
-                      <md-input-container class="md-block" flex-gt-sm="">
-                        <label translate="CONTACTMANAGER.STREET">Street</label>
-                        <input
-                          type="text"
-                          name="street"
-                          ng-model="vm.contact.street"
-                          ng-disabled="!vm.crudPermissions.canEdit"
-                        />
-                      </md-input-container>
-                      <div flex="5"></div>
-                      <!-- postalCode -->
-                      <md-input-container class="md-block" flex-gt-sm="">
-                        <label translate="CONTACTMANAGER.POSTALCODE"
-                          >Postal Code</label
-                        >
-                        <input
-                          type="text"
-                          name="postalCode"
-                          ng-model="vm.contact.postalCode"
-                          ng-disabled="!vm.crudPermissions.canEdit"
-                        />
-                      </md-input-container>
-                    </div>
-
-                    <div layout-gt-sm="row" class="layout-gt-sm-row">
-                      <md-input-container class="md-block" flex-gt-sm="">
-                        <label
-                          translate
-                          translate-attr-placeholder="CONTACTMANAGER.NOTES"
-                          >Notes</label
-                        >
-                        <md-icon md-font-icon="icon-note"></md-icon>
-                        <textarea
-                          ng-model="vm.contact.description"
-                          type="text"
-                          max-rows="4"
-                          ng-disabled="!vm.crudPermissions.canEdit"
-                        ></textarea>
-                      </md-input-container>
-                    </div>
-
-                    <div layout="row" layout-align="center center">
-                      <md-button
-                        class="md-accent"
-                        ng-click="vm.allFields = false"
-                        translate="CONTACTMANAGER.FEWER_FIELDS"
-                        >Fewer Fields
-                      </md-button>
-                    </div>
-                  </div>
-                </form>
-              </md-card>
-              <md-card
-                class="contact-detail-form-container personal_info md-background-bg md-whiteframe-1dp"
-              >
-                <div class="pb-16" layout="row" layout-align="start center">
-                  <div
-                    class="h2 secondary-text text-truncate"
-                    translate="CONTACTMANAGER.SOCIAL"
-                  >
-                    Social
-                  </div>
-                </div>
-                <form name="socialForm" novalidate>
-                  <div layout-gt-sm="row" class="layout-gt-sm-row">
-                    <md-input-container class="md-block" flex-gt-sm="">
-                      <label>Facebook</label>
-                      <md-icon
-                        md-font-icon="icon-facebook"
-                        class="facebook"
-                      ></md-icon>
-                      <input
-                        type="text"
-                        name="facebook"
-                        ng-model="vm.contact.facebook"
-                        class="text-truncate"
-                        ng-disabled="!vm.crudPermissions.canEdit"
-                      />
-                    </md-input-container>
-                    <div flex="5"></div>
-                    <md-input-container class="md-block" flex-gt-sm="">
-                      <label>Twitter</label>
-                      <md-icon
-                        md-font-icon="icon-twitter"
-                        class="twitter"
-                      ></md-icon>
-                      <input
-                        type="text"
-                        name="twitter"
-                        ng-model="vm.contact.twitter"
-                        class="text-truncate"
-                        ng-disabled="!vm.crudPermissions.canEdit"
-                      />
-                    </md-input-container>
-                  </div>
-                  <div layout-gt-sm="row" class="layout-gt-sm-row">
-                    <md-input-container class="md-block" flex-gt-sm="">
-                      <label>Line</label>
-                      <md-icon md-font-icon="fab fa-line"></md-icon>
-                      <input
-                        type="text"
-                        name="line"
-                        ng-model="vm.contact.line"
-                        class="text-truncate"
-                      />
-                    </md-input-container>
-                    <div flex="5"></div>
-                    <md-input-container class="md-block" flex-gt-sm="">
-                      <label>Viber</label>
-                      <md-icon md-font-icon="fab fa-viber"></md-icon>
-                      <input
-                        type="text"
-                        name="viber"
-                        ng-model="vm.contact.viber"
-                        class="text-truncate"
-                      />
-                    </md-input-container>
-                  </div>
-                  <div layout-gt-sm="row" class="layout-gt-sm-row">
-                    <md-input-container class="md-block" flex-gt-sm="">
-                      <label>WeChat</label>
-                      <md-icon md-font-icon="fab fa-weixin"></md-icon>
-                      <input
-                        type="text"
-                        name="wechat"
-                        ng-model="vm.contact.wechat"
-                        class="text-truncate"
-                      />
-                    </md-input-container>
-                    <div flex="5"></div>
-                    <md-input-container class="md-block" flex-gt-sm="">
-                      <label>Telegram</label>
-                      <md-icon md-font-icon="icon-telegram"></md-icon>
-                      <input
-                        type="text"
-                        name="telegram"
-                        ng-model="vm.contact.telegram"
-                        class="text-truncate"
-                      />
-                    </md-input-container>
-                  </div>
-                </form>
-              </md-card>
-            </div>
-
-            <div flex></div>
-
-            <div
-              class="contact-detail-form-container personal_info md-background-bg md-whiteframe-1dp"
-              flex="25"
-            >
-              <div class="pb-16" layout="row" layout-align="start center">
-                <div
-                  class="h2 secondary-text text-truncate"
-                  translate="CONTACTMANAGER.CUSTOM_FIELDS"
-                >
-                  CUSTOM FIELDS
-                </div>
-              </div>
-              <form name="customFieldsForm" novalidate>
-                <md-input-container class="md-block">
-                  <label
-                    translate
-                    translate-attr-placeholder="CONTACTMANAGER.LIST"
-                    >List</label
-                  >
-                  <md-select
-                    name="list"
-                    ng-model="vm.contact.ListId"
-                    md-on-close="vm.onSelectList($event)"
-                    ng-disabled="vm.contact.ListId"
-                  >
-                    <md-optgroup label="Lists">
-                      <md-option
-                        ng-value="list.id"
-                        ng-repeat="list in vm.lists.rows"
-                        >#{{list.id}} - {{list.name}}</md-option
-                      >
-                      <md-option ng-value="null"
-                        ><em translate="CONTACTMANAGER.NONE"
-                          >None</em
-                        ></md-option
-                      >
-                    </md-optgroup>
-                  </md-select>
-                </md-input-container>
-                <div
-                  ng-repeat="customField in vm.customFields.rows"
-                  ng-switch="customField.type"
-                >
-                  <md-input-container
-                    class="md-block"
-                    ng-switch-when="datetime"
-                  >
-                    <label>{{customField.alias}}</label>
-                    <div
-                      ng-init="vm.contact['cf_' + customField.id] = vm.getDateFromString(vm.contact['cf_' + customField.id])"
-                    >
-                      <mdp-date-picker
-                        mdp-open-on-click
-                        ng-required="customField.required"
-                        mdp-format="YYYY-MM-DD"
-                        ng-model="vm.contact['cf_' + customField.id]"
-                      ></mdp-date-picker>
-                      <mdp-time-picker
-                        mdp-open-on-click
-                        mdp-placeholder="Time"
-                        ng-required="customField.required"
-                        mdp-format="HH:mm:ss"
-                        mdp-auto-switch="true"
-                        ng-model="vm.contact['cf_' + customField.id]"
-                      ></mdp-time-picker>
-                    </div>
-                  </md-input-container>
-
-                  <md-input-container class="md-block" ng-switch-when="select">
-                    <label>{{customField.alias}}</label>
-                    <md-select
-                      ng-model="vm.contact['cf_' + customField.id]"
-                      ng-required="customField.required"
-                      ng-disabled="!vm.crudPermissions.canEdit"
-                    >
-                      <md-option
-                        ng-repeat="value in customField.values"
-                        ng-value="value.value"
-                        >{{value.value}}</md-option
-                      >
-                      <md-option ng-value="null"
-                        ><em translate="CONTACTMANAGER.NONE"
-                          >None</em
-                        ></md-option
-                      >
-                    </md-select>
-                  </md-input-container>
-
-                  <md-input-container class="md-block" ng-switch-when="switch">
-                    <md-switch
-                      aria-label="{{customField.alias}}"
-                      ng-model="vm.contact['cf_' + customField.id]"
-                      ng-true-value="1"
-                      ng-false-value="0"
-                    >
-                      {{customField.alias}}
-                    </md-switch>
-                  </md-input-container>
-
-                  <md-input-container class="md-block" ng-switch-default>
-                    <label>{{customField.alias}}</label>
-                    <input
-                      type="{{customField.type}}"
-                      ng-model="vm.contact['cf_' + customField.id]"
-                      ng-required="customField.required"
-                      ng-disabled="!vm.crudPermissions.canEdit"
-                    />
-                  </md-input-container>
-                </div>
-              </form>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-
-      <md-tab ng-if="vm.license.dialer">
-        <md-tab-label>
-          <span translate="CONTACTMANAGER.MOTION_BULL">MOTION BULL</span>
-        </md-tab-label>
-
-        <md-tab-body>
-          <div layout="row">
-            <div
-              class="contact-detail-form-container personal_info md-background-bg md-whiteframe-1dp"
-              flex
-            >
-              <md-toolbar class="md-table-toolbar md-default">
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead" translate="CONTACTMANAGER.HOPPER"
-                    >Hopper</span
-                  >
-                  <div flex></div>
-                  <ms-search-bar
-                    on-search="vm.queryHopper.filter = query;"
-                    on-collapse="vm.queryHopper.filter = undefined;"
-                    debounce="300"
-                  ></ms-search-bar>
-                  <md-button
-                    class="md-icon-button"
-                    ng-click="vm.getHoppers()"
-                    aria-label="reload"
-                    translate
-                    translate-attr-label="CONTACTMANAGER.RELOAD"
-                  >
-                    <md-tooltip
-                      >{{'CONTACTMANAGER.RELOAD' | translate}}</md-tooltip
-                    >
-                    <md-icon md-font-icon="icon-reload"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-
-              <!-- HOPPER TABLE -->
-              <md-table-container>
-                <table md-table multiple md-progress="vm.promise">
-                  <thead
-                    md-head
-                    md-order="vm.queryHopper.sort"
-                    md-on-reorder="vm.getHoppers"
-                  >
-                    <tr md-row>
-                      <th md-column md-order-by="id">
-                        {{ 'CONTACTMANAGER.ID' | translate }}
-                      </th>
-                      <th md-column md-order-by="phone">
-                        {{ 'CONTACTMANAGER.PHONE' | translate }}
-                      </th>
-                      <th md-column md-order-by="scheduledat">
-                        {{ 'CONTACTMANAGER.SCHEDULEDAT' | translate }}
-                      </th>
-                      <th md-column md-order-by="priority">
-                        {{ 'MOTIONDIALER.PRIORITY' | translate }}
-                      </th>
-                      <th md-column md-order-by="recallme">
-                        {{ 'CONTACTMANAGER.RECALLME' | translate }}
-                      </th>
-                      <th md-column md-order-by="VoiceQueueId">
-                        {{ 'CONTACTMANAGER.VOICEQUEUEID' | translate }}
-                      </th>
-                      <th md-column md-order-by="CampaignId">
-                        {{ 'CONTACTMANAGER.CAMPAIGNID' | translate }}
-                      </th>
-                      <th md-column width="10px"></th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr md-row ng-hide="vm.hoppers.count">
-                      <td md-cell colspan="7">
-                        <div layout="row" layout-align="center center">
-                          <span translate="CONTACTMANAGER.NO_AVAILABLE_INFO"
-                            >No Available Info</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                    <tr md-row ng-repeat="(id, hopper) in vm.hoppers.rows">
-                      <td md-cell>{{hopper.id}}</td>
-                      <td md-cell>{{hopper.phone}}</td>
-                      <td md-cell>{{hopper.scheduledat | date:'medium'}}</td>
-                      <td md-cell>
-                        {{ vm.arraypriority[hopper.priority].option }}
-                      </td>
-                      <td md-cell class="recallme">
-                        <md-icon
-                          md-colors="{color: {{hopper.recallme ? '\'green\'' : '\'red\''}}}"
-                          md-font-icon="{{hopper.recallme? 'icon-check' : 'icon-close'}}"
-                        ></md-icon>
-                      </td>
-                      <td md-cell>{{hopper.VoiceQueueId}}</td>
-                      <td md-cell>{{hopper.CampaignId}}</td>
-                      <td
-                        md-cell
-                        class="actions"
-                        ng-if="!vm.crudPermissions.readOnly"
-                      >
-                        <md-menu>
-                          <md-button
-                            class="md-icon-button"
-                            aria-label="More"
-                            translate
-                            translate-attr-aria-label="CONTACTMANAGER.MORE"
-                            ng-click="$mdMenu.open($event)"
-                          >
-                            <md-icon
-                              md-font-icon="icon-dots-vertical"
-                            ></md-icon>
-                          </md-button>
-
-                          <md-menu-content width="2">
-                            <md-menu-item>
-                              <md-button
-                                ng-if="vm.crudPermissions.canEdit && hopper.VoiceQueueId"
-                                ng-click="vm.editHopper($event, hopper)"
-                                translate="CONTACTMANAGER.EDIT_HOPPER"
-                              >
-                                Edit Hopper
-                              </md-button>
-                              <md-button
-                                ng-if="vm.crudPermissions.canEdit && hopper.CampaignId"
-                                ng-click="vm.createOrEditIvrCampaignHopper($event, hopper)"
-                                translate="CONTACTMANAGER.EDIT_HOPPER"
-                              >
-                                Edit Hopper
-                              </md-button>
-                            </md-menu-item>
-                            <md-menu-item>
-                              <md-button
-                                ng-click="vm.crudPermissions.canDelete && vm.deleteconfirm(hopper, $event)"
-                                translate="CONTACTMANAGER.DELETE_HOPPER"
-                              >
-                                Delete Hopper
-                              </md-button>
-                            </md-menu-item>
-                          </md-menu-content>
-                        </md-menu>
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-
-              <md-table-pagination
-                md-label="{page: '{{'CONTACTMANAGER.PAGE' | translate}}:', rowsPerPage: '{{'CONTACTMANAGER.ROWSPERPAGE' | translate}}:', of: '{{'CONTACTMANAGER.OF' | translate}}'}"
-                md-limit="vm.queryHopper.limit"
-                md-limit-options="[10, 15, 20, 50, 100, 250]"
-                md-page="vm.queryHopper.page"
-                md-total="{{vm.hoppers.count}}"
-                md-on-paginate="vm.getHoppers"
-                md-page-select
-              ></md-table-pagination>
-              <!-- / HOPPER TABLE -->
-            </div>
-          </div>
-
-          <div layout="row">
-            <div
-              class="contact-detail-form-container personal_info md-background-bg md-whiteframe-1dp"
-              flex
-            >
-              <md-toolbar class="md-table-toolbar md-default">
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead" translate="CONTACTMANAGER.FINAL"
-                    >Final</span
-                  >
-                  <div flex></div>
-                  <ms-search-bar
-                    on-search="vm.queryFinal.filter = query;"
-                    on-collapse="vm.queryFinal.filter = undefined;"
-                    debounce="300"
-                  ></ms-search-bar>
-                  <md-button
-                    class="md-icon-button"
-                    ng-click="vm.getFinals()"
-                    aria-label="reload"
-                    translate
-                    translate-attr-label="CONTACTMANAGER.RELOAD"
-                  >
-                    <md-tooltip
-                      >{{'CONTACTMANAGER.RELOAD' | translate}}</md-tooltip
-                    >
-                    <md-icon md-font-icon="icon-reload"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-
-              <!-- HOPPER TABLE -->
-              <md-table-container>
-                <table md-table multiple md-progress="vm.promise">
-                  <thead
-                    md-head
-                    md-order="vm.queryFinal.sort"
-                    md-on-reorder="vm.getFinals"
-                  >
-                    <tr md-row>
-                      <th md-column md-order-by="uniqueid">
-                        {{ 'CONTACTMANAGER.UNIQUEID' | translate }}
-                      </th>
-                      <th md-column md-order-by="calleridnum">
-                        {{ 'CONTACTMANAGER.PHONE' | translate }}
-                      </th>
-                      <th md-column md-order-by="state">
-                        {{ 'CONTACTMANAGER.STATE' | translate }}
-                      </th>
-                      <th md-column md-order-by="starttime">
-                        {{ 'CONTACTMANAGER.STARTTIME' | translate }}
-                      </th>
-                      <th md-column md-order-by="disposition">
-                        {{ 'CONTACTMANAGER.DISPOSITION' | translate }}
-                      </th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr md-row ng-hide="vm.finals.count">
-                      <td md-cell colspan="5">
-                        <div layout="row" layout-align="center center">
-                          <span translate="CONTACTMANAGER.NO_AVAILABLE_INFO"
-                            >No Available Info</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                    <tr md-row ng-repeat="(id, final) in vm.finals.rows">
-                      <td md-cell>{{final.uniqueid}}</td>
-                      <td md-cell>{{final.calleridnum}}</td>
-                      <td md-cell>{{final.statedesc}}</td>
-                      <td md-cell>{{final.starttime | date:'medium'}}</td>
-                      <td md-cell>{{final.disposition}}</td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-
-              <md-table-pagination
-                md-label="{page: '{{'CONTACTMANAGER.PAGE' | translate}}:', rowsPerPage: '{{'CONTACTMANAGER.ROWSPERPAGE' | translate}}:', of: '{{'CONTACTMANAGER.OF' | translate}}'}"
-                md-limit="vm.queryFinal.limit"
-                md-limit-options="[10, 15, 20, 50, 100, 250]"
-                md-page="vm.queryFinal.page"
-                md-total="{{vm.finals.count}}"
-                md-on-paginate="vm.getFinals"
-                md-page-select
-              ></md-table-pagination>
-              <!-- / HOPPER TABLE -->
-            </div>
-          </div>
-
-          <div layout="row">
-            <div
-              class="contact-detail-form-container personal_info md-background-bg md-whiteframe-1dp"
-              flex
-            >
-              <md-toolbar class="md-table-toolbar md-default">
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead" translate="CONTACTMANAGER.HISTORY"
-                    >History</span
-                  >
-                  <div flex></div>
-                  <ms-search-bar
-                    on-search="vm.queryHistory.filter = query;"
-                    on-collapse="vm.queryHistory.filter = undefined;"
-                    debounce="300"
-                  ></ms-search-bar>
-                  <md-button
-                    class="md-icon-button"
-                    ng-click="vm.getHistories()"
-                    aria-label="reload"
-                    translate
-                    translate-attr-label="CONTACTMANAGER.RELOAD"
-                  >
-                    <md-tooltip
-                      >{{'CONTACTMANAGER.RELOAD' | translate}}</md-tooltip
-                    >
-                    <md-icon md-font-icon="icon-reload"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-
-              <!-- HOPPER TABLE -->
-              <md-table-container>
-                <table md-table multiple md-progress="vm.promise">
-                  <thead
-                    md-head
-                    md-order="vm.queryHistory.sort"
-                    md-on-reorder="vm.getHistories"
-                  >
-                    <tr md-row>
-                      <th md-column md-order-by="uniqueid">
-                        {{ 'CONTACTMANAGER.UNIQUEID' | translate }}
-                      </th>
-                      <th md-column md-order-by="calleridnum">
-                        {{ 'CONTACTMANAGER.PHONE' | translate }}
-                      </th>
-                      <th md-column md-order-by="state">
-                        {{ 'CONTACTMANAGER.STATE' | translate }}
-                      </th>
-                      <th md-column md-order-by="scheduledat">
-                        {{ 'CONTACTMANAGER.SCHEDULEDAT' | translate }}
-                      </th>
-                      <th md-column md-order-by="starttime">
-                        {{ 'CONTACTMANAGER.STARTTIME' | translate }}
-                      </th>
-                      <th md-column md-order-by="endtime">
-                        {{ 'CONTACTMANAGER.ENDTIME' | translate }}
-                      </th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr md-row ng-hide="vm.histories.count">
-                      <td md-cell colspan="7">
-                        <div layout="row" layout-align="center center">
-                          <span translate="CONTACTMANAGER.NO_AVAILABLE_INFO"
-                            >No Available Info</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                    <tr md-row ng-repeat="(id, history) in vm.histories.rows">
-                      <td md-cell>{{history.uniqueid}}</td>
-                      <td md-cell>{{history.calleridnum}}</td>
-                      <td md-cell>{{history.statedesc}}</td>
-                      <td md-cell>{{history.scheduledat | date:'medium'}}</td>
-                      <td md-cell>{{history.starttime | date:'medium'}}</td>
-                      <td md-cell>{{history.endtime | date:'medium'}}</td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-
-              <md-table-pagination
-                md-label="{page: '{{'CONTACTMANAGER.PAGE' | translate}}:', rowsPerPage: '{{'CONTACTMANAGER.ROWSPERPAGE' | translate}}:', of: '{{'CONTACTMANAGER.OF' | translate}}'}"
-                md-limit="vm.queryHistory.limit"
-                md-limit-options="[10, 15, 20, 50, 100, 250]"
-                md-page="vm.queryHistory.page"
-                md-total="{{vm.histories.count}}"
-                md-on-paginate="vm.getHistories"
-                md-page-select
-              ></md-table-pagination>
-              <!-- / HOPPER TABLE -->
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-
-      <md-tab ng-if="vm.license.jscripty">
-        <md-tab-label>
-          <span translate="CONTACTMANAGER.JSCRIPTY">JSCRIPTY</span>
-        </md-tab-label>
-
-        <md-tab-body>
-          <div layout="row">
-            <div
-              class="contact-detail-form-container personal_info md-background-bg md-whiteframe-1dp"
-              flex
-            >
-              <md-toolbar class="md-table-toolbar md-default">
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead" translate="CONTACTMANAGER.SESSIONS"
-                    >Sessions</span
-                  >
-                  <div flex></div>
-                  <ms-search-bar
-                    on-search="vm.queryJscriptySession.filter = query;"
-                    on-collapse="vm.queryJscriptySession.filter = undefined;"
-                    debounce="300"
-                  ></ms-search-bar>
-                </div>
-              </md-toolbar>
-
-              <!-- SESSION TABLE -->
-              <md-table-container>
-                <table md-table multiple md-progress="vm.promise">
-                  <thead
-                    md-head
-                    md-order="vm.queryJscriptySession.sort"
-                    md-on-reorder="vm.getJscriptySessions"
-                  >
-                    <tr md-row>
-                      <th md-column md-order-by="id">
-                        {{ 'CONTACTMANAGER.ID' | translate }}
-                      </th>
-                      <th md-column md-order-by="starttime">
-                        {{ 'CONTACTMANAGER.STARTTIME' | translate }}
-                      </th>
-                      <th md-column md-order-by="endtime">
-                        {{ 'CONTACTMANAGER.ENDTIME' | translate }}
-                      </th>
-                      <th md-column md-order-by="agent">
-                        {{ 'CONTACTMANAGER.AGENT' | translate }}
-                      </th>
-                      <th md-column md-order-by="project">
-                        {{ 'CONTACTMANAGER.PROJECT' | translate }}
-                      </th>
-                      <th md-column width="10px"></th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr md-row ng-hide="vm.jscriptySessions.count">
-                      <td md-cell colspan="6">
-                        <div layout="row" layout-align="center center">
-                          <span translate="CONTACTMANAGER.NO_AVAILABLE_INFO"
-                            >No Available Info</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                    <tr
-                      md-row
-                      ng-repeat="(id, session) in vm.jscriptySessions.rows"
-                    >
-                      <td md-cell>{{session.id}}</td>
-                      <td md-cell>{{session.starttime | date:'medium'}}</td>
-                      <td md-cell>{{session.endtime | date:'medium'}}</td>
-                      <td md-cell>{{session.membername}}</td>
-                      <td md-cell>{{session.projectname}}</td>
-                      <td md-cell class="actions"></td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-
-              <md-table-pagination
-                md-label="{page: '{{'CONTACTMANAGER.PAGE' | translate}}:', rowsPerPage: '{{'CONTACTMANAGER.ROWSPERPAGE' | translate}}:', of: '{{'CONTACTMANAGER.OF' | translate}}'}"
-                md-limit="vm.queryHopper.limit"
-                md-limit-options="[10, 15, 20, 50, 100, 250]"
-                md-page="vm.queryHopper.page"
-                md-total="{{vm.hoppers.count}}"
-                md-on-paginate="vm.getHoppers"
-                md-page-select
-              ></md-table-pagination>
-              <!-- / SESSION TABLE -->
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-
-      <md-tab>
-        <md-tab-label>
-          <span translate="CONTACTMANAGER.CUSTOMER_JOURNEY"
-            >CUSTOMER JOURNEY</span
-          >
-        </md-tab-label>
-
-        <md-tab-body>
-          <md-content class="md-padding" id="interaction-content">
-            <div
-              ng-include="'app/main/apps/dashboards/views/general/agent/interaction/views/agent.general.info.journey.html'"
-            ></div>
-          </md-content>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/contacts/edit/view.html/view.html b/public/src/js/modules/main/apps/contactmanager/views/contacts/edit/view.html/view.html
new file mode 100644
index 0000000..f417c29
--- /dev/null
+++ b/public/src/js/modules/main/apps/contactmanager/views/contacts/edit/view.html/view.html
@@ -0,0 +1,1114 @@
+<div
+  id="cm-contact"
+  class="page-layout simple tabbed"
+  layout="column"
+  ng-init="vm.onInit()"
+>
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-contacts-button md-icon-button"
+        aria-label="Go to contacts"
+        ng-click="vm.gotoContacts()"
+        translate
+        translate-attr-aria-label="CONTACTMANAGER.GO_TO_CONTACTS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="contact-image" hide-xs>
+          <img ng-src="assets/images/business/contacts.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.contact.id}} {{vm.contact.firstName}} {{vm.contact.lastName}}
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="CONTACTMANAGER.CREATED_AT"></span>
+            <span>{{vm.contact.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div
+      ng-if="vm.contact.role && vm.contact.role !== 'admin'"
+      ng-controller="ContactQueueAddButtonController as vm_contact_qa"
+      ng-cloak
+    >
+      <md-fab-speed-dial
+        ng-hide="vm_contact_qa.hidden"
+        md-direction="left"
+        md-open="vm_contact_qa.isOpen"
+        class="md-scale md-fab"
+        ng-class="{ 'md-hover-full': vm_contact_qa.hover }"
+        ng-mouseenter="vm_contact_qa.isOpen=true"
+        ng-mouseleave="vm_contact_qa.isOpen=false"
+      >
+        <md-fab-trigger>
+          <md-button aria-label="menu" class="md-fab md-primary md-icon-button">
+            <md-tooltip md-direction="top" md-visible="tooltipVisible"
+              >Channels</md-tooltip
+            >
+            <md-icon md-font-icon="icon-eye" aria-label="channels"></md-icon>
+          </md-button>
+        </md-fab-trigger>
+        <md-fab-actions>
+          <div ng-repeat="channel in vm_contact_qa.channels">
+            <md-button
+              aria-label="{{channel.name}}"
+              class="md-fab md-raised md-icon-button md-mini"
+              ng-click="vm_contact_qa.openDialog($event, vm.contact, channel)"
+            >
+              <md-tooltip
+                md-direction="{{channel.direction}}"
+                md-visible="tooltipVisible"
+                md-autohide="false"
+              >
+                {{channel.name}}
+              </md-tooltip>
+              <md-icon
+                md-font-icon="{{channel.icon}}"
+                aria-label="{{channel.name}}"
+              ></md-icon>
+            </md-button>
+          </div>
+        </md-fab-actions>
+      </md-fab-speed-dial>
+    </div>
+
+    <div ng-if="vm.crudPermissions.canEdit">
+      <md-button
+        ng-click="vm.duplicateContact($event)"
+        class="md-fab md-warn md-icon-button"
+        aria-label="DUPLICATE"
+      >
+        <md-icon md-font-icon="icon-file-multiple"></md-icon>
+      </md-button>
+      <md-button
+        type="submit"
+        ng-click="vm.saveContact()"
+        class="send-button md-accent md-raised"
+        ng-disabled="detailForm.$pristine && customFieldsForm.$pristine && socialForm.$pristine"
+        translate="CONTACTMANAGER.SAVE"
+        translate-attr-aria-label="CONTACTMANAGER.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="CONTACTMANAGER.DETAIL">DETAIL</span>
+        </md-tab-label>
+
+        <md-tab-body>
+          <div layout="row">
+            <div layout="column" flex="70">
+              <md-card
+                class="contact-detail-form-container personal_info md-background-bg md-whiteframe-1dp"
+              >
+                <div class="pb-16" layout="row" layout-align="start center">
+                  <div
+                    class="h2 secondary-text text-truncate"
+                    translate="CONTACTMANAGER.PERSONAL_INFO"
+                  >
+                    PERSONAL_INFO
+                  </div>
+                </div>
+                <form name="detailForm" novalidate>
+                  <div layout-gt-sm="row" class="layout-gt-sm-row">
+                    <!-- fistName -->
+                    <md-input-container class="md-block" flex-gt-sm="">
+                      <label translate="CONTACTMANAGER.FIRSTNAME"
+                        >First Name</label
+                      >
+                      <md-icon
+                        md-font-icon="icon-account"
+                        class="firstname"
+                      ></md-icon>
+                      <input
+                        type="text"
+                        name="firstName"
+                        ng-model="vm.contact.firstName"
+                        class="text-truncate"
+                        required
+                        ng-disabled="!vm.crudPermissions.canEdit"
+                      />
+
+                      <div
+                        ng-messages="detailForm.firstName.$error"
+                        ng-show="detailForm.firstName.$touched"
+                        role="alert"
+                      >
+                        <div ng-message="required">
+                          <span
+                            translate="CONTACTMANAGER.ERRORS.FIRSTNAME_REQUIRED"
+                            >First name field is required</span
+                          >
+                        </div>
+                      </div>
+                    </md-input-container>
+                    <div flex="5"></div>
+                    <!-- lastName -->
+                    <md-input-container class="md-block" flex-gt-sm="">
+                      <label translate="CONTACTMANAGER.LASTNAME"
+                        >Last Name</label
+                      >
+                      <input
+                        type="text"
+                        name="lastName"
+                        ng-model="vm.contact.lastName"
+                        class="text-truncate"
+                        ng-disabled="!vm.crudPermissions.canEdit"
+                      />
+                    </md-input-container>
+                  </div>
+
+                  <div layout-gt-sm="row" class="layout-gt-sm-row">
+                    <!-- phone -->
+                    <md-input-container class="md-block" flex-gt-sm="">
+                      <label translate="CONTACTMANAGER.PHONE">Phone</label>
+                      <md-icon md-font-icon="icon-phone"></md-icon>
+                      <input
+                        type="text"
+                        name="phone"
+                        ng-model="vm.contact.phone"
+                        class="text-truncate"
+                        ng-disabled="!vm.crudPermissions.canEdit"
+                      />
+                    </md-input-container>
+                    <div flex="5"></div>
+                    <!-- mobile -->
+                    <md-input-container class="md-block" flex-gt-sm="">
+                      <label translate="CONTACTMANAGER.MOBILE">Mobile</label>
+                      <md-icon md-font-icon="icon-cellphone-iphone"></md-icon>
+                      <input
+                        type="text"
+                        name="mobile"
+                        ng-model="vm.contact.mobile"
+                        class="text-truncate"
+                        ng-disabled="!vm.crudPermissions.canEdit"
+                      />
+                    </md-input-container>
+                  </div>
+
+                  <div layout-gt-sm="row" class="layout-gt-sm-row">
+                    <!-- email -->
+                    <md-input-container class="md-block" flex-gt-sm="">
+                      <label translate="CONTACTMANAGER.EMAIL">Email</label>
+                      <md-icon
+                        md-font-icon="icon-email"
+                        class="email"
+                      ></md-icon>
+                      <input
+                        type="email"
+                        name="email"
+                        ng-model="vm.contact.email"
+                        class="text-truncate"
+                        ng-disabled="!vm.crudPermissions.canEdit"
+                      />
+                      <div
+                        ng-messages="detailForm.firstName.$error"
+                        ng-show="detailForm.firstName.$touched"
+                        role="alert"
+                      >
+                        <div ng-message="email">
+                          <span
+                            translate="CONTACTMANAGER.ERRORS.EMAIL_MUST_VALID"
+                            >Email must be a valid e-mail address</span
+                          >
+                        </div>
+                      </div>
+                    </md-input-container>
+                    <div flex="5"></div>
+                    <!-- fax -->
+                    <md-input-container class="md-block" flex-gt-sm="">
+                      <label translate="CONTACTMANAGER.FAX">Fax</label>
+                      <md-icon md-font-icon="icon-deskphone"></md-icon>
+                      <input
+                        type="text"
+                        name="fax"
+                        ng-model="vm.contact.fax"
+                        ng-disabled="!vm.crudPermissions.canEdit"
+                      />
+                    </md-input-container>
+                  </div>
+
+                  <div layout-gt-sm="row" class="layout-gt-sm-row">
+                    <md-input-container
+                      class="md-block"
+                      flex-gt-sm=""
+                      ng-init="vm.contact.dateOfBirth = vm.getDateFromString(vm.contact.dateOfBirth)"
+                    >
+                      <label translate="CONTACTMANAGER.DATE_OF_BIRTH"
+                        >Date of Birth</label
+                      >
+                      <mdp-date-picker
+                        mdp-open-on-click
+                        mdp-format="YYYY-MM-DD"
+                        name="dateOfBirth"
+                        ng-model="vm.contact.dateOfBirth"
+                        mdp-disabled="!vm.crudPermissions.canEdit"
+                      ></mdp-date-picker>
+                    </md-input-container>
+                  </div>
+
+                  <div layout-gt-sm="row" class="layout-gt-sm-row">
+                    <md-input-container
+                      ng-if="vm.companies.rows.length"
+                      class="md-block"
+                      flex-gt-sm=""
+                    >
+                      <label translate="CONTACTMANAGER.COMPANY">Company</label>
+                      <md-icon md-font-icon="icon-domain"></md-icon>
+                      <md-select
+                        name="company"
+                        ng-model="vm.contact.CompanyId"
+                        ng-disabled="!vm.crudPermissions.canEdit"
+                      >
+                        <md-optgroup label="Companies">
+                          <md-option
+                            ng-value="company.id"
+                            ng-repeat="company in vm.companies.rows"
+                            ng-disabled="company.canSelect === false"
+                            >{{company.name}}</md-option
+                          >
+                          <md-option ng-value="null"
+                            ><em translate="CONTACTMANAGER.NONE"
+                              >None</em
+                            ></md-option
+                          >
+                        </md-optgroup>
+                      </md-select>
+                      <md-icon
+                        class="pointer"
+                        ng-show="vm.contact.CompanyId"
+                        md-font-icon="icon-information-outline"
+                        ng-click="vm.editCompany($event, vm.contact.CompanyId)"
+                      ></md-icon>
+                    </md-input-container>
+                    <section ng-if="!vm.companies.rows.length" flex-gt-sm="">
+                      <md-icon md-font-icon="icon-briefcase"></md-icon>
+                      <label translate="CONTACTMANAGER.NO_COMPANIES"
+                        >No Companies</label
+                      >
+                    </section>
+                  </div>
+
+                  <div layout-gt-sm="row" class="layout-gt-sm-row">
+                    <md-input-container
+                      ng-if="vm.tags.rows.length"
+                      class="md-block"
+                      flex-gt-sm=""
+                    >
+                      <label translate="CONTACTMANAGER.TAGS">Tags</label>
+                      <md-icon md-font-icon="icon-tag"></md-icon>
+                      <md-select
+                        ng-model="vm.Tags"
+                        multiple
+                        ng-disabled="!vm.crudPermissions.canEdit"
+                      >
+                        <md-optgroup label="Tags">
+                          <md-option
+                            ng-value="tag.id"
+                            ng-repeat="tag in vm.tags.rows"
+                            ng-disabled="tag.canSelect === false"
+                            >{{tag.name}}</md-option
+                          >
+                        </md-optgroup>
+                      </md-select>
+                    </md-input-container>
+                    <section ng-if="!vm.tags.rows.length" flex-gt-sm="">
+                      <md-icon md-font-icon="icon-tag"></md-icon>
+                      <label translate="CONTACTMANAGER.NO_TAG">No Tags</label>
+                      <md-button
+                        class="md-accent"
+                        translate="CONTACTMANAGER.ADD_TAG"
+                        >Add Tag</md-button
+                      >
+                    </section>
+                  </div>
+
+                  <div
+                    ng-if="!vm.allFields"
+                    layout="row"
+                    layout-align="center center"
+                  >
+                    <md-button
+                      class="md-accent"
+                      ng-click="vm.allFields = true"
+                      translate="CONTACTMANAGER.SHOW_ALL_FIELDS"
+                      >Show All Fields</md-button
+                    >
+                  </div>
+
+                  <div ng-if="vm.allFields">
+                    <div layout-gt-sm="row" class="layout-gt-sm-row">
+                      <!-- country -->
+                      <md-input-container class="md-block" flex-gt-sm="">
+                        <label translate="CONTACTMANAGER.COUNTRY"
+                          >Country</label
+                        >
+                        <md-icon
+                          md-font-icon="icon-home"
+                          class="country"
+                        ></md-icon>
+                        <input
+                          type="text"
+                          name="country"
+                          ng-model="vm.contact.country"
+                          class="text-truncate"
+                          ng-disabled="!vm.crudPermissions.canEdit"
+                        />
+                      </md-input-container>
+                      <div flex="5"></div>
+                      <!-- city -->
+                      <md-input-container class="md-block" flex-gt-sm="">
+                        <label translate="CONTACTMANAGER.CITY">City</label>
+                        <input
+                          type="text"
+                          name="city"
+                          ng-model="vm.contact.city"
+                          ng-disabled="!vm.crudPermissions.canEdit"
+                        />
+                      </md-input-container>
+                    </div>
+
+                    <div layout-gt-sm="row" class="layout-gt-sm-row">
+                      <div flex="5"></div>
+                      <!-- street -->
+                      <md-input-container class="md-block" flex-gt-sm="">
+                        <label translate="CONTACTMANAGER.STREET">Street</label>
+                        <input
+                          type="text"
+                          name="street"
+                          ng-model="vm.contact.street"
+                          ng-disabled="!vm.crudPermissions.canEdit"
+                        />
+                      </md-input-container>
+                      <div flex="5"></div>
+                      <!-- postalCode -->
+                      <md-input-container class="md-block" flex-gt-sm="">
+                        <label translate="CONTACTMANAGER.POSTALCODE"
+                          >Postal Code</label
+                        >
+                        <input
+                          type="text"
+                          name="postalCode"
+                          ng-model="vm.contact.postalCode"
+                          ng-disabled="!vm.crudPermissions.canEdit"
+                        />
+                      </md-input-container>
+                    </div>
+
+                    <div layout-gt-sm="row" class="layout-gt-sm-row">
+                      <md-input-container class="md-block" flex-gt-sm="">
+                        <label
+                          translate
+                          translate-attr-placeholder="CONTACTMANAGER.NOTES"
+                          >Notes</label
+                        >
+                        <md-icon md-font-icon="icon-note"></md-icon>
+                        <textarea
+                          ng-model="vm.contact.description"
+                          type="text"
+                          max-rows="4"
+                          ng-disabled="!vm.crudPermissions.canEdit"
+                        ></textarea>
+                      </md-input-container>
+                    </div>
+
+                    <div layout="row" layout-align="center center">
+                      <md-button
+                        class="md-accent"
+                        ng-click="vm.allFields = false"
+                        translate="CONTACTMANAGER.FEWER_FIELDS"
+                        >Fewer Fields
+                      </md-button>
+                    </div>
+                  </div>
+                </form>
+              </md-card>
+              <md-card
+                class="contact-detail-form-container personal_info md-background-bg md-whiteframe-1dp"
+              >
+                <div class="pb-16" layout="row" layout-align="start center">
+                  <div
+                    class="h2 secondary-text text-truncate"
+                    translate="CONTACTMANAGER.SOCIAL"
+                  >
+                    Social
+                  </div>
+                </div>
+                <form name="socialForm" novalidate>
+                  <div layout-gt-sm="row" class="layout-gt-sm-row">
+                    <md-input-container class="md-block" flex-gt-sm="">
+                      <label>Facebook</label>
+                      <md-icon
+                        md-font-icon="icon-facebook"
+                        class="facebook"
+                      ></md-icon>
+                      <input
+                        type="text"
+                        name="facebook"
+                        ng-model="vm.contact.facebook"
+                        class="text-truncate"
+                        ng-disabled="!vm.crudPermissions.canEdit"
+                      />
+                    </md-input-container>
+                    <div flex="5"></div>
+                    <md-input-container class="md-block" flex-gt-sm="">
+                      <label>Twitter</label>
+                      <md-icon
+                        md-font-icon="icon-twitter"
+                        class="twitter"
+                      ></md-icon>
+                      <input
+                        type="text"
+                        name="twitter"
+                        ng-model="vm.contact.twitter"
+                        class="text-truncate"
+                        ng-disabled="!vm.crudPermissions.canEdit"
+                      />
+                    </md-input-container>
+                  </div>
+                  <div layout-gt-sm="row" class="layout-gt-sm-row">
+                    <md-input-container class="md-block" flex-gt-sm="">
+                      <label>Line</label>
+                      <md-icon md-font-icon="fab fa-line"></md-icon>
+                      <input
+                        type="text"
+                        name="line"
+                        ng-model="vm.contact.line"
+                        class="text-truncate"
+                      />
+                    </md-input-container>
+                    <div flex="5"></div>
+                    <md-input-container class="md-block" flex-gt-sm="">
+                      <label>Viber</label>
+                      <md-icon md-font-icon="fab fa-viber"></md-icon>
+                      <input
+                        type="text"
+                        name="viber"
+                        ng-model="vm.contact.viber"
+                        class="text-truncate"
+                      />
+                    </md-input-container>
+                  </div>
+                  <div layout-gt-sm="row" class="layout-gt-sm-row">
+                    <md-input-container class="md-block" flex-gt-sm="">
+                      <label>WeChat</label>
+                      <md-icon md-font-icon="fab fa-weixin"></md-icon>
+                      <input
+                        type="text"
+                        name="wechat"
+                        ng-model="vm.contact.wechat"
+                        class="text-truncate"
+                      />
+                    </md-input-container>
+                    <div flex="5"></div>
+                    <md-input-container class="md-block" flex-gt-sm="">
+                      <label>Telegram</label>
+                      <md-icon md-font-icon="icon-telegram"></md-icon>
+                      <input
+                        type="text"
+                        name="telegram"
+                        ng-model="vm.contact.telegram"
+                        class="text-truncate"
+                      />
+                    </md-input-container>
+                  </div>
+                </form>
+              </md-card>
+            </div>
+
+            <div flex></div>
+
+            <div
+              class="contact-detail-form-container personal_info md-background-bg md-whiteframe-1dp"
+              flex="25"
+            >
+              <div class="pb-16" layout="row" layout-align="start center">
+                <div
+                  class="h2 secondary-text text-truncate"
+                  translate="CONTACTMANAGER.CUSTOM_FIELDS"
+                >
+                  CUSTOM FIELDS
+                </div>
+              </div>
+              <form name="customFieldsForm" novalidate>
+                <md-input-container class="md-block">
+                  <label
+                    translate
+                    translate-attr-placeholder="CONTACTMANAGER.LIST"
+                    >List</label
+                  >
+                  <md-select
+                    name="list"
+                    ng-model="vm.contact.ListId"
+                    md-on-close="vm.onSelectList($event)"
+                    ng-disabled="vm.contact.ListId"
+                  >
+                    <md-optgroup label="Lists">
+                      <md-option
+                        ng-value="list.id"
+                        ng-repeat="list in vm.lists.rows"
+                        >#{{list.id}} - {{list.name}}</md-option
+                      >
+                      <md-option ng-value="null"
+                        ><em translate="CONTACTMANAGER.NONE"
+                          >None</em
+                        ></md-option
+                      >
+                    </md-optgroup>
+                  </md-select>
+                </md-input-container>
+                <div
+                  ng-repeat="customField in vm.customFields.rows"
+                  ng-switch="customField.type"
+                >
+                  <md-input-container
+                    class="md-block"
+                    ng-switch-when="datetime"
+                  >
+                    <label>{{customField.alias}}</label>
+                    <div
+                      ng-init="vm.contact['cf_' + customField.id] = vm.getDateFromString(vm.contact['cf_' + customField.id])"
+                    >
+                      <mdp-date-picker
+                        mdp-open-on-click
+                        ng-required="customField.required"
+                        mdp-format="YYYY-MM-DD"
+                        ng-model="vm.contact['cf_' + customField.id]"
+                      ></mdp-date-picker>
+                      <mdp-time-picker
+                        mdp-open-on-click
+                        mdp-placeholder="Time"
+                        ng-required="customField.required"
+                        mdp-format="HH:mm:ss"
+                        mdp-auto-switch="true"
+                        ng-model="vm.contact['cf_' + customField.id]"
+                      ></mdp-time-picker>
+                    </div>
+                  </md-input-container>
+
+                  <md-input-container class="md-block" ng-switch-when="select">
+                    <label>{{customField.alias}}</label>
+                    <md-select
+                      ng-model="vm.contact['cf_' + customField.id]"
+                      ng-required="customField.required"
+                      ng-disabled="!vm.crudPermissions.canEdit"
+                    >
+                      <md-option
+                        ng-repeat="value in customField.values"
+                        ng-value="value.value"
+                        >{{value.value}}</md-option
+                      >
+                      <md-option ng-value="null"
+                        ><em translate="CONTACTMANAGER.NONE"
+                          >None</em
+                        ></md-option
+                      >
+                    </md-select>
+                  </md-input-container>
+
+                  <md-input-container class="md-block" ng-switch-when="switch">
+                    <md-switch
+                      aria-label="{{customField.alias}}"
+                      ng-model="vm.contact['cf_' + customField.id]"
+                      ng-true-value="1"
+                      ng-false-value="0"
+                    >
+                      {{customField.alias}}
+                    </md-switch>
+                  </md-input-container>
+
+                  <md-input-container class="md-block" ng-switch-default>
+                    <label>{{customField.alias}}</label>
+                    <input
+                      type="{{customField.type}}"
+                      ng-model="vm.contact['cf_' + customField.id]"
+                      ng-required="customField.required"
+                      ng-disabled="!vm.crudPermissions.canEdit"
+                    />
+                  </md-input-container>
+                </div>
+              </form>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+
+      <md-tab ng-if="vm.license.dialer">
+        <md-tab-label>
+          <span translate="CONTACTMANAGER.MOTION_BULL">MOTION BULL</span>
+        </md-tab-label>
+
+        <md-tab-body>
+          <div layout="row">
+            <div
+              class="contact-detail-form-container personal_info md-background-bg md-whiteframe-1dp"
+              flex
+            >
+              <md-toolbar class="md-table-toolbar md-default">
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead" translate="CONTACTMANAGER.HOPPER"
+                    >Hopper</span
+                  >
+                  <div flex></div>
+                  <ms-search-bar
+                    on-search="vm.queryHopper.filter = query;"
+                    on-collapse="vm.queryHopper.filter = undefined;"
+                    debounce="300"
+                  ></ms-search-bar>
+                  <md-button
+                    class="md-icon-button"
+                    ng-click="vm.getHoppers()"
+                    aria-label="reload"
+                    translate
+                    translate-attr-label="CONTACTMANAGER.RELOAD"
+                  >
+                    <md-tooltip
+                      >{{'CONTACTMANAGER.RELOAD' | translate}}</md-tooltip
+                    >
+                    <md-icon md-font-icon="icon-reload"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+
+              <!-- HOPPER TABLE -->
+              <md-table-container>
+                <table md-table multiple md-progress="vm.promise">
+                  <thead
+                    md-head
+                    md-order="vm.queryHopper.sort"
+                    md-on-reorder="vm.getHoppers"
+                  >
+                    <tr md-row>
+                      <th md-column md-order-by="id">
+                        {{ 'CONTACTMANAGER.ID' | translate }}
+                      </th>
+                      <th md-column md-order-by="phone">
+                        {{ 'CONTACTMANAGER.PHONE' | translate }}
+                      </th>
+                      <th md-column md-order-by="scheduledat">
+                        {{ 'CONTACTMANAGER.SCHEDULEDAT' | translate }}
+                      </th>
+                      <th md-column md-order-by="priority">
+                        {{ 'MOTIONDIALER.PRIORITY' | translate }}
+                      </th>
+                      <th md-column md-order-by="recallme">
+                        {{ 'CONTACTMANAGER.RECALLME' | translate }}
+                      </th>
+                      <th md-column md-order-by="VoiceQueueId">
+                        {{ 'CONTACTMANAGER.VOICEQUEUEID' | translate }}
+                      </th>
+                      <th md-column md-order-by="CampaignId">
+                        {{ 'CONTACTMANAGER.CAMPAIGNID' | translate }}
+                      </th>
+                      <th md-column width="10px"></th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr md-row ng-hide="vm.hoppers.count">
+                      <td md-cell colspan="7">
+                        <div layout="row" layout-align="center center">
+                          <span translate="CONTACTMANAGER.NO_AVAILABLE_INFO"
+                            >No Available Info</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                    <tr md-row ng-repeat="(id, hopper) in vm.hoppers.rows">
+                      <td md-cell>{{hopper.id}}</td>
+                      <td md-cell>{{hopper.phone}}</td>
+                      <td md-cell>{{hopper.scheduledat | date:'medium'}}</td>
+                      <td md-cell>
+                        {{ vm.arraypriority[hopper.priority].option }}
+                      </td>
+                      <td md-cell class="recallme">
+                        <md-icon
+                          md-colors="{color: {{hopper.recallme ? '\'green\'' : '\'red\''}}}"
+                          md-font-icon="{{hopper.recallme? 'icon-check' : 'icon-close'}}"
+                        ></md-icon>
+                      </td>
+                      <td md-cell>{{hopper.VoiceQueueId}}</td>
+                      <td md-cell>{{hopper.CampaignId}}</td>
+                      <td
+                        md-cell
+                        class="actions"
+                        ng-if="!vm.crudPermissions.readOnly"
+                      >
+                        <md-menu>
+                          <md-button
+                            class="md-icon-button"
+                            aria-label="More"
+                            translate
+                            translate-attr-aria-label="CONTACTMANAGER.MORE"
+                            ng-click="$mdMenu.open($event)"
+                          >
+                            <md-icon
+                              md-font-icon="icon-dots-vertical"
+                            ></md-icon>
+                          </md-button>
+
+                          <md-menu-content width="2">
+                            <md-menu-item>
+                              <md-button
+                                ng-if="vm.crudPermissions.canEdit && hopper.VoiceQueueId"
+                                ng-click="vm.editHopper($event, hopper)"
+                                translate="CONTACTMANAGER.EDIT_HOPPER"
+                              >
+                                Edit Hopper
+                              </md-button>
+                              <md-button
+                                ng-if="vm.crudPermissions.canEdit && hopper.CampaignId"
+                                ng-click="vm.createOrEditIvrCampaignHopper($event, hopper)"
+                                translate="CONTACTMANAGER.EDIT_HOPPER"
+                              >
+                                Edit Hopper
+                              </md-button>
+                            </md-menu-item>
+                            <md-menu-item>
+                              <md-button
+                                ng-click="vm.crudPermissions.canDelete && vm.deleteconfirm(hopper, $event)"
+                                translate="CONTACTMANAGER.DELETE_HOPPER"
+                              >
+                                Delete Hopper
+                              </md-button>
+                            </md-menu-item>
+                          </md-menu-content>
+                        </md-menu>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+
+              <md-table-pagination
+                md-label="{page: '{{'CONTACTMANAGER.PAGE' | translate}}:', rowsPerPage: '{{'CONTACTMANAGER.ROWSPERPAGE' | translate}}:', of: '{{'CONTACTMANAGER.OF' | translate}}'}"
+                md-limit="vm.queryHopper.limit"
+                md-limit-options="[10, 15, 20, 50, 100, 250]"
+                md-page="vm.queryHopper.page"
+                md-total="{{vm.hoppers.count}}"
+                md-on-paginate="vm.getHoppers"
+                md-page-select
+              ></md-table-pagination>
+              <!-- / HOPPER TABLE -->
+            </div>
+          </div>
+
+          <div layout="row">
+            <div
+              class="contact-detail-form-container personal_info md-background-bg md-whiteframe-1dp"
+              flex
+            >
+              <md-toolbar class="md-table-toolbar md-default">
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead" translate="CONTACTMANAGER.FINAL"
+                    >Final</span
+                  >
+                  <div flex></div>
+                  <ms-search-bar
+                    on-search="vm.queryFinal.filter = query;"
+                    on-collapse="vm.queryFinal.filter = undefined;"
+                    debounce="300"
+                  ></ms-search-bar>
+                  <md-button
+                    class="md-icon-button"
+                    ng-click="vm.getFinals()"
+                    aria-label="reload"
+                    translate
+                    translate-attr-label="CONTACTMANAGER.RELOAD"
+                  >
+                    <md-tooltip
+                      >{{'CONTACTMANAGER.RELOAD' | translate}}</md-tooltip
+                    >
+                    <md-icon md-font-icon="icon-reload"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+
+              <!-- HOPPER TABLE -->
+              <md-table-container>
+                <table md-table multiple md-progress="vm.promise">
+                  <thead
+                    md-head
+                    md-order="vm.queryFinal.sort"
+                    md-on-reorder="vm.getFinals"
+                  >
+                    <tr md-row>
+                      <th md-column md-order-by="uniqueid">
+                        {{ 'CONTACTMANAGER.UNIQUEID' | translate }}
+                      </th>
+                      <th md-column md-order-by="calleridnum">
+                        {{ 'CONTACTMANAGER.PHONE' | translate }}
+                      </th>
+                      <th md-column md-order-by="state">
+                        {{ 'CONTACTMANAGER.STATE' | translate }}
+                      </th>
+                      <th md-column md-order-by="starttime">
+                        {{ 'CONTACTMANAGER.STARTTIME' | translate }}
+                      </th>
+                      <th md-column md-order-by="disposition">
+                        {{ 'CONTACTMANAGER.DISPOSITION' | translate }}
+                      </th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr md-row ng-hide="vm.finals.count">
+                      <td md-cell colspan="5">
+                        <div layout="row" layout-align="center center">
+                          <span translate="CONTACTMANAGER.NO_AVAILABLE_INFO"
+                            >No Available Info</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                    <tr md-row ng-repeat="(id, final) in vm.finals.rows">
+                      <td md-cell>{{final.uniqueid}}</td>
+                      <td md-cell>{{final.calleridnum}}</td>
+                      <td md-cell>{{final.statedesc}}</td>
+                      <td md-cell>{{final.starttime | date:'medium'}}</td>
+                      <td md-cell>{{final.disposition}}</td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+
+              <md-table-pagination
+                md-label="{page: '{{'CONTACTMANAGER.PAGE' | translate}}:', rowsPerPage: '{{'CONTACTMANAGER.ROWSPERPAGE' | translate}}:', of: '{{'CONTACTMANAGER.OF' | translate}}'}"
+                md-limit="vm.queryFinal.limit"
+                md-limit-options="[10, 15, 20, 50, 100, 250]"
+                md-page="vm.queryFinal.page"
+                md-total="{{vm.finals.count}}"
+                md-on-paginate="vm.getFinals"
+                md-page-select
+              ></md-table-pagination>
+              <!-- / HOPPER TABLE -->
+            </div>
+          </div>
+
+          <div layout="row">
+            <div
+              class="contact-detail-form-container personal_info md-background-bg md-whiteframe-1dp"
+              flex
+            >
+              <md-toolbar class="md-table-toolbar md-default">
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead" translate="CONTACTMANAGER.HISTORY"
+                    >History</span
+                  >
+                  <div flex></div>
+                  <ms-search-bar
+                    on-search="vm.queryHistory.filter = query;"
+                    on-collapse="vm.queryHistory.filter = undefined;"
+                    debounce="300"
+                  ></ms-search-bar>
+                  <md-button
+                    class="md-icon-button"
+                    ng-click="vm.getHistories()"
+                    aria-label="reload"
+                    translate
+                    translate-attr-label="CONTACTMANAGER.RELOAD"
+                  >
+                    <md-tooltip
+                      >{{'CONTACTMANAGER.RELOAD' | translate}}</md-tooltip
+                    >
+                    <md-icon md-font-icon="icon-reload"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+
+              <!-- HOPPER TABLE -->
+              <md-table-container>
+                <table md-table multiple md-progress="vm.promise">
+                  <thead
+                    md-head
+                    md-order="vm.queryHistory.sort"
+                    md-on-reorder="vm.getHistories"
+                  >
+                    <tr md-row>
+                      <th md-column md-order-by="uniqueid">
+                        {{ 'CONTACTMANAGER.UNIQUEID' | translate }}
+                      </th>
+                      <th md-column md-order-by="calleridnum">
+                        {{ 'CONTACTMANAGER.PHONE' | translate }}
+                      </th>
+                      <th md-column md-order-by="state">
+                        {{ 'CONTACTMANAGER.STATE' | translate }}
+                      </th>
+                      <th md-column md-order-by="scheduledat">
+                        {{ 'CONTACTMANAGER.SCHEDULEDAT' | translate }}
+                      </th>
+                      <th md-column md-order-by="starttime">
+                        {{ 'CONTACTMANAGER.STARTTIME' | translate }}
+                      </th>
+                      <th md-column md-order-by="endtime">
+                        {{ 'CONTACTMANAGER.ENDTIME' | translate }}
+                      </th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr md-row ng-hide="vm.histories.count">
+                      <td md-cell colspan="7">
+                        <div layout="row" layout-align="center center">
+                          <span translate="CONTACTMANAGER.NO_AVAILABLE_INFO"
+                            >No Available Info</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                    <tr md-row ng-repeat="(id, history) in vm.histories.rows">
+                      <td md-cell>{{history.uniqueid}}</td>
+                      <td md-cell>{{history.calleridnum}}</td>
+                      <td md-cell>{{history.statedesc}}</td>
+                      <td md-cell>{{history.scheduledat | date:'medium'}}</td>
+                      <td md-cell>{{history.starttime | date:'medium'}}</td>
+                      <td md-cell>{{history.endtime | date:'medium'}}</td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+
+              <md-table-pagination
+                md-label="{page: '{{'CONTACTMANAGER.PAGE' | translate}}:', rowsPerPage: '{{'CONTACTMANAGER.ROWSPERPAGE' | translate}}:', of: '{{'CONTACTMANAGER.OF' | translate}}'}"
+                md-limit="vm.queryHistory.limit"
+                md-limit-options="[10, 15, 20, 50, 100, 250]"
+                md-page="vm.queryHistory.page"
+                md-total="{{vm.histories.count}}"
+                md-on-paginate="vm.getHistories"
+                md-page-select
+              ></md-table-pagination>
+              <!-- / HOPPER TABLE -->
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+
+      <md-tab ng-if="vm.license.jscripty">
+        <md-tab-label>
+          <span translate="CONTACTMANAGER.JSCRIPTY">JSCRIPTY</span>
+        </md-tab-label>
+
+        <md-tab-body>
+          <div layout="row">
+            <div
+              class="contact-detail-form-container personal_info md-background-bg md-whiteframe-1dp"
+              flex
+            >
+              <md-toolbar class="md-table-toolbar md-default">
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead" translate="CONTACTMANAGER.SESSIONS"
+                    >Sessions</span
+                  >
+                  <div flex></div>
+                  <ms-search-bar
+                    on-search="vm.queryJscriptySession.filter = query;"
+                    on-collapse="vm.queryJscriptySession.filter = undefined;"
+                    debounce="300"
+                  ></ms-search-bar>
+                </div>
+              </md-toolbar>
+
+              <!-- SESSION TABLE -->
+              <md-table-container>
+                <table md-table multiple md-progress="vm.promise">
+                  <thead
+                    md-head
+                    md-order="vm.queryJscriptySession.sort"
+                    md-on-reorder="vm.getJscriptySessions"
+                  >
+                    <tr md-row>
+                      <th md-column md-order-by="id">
+                        {{ 'CONTACTMANAGER.ID' | translate }}
+                      </th>
+                      <th md-column md-order-by="starttime">
+                        {{ 'CONTACTMANAGER.STARTTIME' | translate }}
+                      </th>
+                      <th md-column md-order-by="endtime">
+                        {{ 'CONTACTMANAGER.ENDTIME' | translate }}
+                      </th>
+                      <th md-column md-order-by="agent">
+                        {{ 'CONTACTMANAGER.AGENT' | translate }}
+                      </th>
+                      <th md-column md-order-by="project">
+                        {{ 'CONTACTMANAGER.PROJECT' | translate }}
+                      </th>
+                      <th md-column width="10px"></th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr md-row ng-hide="vm.jscriptySessions.count">
+                      <td md-cell colspan="6">
+                        <div layout="row" layout-align="center center">
+                          <span translate="CONTACTMANAGER.NO_AVAILABLE_INFO"
+                            >No Available Info</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                    <tr
+                      md-row
+                      ng-repeat="(id, session) in vm.jscriptySessions.rows"
+                    >
+                      <td md-cell>{{session.id}}</td>
+                      <td md-cell>{{session.starttime | date:'medium'}}</td>
+                      <td md-cell>{{session.endtime | date:'medium'}}</td>
+                      <td md-cell>{{session.membername}}</td>
+                      <td md-cell>{{session.projectname}}</td>
+                      <td md-cell class="actions"></td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+
+              <md-table-pagination
+                md-label="{page: '{{'CONTACTMANAGER.PAGE' | translate}}:', rowsPerPage: '{{'CONTACTMANAGER.ROWSPERPAGE' | translate}}:', of: '{{'CONTACTMANAGER.OF' | translate}}'}"
+                md-limit="vm.queryHopper.limit"
+                md-limit-options="[10, 15, 20, 50, 100, 250]"
+                md-page="vm.queryHopper.page"
+                md-total="{{vm.hoppers.count}}"
+                md-on-paginate="vm.getHoppers"
+                md-page-select
+              ></md-table-pagination>
+              <!-- / SESSION TABLE -->
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+
+      <md-tab>
+        <md-tab-label>
+          <span translate="CONTACTMANAGER.CUSTOMER_JOURNEY"
+            >CUSTOMER JOURNEY</span
+          >
+        </md-tab-label>
+
+        <md-tab-body>
+          <md-content class="md-padding" id="interaction-content">
+            <div
+              ng-include="'app/main/apps/dashboards/views/general/agent/interaction/views/agent.general.info.journey.html'"
+            ></div>
+          </md-content>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/contacts/import/import.html/import-[chunkhash].html b/public/src/js/modules/main/apps/contactmanager/views/contacts/import/import.html/import-[chunkhash].html
deleted file mode 100644
index 5451e7c..0000000
--- a/public/src/js/modules/main/apps/contactmanager/views/contacts/import/import.html/import-[chunkhash].html
+++ /dev/null
@@ -1,343 +0,0 @@
-<md-dialog class="import-dialog" aria-label="Import contact">
-  <form name="importForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title" translate="CONTACTMANAGER.IMPORT_CONTACTS"
-          >Import Contacts</span
-        >
-        <md-button
-          ng-if="vm.result.finish || !vm.processing"
-          class="md-icon-button"
-          ng-click="vm.closeDialog()"
-        >
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <div md-background-bg layout="row" layout-align="start start">
-      <md-progress-linear
-        ng-disabled="!vm.processing || vm.result.finish"
-        md-mode="indeterminate"
-        class="md-warn"
-      ></md-progress-linear>
-    </div>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <div>
-        <md-content ng-show="!vm.processing">
-          <div class="form-title" translate="CONTACTMANAGER.CONTACTMANAGER">
-            CONTACT MANAGER
-          </div>
-
-          <md-input-container
-            class="md-icon-float md-block"
-            ng-repeat="contactField in vm.contactFields"
-          >
-            <label
-              >{{'CONTACTMANAGER.' + contactField.key | uppercase |
-              translate}}</label
-            >
-            <md-select
-              name="{{contactField.key}}"
-              ng-model="vm.binding[contactField.key]"
-              placeholder="{{'CONTACTMANAGER.' + contactField.key | uppercase | translate}}"
-              ng-required="contactField.required"
-            >
-              <md-option ng-value="field" ng-repeat="field in vm.fields"
-                >{{ field }}</md-option
-              >
-              <md-option ng-value="null" ng-hide="contactField.required">
-                <em>{{ 'CONTACTMANAGER.NONE' | translate }}</em>
-              </md-option>
-            </md-select>
-          </md-input-container>
-
-          <md-input-container class="md-icon-float md-block">
-            <label translate="CONTACTMANAGER.LIST">List</label>
-            <md-select
-              name="list"
-              ng-model="vm.ListId"
-              placeholder="Select a list"
-              ng-change="vm.onChangeList()"
-              required
-            >
-              <md-option ng-value="list.id" ng-repeat="list in vm.lists.rows"
-                >{{list.name}}</md-option
-              >
-            </md-select>
-          </md-input-container>
-
-          <md-input-container
-            class="md-icon-float md-block"
-            ng-repeat="customField in vm.customFields.rows"
-          >
-            <label>{{customField.alias}}</label>
-            <md-select
-              ng-model="vm.binding['cf_' + customField.id]"
-              placeholder="{{customField.alias}}"
-              ng-required="customField.required"
-            >
-              <md-option ng-value="field" ng-repeat="field in vm.fields"
-                >{{ field }}</md-option
-              >
-              <md-option ng-value="null" ng-hide="customField.required">
-                <em>{{ 'CONTACTMANAGER.NONE' | translate }}</em>
-              </md-option>
-            </md-select>
-          </md-input-container>
-
-          <md-input-container class="md-icon-float md-block">
-            <label translate="CONTACTMANAGER.COMPANY">Company</label>
-            <md-select
-              name="company"
-              ng-model="vm.CompanyId"
-              placeholder="Select a company"
-            >
-              <md-option
-                ng-value="company.id"
-                ng-repeat="company in vm.companies.rows"
-                >{{company.name}}</md-option
-              >
-              <md-option ng-value="null">
-                <em translate="CONTACTMANAGER.NONE">None</em>
-              </md-option>
-            </md-select>
-          </md-input-container>
-
-          <md-input-container class="md-icon-float md-block">
-            <md-select
-              ng-model="vm.duplicates"
-              placeholder="{{ 'CONTACTMANAGER.CHECK_DUPLICATES' | translate}}"
-              multiple
-            >
-              <md-option
-                ng-value="contactField.key"
-                ng-repeat="contactField in vm.contactFields"
-                >{{ 'CONTACTMANAGER.' + contactField.key | uppercase |
-                translate}}</md-option
-              >
-            </md-select>
-          </md-input-container>
-
-          <div ng-if="vm.license.dialer">
-            <div class="form-title" translate="CONTACTMANAGER.MOTIONDIALER">
-              MOTION BULL
-            </div>
-
-            <md-input-container
-              class="md-icon-float md-block"
-              ng-repeat="motionBullField in vm.motionBullFields"
-            >
-              <label
-                >{{'CONTACTMANAGER.' + motionBullField.key | uppercase |
-                translate}}</label
-              >
-              <md-select
-                name="{{motionBullField.key}}"
-                ng-model="vm.binding[motionBullField.key]"
-                placeholder="{{'CONTACTMANAGER.' + motionBullField.key | uppercase | translate}}"
-                ng-required="motionBullField.required"
-              >
-                <md-option ng-value="field" ng-repeat="field in vm.fields"
-                  >{{ field }}</md-option
-                >
-                <md-option ng-value="null" ng-hide="contactField.required">
-                  <em>{{ 'CONTACTMANAGER.NONE' | translate }}</em>
-                </md-option>
-              </md-select>
-            </md-input-container>
-          </div>
-        </md-content>
-
-        <div class="error-list" ng-if="vm.result.finish">
-          <div class="info" layout="row" layout-align="space-between center">
-            <div>
-              <div class="message">
-                {{'CONTACTMANAGER.UPLOAD_COMPLETED' | translate | uppercase}}
-                ({{vm.result.elapsed}}s)
-              </div>
-            </div>
-            <md-button class="md-icon-button">
-              <md-icon
-                md-font-icon="icon-alert-box"
-                aria-label="alert error"
-                class="s16"
-              ></md-icon>
-            </md-button>
-          </div>
-        </div>
-
-        <div layout="row" ng-if="vm.processing">
-          <!-- WIDGET PROCESSING -->
-          <ms-widget ng-if="!vm.result.finish" class="h-140" flex>
-            <!-- Front -->
-            <ms-widget-front class="p-16 white-bg">
-              <div
-                class="pt-8 pb-8"
-                layout="column"
-                layout-align="center center"
-                flex
-              >
-                <div class="md-display-1 pb-8 orange-fg">
-                  <span ng-bind="vm.result.rows"></span>
-                </div>
-                <div
-                  ng-if="vm.processing"
-                  class="font-weight-500 secondary-text"
-                >
-                  Please wait, we are processing your contacts...
-                </div>
-              </div>
-            </ms-widget-front>
-            <!-- / Front -->
-          </ms-widget>
-          <!-- / WIDGET PROCESSING -->
-          <!-- WIDGET SUCCESS -->
-          <ms-widget ng-if="vm.result.finish" class="h-140" flex>
-            <!-- Front -->
-            <ms-widget-front class="p-16 white-bg">
-              <div
-                class="pt-8 pb-8"
-                layout="column"
-                layout-align="center center"
-                flex
-              >
-                <div class="md-display-1 pb-8 green-fg">
-                  <span ng-bind="vm.result.affectedRows"></span>
-                </div>
-                <div
-                  class="font-weight-500 secondary-text"
-                  translate="CONTACTMANAGER.SUCCESS"
-                >
-                  Success
-                </div>
-              </div>
-            </ms-widget-front>
-            <!-- / Front -->
-          </ms-widget>
-          <!-- / WIDGET SUCCESS -->
-
-          <!-- WIDGET FAILURE -->
-          <ms-widget ng-if="vm.result.finish" class="h-140" flex>
-            <!-- Front -->
-            <ms-widget-front class="p-16 white-bg">
-              <div
-                class="pt-8 pb-8"
-                layout="column"
-                layout-align="center center"
-                flex
-              >
-                <div class="md-display-1 pb-8 red-fg">
-                  <span ng-bind="vm.result.failedRows"></span>
-                </div>
-                <div
-                  class="font-weight-500 secondary-text"
-                  translate="CONTACTMANAGER.FAILURE"
-                >
-                  Failure
-                </div>
-              </div>
-            </ms-widget-front>
-            <!-- / Front -->
-          </ms-widget>
-          <!-- / WIDGET FAILURE -->
-
-          <!-- WIDGET DUPLICATES -->
-          <ms-widget
-            ng-if="vm.result.duplicatedRows && vm.result.finish"
-            class="h-140"
-            flex
-          >
-            <!-- Front -->
-            <ms-widget-front class="p-16 white-bg">
-              <div
-                class="pt-8 pb-8"
-                layout="column"
-                layout-align="center center"
-                flex
-              >
-                <div class="md-display-1 pb-8 orange-fg">
-                  <span ng-bind="vm.result.duplicatedRows"></span>
-                </div>
-                <div
-                  class="font-weight-500 secondary-text"
-                  translate="CONTACTMANAGER.DUPLICATES"
-                >
-                  Duplicates
-                </div>
-              </div>
-            </ms-widget-front>
-            <!-- / Front -->
-          </ms-widget>
-          <!-- / WIDGET DUPLICATES -->
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row">
-        <md-button
-          ng-if="!vm.processing"
-          ng-disabled="importForm.$invalid || importForm.$pristine"
-          ng-click="vm.uploadCsv()"
-          class="md-accent md-raised"
-          aria-label="UPLOAD"
-          translate="CONTACTMANAGER.UPLOAD"
-          translate-attr-aria-label="CONTACTMANAGER.IMPORT"
-        >
-          IMPORT
-        </md-button>
-        <md-button
-          ng-if="vm.processing && !vm.result.finish && !vm.stopping"
-          ng-click="vm.stopUpload()"
-          class="md-accent md-raised"
-          aria-label="Stop Upload"
-          translate="CONTACTMANAGER.STOP"
-          translate-attr-aria-label="CONTACTMANAGER.STOP"
-        >
-          STOP
-        </md-button>
-        <md-button
-          ng-if="vm.result.finish && vm.result.errors.length"
-          ng-csv="vm.getArrayErrors()"
-          csv-header="vm.getHeaderErrors()"
-          class="md-accent md-raised"
-          aria-label="Export Errors"
-          filename="contacts_import_errors.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-          {{'CONTACTMANAGER.EXPORT_ERRORS' | translate}}
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/contacts/import/import.html/import.html b/public/src/js/modules/main/apps/contactmanager/views/contacts/import/import.html/import.html
new file mode 100644
index 0000000..5451e7c
--- /dev/null
+++ b/public/src/js/modules/main/apps/contactmanager/views/contacts/import/import.html/import.html
@@ -0,0 +1,343 @@
+<md-dialog class="import-dialog" aria-label="Import contact">
+  <form name="importForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title" translate="CONTACTMANAGER.IMPORT_CONTACTS"
+          >Import Contacts</span
+        >
+        <md-button
+          ng-if="vm.result.finish || !vm.processing"
+          class="md-icon-button"
+          ng-click="vm.closeDialog()"
+        >
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <div md-background-bg layout="row" layout-align="start start">
+      <md-progress-linear
+        ng-disabled="!vm.processing || vm.result.finish"
+        md-mode="indeterminate"
+        class="md-warn"
+      ></md-progress-linear>
+    </div>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <div>
+        <md-content ng-show="!vm.processing">
+          <div class="form-title" translate="CONTACTMANAGER.CONTACTMANAGER">
+            CONTACT MANAGER
+          </div>
+
+          <md-input-container
+            class="md-icon-float md-block"
+            ng-repeat="contactField in vm.contactFields"
+          >
+            <label
+              >{{'CONTACTMANAGER.' + contactField.key | uppercase |
+              translate}}</label
+            >
+            <md-select
+              name="{{contactField.key}}"
+              ng-model="vm.binding[contactField.key]"
+              placeholder="{{'CONTACTMANAGER.' + contactField.key | uppercase | translate}}"
+              ng-required="contactField.required"
+            >
+              <md-option ng-value="field" ng-repeat="field in vm.fields"
+                >{{ field }}</md-option
+              >
+              <md-option ng-value="null" ng-hide="contactField.required">
+                <em>{{ 'CONTACTMANAGER.NONE' | translate }}</em>
+              </md-option>
+            </md-select>
+          </md-input-container>
+
+          <md-input-container class="md-icon-float md-block">
+            <label translate="CONTACTMANAGER.LIST">List</label>
+            <md-select
+              name="list"
+              ng-model="vm.ListId"
+              placeholder="Select a list"
+              ng-change="vm.onChangeList()"
+              required
+            >
+              <md-option ng-value="list.id" ng-repeat="list in vm.lists.rows"
+                >{{list.name}}</md-option
+              >
+            </md-select>
+          </md-input-container>
+
+          <md-input-container
+            class="md-icon-float md-block"
+            ng-repeat="customField in vm.customFields.rows"
+          >
+            <label>{{customField.alias}}</label>
+            <md-select
+              ng-model="vm.binding['cf_' + customField.id]"
+              placeholder="{{customField.alias}}"
+              ng-required="customField.required"
+            >
+              <md-option ng-value="field" ng-repeat="field in vm.fields"
+                >{{ field }}</md-option
+              >
+              <md-option ng-value="null" ng-hide="customField.required">
+                <em>{{ 'CONTACTMANAGER.NONE' | translate }}</em>
+              </md-option>
+            </md-select>
+          </md-input-container>
+
+          <md-input-container class="md-icon-float md-block">
+            <label translate="CONTACTMANAGER.COMPANY">Company</label>
+            <md-select
+              name="company"
+              ng-model="vm.CompanyId"
+              placeholder="Select a company"
+            >
+              <md-option
+                ng-value="company.id"
+                ng-repeat="company in vm.companies.rows"
+                >{{company.name}}</md-option
+              >
+              <md-option ng-value="null">
+                <em translate="CONTACTMANAGER.NONE">None</em>
+              </md-option>
+            </md-select>
+          </md-input-container>
+
+          <md-input-container class="md-icon-float md-block">
+            <md-select
+              ng-model="vm.duplicates"
+              placeholder="{{ 'CONTACTMANAGER.CHECK_DUPLICATES' | translate}}"
+              multiple
+            >
+              <md-option
+                ng-value="contactField.key"
+                ng-repeat="contactField in vm.contactFields"
+                >{{ 'CONTACTMANAGER.' + contactField.key | uppercase |
+                translate}}</md-option
+              >
+            </md-select>
+          </md-input-container>
+
+          <div ng-if="vm.license.dialer">
+            <div class="form-title" translate="CONTACTMANAGER.MOTIONDIALER">
+              MOTION BULL
+            </div>
+
+            <md-input-container
+              class="md-icon-float md-block"
+              ng-repeat="motionBullField in vm.motionBullFields"
+            >
+              <label
+                >{{'CONTACTMANAGER.' + motionBullField.key | uppercase |
+                translate}}</label
+              >
+              <md-select
+                name="{{motionBullField.key}}"
+                ng-model="vm.binding[motionBullField.key]"
+                placeholder="{{'CONTACTMANAGER.' + motionBullField.key | uppercase | translate}}"
+                ng-required="motionBullField.required"
+              >
+                <md-option ng-value="field" ng-repeat="field in vm.fields"
+                  >{{ field }}</md-option
+                >
+                <md-option ng-value="null" ng-hide="contactField.required">
+                  <em>{{ 'CONTACTMANAGER.NONE' | translate }}</em>
+                </md-option>
+              </md-select>
+            </md-input-container>
+          </div>
+        </md-content>
+
+        <div class="error-list" ng-if="vm.result.finish">
+          <div class="info" layout="row" layout-align="space-between center">
+            <div>
+              <div class="message">
+                {{'CONTACTMANAGER.UPLOAD_COMPLETED' | translate | uppercase}}
+                ({{vm.result.elapsed}}s)
+              </div>
+            </div>
+            <md-button class="md-icon-button">
+              <md-icon
+                md-font-icon="icon-alert-box"
+                aria-label="alert error"
+                class="s16"
+              ></md-icon>
+            </md-button>
+          </div>
+        </div>
+
+        <div layout="row" ng-if="vm.processing">
+          <!-- WIDGET PROCESSING -->
+          <ms-widget ng-if="!vm.result.finish" class="h-140" flex>
+            <!-- Front -->
+            <ms-widget-front class="p-16 white-bg">
+              <div
+                class="pt-8 pb-8"
+                layout="column"
+                layout-align="center center"
+                flex
+              >
+                <div class="md-display-1 pb-8 orange-fg">
+                  <span ng-bind="vm.result.rows"></span>
+                </div>
+                <div
+                  ng-if="vm.processing"
+                  class="font-weight-500 secondary-text"
+                >
+                  Please wait, we are processing your contacts...
+                </div>
+              </div>
+            </ms-widget-front>
+            <!-- / Front -->
+          </ms-widget>
+          <!-- / WIDGET PROCESSING -->
+          <!-- WIDGET SUCCESS -->
+          <ms-widget ng-if="vm.result.finish" class="h-140" flex>
+            <!-- Front -->
+            <ms-widget-front class="p-16 white-bg">
+              <div
+                class="pt-8 pb-8"
+                layout="column"
+                layout-align="center center"
+                flex
+              >
+                <div class="md-display-1 pb-8 green-fg">
+                  <span ng-bind="vm.result.affectedRows"></span>
+                </div>
+                <div
+                  class="font-weight-500 secondary-text"
+                  translate="CONTACTMANAGER.SUCCESS"
+                >
+                  Success
+                </div>
+              </div>
+            </ms-widget-front>
+            <!-- / Front -->
+          </ms-widget>
+          <!-- / WIDGET SUCCESS -->
+
+          <!-- WIDGET FAILURE -->
+          <ms-widget ng-if="vm.result.finish" class="h-140" flex>
+            <!-- Front -->
+            <ms-widget-front class="p-16 white-bg">
+              <div
+                class="pt-8 pb-8"
+                layout="column"
+                layout-align="center center"
+                flex
+              >
+                <div class="md-display-1 pb-8 red-fg">
+                  <span ng-bind="vm.result.failedRows"></span>
+                </div>
+                <div
+                  class="font-weight-500 secondary-text"
+                  translate="CONTACTMANAGER.FAILURE"
+                >
+                  Failure
+                </div>
+              </div>
+            </ms-widget-front>
+            <!-- / Front -->
+          </ms-widget>
+          <!-- / WIDGET FAILURE -->
+
+          <!-- WIDGET DUPLICATES -->
+          <ms-widget
+            ng-if="vm.result.duplicatedRows && vm.result.finish"
+            class="h-140"
+            flex
+          >
+            <!-- Front -->
+            <ms-widget-front class="p-16 white-bg">
+              <div
+                class="pt-8 pb-8"
+                layout="column"
+                layout-align="center center"
+                flex
+              >
+                <div class="md-display-1 pb-8 orange-fg">
+                  <span ng-bind="vm.result.duplicatedRows"></span>
+                </div>
+                <div
+                  class="font-weight-500 secondary-text"
+                  translate="CONTACTMANAGER.DUPLICATES"
+                >
+                  Duplicates
+                </div>
+              </div>
+            </ms-widget-front>
+            <!-- / Front -->
+          </ms-widget>
+          <!-- / WIDGET DUPLICATES -->
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row">
+        <md-button
+          ng-if="!vm.processing"
+          ng-disabled="importForm.$invalid || importForm.$pristine"
+          ng-click="vm.uploadCsv()"
+          class="md-accent md-raised"
+          aria-label="UPLOAD"
+          translate="CONTACTMANAGER.UPLOAD"
+          translate-attr-aria-label="CONTACTMANAGER.IMPORT"
+        >
+          IMPORT
+        </md-button>
+        <md-button
+          ng-if="vm.processing && !vm.result.finish && !vm.stopping"
+          ng-click="vm.stopUpload()"
+          class="md-accent md-raised"
+          aria-label="Stop Upload"
+          translate="CONTACTMANAGER.STOP"
+          translate-attr-aria-label="CONTACTMANAGER.STOP"
+        >
+          STOP
+        </md-button>
+        <md-button
+          ng-if="vm.result.finish && vm.result.errors.length"
+          ng-csv="vm.getArrayErrors()"
+          csv-header="vm.getHeaderErrors()"
+          class="md-accent md-raised"
+          aria-label="Export Errors"
+          filename="contacts_import_errors.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+          {{'CONTACTMANAGER.EXPORT_ERRORS' | translate}}
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/contacts/merge/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/contactmanager/views/contacts/merge/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 8cb5404..0000000
--- a/public/src/js/modules/main/apps/contactmanager/views/contacts/merge/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,97 +0,0 @@
-<md-dialog class="cm-contact-dialog" aria-label="Merge Contact">
-  <form name="contactForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <md-input-container class="md-block" flex-gt-sm>
-        <label>Filter</label>
-        <input
-          ng-model="vm.searchTerm"
-          name="searchTerm"
-          ng-model-options="{ debounce: 300 }"
-          ng-change="vm.change()"
-        />
-      </md-input-container>
-
-      <md-list flex>
-        <md-subheader class="md-no-sticky" ng-hide="vm.contacts.length"
-          ><em>Filter doesn't match any contact</em></md-subheader
-        >
-        <md-list-item
-          class="md-3-line"
-          ng-repeat="contact in vm.contacts | filter:{ id: '!' + vm.contact.id}"
-          ng-click="vm.showConfirm($event, vm.contact, contact)"
-        >
-          <img
-            ng-src="assets/images/avatars/profile.png"
-            class="md-avatar"
-            alt="{{contact.who}}"
-          />
-          <div class="md-list-item-text" layout="column">
-            <h3>
-              #{{ contact.id }} - {{ contact.firstName }} {{ contact.lastName }}
-            </h3>
-            <h4>{{ contact.email }}</h4>
-            <p>{{ contact.phone }}</p>
-          </div>
-        </md-list-item>
-      </md-list>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/contacts/merge/dialog.html/dialog.html b/public/src/js/modules/main/apps/contactmanager/views/contacts/merge/dialog.html/dialog.html
new file mode 100644
index 0000000..8cb5404
--- /dev/null
+++ b/public/src/js/modules/main/apps/contactmanager/views/contacts/merge/dialog.html/dialog.html
@@ -0,0 +1,97 @@
+<md-dialog class="cm-contact-dialog" aria-label="Merge Contact">
+  <form name="contactForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <md-input-container class="md-block" flex-gt-sm>
+        <label>Filter</label>
+        <input
+          ng-model="vm.searchTerm"
+          name="searchTerm"
+          ng-model-options="{ debounce: 300 }"
+          ng-change="vm.change()"
+        />
+      </md-input-container>
+
+      <md-list flex>
+        <md-subheader class="md-no-sticky" ng-hide="vm.contacts.length"
+          ><em>Filter doesn't match any contact</em></md-subheader
+        >
+        <md-list-item
+          class="md-3-line"
+          ng-repeat="contact in vm.contacts | filter:{ id: '!' + vm.contact.id}"
+          ng-click="vm.showConfirm($event, vm.contact, contact)"
+        >
+          <img
+            ng-src="assets/images/avatars/profile.png"
+            class="md-avatar"
+            alt="{{contact.who}}"
+          />
+          <div class="md-list-item-text" layout="column">
+            <h3>
+              #{{ contact.id }} - {{ contact.firstName }} {{ contact.lastName }}
+            </h3>
+            <h4>{{ contact.email }}</h4>
+            <p>{{ contact.phone }}</p>
+          </div>
+        </md-list-item>
+      </md-list>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/globalCustomFields/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/contactmanager/views/globalCustomFields/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 786edfd..0000000
--- a/public/src/js/modules/main/apps/contactmanager/views/globalCustomFields/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,274 +0,0 @@
-<md-dialog class="globalCustomField-dialog" aria-label="New GlobalCustomField">
-  <form name="globalCustomFieldForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="CONTACTMANAGER.ALIAS">Alias</label>
-        <input
-          type=""
-          name="alias"
-          ng-model="vm.globalCustomField.alias"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="globalCustomFieldForm['alias'].$error"
-          ng-show="globalCustomFieldForm['alias'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CONTACTMANAGER.ERRORS.ALIAS_REQUIRED"
-              >Alias field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CONTACTMANAGER.TYPE">Type</label>
-        <md-select
-          name="type"
-          ng-model="vm.globalCustomField.type"
-          required
-          ng-disabled="!vm.newGlobalCustomField"
-        >
-          <md-option ng-value="'text'">Text</md-option>
-          <md-option ng-value="'select'">Select</md-option>
-          <md-option ng-value="'number'">Number</md-option>
-          <md-option ng-value="'switch'">Switch</md-option>
-          <md-option ng-value="'datetime'">Datetime</md-option>
-        </md-select>
-        <div
-          ng-messages="globalCustomFieldForm['type'].$error"
-          ng-show="globalCustomFieldForm['type'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CONTACTMANAGER.ERRORS.TYPE_REQUIRED"
-              >Type field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <div ng-if="vm.globalCustomField.type == 'select'" class="md-block">
-        <md-list>
-          <md-list-item layout-margin>
-            <md-button
-              class="md-fab md-mini md-secondary"
-              ng-click="vm.addItem(vm.globalCustomField.values);"
-            >
-              <md-tooltip
-                ><span translate="CONTACTMANAGER.ADD">ADD</span></md-tooltip
-              >
-              <md-icon
-                md-font-icon="icon-plus"
-                aria-label="alert error"
-              ></md-icon>
-            </md-button>
-            <md-button
-              ng-if="vm.globalCustomField.values.length"
-              class="md-fab md-mini md-warn md-secondary"
-              ng-click="vm.removeItems(vm.globalCustomField.values);"
-            >
-              <md-tooltip
-                ><span translate="CONTACTMANAGER.DELETE_ALL"
-                  >Delete All</span
-                ></md-tooltip
-              >
-              <md-icon
-                md-font-icon="icon-delete"
-                aria-label="alert error"
-              ></md-icon>
-            </md-button>
-          </md-list-item>
-        </md-list>
-        <md-list ng-sortable="vm.sortable">
-          <md-list-item
-            ng-repeat="item in vm.globalCustomField.values"
-            style="border: 1px solid #ccc !important; border-radius: 7px"
-            layout-margin
-          >
-            <div>
-              <md-icon
-                class="s24"
-                style="cursor: move"
-                md-font-icon="icon-drag"
-                aria-label="drag"
-              ></md-icon>
-              <input type="text" ng-model="item.value" flex />
-            </div>
-            <md-button
-              class="md-fab md-mini md-warn md-secondary"
-              ng-click="vm.removeItem(vm.globalCustomField.values, $index);"
-            >
-              <md-tooltip
-                ><span translate="CONTACTMANAGER.DELETE"
-                  >DELETE</span
-                ></md-tooltip
-              >
-              <md-icon
-                md-font-icon="icon-delete"
-                aria-label="alert error"
-              ></md-icon>
-            </md-button>
-          </md-list-item>
-        </md-list>
-        <md-list>
-          <md-list-item
-            ng-if="!vm.globalCustomField.values.length"
-            layout="row"
-            layout-align="center center"
-          >
-            <em translate="CONTACTMANAGER.NO_AVAILABLE_ITEMS"
-              >No Available Items</em
-            >
-          </md-list-item>
-        </md-list>
-      </div>
-      <md-input-container class="md-block">
-        <md-switch
-          ng-model="vm.globalCustomField.required"
-          aria-label="Required"
-          ><span translate="CONTACTMANAGER.REQUIRED">Required</span></md-switch
-        >
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.globalCustomField.type == 'text'"
-        class="md-block"
-      >
-        <md-switch
-          ng-model="vm.globalCustomField.clickToAction"
-          aria-label="ClickToAction"
-          ><span translate="CONTACTMANAGER.CLICKTOACTION"
-            >ClickToAction</span
-          ></md-switch
-        >
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.globalCustomField.clickToAction"
-        class="md-block"
-      >
-        <label translate="CONTACTMANAGER.ACTIONTYPE">ActionType</label>
-        <md-select name="actionType" ng-model="vm.globalCustomField.actionType">
-          <md-option ng-value="'voice'">Voice</md-option>
-        </md-select>
-        <div
-          ng-messages="globalCustomFieldForm['actionType'].$error"
-          ng-show="globalCustomFieldForm['actionType'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CONTACTMANAGER.ERRORS.ACTIONTYPE_REQUIRED"
-              >ActionType field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newGlobalCustomField"
-          ng-click="vm.saveGlobalCustomField()"
-          class="send-button md-accent md-raised"
-          ng-disabled="globalCustomFieldForm.$invalid || globalCustomFieldForm.$pristine"
-          aria-label="SAVE"
-          translate="CONTACTMANAGER.SAVE"
-          translate-attr-aria-label="CONTACTMANAGER.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newGlobalCustomField"
-          ng-click="vm.addNewGlobalCustomField()"
-          class="send-button md-accent md-raised"
-          ng-disabled="globalCustomFieldForm.$invalid"
-          aria-label="ADD"
-          translate="CONTACTMANAGER.ADD_GLOBALCUSTOMFIELD"
-          translate-attr-aria-label="CONTACTMANAGER.ADD_GLOBALCUSTOMFIELD"
-        >
-          ADD GLOBALCUSTOMFIELD
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newGlobalCustomField"
-          ng-click="vm.deleteGlobalCustomField($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="CONTACTMANAGER.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="CONTACTMANAGER.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/globalCustomFields/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/contactmanager/views/globalCustomFields/create/dialog.html/dialog.html
new file mode 100644
index 0000000..786edfd
--- /dev/null
+++ b/public/src/js/modules/main/apps/contactmanager/views/globalCustomFields/create/dialog.html/dialog.html
@@ -0,0 +1,274 @@
+<md-dialog class="globalCustomField-dialog" aria-label="New GlobalCustomField">
+  <form name="globalCustomFieldForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="CONTACTMANAGER.ALIAS">Alias</label>
+        <input
+          type=""
+          name="alias"
+          ng-model="vm.globalCustomField.alias"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="globalCustomFieldForm['alias'].$error"
+          ng-show="globalCustomFieldForm['alias'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CONTACTMANAGER.ERRORS.ALIAS_REQUIRED"
+              >Alias field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CONTACTMANAGER.TYPE">Type</label>
+        <md-select
+          name="type"
+          ng-model="vm.globalCustomField.type"
+          required
+          ng-disabled="!vm.newGlobalCustomField"
+        >
+          <md-option ng-value="'text'">Text</md-option>
+          <md-option ng-value="'select'">Select</md-option>
+          <md-option ng-value="'number'">Number</md-option>
+          <md-option ng-value="'switch'">Switch</md-option>
+          <md-option ng-value="'datetime'">Datetime</md-option>
+        </md-select>
+        <div
+          ng-messages="globalCustomFieldForm['type'].$error"
+          ng-show="globalCustomFieldForm['type'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CONTACTMANAGER.ERRORS.TYPE_REQUIRED"
+              >Type field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <div ng-if="vm.globalCustomField.type == 'select'" class="md-block">
+        <md-list>
+          <md-list-item layout-margin>
+            <md-button
+              class="md-fab md-mini md-secondary"
+              ng-click="vm.addItem(vm.globalCustomField.values);"
+            >
+              <md-tooltip
+                ><span translate="CONTACTMANAGER.ADD">ADD</span></md-tooltip
+              >
+              <md-icon
+                md-font-icon="icon-plus"
+                aria-label="alert error"
+              ></md-icon>
+            </md-button>
+            <md-button
+              ng-if="vm.globalCustomField.values.length"
+              class="md-fab md-mini md-warn md-secondary"
+              ng-click="vm.removeItems(vm.globalCustomField.values);"
+            >
+              <md-tooltip
+                ><span translate="CONTACTMANAGER.DELETE_ALL"
+                  >Delete All</span
+                ></md-tooltip
+              >
+              <md-icon
+                md-font-icon="icon-delete"
+                aria-label="alert error"
+              ></md-icon>
+            </md-button>
+          </md-list-item>
+        </md-list>
+        <md-list ng-sortable="vm.sortable">
+          <md-list-item
+            ng-repeat="item in vm.globalCustomField.values"
+            style="border: 1px solid #ccc !important; border-radius: 7px"
+            layout-margin
+          >
+            <div>
+              <md-icon
+                class="s24"
+                style="cursor: move"
+                md-font-icon="icon-drag"
+                aria-label="drag"
+              ></md-icon>
+              <input type="text" ng-model="item.value" flex />
+            </div>
+            <md-button
+              class="md-fab md-mini md-warn md-secondary"
+              ng-click="vm.removeItem(vm.globalCustomField.values, $index);"
+            >
+              <md-tooltip
+                ><span translate="CONTACTMANAGER.DELETE"
+                  >DELETE</span
+                ></md-tooltip
+              >
+              <md-icon
+                md-font-icon="icon-delete"
+                aria-label="alert error"
+              ></md-icon>
+            </md-button>
+          </md-list-item>
+        </md-list>
+        <md-list>
+          <md-list-item
+            ng-if="!vm.globalCustomField.values.length"
+            layout="row"
+            layout-align="center center"
+          >
+            <em translate="CONTACTMANAGER.NO_AVAILABLE_ITEMS"
+              >No Available Items</em
+            >
+          </md-list-item>
+        </md-list>
+      </div>
+      <md-input-container class="md-block">
+        <md-switch
+          ng-model="vm.globalCustomField.required"
+          aria-label="Required"
+          ><span translate="CONTACTMANAGER.REQUIRED">Required</span></md-switch
+        >
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.globalCustomField.type == 'text'"
+        class="md-block"
+      >
+        <md-switch
+          ng-model="vm.globalCustomField.clickToAction"
+          aria-label="ClickToAction"
+          ><span translate="CONTACTMANAGER.CLICKTOACTION"
+            >ClickToAction</span
+          ></md-switch
+        >
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.globalCustomField.clickToAction"
+        class="md-block"
+      >
+        <label translate="CONTACTMANAGER.ACTIONTYPE">ActionType</label>
+        <md-select name="actionType" ng-model="vm.globalCustomField.actionType">
+          <md-option ng-value="'voice'">Voice</md-option>
+        </md-select>
+        <div
+          ng-messages="globalCustomFieldForm['actionType'].$error"
+          ng-show="globalCustomFieldForm['actionType'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CONTACTMANAGER.ERRORS.ACTIONTYPE_REQUIRED"
+              >ActionType field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newGlobalCustomField"
+          ng-click="vm.saveGlobalCustomField()"
+          class="send-button md-accent md-raised"
+          ng-disabled="globalCustomFieldForm.$invalid || globalCustomFieldForm.$pristine"
+          aria-label="SAVE"
+          translate="CONTACTMANAGER.SAVE"
+          translate-attr-aria-label="CONTACTMANAGER.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newGlobalCustomField"
+          ng-click="vm.addNewGlobalCustomField()"
+          class="send-button md-accent md-raised"
+          ng-disabled="globalCustomFieldForm.$invalid"
+          aria-label="ADD"
+          translate="CONTACTMANAGER.ADD_GLOBALCUSTOMFIELD"
+          translate-attr-aria-label="CONTACTMANAGER.ADD_GLOBALCUSTOMFIELD"
+        >
+          ADD GLOBALCUSTOMFIELD
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newGlobalCustomField"
+          ng-click="vm.deleteGlobalCustomField($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="CONTACTMANAGER.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="CONTACTMANAGER.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/globalCustomFields/globalCustomFields.html/globalCustomFields-[chunkhash].html b/public/src/js/modules/main/apps/contactmanager/views/globalCustomFields/globalCustomFields.html/globalCustomFields-[chunkhash].html
deleted file mode 100644
index c5f9a99..0000000
--- a/public/src/js/modules/main/apps/contactmanager/views/globalCustomFields/globalCustomFields.html/globalCustomFields-[chunkhash].html
+++ /dev/null
@@ -1,317 +0,0 @@
-<div
-  id="globalCustomFields"
-  class="page-layout simple left-sidenav inner-sidenav"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-account-circle" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="CONTACTMANAGER.GLOBALCUSTOMFIELDS"
-          >GlobalCustomFields</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="CONTACTMANAGER.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedGlobalCustomFields.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div
-      class="close-button-wrapper"
-      ng-click="vm.selectedGlobalCustomFields =[]"
-    >
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="CONTACTMANAGER.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-globalCustomFields-count">
-          <span>{{vm.selectedGlobalCustomFields.length}}</span>
-          <span translate="CONTACTMANAGER.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdOpenMenu($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="CONTACTMANAGER.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllGlobalCustomFields()"
-                translate="CONTACTMANAGER.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectGlobalCustomFields()"
-                translate="CONTACTMANAGER.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedGlobalCustomFields"
-          csv-label="true"
-          filename="globalCustomFields.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedGlobalCustomFields($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="CONTACTMANAGER.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- GLOBALCUSTOMFIELD TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedGlobalCustomFields"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getGlobalCustomFields"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">
-                  {{ 'CONTACTMANAGER.ID' | translate }}
-                </th>
-                <th md-column md-order-by="alias">
-                  {{ 'CONTACTMANAGER.ALIAS' | translate }}
-                </th>
-                <th md-column md-order-by="type">
-                  {{ 'CONTACTMANAGER.TYPE' | translate }}
-                </th>
-                <th md-column md-order-by="required">
-                  {{ 'CONTACTMANAGER.REQUIRED' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.globalCustomFields.rows.length">
-                <td md-cell colspan="5">
-                  <div layout="row" layout-align="center center">
-                    <span translate="CONTACTMANAGER.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="globalCustomField"
-                md-select-id="id"
-                ng-repeat="globalCustomField in vm.globalCustomFields.rows"
-              >
-                <td md-cell ng-if="globalCustomField.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{globalCustomField.name}}"
-                    ng-src="api/users/{{globalCustomField.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!globalCustomField.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{globalCustomField.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.createOrEditGlobalCustomField($event, globalCustomField)"
-                  md-cell
-                  class="id"
-                >
-                  {{globalCustomField.id}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditGlobalCustomField($event, globalCustomField)"
-                  md-cell
-                  class="alias"
-                >
-                  {{globalCustomField.alias}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditGlobalCustomField($event, globalCustomField)"
-                  md-cell
-                  class="type"
-                >
-                  {{ vm.arraytype[globalCustomField.type].option }}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(globalCustomField, ev) : vm.createOrEditGlobalCustomField($event, globalCustomField)"
-                  md-cell
-                  class="required"
-                >
-                  <md-icon
-                    md-colors="{color: {{globalCustomField.required ? '\'green\'' : '\'grey\''}}}"
-                    md-font-icon="{{globalCustomField.required ? 'icon-check' : 'icon-close'}}"
-                  ></md-icon>
-                </td>
-
-                <td
-                  md-cell
-                  class="actions"
-                  ng-if="!vm.crudPermissions.readOnly"
-                >
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="CONTACTMANAGER.MORE"
-                      ng-click="$mdOpenMenu($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editdialog(globalCustomField, $event    )"
-                          translate="CONTACTMANAGER.EDIT_GLOBALCUSTOMFIELD"
-                        >
-                          Edit GlobalCustomField
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(globalCustomField, $event    )"
-                          translate="CONTACTMANAGER.DELETE_GLOBALCUSTOMFIELD"
-                        >
-                          Delete GlobalCustomField
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'CONTACTMANAGER.PAGE' | translate}}:', rowsPerPage: '{{'CONTACTMANAGER.ROWSPERPAGE' | translate}}:', of: '{{'CONTACTMANAGER.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.globalCustomFields.count}}"
-          md-on-paginate="vm.getGlobalCustomFields"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / GLOBALCUSTOMFIELD TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD GLOBALCUSTOMFIELD BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent"
-    id="add-globalCustomField-button"
-    ng-click="vm.createOrEditGlobalCustomField($event)"
-    aria-label="add globalCustomField"
-    translate
-    translate-attr-aria-label="CONTACTMANAGER.ADD_GLOBALCUSTOMFIELD"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD GLOBALCUSTOMFIELD BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/globalCustomFields/globalCustomFields.html/globalCustomFields.html b/public/src/js/modules/main/apps/contactmanager/views/globalCustomFields/globalCustomFields.html/globalCustomFields.html
new file mode 100644
index 0000000..c5f9a99
--- /dev/null
+++ b/public/src/js/modules/main/apps/contactmanager/views/globalCustomFields/globalCustomFields.html/globalCustomFields.html
@@ -0,0 +1,317 @@
+<div
+  id="globalCustomFields"
+  class="page-layout simple left-sidenav inner-sidenav"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-account-circle" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="CONTACTMANAGER.GLOBALCUSTOMFIELDS"
+          >GlobalCustomFields</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="CONTACTMANAGER.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedGlobalCustomFields.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div
+      class="close-button-wrapper"
+      ng-click="vm.selectedGlobalCustomFields =[]"
+    >
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="CONTACTMANAGER.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-globalCustomFields-count">
+          <span>{{vm.selectedGlobalCustomFields.length}}</span>
+          <span translate="CONTACTMANAGER.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdOpenMenu($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="CONTACTMANAGER.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllGlobalCustomFields()"
+                translate="CONTACTMANAGER.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectGlobalCustomFields()"
+                translate="CONTACTMANAGER.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedGlobalCustomFields"
+          csv-label="true"
+          filename="globalCustomFields.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedGlobalCustomFields($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="CONTACTMANAGER.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- GLOBALCUSTOMFIELD TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedGlobalCustomFields"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getGlobalCustomFields"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">
+                  {{ 'CONTACTMANAGER.ID' | translate }}
+                </th>
+                <th md-column md-order-by="alias">
+                  {{ 'CONTACTMANAGER.ALIAS' | translate }}
+                </th>
+                <th md-column md-order-by="type">
+                  {{ 'CONTACTMANAGER.TYPE' | translate }}
+                </th>
+                <th md-column md-order-by="required">
+                  {{ 'CONTACTMANAGER.REQUIRED' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.globalCustomFields.rows.length">
+                <td md-cell colspan="5">
+                  <div layout="row" layout-align="center center">
+                    <span translate="CONTACTMANAGER.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="globalCustomField"
+                md-select-id="id"
+                ng-repeat="globalCustomField in vm.globalCustomFields.rows"
+              >
+                <td md-cell ng-if="globalCustomField.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{globalCustomField.name}}"
+                    ng-src="api/users/{{globalCustomField.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!globalCustomField.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{globalCustomField.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.createOrEditGlobalCustomField($event, globalCustomField)"
+                  md-cell
+                  class="id"
+                >
+                  {{globalCustomField.id}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditGlobalCustomField($event, globalCustomField)"
+                  md-cell
+                  class="alias"
+                >
+                  {{globalCustomField.alias}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditGlobalCustomField($event, globalCustomField)"
+                  md-cell
+                  class="type"
+                >
+                  {{ vm.arraytype[globalCustomField.type].option }}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(globalCustomField, ev) : vm.createOrEditGlobalCustomField($event, globalCustomField)"
+                  md-cell
+                  class="required"
+                >
+                  <md-icon
+                    md-colors="{color: {{globalCustomField.required ? '\'green\'' : '\'grey\''}}}"
+                    md-font-icon="{{globalCustomField.required ? 'icon-check' : 'icon-close'}}"
+                  ></md-icon>
+                </td>
+
+                <td
+                  md-cell
+                  class="actions"
+                  ng-if="!vm.crudPermissions.readOnly"
+                >
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="CONTACTMANAGER.MORE"
+                      ng-click="$mdOpenMenu($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editdialog(globalCustomField, $event    )"
+                          translate="CONTACTMANAGER.EDIT_GLOBALCUSTOMFIELD"
+                        >
+                          Edit GlobalCustomField
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(globalCustomField, $event    )"
+                          translate="CONTACTMANAGER.DELETE_GLOBALCUSTOMFIELD"
+                        >
+                          Delete GlobalCustomField
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'CONTACTMANAGER.PAGE' | translate}}:', rowsPerPage: '{{'CONTACTMANAGER.ROWSPERPAGE' | translate}}:', of: '{{'CONTACTMANAGER.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.globalCustomFields.count}}"
+          md-on-paginate="vm.getGlobalCustomFields"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / GLOBALCUSTOMFIELD TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD GLOBALCUSTOMFIELD BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent"
+    id="add-globalCustomField-button"
+    ng-click="vm.createOrEditGlobalCustomField($event)"
+    aria-label="add globalCustomField"
+    translate
+    translate-attr-aria-label="CONTACTMANAGER.ADD_GLOBALCUSTOMFIELD"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD GLOBALCUSTOMFIELD BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/lists/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/contactmanager/views/lists/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 955a693..0000000
--- a/public/src/js/modules/main/apps/contactmanager/views/lists/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,150 +0,0 @@
-<md-dialog class="list-dialog" aria-label="New List">
-  <form name="listForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="CONTACTMANAGER.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.list.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="listForm['name'].$error"
-          ng-show="listForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CONTACTMANAGER.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CONTACTMANAGER.DESCRIPTION">Description</label>
-        <input type="text" name="description" ng-model="vm.list.description" />
-
-        <div
-          ng-messages="listForm['description'].$error"
-          ng-show="listForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CONTACTMANAGER.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newList"
-          ng-click="vm.saveList()"
-          class="send-button md-accent md-raised"
-          ng-disabled="listForm.$invalid || listForm.$pristine"
-          aria-label="SAVE"
-          translate="CONTACTMANAGER.SAVE"
-          translate-attr-aria-label="CONTACTMANAGER.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newList"
-          ng-click="vm.addNewList()"
-          class="send-button md-accent md-raised"
-          ng-disabled="listForm.$invalid"
-          aria-label="ADD"
-          translate="CONTACTMANAGER.ADD_LIST"
-          translate-attr-aria-label="CONTACTMANAGER.ADD_LIST"
-        >
-          ADD LIST
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newList"
-          ng-click="vm.deleteList($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="CONTACTMANAGER.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="CONTACTMANAGER.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/lists/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/contactmanager/views/lists/create/dialog.html/dialog.html
new file mode 100644
index 0000000..955a693
--- /dev/null
+++ b/public/src/js/modules/main/apps/contactmanager/views/lists/create/dialog.html/dialog.html
@@ -0,0 +1,150 @@
+<md-dialog class="list-dialog" aria-label="New List">
+  <form name="listForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="CONTACTMANAGER.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.list.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="listForm['name'].$error"
+          ng-show="listForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CONTACTMANAGER.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CONTACTMANAGER.DESCRIPTION">Description</label>
+        <input type="text" name="description" ng-model="vm.list.description" />
+
+        <div
+          ng-messages="listForm['description'].$error"
+          ng-show="listForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CONTACTMANAGER.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newList"
+          ng-click="vm.saveList()"
+          class="send-button md-accent md-raised"
+          ng-disabled="listForm.$invalid || listForm.$pristine"
+          aria-label="SAVE"
+          translate="CONTACTMANAGER.SAVE"
+          translate-attr-aria-label="CONTACTMANAGER.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newList"
+          ng-click="vm.addNewList()"
+          class="send-button md-accent md-raised"
+          ng-disabled="listForm.$invalid"
+          aria-label="ADD"
+          translate="CONTACTMANAGER.ADD_LIST"
+          translate-attr-aria-label="CONTACTMANAGER.ADD_LIST"
+        >
+          ADD LIST
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newList"
+          ng-click="vm.deleteList($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="CONTACTMANAGER.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="CONTACTMANAGER.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/lists/edit/agentadd/agentadd.html/agentadd-[chunkhash].html b/public/src/js/modules/main/apps/contactmanager/views/lists/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
deleted file mode 100644
index cde3c90..0000000
--- a/public/src/js/modules/main/apps/contactmanager/views/lists/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
+++ /dev/null
@@ -1,40 +0,0 @@
-<md-dialog class="list-dialog" aria-label="list" ng-init="vm.onInit()">
-  <form name="listForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="CONTACTMANAGER.AGENTADD_LIST">Add Agent to list</h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <ms-dual-multiselect
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveAgents()"
-        class="send-button md-accent md-raised"
-        ng-disabled="!vm.pendingChanges"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/lists/edit/agentadd/agentadd.html/agentadd.html b/public/src/js/modules/main/apps/contactmanager/views/lists/edit/agentadd/agentadd.html/agentadd.html
new file mode 100644
index 0000000..cde3c90
--- /dev/null
+++ b/public/src/js/modules/main/apps/contactmanager/views/lists/edit/agentadd/agentadd.html/agentadd.html
@@ -0,0 +1,40 @@
+<md-dialog class="list-dialog" aria-label="list" ng-init="vm.onInit()">
+  <form name="listForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="CONTACTMANAGER.AGENTADD_LIST">Add Agent to list</h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <ms-dual-multiselect
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveAgents()"
+        class="send-button md-accent md-raised"
+        ng-disabled="!vm.pendingChanges"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/lists/edit/customFields/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/contactmanager/views/lists/edit/customFields/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index bb1b0d3..0000000
--- a/public/src/js/modules/main/apps/contactmanager/views/lists/edit/customFields/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,269 +0,0 @@
-<md-dialog class="customField-dialog" aria-label="New CustomField">
-  <form name="customFieldForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="CONTACTMANAGER.ALIAS">Alias</label>
-        <input
-          type=""
-          name="alias"
-          ng-model="vm.customField.alias"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="customFieldForm['alias'].$error"
-          ng-show="customFieldForm['alias'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CONTACTMANAGER.ERRORS.ALIAS_REQUIRED"
-              >Alias field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="CONTACTMANAGER.TYPE">Type</label>
-        <md-select
-          name="type"
-          ng-model="vm.customField.type"
-          required
-          ng-disabled="!vm.newCustomField"
-        >
-          <md-option ng-value="'text'">Text</md-option>
-          <md-option ng-value="'select'">Select</md-option>
-          <md-option ng-value="'number'">Number</md-option>
-          <md-option ng-value="'switch'">Switch</md-option>
-          <md-option ng-value="'datetime'">Datetime</md-option>
-        </md-select>
-        <div
-          ng-messages="customFieldForm['type'].$error"
-          ng-show="customFieldForm['type'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CONTACTMANAGER.ERRORS.TYPE_REQUIRED"
-              >Type field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <div ng-if="vm.customField.type == 'select'" class="md-block">
-        <md-list>
-          <md-list-item layout-margin>
-            <md-button
-              class="md-fab md-mini md-secondary"
-              ng-click="vm.addItem(vm.customField.values);"
-            >
-              <md-tooltip
-                ><span translate="CONTACTMANAGER.ADD">ADD</span></md-tooltip
-              >
-              <md-icon
-                md-font-icon="icon-plus"
-                aria-label="alert error"
-              ></md-icon>
-            </md-button>
-            <md-button
-              ng-if="vm.customField.values.length"
-              class="md-fab md-mini md-warn md-secondary"
-              ng-click="vm.removeItems(vm.customField.values);"
-            >
-              <md-tooltip
-                ><span translate="CONTACTMANAGER.DELETE_ALL"
-                  >Delete All</span
-                ></md-tooltip
-              >
-              <md-icon
-                md-font-icon="icon-delete"
-                aria-label="alert error"
-              ></md-icon>
-            </md-button>
-          </md-list-item>
-        </md-list>
-        <md-list ng-sortable="vm.sortable">
-          <md-list-item
-            ng-repeat="item in vm.customField.values"
-            style="border: 1px solid #ccc !important; border-radius: 7px"
-            layout-margin
-          >
-            <div>
-              <md-icon
-                class="s24"
-                style="cursor: move"
-                md-font-icon="icon-drag"
-                aria-label="drag"
-              ></md-icon>
-              <input type="text" ng-model="item.value" flex />
-            </div>
-            <md-button
-              class="md-fab md-mini md-warn md-secondary"
-              ng-click="vm.removeItem(vm.customField.values, $index);"
-            >
-              <md-tooltip
-                ><span translate="CONTACTMANAGER.DELETE"
-                  >DELETE</span
-                ></md-tooltip
-              >
-              <md-icon
-                md-font-icon="icon-delete"
-                aria-label="alert error"
-              ></md-icon>
-            </md-button>
-          </md-list-item>
-        </md-list>
-        <md-list>
-          <md-list-item
-            ng-if="!vm.customField.values.length"
-            layout="row"
-            layout-align="center center"
-          >
-            <em translate="CONTACTMANAGER.NO_AVAILABLE_ITEMS"
-              >No Available Items</em
-            >
-          </md-list-item>
-        </md-list>
-      </div>
-      <md-input-container class="md-block">
-        <md-switch ng-model="vm.customField.required" aria-label="Required"
-          ><span translate="CONTACTMANAGER.REQUIRED">Required</span></md-switch
-        >
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.customField.type == 'text'"
-        class="md-block"
-      >
-        <md-switch
-          ng-model="vm.customField.clickToAction"
-          aria-label="clickToAction"
-          ><span translate="CONTACTMANAGER.CLICKTOACTION"
-            >clickToAction</span
-          ></md-switch
-        >
-      </md-input-container>
-      <md-input-container ng-if="vm.customField.clickToAction" class="md-block">
-        <label translate="CONTACTMANAGER.ACTIONTYPE">actionType</label>
-        <md-select name="actionType" ng-model="vm.customField.actionType">
-          <md-option ng-value="'voice'">Voice</md-option>
-        </md-select>
-        <div
-          ng-messages="customFieldForm['actionType'].$error"
-          ng-show="customFieldForm['actionType'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="CONTACTMANAGER.ERRORS.ACTIONTYPE_REQUIRED"
-              >actionType field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newCustomField"
-          ng-click="vm.saveCustomField()"
-          class="send-button md-accent md-raised"
-          ng-disabled="customFieldForm.$invalid || customFieldForm.$pristine"
-          aria-label="SAVE"
-          translate="CONTACTMANAGER.SAVE"
-          translate-attr-aria-label="CONTACTMANAGER.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newCustomField"
-          ng-click="vm.addNewCustomField()"
-          class="send-button md-accent md-raised"
-          ng-disabled="customFieldForm.$invalid"
-          aria-label="ADD"
-          translate="CONTACTMANAGER.ADD_CUSTOMFIELD"
-          translate-attr-aria-label="CONTACTMANAGER.ADD_CUSTOMFIELD"
-        >
-          ADD CUSTOMFIELD
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newCustomField"
-          ng-click="vm.deleteCustomField($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="CONTACTMANAGER.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="CONTACTMANAGER.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/lists/edit/customFields/dialog.html/dialog.html b/public/src/js/modules/main/apps/contactmanager/views/lists/edit/customFields/dialog.html/dialog.html
new file mode 100644
index 0000000..bb1b0d3
--- /dev/null
+++ b/public/src/js/modules/main/apps/contactmanager/views/lists/edit/customFields/dialog.html/dialog.html
@@ -0,0 +1,269 @@
+<md-dialog class="customField-dialog" aria-label="New CustomField">
+  <form name="customFieldForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="CONTACTMANAGER.ALIAS">Alias</label>
+        <input
+          type=""
+          name="alias"
+          ng-model="vm.customField.alias"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="customFieldForm['alias'].$error"
+          ng-show="customFieldForm['alias'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CONTACTMANAGER.ERRORS.ALIAS_REQUIRED"
+              >Alias field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="CONTACTMANAGER.TYPE">Type</label>
+        <md-select
+          name="type"
+          ng-model="vm.customField.type"
+          required
+          ng-disabled="!vm.newCustomField"
+        >
+          <md-option ng-value="'text'">Text</md-option>
+          <md-option ng-value="'select'">Select</md-option>
+          <md-option ng-value="'number'">Number</md-option>
+          <md-option ng-value="'switch'">Switch</md-option>
+          <md-option ng-value="'datetime'">Datetime</md-option>
+        </md-select>
+        <div
+          ng-messages="customFieldForm['type'].$error"
+          ng-show="customFieldForm['type'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CONTACTMANAGER.ERRORS.TYPE_REQUIRED"
+              >Type field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <div ng-if="vm.customField.type == 'select'" class="md-block">
+        <md-list>
+          <md-list-item layout-margin>
+            <md-button
+              class="md-fab md-mini md-secondary"
+              ng-click="vm.addItem(vm.customField.values);"
+            >
+              <md-tooltip
+                ><span translate="CONTACTMANAGER.ADD">ADD</span></md-tooltip
+              >
+              <md-icon
+                md-font-icon="icon-plus"
+                aria-label="alert error"
+              ></md-icon>
+            </md-button>
+            <md-button
+              ng-if="vm.customField.values.length"
+              class="md-fab md-mini md-warn md-secondary"
+              ng-click="vm.removeItems(vm.customField.values);"
+            >
+              <md-tooltip
+                ><span translate="CONTACTMANAGER.DELETE_ALL"
+                  >Delete All</span
+                ></md-tooltip
+              >
+              <md-icon
+                md-font-icon="icon-delete"
+                aria-label="alert error"
+              ></md-icon>
+            </md-button>
+          </md-list-item>
+        </md-list>
+        <md-list ng-sortable="vm.sortable">
+          <md-list-item
+            ng-repeat="item in vm.customField.values"
+            style="border: 1px solid #ccc !important; border-radius: 7px"
+            layout-margin
+          >
+            <div>
+              <md-icon
+                class="s24"
+                style="cursor: move"
+                md-font-icon="icon-drag"
+                aria-label="drag"
+              ></md-icon>
+              <input type="text" ng-model="item.value" flex />
+            </div>
+            <md-button
+              class="md-fab md-mini md-warn md-secondary"
+              ng-click="vm.removeItem(vm.customField.values, $index);"
+            >
+              <md-tooltip
+                ><span translate="CONTACTMANAGER.DELETE"
+                  >DELETE</span
+                ></md-tooltip
+              >
+              <md-icon
+                md-font-icon="icon-delete"
+                aria-label="alert error"
+              ></md-icon>
+            </md-button>
+          </md-list-item>
+        </md-list>
+        <md-list>
+          <md-list-item
+            ng-if="!vm.customField.values.length"
+            layout="row"
+            layout-align="center center"
+          >
+            <em translate="CONTACTMANAGER.NO_AVAILABLE_ITEMS"
+              >No Available Items</em
+            >
+          </md-list-item>
+        </md-list>
+      </div>
+      <md-input-container class="md-block">
+        <md-switch ng-model="vm.customField.required" aria-label="Required"
+          ><span translate="CONTACTMANAGER.REQUIRED">Required</span></md-switch
+        >
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.customField.type == 'text'"
+        class="md-block"
+      >
+        <md-switch
+          ng-model="vm.customField.clickToAction"
+          aria-label="clickToAction"
+          ><span translate="CONTACTMANAGER.CLICKTOACTION"
+            >clickToAction</span
+          ></md-switch
+        >
+      </md-input-container>
+      <md-input-container ng-if="vm.customField.clickToAction" class="md-block">
+        <label translate="CONTACTMANAGER.ACTIONTYPE">actionType</label>
+        <md-select name="actionType" ng-model="vm.customField.actionType">
+          <md-option ng-value="'voice'">Voice</md-option>
+        </md-select>
+        <div
+          ng-messages="customFieldForm['actionType'].$error"
+          ng-show="customFieldForm['actionType'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="CONTACTMANAGER.ERRORS.ACTIONTYPE_REQUIRED"
+              >actionType field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newCustomField"
+          ng-click="vm.saveCustomField()"
+          class="send-button md-accent md-raised"
+          ng-disabled="customFieldForm.$invalid || customFieldForm.$pristine"
+          aria-label="SAVE"
+          translate="CONTACTMANAGER.SAVE"
+          translate-attr-aria-label="CONTACTMANAGER.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newCustomField"
+          ng-click="vm.addNewCustomField()"
+          class="send-button md-accent md-raised"
+          ng-disabled="customFieldForm.$invalid"
+          aria-label="ADD"
+          translate="CONTACTMANAGER.ADD_CUSTOMFIELD"
+          translate-attr-aria-label="CONTACTMANAGER.ADD_CUSTOMFIELD"
+        >
+          ADD CUSTOMFIELD
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newCustomField"
+          ng-click="vm.deleteCustomField($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="CONTACTMANAGER.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="CONTACTMANAGER.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/lists/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/contactmanager/views/lists/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index ba1c566..0000000
--- a/public/src/js/modules/main/apps/contactmanager/views/lists/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,628 +0,0 @@
-<div id="contactmanager-list" class="page-layout simple tabbed" layout="column">
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-lists-button md-icon-button"
-        aria-label="Go to lists"
-        ng-click="vm.gotoLists()"
-        translate
-        translate-attr-aria-label="CONTACTMANAGER.GO_TO_LISTS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="list-image" hide-xs>
-          <img ng-src="assets/images/business/lists.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.list.id}}
-            <span ng-if="vm.list.name">{{vm.list.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="CONTACTMANAGER.CREATED_AT"></span>
-            <span>{{vm.list.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.gotogoto(vm.list, $event)"
-        class="md-fab md-warn md-icon-button"
-        aria-label="goto"
-      >
-        <md-tooltip
-          ><span translate="CONTACTMANAGER.GOTO_LIST"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-forward"></md-icon>
-      </md-button>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.agentadddialog(vm.list, $event)"
-        class="md-fab md-warn md-icon-button"
-        aria-label="agentadd"
-      >
-        <md-tooltip
-          ><span translate="CONTACTMANAGER.AGENTADD_LIST"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-eye"></md-icon>
-      </md-button>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveList()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (customFieldsForm.$invalid) || (voiceDispositionsForm.$invalid)"
-        translate="CONTACTMANAGER.SAVE"
-        translate-attr-aria-label="CONTACTMANAGER.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="CONTACTMANAGER.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="list-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="CONTACTMANAGER.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="CONTACTMANAGER.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.list.name"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CONTACTMANAGER.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CONTACTMANAGER.DESCRIPTION"
-                  >Description</label
-                >
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.list.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CONTACTMANAGER.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="CONTACTMANAGER.PREFIX">Prefix</label>
-                <input
-                  type="text"
-                  name="dialPrefix"
-                  ng-model="vm.list.dialPrefix"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['dialPrefix'].$error"
-                  ng-show="generalForm['dialPrefix'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="CONTACTMANAGER.ERRORS.PREFIX_REQUIRED"
-                      >Prefix field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="CONTACTMANAGER.CUSTOMFIELDS">CUSTOMFIELDS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="list-detail-form-container customfields md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="ListCustomFieldsController as vm_dc"
-              ng-init="vm_dc.init(vm.list, vm.crudPermissions)"
-            >
-              <md-toolbar
-                class="md-table-toolbar md-default"
-                ng-hide="vm_dc.selectedListCustomFields.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span
-                    class="md-subhead"
-                    translate="CONTACTMANAGER.CUSTOMFIELDS"
-                    >CustomFields</span
-                  >
-                  <ms-search-bar
-                    on-search="vm_dc.query.filter = query"
-                    on-collapse="vm_dc.query.filter = undefined"
-                    debounce="300"
-                    direction="down"
-                  ></ms-search-bar>
-                  <div flex></div>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canEdit"
-                    class="md-icon-button"
-                    ng-click="vm_dc.createOrEditListCustomField($event)"
-                    aria-label="add customField"
-                    translate
-                    translate-attr-label="CONTACTMANAGER.ADD_CUSTOMFIELD"
-                  >
-                    <md-icon md-font-icon="icon-plus"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-toolbar
-                class="md-table-toolbar md-accent"
-                ng-show="vm_dc.selectedListCustomFields.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead"
-                    >{{vm_dc.selectedListCustomFields.length}}
-                    {{vm_dc.selectedListCustomFields.length > 1 ? 'items' :
-                    'item'}} selected</span
-                  >
-                  <div flex></div>
-                  <button
-                    class="md-icon-button"
-                    ng-csv="vm_dc.exportSelectedListCustomFields"
-                    csv-label="true"
-                    filename="lists.csv"
-                  >
-                    <md-icon md-font-icon="icon-file-excel"></md-icon>
-                  </button>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canDelete"
-                    class="md-icon-button"
-                    ng-click="vm_dc.deleteSelectedListCustomFields($event)"
-                    aria-label="delete selected"
-                    translate
-                    translate-attr-label="CONTACTMANAGER.DELETE_SELECTED"
-                  >
-                    <md-icon md-font-icon="icon-delete"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-table-container class="font-size-12">
-                <table
-                  md-table
-                  md-row-select
-                  multiple
-                  ng-model="vm_dc.selectedListCustomFields"
-                  md-progress="vm_dc.promise"
-                >
-                  <thead
-                    md-head
-                    md-order="vm_dc.query.sort"
-                    md-on-reorder="vm_dc.getListCustomFields"
-                  >
-                    <tr md-row>
-                      <th md-column md-order-by="id">
-                        {{ 'CONTACTMANAGER.ID' | translate }}
-                      </th>
-                      <th md-column md-order-by="alias">
-                        {{ 'CONTACTMANAGER.ALIAS' | translate }}
-                      </th>
-                      <th md-column md-order-by="type">
-                        {{ 'CONTACTMANAGER.TYPE' | translate }}
-                      </th>
-                      <th md-column md-order-by="required">
-                        {{ 'CONTACTMANAGER.REQUIRED' | translate }}
-                      </th>
-                      <th md-column width="10px"></th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr
-                      md-row
-                      md-select="customField"
-                      md-select-id="id"
-                      ng-repeat="customField in vm_dc.listCustomFields.rows"
-                    >
-                      <td
-                        ng-click="vm_dc.createOrEditListCustomField($event, customField)"
-                        md-cell
-                      >
-                        {{customField.id}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditListCustomField($event, customField)"
-                        md-cell
-                      >
-                        {{customField.alias}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditListCustomField($event, customField)"
-                        md-cell
-                      >
-                        {{ vm_dc.arraytype[customField.type].option }}
-                      </td>
-
-                      <td
-                        ng-click="vm_dc.createOrEditListCustomField($event, customField)"
-                        md-cell
-                        class="required"
-                      >
-                        <md-icon
-                          md-colors="{color: {{customField.required ? '\'green\'' : '\'grey\''}}}"
-                          md-font-icon="{{customField.required? 'icon-check' : 'icon-close'}}"
-                        ></md-icon>
-                      </td>
-                      <td
-                        md-cell
-                        class="actions"
-                        ng-if="!vm_dc.crudPermissions.readOnly"
-                      >
-                        <md-menu>
-                          <md-button
-                            class="md-icon-button"
-                            aria-label="More"
-                            translate
-                            translate-attr-aria-label="CONTACTMANAGER.MORE"
-                            ng-click="$mdOpenMenu($event)"
-                          >
-                            <md-icon
-                              md-font-icon="icon-dots-vertical"
-                            ></md-icon>
-                          </md-button>
-
-                          <md-menu-content width="3">
-                            <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
-                              <md-button
-                                ng-click="vm_dc.createOrEditListCustomField($event, customField)"
-                                translate="CONTACTMANAGER.EDIT_CUSTOMFIELD"
-                              >
-                                Edit CustomField
-                              </md-button>
-                            </md-menu-item>
-                            <md-menu-item
-                              ng-if="vm_dc.crudPermissions.canDelete"
-                            >
-                              <md-button
-                                ng-click="vm_dc.deleteConfirm(customField, $event)"
-                                translate="CONTACTMANAGER.DELETE_CUSTOMFIELD"
-                              >
-                                Delete CustomField
-                              </md-button>
-                            </md-menu-item>
-                          </md-menu-content>
-                        </md-menu>
-                      </td>
-                    </tr>
-                    <tr md-row ng-if="!vm_dc.listCustomFields.rows.length">
-                      <td md-cell colspan="9">
-                        <div layout="row" layout-align="center center">
-                          <span
-                            class="text-boxed-light"
-                            translate="CONTACTMANAGER.NO_CUSTOMFIELD_AVAILABLE"
-                            >No customfield available</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-              <md-table-pagination
-                md-label="{page: '{{'CONTACTMANAGER.PAGE' | translate}}:', rowsPerPage: '{{'CONTACTMANAGER.ROWSPERPAGE' | translate}}:', of: '{{'CONTACTMANAGER.OF' | translate}}'}"
-                md-limit="vm_dc.query.limit"
-                md-limit-options="[10, 15, 20, 50, 100, 250]"
-                md-page="vm_dc.query.page"
-                md-total="{{vm_dc.listCustomFields.count}}"
-                md-on-paginate="vm_dc.getListCustomFields"
-                md-page-select
-              ></md-table-pagination>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="CONTACTMANAGER.DISPOSITIONS">DISPOSITIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            ng-controller="ListDispositionsController as vm_dc"
-            ng-init="vm_dc.init(vm.list, vm.crudPermissions)"
-          >
-            <div layout="row">
-              <div class="column" flex="20">
-                <md-card class="mt-0">
-                  <md-card-content>
-                    <button
-                      layout-align="center center"
-                      md-mini-fab
-                      ng-click="vm_dc.query.level = null; vm_dc.getDispositions()"
-                    >
-                      <div layout="row" layout-align="start center">
-                        <md-icon md-font-icon="icon-refresh"></md-icon>
-                        <span class="ph-5"
-                          >{{ 'TOOLS.ALL_DISPOSITIONS' | translate }}</span
-                        >
-                      </div>
-                    </button>
-                  </md-card-content>
-                </md-card>
-                <md-card>
-                  <md-card-content>
-                    <md-input-container class="md-block" flex-gt-sm="">
-                      <label translate="TOOLS.SELECT_LEVEL"
-                        >Select a level</label
-                      >
-                      <md-select
-                        placeholder="{{ 'TOOLS.SELECT_LEVEL' | translate }}"
-                        ng-model="vm_dc.query.level"
-                        ng-change="vm_dc.getDispositions()"
-                      >
-                        <md-option ng-value="null"
-                          ><em translate="TOOLS.ALL">All</em></md-option
-                        >
-                        <md-option
-                          ng-value="key"
-                          ng-repeat="(key, value) in vm_dc.levels"
-                          >{{ value }}</md-option
-                        >
-                      </md-select>
-                    </md-input-container>
-                  </md-card-content>
-                </md-card>
-              </div>
-              <div
-                class="list-detail-form-container voicedispositions md-background-bg md-whiteframe-1dp"
-                flex="80"
-              >
-                <md-toolbar
-                  class="md-table-toolbar md-default"
-                  ng-hide="vm_dc.selectedListDispositions.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span
-                      class="md-subhead"
-                      translate="CONTACTMANAGER.DISPOSITIONS"
-                      >Dispositions</span
-                    >
-                    <ms-search-bar
-                      on-search="vm_dc.query.filter = query"
-                      on-collapse="vm_dc.query.filter = undefined"
-                      debounce="300"
-                      direction="down"
-                    ></ms-search-bar>
-                    <div flex></div>
-                    <md-button
-                      ng-if="vm_dc.crudPermissions.canEdit"
-                      class="md-icon-button"
-                      ng-click="vm_dc.createOrEditDisposition($event)"
-                      aria-label="Add contactmanager dispositions"
-                      translate
-                      translate-attr-label="CONTACTMANAGER.ADD_DISPOSITION"
-                    >
-                      <md-icon md-font-icon="icon-plus"></md-icon>
-                    </md-button>
-                  </div>
-                </md-toolbar>
-                <md-toolbar
-                  class="md-table-toolbar md-accent"
-                  ng-show="vm_dc.selectedDispositions.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead"
-                      >{{vm_dc.selectedDispositions.length}}
-                      {{vm_dc.selectedDispositions.length > 1 ? 'items' :
-                      'item'}} selected</span
-                    >
-                    <div flex></div>
-                    <button
-                      class="md-icon-button"
-                      ng-csv="vm_dc.exportSelectedDispositions"
-                      csv-label="true"
-                      filename="lists.csv"
-                    >
-                      <md-icon md-font-icon="icon-file-excel"></md-icon>
-                    </button>
-                    <md-button
-                      ng-if="vm_dc.crudPermissions.canDelete"
-                      class="md-icon-button"
-                      ng-click="vm_dc.deleteSelectedDispositions($event)"
-                      aria-label="delete selected"
-                      translate
-                      translate-attr-label="CONTACTMANAGER.DELETE_SELECTED"
-                    >
-                      <md-icon md-font-icon="icon-delete"></md-icon>
-                    </md-button>
-                  </div>
-                </md-toolbar>
-                <md-table-container>
-                  <table
-                    md-table
-                    md-row-select
-                    multiple
-                    ng-model="vm_dc.selectedDispositions"
-                    md-progress="vm_dc.promise"
-                  >
-                    <thead
-                      md-head
-                      md-order="vm_dc.query.sort"
-                      md-on-reorder="vm_dc.getDispositions"
-                    >
-                      <tr md-row>
-                        <th md-column md-order-by="id">
-                          {{ 'CONTACTMANAGER.ID' | translate }}
-                        </th>
-                        <th md-column md-order-by="level">
-                          {{ 'TOOLS.LEVEL' | translate }}
-                        </th>
-                        <th md-column md-order-by="name">
-                          {{ 'CONTACTMANAGER.NAME' | translate }}
-                        </th>
-                        <th md-column md-order-by="description">
-                          {{ 'CONTACTMANAGER.DESCRIPTION' | translate }}
-                        </th>
-                        <th md-column width="10px"></th>
-                      </tr>
-                    </thead>
-                    <tbody md-body>
-                      <tr md-row ng-hide="vm_dc.dispositions.rows.length">
-                        <td md-cell colspan="5">
-                          <div layout="row" layout-align="center center">
-                            <span translate="CONTACTMANAGER.NO_AVAILABLE_INFO"
-                              >No Available Info</span
-                            >
-                          </div>
-                        </td>
-                      </tr>
-                      <tr
-                        md-row
-                        md-select="disposition"
-                        md-select-id="id"
-                        ng-repeat="disposition in vm_dc.dispositions.rows"
-                      >
-                        <td
-                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                          md-cell
-                          class="id"
-                        >
-                          {{disposition.id}}
-                        </td>
-                        <td
-                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                          md-cell
-                          class="level"
-                        >
-                          {{ vm_dc.levels[disposition.level] }}
-                        </td>
-                        <td
-                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                          md-cell
-                          class="name"
-                        >
-                          {{disposition.name}}
-                        </td>
-                        <td
-                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                          md-cell
-                          class="description"
-                        >
-                          {{disposition.description}}
-                        </td>
-                        <td
-                          md-cell
-                          class="actions"
-                          ng-if="!vm_dc.crudPermissions.readOnly"
-                        >
-                          <md-menu>
-                            <md-button
-                              class="md-icon-button"
-                              aria-label="More"
-                              translate
-                              translate-attr-aria-label="CONTACTMANAGER.MORE"
-                              ng-click="$mdOpenMenu($event)"
-                            >
-                              <md-icon
-                                md-font-icon="icon-dots-vertical"
-                              ></md-icon>
-                            </md-button>
-                            <md-menu-content width="3">
-                              <!-- SUBACTIONS -->
-                              <!-- ACTIONS -->
-                              <md-menu-item
-                                ng-if="vm_dc.crudPermissions.canEdit"
-                              >
-                                <md-button
-                                  ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                                  translate="TOOLS.EDIT_DISPOSITION"
-                                >
-                                  Edit Disposition
-                                </md-button>
-                              </md-menu-item>
-                              <!-- SUBACTIONS -->
-                              <!-- ACTIONS -->
-                              <md-menu-item
-                                ng-if="vm_dc.crudPermissions.canDelete"
-                              >
-                                <md-button
-                                  ng-click="vm_dc.deleteConfirm(disposition, $event)"
-                                  translate="TOOLS.DELETE_DISPOSITION"
-                                >
-                                  Delete Disposition
-                                </md-button>
-                              </md-menu-item>
-                            </md-menu-content>
-                          </md-menu>
-                        </td>
-                      </tr>
-                    </tbody>
-                  </table>
-                </md-table-container>
-                <md-table-pagination
-                  md-label="{page: '{{'CONTACTMANAGER.PAGE' | translate}}:', rowsPerPage: '{{'CONTACTMANAGER.ROWSPERPAGE' | translate}}:', of: '{{'CONTACTMANAGER.OF' | translate}}'}"
-                  md-limit="vm_dc.query.limit"
-                  md-limit-options="[10, 15, 20, 50, 100, 250]"
-                  md-page="vm_dc.query.page"
-                  md-total="{{vm_dc.dispositions.count}}"
-                  md-on-paginate="vm_dc.getDispositions"
-                  md-page-select
-                >
-                </md-table-pagination>
-              </div>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/lists/edit/view.html/view.html b/public/src/js/modules/main/apps/contactmanager/views/lists/edit/view.html/view.html
new file mode 100644
index 0000000..ba1c566
--- /dev/null
+++ b/public/src/js/modules/main/apps/contactmanager/views/lists/edit/view.html/view.html
@@ -0,0 +1,628 @@
+<div id="contactmanager-list" class="page-layout simple tabbed" layout="column">
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-lists-button md-icon-button"
+        aria-label="Go to lists"
+        ng-click="vm.gotoLists()"
+        translate
+        translate-attr-aria-label="CONTACTMANAGER.GO_TO_LISTS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="list-image" hide-xs>
+          <img ng-src="assets/images/business/lists.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.list.id}}
+            <span ng-if="vm.list.name">{{vm.list.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="CONTACTMANAGER.CREATED_AT"></span>
+            <span>{{vm.list.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.gotogoto(vm.list, $event)"
+        class="md-fab md-warn md-icon-button"
+        aria-label="goto"
+      >
+        <md-tooltip
+          ><span translate="CONTACTMANAGER.GOTO_LIST"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-forward"></md-icon>
+      </md-button>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.agentadddialog(vm.list, $event)"
+        class="md-fab md-warn md-icon-button"
+        aria-label="agentadd"
+      >
+        <md-tooltip
+          ><span translate="CONTACTMANAGER.AGENTADD_LIST"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-eye"></md-icon>
+      </md-button>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveList()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (customFieldsForm.$invalid) || (voiceDispositionsForm.$invalid)"
+        translate="CONTACTMANAGER.SAVE"
+        translate-attr-aria-label="CONTACTMANAGER.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="CONTACTMANAGER.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="list-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="CONTACTMANAGER.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="CONTACTMANAGER.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.list.name"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CONTACTMANAGER.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CONTACTMANAGER.DESCRIPTION"
+                  >Description</label
+                >
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.list.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CONTACTMANAGER.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="CONTACTMANAGER.PREFIX">Prefix</label>
+                <input
+                  type="text"
+                  name="dialPrefix"
+                  ng-model="vm.list.dialPrefix"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['dialPrefix'].$error"
+                  ng-show="generalForm['dialPrefix'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="CONTACTMANAGER.ERRORS.PREFIX_REQUIRED"
+                      >Prefix field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="CONTACTMANAGER.CUSTOMFIELDS">CUSTOMFIELDS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="list-detail-form-container customfields md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="ListCustomFieldsController as vm_dc"
+              ng-init="vm_dc.init(vm.list, vm.crudPermissions)"
+            >
+              <md-toolbar
+                class="md-table-toolbar md-default"
+                ng-hide="vm_dc.selectedListCustomFields.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span
+                    class="md-subhead"
+                    translate="CONTACTMANAGER.CUSTOMFIELDS"
+                    >CustomFields</span
+                  >
+                  <ms-search-bar
+                    on-search="vm_dc.query.filter = query"
+                    on-collapse="vm_dc.query.filter = undefined"
+                    debounce="300"
+                    direction="down"
+                  ></ms-search-bar>
+                  <div flex></div>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canEdit"
+                    class="md-icon-button"
+                    ng-click="vm_dc.createOrEditListCustomField($event)"
+                    aria-label="add customField"
+                    translate
+                    translate-attr-label="CONTACTMANAGER.ADD_CUSTOMFIELD"
+                  >
+                    <md-icon md-font-icon="icon-plus"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-toolbar
+                class="md-table-toolbar md-accent"
+                ng-show="vm_dc.selectedListCustomFields.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead"
+                    >{{vm_dc.selectedListCustomFields.length}}
+                    {{vm_dc.selectedListCustomFields.length > 1 ? 'items' :
+                    'item'}} selected</span
+                  >
+                  <div flex></div>
+                  <button
+                    class="md-icon-button"
+                    ng-csv="vm_dc.exportSelectedListCustomFields"
+                    csv-label="true"
+                    filename="lists.csv"
+                  >
+                    <md-icon md-font-icon="icon-file-excel"></md-icon>
+                  </button>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canDelete"
+                    class="md-icon-button"
+                    ng-click="vm_dc.deleteSelectedListCustomFields($event)"
+                    aria-label="delete selected"
+                    translate
+                    translate-attr-label="CONTACTMANAGER.DELETE_SELECTED"
+                  >
+                    <md-icon md-font-icon="icon-delete"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-table-container class="font-size-12">
+                <table
+                  md-table
+                  md-row-select
+                  multiple
+                  ng-model="vm_dc.selectedListCustomFields"
+                  md-progress="vm_dc.promise"
+                >
+                  <thead
+                    md-head
+                    md-order="vm_dc.query.sort"
+                    md-on-reorder="vm_dc.getListCustomFields"
+                  >
+                    <tr md-row>
+                      <th md-column md-order-by="id">
+                        {{ 'CONTACTMANAGER.ID' | translate }}
+                      </th>
+                      <th md-column md-order-by="alias">
+                        {{ 'CONTACTMANAGER.ALIAS' | translate }}
+                      </th>
+                      <th md-column md-order-by="type">
+                        {{ 'CONTACTMANAGER.TYPE' | translate }}
+                      </th>
+                      <th md-column md-order-by="required">
+                        {{ 'CONTACTMANAGER.REQUIRED' | translate }}
+                      </th>
+                      <th md-column width="10px"></th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr
+                      md-row
+                      md-select="customField"
+                      md-select-id="id"
+                      ng-repeat="customField in vm_dc.listCustomFields.rows"
+                    >
+                      <td
+                        ng-click="vm_dc.createOrEditListCustomField($event, customField)"
+                        md-cell
+                      >
+                        {{customField.id}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditListCustomField($event, customField)"
+                        md-cell
+                      >
+                        {{customField.alias}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditListCustomField($event, customField)"
+                        md-cell
+                      >
+                        {{ vm_dc.arraytype[customField.type].option }}
+                      </td>
+
+                      <td
+                        ng-click="vm_dc.createOrEditListCustomField($event, customField)"
+                        md-cell
+                        class="required"
+                      >
+                        <md-icon
+                          md-colors="{color: {{customField.required ? '\'green\'' : '\'grey\''}}}"
+                          md-font-icon="{{customField.required? 'icon-check' : 'icon-close'}}"
+                        ></md-icon>
+                      </td>
+                      <td
+                        md-cell
+                        class="actions"
+                        ng-if="!vm_dc.crudPermissions.readOnly"
+                      >
+                        <md-menu>
+                          <md-button
+                            class="md-icon-button"
+                            aria-label="More"
+                            translate
+                            translate-attr-aria-label="CONTACTMANAGER.MORE"
+                            ng-click="$mdOpenMenu($event)"
+                          >
+                            <md-icon
+                              md-font-icon="icon-dots-vertical"
+                            ></md-icon>
+                          </md-button>
+
+                          <md-menu-content width="3">
+                            <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
+                              <md-button
+                                ng-click="vm_dc.createOrEditListCustomField($event, customField)"
+                                translate="CONTACTMANAGER.EDIT_CUSTOMFIELD"
+                              >
+                                Edit CustomField
+                              </md-button>
+                            </md-menu-item>
+                            <md-menu-item
+                              ng-if="vm_dc.crudPermissions.canDelete"
+                            >
+                              <md-button
+                                ng-click="vm_dc.deleteConfirm(customField, $event)"
+                                translate="CONTACTMANAGER.DELETE_CUSTOMFIELD"
+                              >
+                                Delete CustomField
+                              </md-button>
+                            </md-menu-item>
+                          </md-menu-content>
+                        </md-menu>
+                      </td>
+                    </tr>
+                    <tr md-row ng-if="!vm_dc.listCustomFields.rows.length">
+                      <td md-cell colspan="9">
+                        <div layout="row" layout-align="center center">
+                          <span
+                            class="text-boxed-light"
+                            translate="CONTACTMANAGER.NO_CUSTOMFIELD_AVAILABLE"
+                            >No customfield available</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+              <md-table-pagination
+                md-label="{page: '{{'CONTACTMANAGER.PAGE' | translate}}:', rowsPerPage: '{{'CONTACTMANAGER.ROWSPERPAGE' | translate}}:', of: '{{'CONTACTMANAGER.OF' | translate}}'}"
+                md-limit="vm_dc.query.limit"
+                md-limit-options="[10, 15, 20, 50, 100, 250]"
+                md-page="vm_dc.query.page"
+                md-total="{{vm_dc.listCustomFields.count}}"
+                md-on-paginate="vm_dc.getListCustomFields"
+                md-page-select
+              ></md-table-pagination>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="CONTACTMANAGER.DISPOSITIONS">DISPOSITIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            ng-controller="ListDispositionsController as vm_dc"
+            ng-init="vm_dc.init(vm.list, vm.crudPermissions)"
+          >
+            <div layout="row">
+              <div class="column" flex="20">
+                <md-card class="mt-0">
+                  <md-card-content>
+                    <button
+                      layout-align="center center"
+                      md-mini-fab
+                      ng-click="vm_dc.query.level = null; vm_dc.getDispositions()"
+                    >
+                      <div layout="row" layout-align="start center">
+                        <md-icon md-font-icon="icon-refresh"></md-icon>
+                        <span class="ph-5"
+                          >{{ 'TOOLS.ALL_DISPOSITIONS' | translate }}</span
+                        >
+                      </div>
+                    </button>
+                  </md-card-content>
+                </md-card>
+                <md-card>
+                  <md-card-content>
+                    <md-input-container class="md-block" flex-gt-sm="">
+                      <label translate="TOOLS.SELECT_LEVEL"
+                        >Select a level</label
+                      >
+                      <md-select
+                        placeholder="{{ 'TOOLS.SELECT_LEVEL' | translate }}"
+                        ng-model="vm_dc.query.level"
+                        ng-change="vm_dc.getDispositions()"
+                      >
+                        <md-option ng-value="null"
+                          ><em translate="TOOLS.ALL">All</em></md-option
+                        >
+                        <md-option
+                          ng-value="key"
+                          ng-repeat="(key, value) in vm_dc.levels"
+                          >{{ value }}</md-option
+                        >
+                      </md-select>
+                    </md-input-container>
+                  </md-card-content>
+                </md-card>
+              </div>
+              <div
+                class="list-detail-form-container voicedispositions md-background-bg md-whiteframe-1dp"
+                flex="80"
+              >
+                <md-toolbar
+                  class="md-table-toolbar md-default"
+                  ng-hide="vm_dc.selectedListDispositions.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span
+                      class="md-subhead"
+                      translate="CONTACTMANAGER.DISPOSITIONS"
+                      >Dispositions</span
+                    >
+                    <ms-search-bar
+                      on-search="vm_dc.query.filter = query"
+                      on-collapse="vm_dc.query.filter = undefined"
+                      debounce="300"
+                      direction="down"
+                    ></ms-search-bar>
+                    <div flex></div>
+                    <md-button
+                      ng-if="vm_dc.crudPermissions.canEdit"
+                      class="md-icon-button"
+                      ng-click="vm_dc.createOrEditDisposition($event)"
+                      aria-label="Add contactmanager dispositions"
+                      translate
+                      translate-attr-label="CONTACTMANAGER.ADD_DISPOSITION"
+                    >
+                      <md-icon md-font-icon="icon-plus"></md-icon>
+                    </md-button>
+                  </div>
+                </md-toolbar>
+                <md-toolbar
+                  class="md-table-toolbar md-accent"
+                  ng-show="vm_dc.selectedDispositions.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead"
+                      >{{vm_dc.selectedDispositions.length}}
+                      {{vm_dc.selectedDispositions.length > 1 ? 'items' :
+                      'item'}} selected</span
+                    >
+                    <div flex></div>
+                    <button
+                      class="md-icon-button"
+                      ng-csv="vm_dc.exportSelectedDispositions"
+                      csv-label="true"
+                      filename="lists.csv"
+                    >
+                      <md-icon md-font-icon="icon-file-excel"></md-icon>
+                    </button>
+                    <md-button
+                      ng-if="vm_dc.crudPermissions.canDelete"
+                      class="md-icon-button"
+                      ng-click="vm_dc.deleteSelectedDispositions($event)"
+                      aria-label="delete selected"
+                      translate
+                      translate-attr-label="CONTACTMANAGER.DELETE_SELECTED"
+                    >
+                      <md-icon md-font-icon="icon-delete"></md-icon>
+                    </md-button>
+                  </div>
+                </md-toolbar>
+                <md-table-container>
+                  <table
+                    md-table
+                    md-row-select
+                    multiple
+                    ng-model="vm_dc.selectedDispositions"
+                    md-progress="vm_dc.promise"
+                  >
+                    <thead
+                      md-head
+                      md-order="vm_dc.query.sort"
+                      md-on-reorder="vm_dc.getDispositions"
+                    >
+                      <tr md-row>
+                        <th md-column md-order-by="id">
+                          {{ 'CONTACTMANAGER.ID' | translate }}
+                        </th>
+                        <th md-column md-order-by="level">
+                          {{ 'TOOLS.LEVEL' | translate }}
+                        </th>
+                        <th md-column md-order-by="name">
+                          {{ 'CONTACTMANAGER.NAME' | translate }}
+                        </th>
+                        <th md-column md-order-by="description">
+                          {{ 'CONTACTMANAGER.DESCRIPTION' | translate }}
+                        </th>
+                        <th md-column width="10px"></th>
+                      </tr>
+                    </thead>
+                    <tbody md-body>
+                      <tr md-row ng-hide="vm_dc.dispositions.rows.length">
+                        <td md-cell colspan="5">
+                          <div layout="row" layout-align="center center">
+                            <span translate="CONTACTMANAGER.NO_AVAILABLE_INFO"
+                              >No Available Info</span
+                            >
+                          </div>
+                        </td>
+                      </tr>
+                      <tr
+                        md-row
+                        md-select="disposition"
+                        md-select-id="id"
+                        ng-repeat="disposition in vm_dc.dispositions.rows"
+                      >
+                        <td
+                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                          md-cell
+                          class="id"
+                        >
+                          {{disposition.id}}
+                        </td>
+                        <td
+                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                          md-cell
+                          class="level"
+                        >
+                          {{ vm_dc.levels[disposition.level] }}
+                        </td>
+                        <td
+                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                          md-cell
+                          class="name"
+                        >
+                          {{disposition.name}}
+                        </td>
+                        <td
+                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                          md-cell
+                          class="description"
+                        >
+                          {{disposition.description}}
+                        </td>
+                        <td
+                          md-cell
+                          class="actions"
+                          ng-if="!vm_dc.crudPermissions.readOnly"
+                        >
+                          <md-menu>
+                            <md-button
+                              class="md-icon-button"
+                              aria-label="More"
+                              translate
+                              translate-attr-aria-label="CONTACTMANAGER.MORE"
+                              ng-click="$mdOpenMenu($event)"
+                            >
+                              <md-icon
+                                md-font-icon="icon-dots-vertical"
+                              ></md-icon>
+                            </md-button>
+                            <md-menu-content width="3">
+                              <!-- SUBACTIONS -->
+                              <!-- ACTIONS -->
+                              <md-menu-item
+                                ng-if="vm_dc.crudPermissions.canEdit"
+                              >
+                                <md-button
+                                  ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                                  translate="TOOLS.EDIT_DISPOSITION"
+                                >
+                                  Edit Disposition
+                                </md-button>
+                              </md-menu-item>
+                              <!-- SUBACTIONS -->
+                              <!-- ACTIONS -->
+                              <md-menu-item
+                                ng-if="vm_dc.crudPermissions.canDelete"
+                              >
+                                <md-button
+                                  ng-click="vm_dc.deleteConfirm(disposition, $event)"
+                                  translate="TOOLS.DELETE_DISPOSITION"
+                                >
+                                  Delete Disposition
+                                </md-button>
+                              </md-menu-item>
+                            </md-menu-content>
+                          </md-menu>
+                        </td>
+                      </tr>
+                    </tbody>
+                  </table>
+                </md-table-container>
+                <md-table-pagination
+                  md-label="{page: '{{'CONTACTMANAGER.PAGE' | translate}}:', rowsPerPage: '{{'CONTACTMANAGER.ROWSPERPAGE' | translate}}:', of: '{{'CONTACTMANAGER.OF' | translate}}'}"
+                  md-limit="vm_dc.query.limit"
+                  md-limit-options="[10, 15, 20, 50, 100, 250]"
+                  md-page="vm_dc.query.page"
+                  md-total="{{vm_dc.dispositions.count}}"
+                  md-on-paginate="vm_dc.getDispositions"
+                  md-page-select
+                >
+                </md-table-pagination>
+              </div>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/lists/lists.html/lists-[chunkhash].html b/public/src/js/modules/main/apps/contactmanager/views/lists/lists.html/lists-[chunkhash].html
deleted file mode 100644
index f2da953..0000000
--- a/public/src/js/modules/main/apps/contactmanager/views/lists/lists.html/lists-[chunkhash].html
+++ /dev/null
@@ -1,330 +0,0 @@
-<div
-  id="lists"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-account-circle" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="CONTACTMANAGER.LISTS">Lists</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="CONTACTMANAGER.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedLists.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedLists =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="CONTACTMANAGER.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-lists-count">
-          <span>{{vm.selectedLists.length}}</span>
-          <span translate="CONTACTMANAGER.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="CONTACTMANAGER.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllLists()"
-                translate="CONTACTMANAGER.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectLists()"
-                translate="CONTACTMANAGER.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedLists"
-          csv-label="true"
-          filename="lists.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedLists($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="CONTACTMANAGER.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- LIST TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedLists"
-            md-progress="vm.promise"
-          >
-            <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getLists">
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">
-                  {{ 'CONTACTMANAGER.ID' | translate }}
-                </th>
-                <th md-column md-order-by="name">
-                  {{ 'CONTACTMANAGER.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'CONTACTMANAGER.DESCRIPTION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.lists.rows.length">
-                <td md-cell colspan="4">
-                  <div layout="row" layout-align="center center">
-                    <span translate="CONTACTMANAGER.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="list"
-                md-select-id="id"
-                ng-repeat="list in vm.lists.rows"
-              >
-                <td md-cell ng-if="list.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{list.name}}"
-                    ng-src="api/users/{{list.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!list.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{list.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(list, ev) : vm.createOrEditList($event, list)"
-                  md-cell
-                  class="id"
-                >
-                  {{list.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(list, ev) : vm.createOrEditList($event, list)"
-                  md-cell
-                  class="name"
-                >
-                  {{list.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(list, ev) : vm.createOrEditList($event, list)"
-                  md-cell
-                  class="description"
-                >
-                  {{list.description}}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="CONTACTMANAGER.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(list, $event    )"
-                          translate="CONTACTMANAGER.EDIT_LIST"
-                        >
-                          Edit List
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.gotocontactsgoto(list, $event    )"
-                          translate="CONTACTMANAGER.GOTOCONTACTS_LIST"
-                        >
-                          goToContacts List
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.exportcsvcontactsexport(list, $event    )"
-                          translate="CONTACTMANAGER.EXPORTCSVCONTACTS_LIST"
-                        >
-                          exportCsvContacts List
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.agentadddialog(list, $event    )"
-                          translate="CONTACTMANAGER.AGENTADD_LIST"
-                        >
-                          AgentAdd List
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(list, $event    )"
-                          translate="CONTACTMANAGER.DELETE_LIST"
-                        >
-                          Delete List
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'CONTACTMANAGER.PAGE' | translate}}:', rowsPerPage: '{{'CONTACTMANAGER.ROWSPERPAGE' | translate}}:', of: '{{'CONTACTMANAGER.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.lists.count}}"
-          md-on-paginate="vm.getLists"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / LIST TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD LIST BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-list-button"
-    ng-click="vm.createOrEditList($event)"
-    aria-label="add list"
-    translate
-    translate-attr-aria-label="CONTACTMANAGER.ADD_LIST"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD LIST BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/contactmanager/views/lists/lists.html/lists.html b/public/src/js/modules/main/apps/contactmanager/views/lists/lists.html/lists.html
new file mode 100644
index 0000000..f2da953
--- /dev/null
+++ b/public/src/js/modules/main/apps/contactmanager/views/lists/lists.html/lists.html
@@ -0,0 +1,330 @@
+<div
+  id="lists"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-account-circle" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="CONTACTMANAGER.LISTS">Lists</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="CONTACTMANAGER.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedLists.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedLists =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="CONTACTMANAGER.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-lists-count">
+          <span>{{vm.selectedLists.length}}</span>
+          <span translate="CONTACTMANAGER.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="CONTACTMANAGER.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllLists()"
+                translate="CONTACTMANAGER.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectLists()"
+                translate="CONTACTMANAGER.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedLists"
+          csv-label="true"
+          filename="lists.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedLists($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="CONTACTMANAGER.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- LIST TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedLists"
+            md-progress="vm.promise"
+          >
+            <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getLists">
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">
+                  {{ 'CONTACTMANAGER.ID' | translate }}
+                </th>
+                <th md-column md-order-by="name">
+                  {{ 'CONTACTMANAGER.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'CONTACTMANAGER.DESCRIPTION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.lists.rows.length">
+                <td md-cell colspan="4">
+                  <div layout="row" layout-align="center center">
+                    <span translate="CONTACTMANAGER.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="list"
+                md-select-id="id"
+                ng-repeat="list in vm.lists.rows"
+              >
+                <td md-cell ng-if="list.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{list.name}}"
+                    ng-src="api/users/{{list.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!list.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{list.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(list, ev) : vm.createOrEditList($event, list)"
+                  md-cell
+                  class="id"
+                >
+                  {{list.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(list, ev) : vm.createOrEditList($event, list)"
+                  md-cell
+                  class="name"
+                >
+                  {{list.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(list, ev) : vm.createOrEditList($event, list)"
+                  md-cell
+                  class="description"
+                >
+                  {{list.description}}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="CONTACTMANAGER.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(list, $event    )"
+                          translate="CONTACTMANAGER.EDIT_LIST"
+                        >
+                          Edit List
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.gotocontactsgoto(list, $event    )"
+                          translate="CONTACTMANAGER.GOTOCONTACTS_LIST"
+                        >
+                          goToContacts List
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.exportcsvcontactsexport(list, $event    )"
+                          translate="CONTACTMANAGER.EXPORTCSVCONTACTS_LIST"
+                        >
+                          exportCsvContacts List
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.agentadddialog(list, $event    )"
+                          translate="CONTACTMANAGER.AGENTADD_LIST"
+                        >
+                          AgentAdd List
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(list, $event    )"
+                          translate="CONTACTMANAGER.DELETE_LIST"
+                        >
+                          Delete List
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'CONTACTMANAGER.PAGE' | translate}}:', rowsPerPage: '{{'CONTACTMANAGER.ROWSPERPAGE' | translate}}:', of: '{{'CONTACTMANAGER.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.lists.count}}"
+          md-on-paginate="vm.getLists"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / LIST TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD LIST BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-list-button"
+    ng-click="vm.createOrEditList($event)"
+    aria-label="add list"
+    translate
+    translate-attr-aria-label="CONTACTMANAGER.ADD_LIST"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD LIST BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/dashboards/views/custom/custom.html/custom-[chunkhash].html b/public/src/js/modules/main/apps/dashboards/views/custom/custom.html/custom-[chunkhash].html
deleted file mode 100644
index 7656140..0000000
--- a/public/src/js/modules/main/apps/dashboards/views/custom/custom.html/custom-[chunkhash].html
+++ /dev/null
@@ -1,44 +0,0 @@
-<div ng-if="!vm.customDashboard">
-  <p>Custom Dashboard not available...</p>
-</div>
-<div id="dashboard-custom" ng-if="vm.customDashboard" ng-cloak layout-fill>
-  <md-content>
-    <md-toolbar class="md-default md-accent filter-header">
-      <div class="md-toolbar-tools">
-        <span class="md-subhead">{{vm.customDashboard.name}}</span>
-        <div flex></div>
-        <div layout="column">
-          <span class="font-size-10" translate="DASHBOARDS.FILTER_VOICE_QUEUES"
-            >Filter Voice Queues</span
-          >
-          <md-select
-            placeholder="Select one or more queues"
-            class="font-size-12 no-margin w-200"
-            md-on-close="vm.onChangeVoiceQueues()"
-            ng-model="vm.voiceQueuesSelected"
-            multiple
-            aria-label="voiceQueues"
-          >
-            <md-option
-              ng-value="voiceQueue.id"
-              ng-repeat="voiceQueue in vm.voiceQueues.rows"
-              >{{ voiceQueue.name }}</md-option
-            >
-          </md-select>
-        </div>
-        <md-button
-          ng-if="vm.crudPermissions.canEdit"
-          class="md-icon-button"
-          ng-click="vm.goToEdit()"
-          aria-label="goToEdit"
-        >
-          <md-tooltip md-direction="top"
-            ><span translate="DASHBOARDS.EDIT"></span
-          ></md-tooltip>
-          <md-icon md-font-icon="icon-table-edit"></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <ms-widget-engine config="vm.customDashboard"></ms-widget-engine>
-  </md-content>
-</div>
diff --git a/public/src/js/modules/main/apps/dashboards/views/custom/custom.html/custom.html b/public/src/js/modules/main/apps/dashboards/views/custom/custom.html/custom.html
new file mode 100644
index 0000000..7656140
--- /dev/null
+++ b/public/src/js/modules/main/apps/dashboards/views/custom/custom.html/custom.html
@@ -0,0 +1,44 @@
+<div ng-if="!vm.customDashboard">
+  <p>Custom Dashboard not available...</p>
+</div>
+<div id="dashboard-custom" ng-if="vm.customDashboard" ng-cloak layout-fill>
+  <md-content>
+    <md-toolbar class="md-default md-accent filter-header">
+      <div class="md-toolbar-tools">
+        <span class="md-subhead">{{vm.customDashboard.name}}</span>
+        <div flex></div>
+        <div layout="column">
+          <span class="font-size-10" translate="DASHBOARDS.FILTER_VOICE_QUEUES"
+            >Filter Voice Queues</span
+          >
+          <md-select
+            placeholder="Select one or more queues"
+            class="font-size-12 no-margin w-200"
+            md-on-close="vm.onChangeVoiceQueues()"
+            ng-model="vm.voiceQueuesSelected"
+            multiple
+            aria-label="voiceQueues"
+          >
+            <md-option
+              ng-value="voiceQueue.id"
+              ng-repeat="voiceQueue in vm.voiceQueues.rows"
+              >{{ voiceQueue.name }}</md-option
+            >
+          </md-select>
+        </div>
+        <md-button
+          ng-if="vm.crudPermissions.canEdit"
+          class="md-icon-button"
+          ng-click="vm.goToEdit()"
+          aria-label="goToEdit"
+        >
+          <md-tooltip md-direction="top"
+            ><span translate="DASHBOARDS.EDIT"></span
+          ></md-tooltip>
+          <md-icon md-font-icon="icon-table-edit"></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <ms-widget-engine config="vm.customDashboard"></ms-widget-engine>
+  </md-content>
+</div>
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/agent/agent.general.html/agent.general-[chunkhash].html b/public/src/js/modules/main/apps/dashboards/views/general/agent/agent.general.html/agent.general-[chunkhash].html
deleted file mode 100644
index d10e30e..0000000
--- a/public/src/js/modules/main/apps/dashboards/views/general/agent/agent.general.html/agent.general-[chunkhash].html
+++ /dev/null
@@ -1,139 +0,0 @@
-<div id="agent-general" layout="column">
-  <div layout="row" layout-align="start center" class="md-primary-bg">
-    <md-button
-      class="md-raised no-margin width-50"
-      style="border-radius: 0px"
-      ng-class="{'md-primary': !vm.isActiveTab(0)}"
-      ng-click="vm.onClickTab(0)"
-      aria-label="home"
-    >
-      <md-tooltip md-direction="bottom" md-delay="500">Home</md-tooltip>
-      <md-icon md-font-icon="icon-home" class="icon"></md-icon>
-    </md-button>
-
-    <ms-tab-scroll style="overflow: hidden">
-      <div
-        layout="column"
-        ng-repeat="(key, tab) in vm.tabs"
-        ng-click="vm.onClickTab(tab.id)"
-        ng-class="{'grey-50-bg': vm.isActiveTab(tab.id)}"
-      >
-        <div
-          style="height: 34px"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-icon
-            md-font-icon="{{tab.icon}}"
-            class="icon s16 margin-horizontal-5"
-            ng-class="tab.color + '-fg'"
-          >
-          </md-icon>
-          <span
-            class="text-truncate font-size-12"
-            ng-class="vm.isActiveTab(tab.id) ? 'black-fg' : 'grey-300-fg'"
-          >
-            {{tab.title}}
-            <span ng-if="tab.badges" class="badge md-white-fg md-red-bg"
-              >{{tab.badges}}</span
-            ></span
-          >
-          <md-button
-            class="md-icon-button md-mini no-margin"
-            ng-class="vm.isActiveTab(tab.id) ? 'md-primary' : 'grey-300-fg'"
-            aria-label="close"
-            ng-click="vm.closeTab(tab)"
-          >
-            <md-icon
-              md-font-icon="icon-close-circle-outline"
-              class="icon s16"
-            ></md-icon>
-          </md-button>
-        </div>
-        <div
-          style="height: 2px"
-          ng-class="vm.isActiveTab(tab.id) ? tab.color + '-bg' : ''"
-        ></div>
-      </div>
-    </ms-tab-scroll>
-  </div>
-  <div
-    layout="row"
-    class="agent-content"
-    ng-if="vm.isActiveTab(0)"
-    ng-style="{'top': vm.detectBrowser.browser == 'safari' ? '100px' : '36px'}"
-    ng-include="'app/main/apps/dashboards/views/general/agent/home/agent.general.home.html'"
-    ng-controller="AgentGeneralHomeController as vm_home"
-    ng-init="vm_home.init(vm.license, vm.setting)"
-  ></div>
-  <div
-    ng-if="!vm.isActiveTab(0)"
-    ng-repeat="(key, tab) in vm.tabs"
-    ng-switch="tab.type"
-  >
-    <div ng-switch-when="contact">
-      <div
-        class="agent-content"
-        ms-scroll
-        ng-if="vm.isActiveTab(tab.id)"
-        ng-style="{'top': vm.detectBrowser.browser == 'safari' ? '100px' : '36px'}"
-        ng-include="'app/main/apps/dashboards/views/general/agent/contact/agent.general.contact.html'"
-        ng-controller="AgentGeneralContactController as vm"
-        ng-init="vm.init(tab,$parent.vm.license)"
-      ></div>
-    </div>
-    <div ng-switch-when="popup">
-      <div
-        ng-if="vm.isActiveTab(tab.id)"
-        ms-scroll
-        ng-include="'app/main/apps/dashboards/views/general/agent/popup/agent.general.popup.html'"
-        ng-controller="AgentGeneralPopupController as vm"
-        ng-init="vm.init(tab)"
-      ></div>
-    </div>
-    <div ng-switch-when="jscripty">
-      <div
-        class="agent-content"
-        ms-scroll
-        ng-if="vm.isActiveTab(tab.id)"
-        ng-style="{'top': vm.detectBrowser.browser == 'safari' ? '100px' : '36px'}"
-        ng-include="'app/main/apps/dashboards/views/general/agent/jscripty/agent.general.jscripty.html'"
-        ng-controller="AgentGeneralJscriptyController as vm"
-        ng-init="vm.init(tab)"
-      ></div>
-    </div>
-    <div ng-switch-when="bot">
-      <div
-        id="interaction-app"
-        ng-if="vm.isActiveTab(tab.id)"
-        class="agent-content"
-        ng-style="{'top': vm.detectBrowser.browser == 'safari' ? '100px' : '36px'}"
-        ng-include="'app/main/apps/dashboards/views/general/agent/bot/agent.general.bot.html'"
-        ng-controller="AgentGeneralBotController as vm"
-        ng-init="vm.init(tab, $parent.vm.setting)"
-      ></div>
-    </div>
-    <div ng-switch-when="interaction">
-      <div
-        id="interaction-app"
-        ng-if="vm.isActiveTab(tab.id)"
-        class="agent-content"
-        ng-style="{'top': vm.detectBrowser.browser == 'safari' ? '100px' : '36px'}"
-        ng-include="'app/main/apps/dashboards/views/general/agent/interaction/agent.general.interaction.html'"
-        ng-controller="AgentGeneralInteractionController as vm"
-        ng-init="vm.init(tab, $parent.vm.setting)"
-      ></div>
-    </div>
-    <div ng-switch-when="iframe">
-      <div
-        id="iframe"
-        ng-if="vm.isActiveTab(tab.id)"
-        class="agent-content"
-        ng-style="{'top': vm.detectBrowser.browser == 'safari' ? '100px' : '36px'}"
-        ng-include="'app/main/apps/dashboards/views/general/agent/iframe/agent.general.iframe.html'"
-        ng-controller="AgentGeneralIframeController as vm"
-        ng-init="vm.init(tab, $parent.vm.setting)"
-      ></div>
-    </div>
-  </div>
-</div>
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/agent/agent.general.html/agent.general.html b/public/src/js/modules/main/apps/dashboards/views/general/agent/agent.general.html/agent.general.html
new file mode 100644
index 0000000..d10e30e
--- /dev/null
+++ b/public/src/js/modules/main/apps/dashboards/views/general/agent/agent.general.html/agent.general.html
@@ -0,0 +1,139 @@
+<div id="agent-general" layout="column">
+  <div layout="row" layout-align="start center" class="md-primary-bg">
+    <md-button
+      class="md-raised no-margin width-50"
+      style="border-radius: 0px"
+      ng-class="{'md-primary': !vm.isActiveTab(0)}"
+      ng-click="vm.onClickTab(0)"
+      aria-label="home"
+    >
+      <md-tooltip md-direction="bottom" md-delay="500">Home</md-tooltip>
+      <md-icon md-font-icon="icon-home" class="icon"></md-icon>
+    </md-button>
+
+    <ms-tab-scroll style="overflow: hidden">
+      <div
+        layout="column"
+        ng-repeat="(key, tab) in vm.tabs"
+        ng-click="vm.onClickTab(tab.id)"
+        ng-class="{'grey-50-bg': vm.isActiveTab(tab.id)}"
+      >
+        <div
+          style="height: 34px"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-icon
+            md-font-icon="{{tab.icon}}"
+            class="icon s16 margin-horizontal-5"
+            ng-class="tab.color + '-fg'"
+          >
+          </md-icon>
+          <span
+            class="text-truncate font-size-12"
+            ng-class="vm.isActiveTab(tab.id) ? 'black-fg' : 'grey-300-fg'"
+          >
+            {{tab.title}}
+            <span ng-if="tab.badges" class="badge md-white-fg md-red-bg"
+              >{{tab.badges}}</span
+            ></span
+          >
+          <md-button
+            class="md-icon-button md-mini no-margin"
+            ng-class="vm.isActiveTab(tab.id) ? 'md-primary' : 'grey-300-fg'"
+            aria-label="close"
+            ng-click="vm.closeTab(tab)"
+          >
+            <md-icon
+              md-font-icon="icon-close-circle-outline"
+              class="icon s16"
+            ></md-icon>
+          </md-button>
+        </div>
+        <div
+          style="height: 2px"
+          ng-class="vm.isActiveTab(tab.id) ? tab.color + '-bg' : ''"
+        ></div>
+      </div>
+    </ms-tab-scroll>
+  </div>
+  <div
+    layout="row"
+    class="agent-content"
+    ng-if="vm.isActiveTab(0)"
+    ng-style="{'top': vm.detectBrowser.browser == 'safari' ? '100px' : '36px'}"
+    ng-include="'app/main/apps/dashboards/views/general/agent/home/agent.general.home.html'"
+    ng-controller="AgentGeneralHomeController as vm_home"
+    ng-init="vm_home.init(vm.license, vm.setting)"
+  ></div>
+  <div
+    ng-if="!vm.isActiveTab(0)"
+    ng-repeat="(key, tab) in vm.tabs"
+    ng-switch="tab.type"
+  >
+    <div ng-switch-when="contact">
+      <div
+        class="agent-content"
+        ms-scroll
+        ng-if="vm.isActiveTab(tab.id)"
+        ng-style="{'top': vm.detectBrowser.browser == 'safari' ? '100px' : '36px'}"
+        ng-include="'app/main/apps/dashboards/views/general/agent/contact/agent.general.contact.html'"
+        ng-controller="AgentGeneralContactController as vm"
+        ng-init="vm.init(tab,$parent.vm.license)"
+      ></div>
+    </div>
+    <div ng-switch-when="popup">
+      <div
+        ng-if="vm.isActiveTab(tab.id)"
+        ms-scroll
+        ng-include="'app/main/apps/dashboards/views/general/agent/popup/agent.general.popup.html'"
+        ng-controller="AgentGeneralPopupController as vm"
+        ng-init="vm.init(tab)"
+      ></div>
+    </div>
+    <div ng-switch-when="jscripty">
+      <div
+        class="agent-content"
+        ms-scroll
+        ng-if="vm.isActiveTab(tab.id)"
+        ng-style="{'top': vm.detectBrowser.browser == 'safari' ? '100px' : '36px'}"
+        ng-include="'app/main/apps/dashboards/views/general/agent/jscripty/agent.general.jscripty.html'"
+        ng-controller="AgentGeneralJscriptyController as vm"
+        ng-init="vm.init(tab)"
+      ></div>
+    </div>
+    <div ng-switch-when="bot">
+      <div
+        id="interaction-app"
+        ng-if="vm.isActiveTab(tab.id)"
+        class="agent-content"
+        ng-style="{'top': vm.detectBrowser.browser == 'safari' ? '100px' : '36px'}"
+        ng-include="'app/main/apps/dashboards/views/general/agent/bot/agent.general.bot.html'"
+        ng-controller="AgentGeneralBotController as vm"
+        ng-init="vm.init(tab, $parent.vm.setting)"
+      ></div>
+    </div>
+    <div ng-switch-when="interaction">
+      <div
+        id="interaction-app"
+        ng-if="vm.isActiveTab(tab.id)"
+        class="agent-content"
+        ng-style="{'top': vm.detectBrowser.browser == 'safari' ? '100px' : '36px'}"
+        ng-include="'app/main/apps/dashboards/views/general/agent/interaction/agent.general.interaction.html'"
+        ng-controller="AgentGeneralInteractionController as vm"
+        ng-init="vm.init(tab, $parent.vm.setting)"
+      ></div>
+    </div>
+    <div ng-switch-when="iframe">
+      <div
+        id="iframe"
+        ng-if="vm.isActiveTab(tab.id)"
+        class="agent-content"
+        ng-style="{'top': vm.detectBrowser.browser == 'safari' ? '100px' : '36px'}"
+        ng-include="'app/main/apps/dashboards/views/general/agent/iframe/agent.general.iframe.html'"
+        ng-controller="AgentGeneralIframeController as vm"
+        ng-init="vm.init(tab, $parent.vm.setting)"
+      ></div>
+    </div>
+  </div>
+</div>
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/agent/contact/dispose/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/dashboards/views/general/agent/contact/dispose/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 398d39d..0000000
--- a/public/src/js/modules/main/apps/dashboards/views/general/agent/contact/dispose/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,285 +0,0 @@
-<md-dialog class="agent-dialog" aria-label="agent dispose">
-  <form name="disposition" class="md-inline-form" novalidate>
-    <md-toolbar class="md-background-bg">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title" translate="DASHBOARDS.DISPOSE"></span>
-        <md-button
-          class="md-icon-button"
-          ng-click="vm.closeDialog()"
-          ng-if="!vm.call.mandatoryDisposition"
-        >
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content ms-scroll>
-      <div ng-if="!vm.isReschedule">
-        <md-input-container class="md-block">
-          <label translate="DASHBOARDS.DISPOSITION">Disposition</label>
-          <md-select
-            name="disposition"
-            ng-model="vm.firstLevelDisposition"
-            ng-change="vm.onDispositionChange('first')"
-            required
-          >
-            <md-option
-              ng-value="disposition"
-              ng-repeat="disposition in vm.dispositions | filter: { level: 'first' }"
-            >
-              {{ disposition.name }}</md-option
-            >
-            <md-option
-              ng-value="globalDisposition"
-              ng-repeat="globalDisposition in vm.globalDispositions | filter: { level: 'first' }"
-            >
-              {{ globalDisposition.name }}</md-option
-            >
-          </md-select>
-          <div
-            ng-messages="dispositionForm.disposition.$error"
-            ng-show="dispositionForm.disposition.$touched"
-            role="alert"
-          >
-            <div ng-message="required">
-              <span translate="DASHBOARDS.ERRORS.DISPOSITION_REQUIRED"
-                >Disposition field is required</span
-              >
-            </div>
-          </div>
-        </md-input-container>
-        <div
-          ng-if="vm.firstLevelDisposition && vm.anySecondLevelDisposition"
-          layout="row"
-          layout-align="start center"
-        >
-          <md-input-container class="md-block" flex>
-            <label translate="DASHBOARDS.SECOND_LEVEL_DISPOSITION"
-              >Second Level Disposition</label
-            >
-            <md-select
-              name="secondLevelDisposition"
-              ng-model="vm.secondLevelDisposition"
-              ng-change="vm.onDispositionChange('second')"
-            >
-              <md-option
-                ng-value="disposition"
-                ng-repeat="disposition in vm.dispositions | filter: { level: 'second', ParentId: vm.firstLevelDisposition.id }"
-              >
-                {{ disposition.name }}</md-option
-              >
-              <md-option
-                ng-value="globalDisposition"
-                ng-repeat="globalDisposition in vm.globalDispositions | filter: { level: 'second', ParentId: vm.firstLevelDisposition.id }"
-              >
-                {{ globalDisposition.name }}</md-option
-              >
-            </md-select>
-          </md-input-container>
-          <md-button
-            ng-if="vm.secondLevelDisposition"
-            ng-click="vm.clearDispositionSelection('second')"
-            class="md-icon-button"
-          >
-            <md-icon
-              md-font-icon="icon-cancel"
-              aria-label="Clear second level disposition selection"
-            >
-            </md-icon>
-          </md-button>
-        </div>
-        <div
-          ng-if="vm.secondLevelDisposition && vm.anyThirdLevelDisposition"
-          layout="row"
-          layout-align="start center"
-        >
-          <md-input-container class="md-block" flex>
-            <label translate="DASHBOARDS.THIRD_LEVEL_DISPOSITION"
-              >Third Level Disposition</label
-            >
-            <md-select
-              name="thirdLevelDisposition"
-              ng-model="vm.thirdLevelDisposition"
-              ng-change="vm.onDispositionChange('third')"
-            >
-              <md-option
-                ng-value="disposition"
-                ng-repeat="disposition in vm.dispositions | filter: { level: 'third', ParentId: vm.secondLevelDisposition.id }"
-              >
-                {{ disposition.name }}</md-option
-              >
-              <md-option
-                ng-value="globalDisposition"
-                ng-repeat="globalDisposition in vm.globalDispositions | filter: { level: 'third', ParentId: vm.secondLevelDisposition.id }"
-              >
-                {{ globalDisposition.name }}</md-option
-              >
-            </md-select>
-          </md-input-container>
-          <md-button
-            ng-if="vm.thirdLevelDisposition"
-            ng-click="vm.clearDispositionSelection('third')"
-            class="md-icon-button"
-          >
-            <md-icon
-              md-font-icon="icon-cancel"
-              aria-label="Clear third level disposition selection"
-            >
-            </md-icon>
-          </md-button>
-        </div>
-        <md-input-container class="md-block">
-          <label translate="DASHBOARDS.NOTE">Note</label>
-          <textarea
-            ng-model="vm.note"
-            md-maxlength="255"
-            max-rows="5"
-            autofocus
-          ></textarea>
-        </md-input-container>
-      </div>
-      <div ng-if="vm.isReschedule">
-        <div layout="row">
-          <div flex class="md-block">
-            <mdp-date-picker
-              mdp-open-on-click
-              required
-              name="date"
-              mdp-placeholder="Date"
-              mdp-format="YYYY-MM-DD"
-              mdp-min-date="vm.hopper.minDate"
-              ng-model="vm.hopper.dateTime"
-            >
-              <div
-                ng-messages="disposition.date.$error"
-                ng-show="disposition.date.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="DASHBOARDS.ERRORS.DATE_REQUIRED"
-                    >Date is required</span
-                  >
-                </div>
-                <div ng-message="format">
-                  <span translate="DASHBOARDS.ERRORS.DATE_INVALID"
-                    >Date is invalid</span
-                  >
-                </div>
-              </div>
-            </mdp-date-picker>
-          </div>
-
-          <div flex class="md-block">
-            <mdp-time-picker
-              mdp-open-on-click
-              required
-              name="time"
-              mdp-placeholder="Time"
-              mdp-format="HH:mm:ss"
-              mdp-auto-switch="true"
-              ng-model="vm.hopper.dateTime"
-            >
-              <div
-                ng-messages="disposition.time.$error"
-                ng-show="disposition.time.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="DASHBOARDS.ERRORS.TIME_REQUIRED"
-                    >Time is required</span
-                  >
-                </div>
-                <div ng-message="format">
-                  <span translate="DASHBOARDS.ERRORS.TIME_INVALID"
-                    >Time is invalid</span
-                  >
-                </div>
-              </div>
-            </mdp-time-picker>
-          </div>
-        </div>
-        <md-input-container ng-if="!vm.dialerCall" class="md-block">
-          <label translate="DASHBOARDS.CAMPAIGN">Campaign</label>
-          <md-select name="queueCampaign" ng-model="vm.queueCampaign" required>
-            <md-option
-              ng-value="queueCampaign"
-              ng-repeat="queueCampaign in vm.queueCampaigns.rows"
-            >
-              {{ queueCampaign.name }} ({{ queueCampaign.dialActive ? 'Active' :
-              'Not Active' }})</md-option
-            >
-          </md-select>
-          <div
-            ng-messages="disposition.queueCampaign.$error"
-            ng-show="disposition.queueCampaign.$touched"
-            role="alert"
-          >
-            <div ng-message="required">
-              <span translate="DASHBOARDS.ERRORS.CAMPAIGN_REQUIRED"
-                >Campaign field is required</span
-              >
-            </div>
-          </div>
-        </md-input-container>
-      </div>
-    </md-dialog-content>
-    <md-dialog-actions ng-if="!vm.isReschedule" layout="row">
-      <md-button
-        ng-disabled="disposition.$invalid || disposition.$pristine"
-        class="send-button md-raised md-accent"
-        ng-click="vm.saveDisposition()"
-      >
-        {{(vm.selectedDisposition.name ? 'DASHBOARDS.DISPOSE' :
-        'DASHBOARDS.SAVE') | translate}}
-      </md-button>
-      <md-button
-        class="send-button md-raised md-primary"
-        translate="DASHBOARDS.RESCHEDULE"
-        ng-click="vm.saveDisposition('reschedule')"
-      >
-        Reschedule
-      </md-button>
-      <md-button
-        class="send-button md-accent md-raised"
-        translate="DASHBOARDS.RECALLME"
-        ng-click="vm.saveDisposition('recallme')"
-      >
-        Recall Me
-      </md-button>
-      <span flex></span>
-      <md-button
-        ng-if="vm.hasBlackLists"
-        class="md-raised md-warn"
-        translate="DASHBOARDS.BLACKLIST"
-        ng-click="vm.saveDisposition('blacklist')"
-      >
-        Blacklist
-      </md-button>
-    </md-dialog-actions>
-    <md-dialog-actions
-      ng-if="vm.isReschedule"
-      layout="row"
-      layout-align="space-between center"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-click="vm.saveReschedule()"
-          class="send-button md-accent md-raised"
-          ng-disabled="disposition.$invalid || disposition.$pristine || vm.disable"
-          aria-label="SAVE"
-          translate="DASHBOARDS.SAVE"
-          translate-attr-aria-label="DASHBOARDS.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/agent/contact/dispose/dialog.html/dialog.html b/public/src/js/modules/main/apps/dashboards/views/general/agent/contact/dispose/dialog.html/dialog.html
new file mode 100644
index 0000000..398d39d
--- /dev/null
+++ b/public/src/js/modules/main/apps/dashboards/views/general/agent/contact/dispose/dialog.html/dialog.html
@@ -0,0 +1,285 @@
+<md-dialog class="agent-dialog" aria-label="agent dispose">
+  <form name="disposition" class="md-inline-form" novalidate>
+    <md-toolbar class="md-background-bg">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title" translate="DASHBOARDS.DISPOSE"></span>
+        <md-button
+          class="md-icon-button"
+          ng-click="vm.closeDialog()"
+          ng-if="!vm.call.mandatoryDisposition"
+        >
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content ms-scroll>
+      <div ng-if="!vm.isReschedule">
+        <md-input-container class="md-block">
+          <label translate="DASHBOARDS.DISPOSITION">Disposition</label>
+          <md-select
+            name="disposition"
+            ng-model="vm.firstLevelDisposition"
+            ng-change="vm.onDispositionChange('first')"
+            required
+          >
+            <md-option
+              ng-value="disposition"
+              ng-repeat="disposition in vm.dispositions | filter: { level: 'first' }"
+            >
+              {{ disposition.name }}</md-option
+            >
+            <md-option
+              ng-value="globalDisposition"
+              ng-repeat="globalDisposition in vm.globalDispositions | filter: { level: 'first' }"
+            >
+              {{ globalDisposition.name }}</md-option
+            >
+          </md-select>
+          <div
+            ng-messages="dispositionForm.disposition.$error"
+            ng-show="dispositionForm.disposition.$touched"
+            role="alert"
+          >
+            <div ng-message="required">
+              <span translate="DASHBOARDS.ERRORS.DISPOSITION_REQUIRED"
+                >Disposition field is required</span
+              >
+            </div>
+          </div>
+        </md-input-container>
+        <div
+          ng-if="vm.firstLevelDisposition && vm.anySecondLevelDisposition"
+          layout="row"
+          layout-align="start center"
+        >
+          <md-input-container class="md-block" flex>
+            <label translate="DASHBOARDS.SECOND_LEVEL_DISPOSITION"
+              >Second Level Disposition</label
+            >
+            <md-select
+              name="secondLevelDisposition"
+              ng-model="vm.secondLevelDisposition"
+              ng-change="vm.onDispositionChange('second')"
+            >
+              <md-option
+                ng-value="disposition"
+                ng-repeat="disposition in vm.dispositions | filter: { level: 'second', ParentId: vm.firstLevelDisposition.id }"
+              >
+                {{ disposition.name }}</md-option
+              >
+              <md-option
+                ng-value="globalDisposition"
+                ng-repeat="globalDisposition in vm.globalDispositions | filter: { level: 'second', ParentId: vm.firstLevelDisposition.id }"
+              >
+                {{ globalDisposition.name }}</md-option
+              >
+            </md-select>
+          </md-input-container>
+          <md-button
+            ng-if="vm.secondLevelDisposition"
+            ng-click="vm.clearDispositionSelection('second')"
+            class="md-icon-button"
+          >
+            <md-icon
+              md-font-icon="icon-cancel"
+              aria-label="Clear second level disposition selection"
+            >
+            </md-icon>
+          </md-button>
+        </div>
+        <div
+          ng-if="vm.secondLevelDisposition && vm.anyThirdLevelDisposition"
+          layout="row"
+          layout-align="start center"
+        >
+          <md-input-container class="md-block" flex>
+            <label translate="DASHBOARDS.THIRD_LEVEL_DISPOSITION"
+              >Third Level Disposition</label
+            >
+            <md-select
+              name="thirdLevelDisposition"
+              ng-model="vm.thirdLevelDisposition"
+              ng-change="vm.onDispositionChange('third')"
+            >
+              <md-option
+                ng-value="disposition"
+                ng-repeat="disposition in vm.dispositions | filter: { level: 'third', ParentId: vm.secondLevelDisposition.id }"
+              >
+                {{ disposition.name }}</md-option
+              >
+              <md-option
+                ng-value="globalDisposition"
+                ng-repeat="globalDisposition in vm.globalDispositions | filter: { level: 'third', ParentId: vm.secondLevelDisposition.id }"
+              >
+                {{ globalDisposition.name }}</md-option
+              >
+            </md-select>
+          </md-input-container>
+          <md-button
+            ng-if="vm.thirdLevelDisposition"
+            ng-click="vm.clearDispositionSelection('third')"
+            class="md-icon-button"
+          >
+            <md-icon
+              md-font-icon="icon-cancel"
+              aria-label="Clear third level disposition selection"
+            >
+            </md-icon>
+          </md-button>
+        </div>
+        <md-input-container class="md-block">
+          <label translate="DASHBOARDS.NOTE">Note</label>
+          <textarea
+            ng-model="vm.note"
+            md-maxlength="255"
+            max-rows="5"
+            autofocus
+          ></textarea>
+        </md-input-container>
+      </div>
+      <div ng-if="vm.isReschedule">
+        <div layout="row">
+          <div flex class="md-block">
+            <mdp-date-picker
+              mdp-open-on-click
+              required
+              name="date"
+              mdp-placeholder="Date"
+              mdp-format="YYYY-MM-DD"
+              mdp-min-date="vm.hopper.minDate"
+              ng-model="vm.hopper.dateTime"
+            >
+              <div
+                ng-messages="disposition.date.$error"
+                ng-show="disposition.date.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="DASHBOARDS.ERRORS.DATE_REQUIRED"
+                    >Date is required</span
+                  >
+                </div>
+                <div ng-message="format">
+                  <span translate="DASHBOARDS.ERRORS.DATE_INVALID"
+                    >Date is invalid</span
+                  >
+                </div>
+              </div>
+            </mdp-date-picker>
+          </div>
+
+          <div flex class="md-block">
+            <mdp-time-picker
+              mdp-open-on-click
+              required
+              name="time"
+              mdp-placeholder="Time"
+              mdp-format="HH:mm:ss"
+              mdp-auto-switch="true"
+              ng-model="vm.hopper.dateTime"
+            >
+              <div
+                ng-messages="disposition.time.$error"
+                ng-show="disposition.time.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="DASHBOARDS.ERRORS.TIME_REQUIRED"
+                    >Time is required</span
+                  >
+                </div>
+                <div ng-message="format">
+                  <span translate="DASHBOARDS.ERRORS.TIME_INVALID"
+                    >Time is invalid</span
+                  >
+                </div>
+              </div>
+            </mdp-time-picker>
+          </div>
+        </div>
+        <md-input-container ng-if="!vm.dialerCall" class="md-block">
+          <label translate="DASHBOARDS.CAMPAIGN">Campaign</label>
+          <md-select name="queueCampaign" ng-model="vm.queueCampaign" required>
+            <md-option
+              ng-value="queueCampaign"
+              ng-repeat="queueCampaign in vm.queueCampaigns.rows"
+            >
+              {{ queueCampaign.name }} ({{ queueCampaign.dialActive ? 'Active' :
+              'Not Active' }})</md-option
+            >
+          </md-select>
+          <div
+            ng-messages="disposition.queueCampaign.$error"
+            ng-show="disposition.queueCampaign.$touched"
+            role="alert"
+          >
+            <div ng-message="required">
+              <span translate="DASHBOARDS.ERRORS.CAMPAIGN_REQUIRED"
+                >Campaign field is required</span
+              >
+            </div>
+          </div>
+        </md-input-container>
+      </div>
+    </md-dialog-content>
+    <md-dialog-actions ng-if="!vm.isReschedule" layout="row">
+      <md-button
+        ng-disabled="disposition.$invalid || disposition.$pristine"
+        class="send-button md-raised md-accent"
+        ng-click="vm.saveDisposition()"
+      >
+        {{(vm.selectedDisposition.name ? 'DASHBOARDS.DISPOSE' :
+        'DASHBOARDS.SAVE') | translate}}
+      </md-button>
+      <md-button
+        class="send-button md-raised md-primary"
+        translate="DASHBOARDS.RESCHEDULE"
+        ng-click="vm.saveDisposition('reschedule')"
+      >
+        Reschedule
+      </md-button>
+      <md-button
+        class="send-button md-accent md-raised"
+        translate="DASHBOARDS.RECALLME"
+        ng-click="vm.saveDisposition('recallme')"
+      >
+        Recall Me
+      </md-button>
+      <span flex></span>
+      <md-button
+        ng-if="vm.hasBlackLists"
+        class="md-raised md-warn"
+        translate="DASHBOARDS.BLACKLIST"
+        ng-click="vm.saveDisposition('blacklist')"
+      >
+        Blacklist
+      </md-button>
+    </md-dialog-actions>
+    <md-dialog-actions
+      ng-if="vm.isReschedule"
+      layout="row"
+      layout-align="space-between center"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-click="vm.saveReschedule()"
+          class="send-button md-accent md-raised"
+          ng-disabled="disposition.$invalid || disposition.$pristine || vm.disable"
+          aria-label="SAVE"
+          translate="DASHBOARDS.SAVE"
+          translate-attr-aria-label="DASHBOARDS.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/agent/contact/selection/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/dashboards/views/general/agent/contact/selection/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 39935a7..0000000
--- a/public/src/js/modules/main/apps/dashboards/views/general/agent/contact/selection/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,122 +0,0 @@
-<md-dialog
-  ng-init="vm.onInit()"
-  class="contact-trigger-dialog"
-  aria-label="Select contact"
->
-  <md-toolbar class="red-bg">
-    <div
-      class="md-toolbar-tools"
-      layout="row"
-      layout-align="space-between center"
-    >
-      <span class="title">{{ 'DASHBOARDS.SELECT_CONTACT' | translate }}</span>
-    </div>
-  </md-toolbar>
-  <md-dialog-content class="h-400 pv-16" ms-scroll>
-    <div layout="row" class="p-10">
-      <span class="font-size-16"
-        >{{ 'DASHBOARDS.MULTIPLE_CONTACTS_FOUND' | translate }}<strong
-          >&nbsp;{{ vm.callNumber }}</strong
-        >.</span
-      >
-      <span class="font-size-16"
-        >&nbsp;{{ 'DASHBOARDS.WHICH_ONE_TO_USE' | translate }}</span
-      >
-    </div>
-    <md-grid-list
-      md-cols-xs="1"
-      md-cols="2"
-      md-row-height="fit"
-      ng-class="vm.paginatedContacts[vm.page - 1].length > 2 ? 'two-rows-layout' : 'one-row-layout'"
-      flex
-    >
-      <md-grid-tile
-        ng-repeat="contact in vm.paginatedContacts[vm.page - 1]"
-        md-rowspan="1"
-      >
-        <md-card
-          layout="column"
-          class="contact-info"
-          no-padding
-          no-margin
-          ng-click="vm.selectedContact = contact;"
-          ng-class="{ 'light-blue-50-bg' : vm.selectedContact && vm.selectedContact.id === contact.id }"
-          flex
-        >
-          <md-card-title class="pt-16">
-            <md-card-title-text layout-align="center start">
-              <span class="font-size-16 text-bold"
-                >#{{ contact.id }} - {{ contact.firstName }} {{ contact.lastName
-                }}</span
-              >
-              <em class="font-size-12"
-                >{{ 'DASHBOARDS.LAST_UPDATED' | translate }}: {{
-                contact.updatedAt }}</em
-              >
-              <span class="font-size-12"
-                >{{ 'DASHBOARDS.LIST' | translate }}: {{
-                vm.lists[contact.ListId] }}</span
-              >
-            </md-card-title-text>
-            <md-button class="md-icon-button no-margin" aria-label="Selected">
-              <md-icon
-                md-font-icon="{{ vm.selectedContact && vm.selectedContact.id === contact.id ? 'icon-checkbox-marked-circle' : 'icon-checkbox-blank-circle-outline' }}"
-                ng-class="{ 'green-fg': vm.selectedContact && vm.selectedContact.id === contact.id }"
-              ></md-icon>
-            </md-button>
-          </md-card-title>
-          <md-divider></md-divider>
-          <md-card-content
-            layout="row"
-            layout-align="center start"
-            class="p-10"
-          >
-            <span class="font-size-16"
-              >{{ 'DASHBOARDS.MATCHING_FIELD' | translate }}:
-              <strong>{{ contact.matchingField }}</strong>
-            </span>
-          </md-card-content>
-        </md-card>
-      </md-grid-tile>
-    </md-grid-list>
-  </md-dialog-content>
-  <md-dialog-actions layout="row">
-    <div
-      ng-if="vm.paginatedContacts.length > 1"
-      layout="row"
-      layout-align="center center"
-      flex
-    >
-      <md-button
-        ng-click="vm.page = vm.page - 1;"
-        class="md-icon-button no-margin"
-        ng-class="{ 'hidden': vm.page <= 1 }"
-        aria-label="Previous page"
-      >
-        <md-icon md-font-icon="icon-chevron-double-left"></md-icon>
-      </md-button>
-      <span
-        >{{ 'DASHBOARDS.PAGE' | translate }} {{ vm.page }} {{ 'DASHBOARDS.OF' |
-        translate }} {{ vm.paginatedContacts.length }}</span
-      >
-      <md-button
-        ng-click="vm.page = vm.page + 1;"
-        class="md-icon-button no-margin"
-        ng-class="{ 'hidden': !vm.paginatedContacts[vm.page] }"
-        aria-label="Next page"
-      >
-        <md-icon md-font-icon="icon-chevron-double-right"></md-icon>
-      </md-button>
-    </div>
-    <md-button
-      ng-click="vm.selectContact()"
-      class="select-button md-accent md-raised"
-      ng-disabled="!vm.selectedContact"
-      aria-label="Select"
-      translate="DASHBOARDS.SELECT"
-      translate-attr-aria-label="DASHBOARDS.SELECT"
-    >
-      SELECT
-    </md-button>
-  </md-dialog-actions> </md-dialog
->vc
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/agent/contact/selection/dialog.html/dialog.html b/public/src/js/modules/main/apps/dashboards/views/general/agent/contact/selection/dialog.html/dialog.html
new file mode 100644
index 0000000..39935a7
--- /dev/null
+++ b/public/src/js/modules/main/apps/dashboards/views/general/agent/contact/selection/dialog.html/dialog.html
@@ -0,0 +1,122 @@
+<md-dialog
+  ng-init="vm.onInit()"
+  class="contact-trigger-dialog"
+  aria-label="Select contact"
+>
+  <md-toolbar class="red-bg">
+    <div
+      class="md-toolbar-tools"
+      layout="row"
+      layout-align="space-between center"
+    >
+      <span class="title">{{ 'DASHBOARDS.SELECT_CONTACT' | translate }}</span>
+    </div>
+  </md-toolbar>
+  <md-dialog-content class="h-400 pv-16" ms-scroll>
+    <div layout="row" class="p-10">
+      <span class="font-size-16"
+        >{{ 'DASHBOARDS.MULTIPLE_CONTACTS_FOUND' | translate }}<strong
+          >&nbsp;{{ vm.callNumber }}</strong
+        >.</span
+      >
+      <span class="font-size-16"
+        >&nbsp;{{ 'DASHBOARDS.WHICH_ONE_TO_USE' | translate }}</span
+      >
+    </div>
+    <md-grid-list
+      md-cols-xs="1"
+      md-cols="2"
+      md-row-height="fit"
+      ng-class="vm.paginatedContacts[vm.page - 1].length > 2 ? 'two-rows-layout' : 'one-row-layout'"
+      flex
+    >
+      <md-grid-tile
+        ng-repeat="contact in vm.paginatedContacts[vm.page - 1]"
+        md-rowspan="1"
+      >
+        <md-card
+          layout="column"
+          class="contact-info"
+          no-padding
+          no-margin
+          ng-click="vm.selectedContact = contact;"
+          ng-class="{ 'light-blue-50-bg' : vm.selectedContact && vm.selectedContact.id === contact.id }"
+          flex
+        >
+          <md-card-title class="pt-16">
+            <md-card-title-text layout-align="center start">
+              <span class="font-size-16 text-bold"
+                >#{{ contact.id }} - {{ contact.firstName }} {{ contact.lastName
+                }}</span
+              >
+              <em class="font-size-12"
+                >{{ 'DASHBOARDS.LAST_UPDATED' | translate }}: {{
+                contact.updatedAt }}</em
+              >
+              <span class="font-size-12"
+                >{{ 'DASHBOARDS.LIST' | translate }}: {{
+                vm.lists[contact.ListId] }}</span
+              >
+            </md-card-title-text>
+            <md-button class="md-icon-button no-margin" aria-label="Selected">
+              <md-icon
+                md-font-icon="{{ vm.selectedContact && vm.selectedContact.id === contact.id ? 'icon-checkbox-marked-circle' : 'icon-checkbox-blank-circle-outline' }}"
+                ng-class="{ 'green-fg': vm.selectedContact && vm.selectedContact.id === contact.id }"
+              ></md-icon>
+            </md-button>
+          </md-card-title>
+          <md-divider></md-divider>
+          <md-card-content
+            layout="row"
+            layout-align="center start"
+            class="p-10"
+          >
+            <span class="font-size-16"
+              >{{ 'DASHBOARDS.MATCHING_FIELD' | translate }}:
+              <strong>{{ contact.matchingField }}</strong>
+            </span>
+          </md-card-content>
+        </md-card>
+      </md-grid-tile>
+    </md-grid-list>
+  </md-dialog-content>
+  <md-dialog-actions layout="row">
+    <div
+      ng-if="vm.paginatedContacts.length > 1"
+      layout="row"
+      layout-align="center center"
+      flex
+    >
+      <md-button
+        ng-click="vm.page = vm.page - 1;"
+        class="md-icon-button no-margin"
+        ng-class="{ 'hidden': vm.page <= 1 }"
+        aria-label="Previous page"
+      >
+        <md-icon md-font-icon="icon-chevron-double-left"></md-icon>
+      </md-button>
+      <span
+        >{{ 'DASHBOARDS.PAGE' | translate }} {{ vm.page }} {{ 'DASHBOARDS.OF' |
+        translate }} {{ vm.paginatedContacts.length }}</span
+      >
+      <md-button
+        ng-click="vm.page = vm.page + 1;"
+        class="md-icon-button no-margin"
+        ng-class="{ 'hidden': !vm.paginatedContacts[vm.page] }"
+        aria-label="Next page"
+      >
+        <md-icon md-font-icon="icon-chevron-double-right"></md-icon>
+      </md-button>
+    </div>
+    <md-button
+      ng-click="vm.selectContact()"
+      class="select-button md-accent md-raised"
+      ng-disabled="!vm.selectedContact"
+      aria-label="Select"
+      translate="DASHBOARDS.SELECT"
+      translate-attr-aria-label="DASHBOARDS.SELECT"
+    >
+      SELECT
+    </md-button>
+  </md-dialog-actions> </md-dialog
+>vc
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/agent/home/abandoned/dispose/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/dashboards/views/general/agent/home/abandoned/dispose/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 379baf8..0000000
--- a/public/src/js/modules/main/apps/dashboards/views/general/agent/home/abandoned/dispose/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,157 +0,0 @@
-<md-dialog class="agent-dialog" aria-label="agent dispose">
-  <form name="disposition" class="md-inline-form" novalidate>
-    <md-toolbar class="md-background-bg">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title" translate="DASHBOARDS.DISPOSE"></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content ms-scroll>
-      <div>
-        <md-input-container class="md-block">
-          <label translate="DASHBOARDS.DISPOSITION">Disposition</label>
-          <md-select
-            name="disposition"
-            ng-model="vm.firstLevelDisposition"
-            ng-change="vm.onDispositionChange('first')"
-            required
-          >
-            <md-option
-              ng-value="disposition"
-              ng-repeat="disposition in vm.dispositions | filter: { level: 'first' }"
-            >
-              {{ disposition.name }}</md-option
-            >
-            <md-option
-              ng-value="globalDisposition"
-              ng-repeat="globalDisposition in vm.globalDispositions | filter: { level: 'first' }"
-            >
-              {{ globalDisposition.name }}</md-option
-            >
-          </md-select>
-          <div
-            ng-messages="dispositionForm.disposition.$error"
-            ng-show="dispositionForm.disposition.$touched"
-            role="alert"
-          >
-            <div ng-message="required">
-              <span translate="DASHBOARDS.ERRORS.DISPOSITION_REQUIRED"
-                >Disposition field is required</span
-              >
-            </div>
-          </div>
-        </md-input-container>
-        <div
-          ng-if="vm.firstLevelDisposition && vm.anySecondLevelDisposition"
-          layout="row"
-          layout-align="start center"
-        >
-          <md-input-container class="md-block" flex>
-            <label translate="DASHBOARDS.SECOND_LEVEL_DISPOSITION"
-              >Second Level Disposition</label
-            >
-            <md-select
-              name="secondLevelDisposition"
-              ng-model="vm.secondLevelDisposition"
-              ng-change="vm.onDispositionChange('second')"
-            >
-              <md-option
-                ng-value="disposition"
-                ng-repeat="disposition in vm.dispositions | filter: { level: 'second', ParentId: vm.firstLevelDisposition.id }"
-              >
-                {{ disposition.name }}</md-option
-              >
-              <md-option
-                ng-value="globalDisposition"
-                ng-repeat="globalDisposition in vm.globalDispositions | filter: { level: 'second', ParentId: vm.firstLevelDisposition.id }"
-              >
-                {{ globalDisposition.name }}</md-option
-              >
-            </md-select>
-          </md-input-container>
-          <md-button
-            ng-if="vm.secondLevelDisposition"
-            ng-click="vm.clearDispositionSelection('second')"
-            class="md-icon-button"
-          >
-            <md-icon
-              md-font-icon="icon-cancel"
-              aria-label="Clear second level disposition selection"
-            >
-            </md-icon>
-          </md-button>
-        </div>
-        <div
-          ng-if="vm.secondLevelDisposition && vm.anyThirdLevelDisposition"
-          layout="row"
-          layout-align="start center"
-        >
-          <md-input-container class="md-block" flex>
-            <label translate="DASHBOARDS.THIRD_LEVEL_DISPOSITION"
-              >Third Level Disposition</label
-            >
-            <md-select
-              name="thirdLevelDisposition"
-              ng-model="vm.thirdLevelDisposition"
-              ng-change="vm.onDispositionChange('third')"
-            >
-              <md-option
-                ng-value="disposition"
-                ng-repeat="disposition in vm.dispositions | filter: { level: 'third', ParentId: vm.secondLevelDisposition.id }"
-              >
-                {{ disposition.name }}</md-option
-              >
-              <md-option
-                ng-value="globalDisposition"
-                ng-repeat="globalDisposition in vm.globalDispositions | filter: { level: 'third', ParentId: vm.secondLevelDisposition.id }"
-              >
-                {{ globalDisposition.name }}</md-option
-              >
-            </md-select>
-          </md-input-container>
-          <md-button
-            ng-if="vm.thirdLevelDisposition"
-            ng-click="vm.clearDispositionSelection('third')"
-            class="md-icon-button"
-          >
-            <md-icon
-              md-font-icon="icon-cancel"
-              aria-label="Clear third level disposition selection"
-            >
-            </md-icon>
-          </md-button>
-        </div>
-        <md-input-container class="md-block">
-          <label translate="DASHBOARDS.NOTE">Note</label>
-          <textarea
-            ng-model="vm.note"
-            md-maxlength="255"
-            max-rows="5"
-            autofocus
-          ></textarea>
-        </md-input-container>
-      </div>
-    </md-dialog-content>
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          ng-disabled="disposition.$invalid || disposition.$pristine"
-          class="send-button md-raised md-accent"
-          ng-click="vm.saveDisposition()"
-        >
-          {{(vm.selectedDisposition.name ? 'DASHBOARDS.DISPOSE' :
-          'DASHBOARDS.SAVE') | translate}}
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/agent/home/abandoned/dispose/dialog.html/dialog.html b/public/src/js/modules/main/apps/dashboards/views/general/agent/home/abandoned/dispose/dialog.html/dialog.html
new file mode 100644
index 0000000..379baf8
--- /dev/null
+++ b/public/src/js/modules/main/apps/dashboards/views/general/agent/home/abandoned/dispose/dialog.html/dialog.html
@@ -0,0 +1,157 @@
+<md-dialog class="agent-dialog" aria-label="agent dispose">
+  <form name="disposition" class="md-inline-form" novalidate>
+    <md-toolbar class="md-background-bg">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title" translate="DASHBOARDS.DISPOSE"></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content ms-scroll>
+      <div>
+        <md-input-container class="md-block">
+          <label translate="DASHBOARDS.DISPOSITION">Disposition</label>
+          <md-select
+            name="disposition"
+            ng-model="vm.firstLevelDisposition"
+            ng-change="vm.onDispositionChange('first')"
+            required
+          >
+            <md-option
+              ng-value="disposition"
+              ng-repeat="disposition in vm.dispositions | filter: { level: 'first' }"
+            >
+              {{ disposition.name }}</md-option
+            >
+            <md-option
+              ng-value="globalDisposition"
+              ng-repeat="globalDisposition in vm.globalDispositions | filter: { level: 'first' }"
+            >
+              {{ globalDisposition.name }}</md-option
+            >
+          </md-select>
+          <div
+            ng-messages="dispositionForm.disposition.$error"
+            ng-show="dispositionForm.disposition.$touched"
+            role="alert"
+          >
+            <div ng-message="required">
+              <span translate="DASHBOARDS.ERRORS.DISPOSITION_REQUIRED"
+                >Disposition field is required</span
+              >
+            </div>
+          </div>
+        </md-input-container>
+        <div
+          ng-if="vm.firstLevelDisposition && vm.anySecondLevelDisposition"
+          layout="row"
+          layout-align="start center"
+        >
+          <md-input-container class="md-block" flex>
+            <label translate="DASHBOARDS.SECOND_LEVEL_DISPOSITION"
+              >Second Level Disposition</label
+            >
+            <md-select
+              name="secondLevelDisposition"
+              ng-model="vm.secondLevelDisposition"
+              ng-change="vm.onDispositionChange('second')"
+            >
+              <md-option
+                ng-value="disposition"
+                ng-repeat="disposition in vm.dispositions | filter: { level: 'second', ParentId: vm.firstLevelDisposition.id }"
+              >
+                {{ disposition.name }}</md-option
+              >
+              <md-option
+                ng-value="globalDisposition"
+                ng-repeat="globalDisposition in vm.globalDispositions | filter: { level: 'second', ParentId: vm.firstLevelDisposition.id }"
+              >
+                {{ globalDisposition.name }}</md-option
+              >
+            </md-select>
+          </md-input-container>
+          <md-button
+            ng-if="vm.secondLevelDisposition"
+            ng-click="vm.clearDispositionSelection('second')"
+            class="md-icon-button"
+          >
+            <md-icon
+              md-font-icon="icon-cancel"
+              aria-label="Clear second level disposition selection"
+            >
+            </md-icon>
+          </md-button>
+        </div>
+        <div
+          ng-if="vm.secondLevelDisposition && vm.anyThirdLevelDisposition"
+          layout="row"
+          layout-align="start center"
+        >
+          <md-input-container class="md-block" flex>
+            <label translate="DASHBOARDS.THIRD_LEVEL_DISPOSITION"
+              >Third Level Disposition</label
+            >
+            <md-select
+              name="thirdLevelDisposition"
+              ng-model="vm.thirdLevelDisposition"
+              ng-change="vm.onDispositionChange('third')"
+            >
+              <md-option
+                ng-value="disposition"
+                ng-repeat="disposition in vm.dispositions | filter: { level: 'third', ParentId: vm.secondLevelDisposition.id }"
+              >
+                {{ disposition.name }}</md-option
+              >
+              <md-option
+                ng-value="globalDisposition"
+                ng-repeat="globalDisposition in vm.globalDispositions | filter: { level: 'third', ParentId: vm.secondLevelDisposition.id }"
+              >
+                {{ globalDisposition.name }}</md-option
+              >
+            </md-select>
+          </md-input-container>
+          <md-button
+            ng-if="vm.thirdLevelDisposition"
+            ng-click="vm.clearDispositionSelection('third')"
+            class="md-icon-button"
+          >
+            <md-icon
+              md-font-icon="icon-cancel"
+              aria-label="Clear third level disposition selection"
+            >
+            </md-icon>
+          </md-button>
+        </div>
+        <md-input-container class="md-block">
+          <label translate="DASHBOARDS.NOTE">Note</label>
+          <textarea
+            ng-model="vm.note"
+            md-maxlength="255"
+            max-rows="5"
+            autofocus
+          ></textarea>
+        </md-input-container>
+      </div>
+    </md-dialog-content>
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          ng-disabled="disposition.$invalid || disposition.$pristine"
+          class="send-button md-raised md-accent"
+          ng-click="vm.saveDisposition()"
+        >
+          {{(vm.selectedDisposition.name ? 'DASHBOARDS.DISPOSE' :
+          'DASHBOARDS.SAVE') | translate}}
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/agent/home/voice/details/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/dashboards/views/general/agent/home/voice/details/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index e5628fe..0000000
--- a/public/src/js/modules/main/apps/dashboards/views/general/agent/home/voice/details/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,140 +0,0 @@
-<md-dialog class="details-dialog" aria-label="details">
-  <md-toolbar class="md-background-bg">
-    <div
-      class="md-toolbar-tools"
-      layout="row"
-      layout-align="space-between center"
-    >
-      <span
-        ng-if="!vm.interaction.closed"
-        class="title"
-        translate="VOICE.DETAILS"
-      ></span>
-      <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-        <md-icon md-font-icon="icon-close" aria-label="Close dialog"></md-icon>
-      </md-button>
-    </div>
-  </md-toolbar>
-
-  <md-dialog-content>
-    <md-list flex>
-      <md-list-item class="md-2-line">
-        <div class="md-list-item-text">
-          <p translate="VOICE.UNIQUEID">Uniqueid</p>
-          <h4>{{vm.call.uniqueid}}</h4>
-        </div>
-      </md-list-item>
-
-      <md-list-item class="md-2-line">
-        <div class="md-list-item-text">
-          <p translate="VOICE.TYPE">Type</p>
-          <h4>{{vm.call.type ? vm.call.type : 'no type'}}</h4>
-        </div>
-      </md-list-item>
-
-      <md-list-item class="md-2-line">
-        <div class="md-list-item-text">
-          <p translate="VOICE.SOURCE">Source</p>
-          <h4>{{vm.call.source ? vm.call.source : 'unknown'}}</h4>
-        </div>
-      </md-list-item>
-
-      <md-list-item class="md-2-line">
-        <div class="md-list-item-text">
-          <p translate="VOICE.DESTINATION">Destination</p>
-          <h4>{{vm.call.destination ? vm.call.destination : 'unknown'}}</h4>
-        </div>
-      </md-list-item>
-
-      <md-list-item class="md-2-line">
-        <div class="md-list-item-text">
-          <p translate="VOICE.STARTEDAT">Started At</p>
-          <h4>{{vm.call.starttime | date:'medium'}}</h4>
-        </div>
-      </md-list-item>
-
-      <md-list-item class="md-2-line">
-        <div class="md-list-item-text">
-          <p translate="VOICE.ANSWEREDAT">Answered At</p>
-          <h4>
-            {{vm.call.answertime ? (vm.call.answertime | date:'medium') : '--'}}
-          </h4>
-        </div>
-      </md-list-item>
-
-      <md-list-item class="md-2-line">
-        <div class="md-list-item-text">
-          <p translate="VOICE.ENDEDAT">Ended At</p>
-          <h4>
-            {{vm.call.endtime ? (vm.call.endtime | date:'medium') : '--'}}
-          </h4>
-        </div>
-      </md-list-item>
-
-      <md-list-item class="md-2-line">
-        <div class="md-list-item-text">
-          <p translate="VOICE.DURATION">Duration</p>
-          <h4>{{vm.call.duration ? vm.call.duration : '--'}}s</h4>
-        </div>
-      </md-list-item>
-
-      <md-list-item class="md-2-line">
-        <div class="md-list-item-text">
-          <p translate="VOICE.BILLABLESECONDS">Billable Seconds</p>
-          <h4>{{vm.call.billableseconds ? vm.call.billableseconds : '--'}}s</h4>
-        </div>
-      </md-list-item>
-
-      <md-list-item class="md-2-line">
-        <div class="md-list-item-text">
-          <p translate="VOICE.DISPOSITION">Disposition</p>
-          <h4>{{vm.call.userDisposition ? vm.call.userDisposition : '--'}}</h4>
-        </div>
-      </md-list-item>
-
-      <md-list-item class="md-2-line">
-        <div class="md-list-item-text">
-          <p translate="DASHBOARDS.SECOND_LEVEL_DISPOSITION">
-            Second Level Disposition
-          </p>
-          <h4>
-            {{vm.call.userSecondDisposition ? vm.call.userSecondDisposition :
-            '--'}}
-          </h4>
-        </div>
-      </md-list-item>
-
-      <md-list-item class="md-2-line">
-        <div class="md-list-item-text">
-          <p translate="DASHBOARDS.THIRD_LEVEL_DISPOSITION">
-            Third Level Disposition
-          </p>
-          <h4>
-            {{vm.call.userThirdDisposition ? vm.call.userThirdDisposition :
-            '--'}}
-          </h4>
-        </div>
-      </md-list-item>
-
-      <md-list-item class="md-2-line">
-        <div class="md-list-item-text">
-          <p translate="VOICE.NOTE">Note</p>
-          <h4>{{vm.call.note ? vm.call.note : '--'}}</h4>
-        </div>
-      </md-list-item>
-    </md-list>
-  </md-dialog-content>
-
-  <md-dialog-actions layout="row" layout-align="space-between center">
-    <md-button
-      type="button"
-      ng-click="vm.closeDialog()"
-      class="send-button md-accent md-raised"
-      aria-label="DISPOSE"
-      translate="VOICE.CLOSE"
-      translate-attr-aria-label="VOICE.DISPOSE"
-    >
-      CLOSE
-    </md-button>
-  </md-dialog-actions>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/agent/home/voice/details/dialog.html/dialog.html b/public/src/js/modules/main/apps/dashboards/views/general/agent/home/voice/details/dialog.html/dialog.html
new file mode 100644
index 0000000..e5628fe
--- /dev/null
+++ b/public/src/js/modules/main/apps/dashboards/views/general/agent/home/voice/details/dialog.html/dialog.html
@@ -0,0 +1,140 @@
+<md-dialog class="details-dialog" aria-label="details">
+  <md-toolbar class="md-background-bg">
+    <div
+      class="md-toolbar-tools"
+      layout="row"
+      layout-align="space-between center"
+    >
+      <span
+        ng-if="!vm.interaction.closed"
+        class="title"
+        translate="VOICE.DETAILS"
+      ></span>
+      <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+        <md-icon md-font-icon="icon-close" aria-label="Close dialog"></md-icon>
+      </md-button>
+    </div>
+  </md-toolbar>
+
+  <md-dialog-content>
+    <md-list flex>
+      <md-list-item class="md-2-line">
+        <div class="md-list-item-text">
+          <p translate="VOICE.UNIQUEID">Uniqueid</p>
+          <h4>{{vm.call.uniqueid}}</h4>
+        </div>
+      </md-list-item>
+
+      <md-list-item class="md-2-line">
+        <div class="md-list-item-text">
+          <p translate="VOICE.TYPE">Type</p>
+          <h4>{{vm.call.type ? vm.call.type : 'no type'}}</h4>
+        </div>
+      </md-list-item>
+
+      <md-list-item class="md-2-line">
+        <div class="md-list-item-text">
+          <p translate="VOICE.SOURCE">Source</p>
+          <h4>{{vm.call.source ? vm.call.source : 'unknown'}}</h4>
+        </div>
+      </md-list-item>
+
+      <md-list-item class="md-2-line">
+        <div class="md-list-item-text">
+          <p translate="VOICE.DESTINATION">Destination</p>
+          <h4>{{vm.call.destination ? vm.call.destination : 'unknown'}}</h4>
+        </div>
+      </md-list-item>
+
+      <md-list-item class="md-2-line">
+        <div class="md-list-item-text">
+          <p translate="VOICE.STARTEDAT">Started At</p>
+          <h4>{{vm.call.starttime | date:'medium'}}</h4>
+        </div>
+      </md-list-item>
+
+      <md-list-item class="md-2-line">
+        <div class="md-list-item-text">
+          <p translate="VOICE.ANSWEREDAT">Answered At</p>
+          <h4>
+            {{vm.call.answertime ? (vm.call.answertime | date:'medium') : '--'}}
+          </h4>
+        </div>
+      </md-list-item>
+
+      <md-list-item class="md-2-line">
+        <div class="md-list-item-text">
+          <p translate="VOICE.ENDEDAT">Ended At</p>
+          <h4>
+            {{vm.call.endtime ? (vm.call.endtime | date:'medium') : '--'}}
+          </h4>
+        </div>
+      </md-list-item>
+
+      <md-list-item class="md-2-line">
+        <div class="md-list-item-text">
+          <p translate="VOICE.DURATION">Duration</p>
+          <h4>{{vm.call.duration ? vm.call.duration : '--'}}s</h4>
+        </div>
+      </md-list-item>
+
+      <md-list-item class="md-2-line">
+        <div class="md-list-item-text">
+          <p translate="VOICE.BILLABLESECONDS">Billable Seconds</p>
+          <h4>{{vm.call.billableseconds ? vm.call.billableseconds : '--'}}s</h4>
+        </div>
+      </md-list-item>
+
+      <md-list-item class="md-2-line">
+        <div class="md-list-item-text">
+          <p translate="VOICE.DISPOSITION">Disposition</p>
+          <h4>{{vm.call.userDisposition ? vm.call.userDisposition : '--'}}</h4>
+        </div>
+      </md-list-item>
+
+      <md-list-item class="md-2-line">
+        <div class="md-list-item-text">
+          <p translate="DASHBOARDS.SECOND_LEVEL_DISPOSITION">
+            Second Level Disposition
+          </p>
+          <h4>
+            {{vm.call.userSecondDisposition ? vm.call.userSecondDisposition :
+            '--'}}
+          </h4>
+        </div>
+      </md-list-item>
+
+      <md-list-item class="md-2-line">
+        <div class="md-list-item-text">
+          <p translate="DASHBOARDS.THIRD_LEVEL_DISPOSITION">
+            Third Level Disposition
+          </p>
+          <h4>
+            {{vm.call.userThirdDisposition ? vm.call.userThirdDisposition :
+            '--'}}
+          </h4>
+        </div>
+      </md-list-item>
+
+      <md-list-item class="md-2-line">
+        <div class="md-list-item-text">
+          <p translate="VOICE.NOTE">Note</p>
+          <h4>{{vm.call.note ? vm.call.note : '--'}}</h4>
+        </div>
+      </md-list-item>
+    </md-list>
+  </md-dialog-content>
+
+  <md-dialog-actions layout="row" layout-align="space-between center">
+    <md-button
+      type="button"
+      ng-click="vm.closeDialog()"
+      class="send-button md-accent md-raised"
+      aria-label="DISPOSE"
+      translate="VOICE.CLOSE"
+      translate-attr-aria-label="VOICE.DISPOSE"
+    >
+      CLOSE
+    </md-button>
+  </md-dialog-actions>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/agent.general.interaction.dialog.html/agent.general.interaction.dialog-[chunkhash].html b/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/agent.general.interaction.dialog.html/agent.general.interaction.dialog-[chunkhash].html
deleted file mode 100644
index 07c99c5..0000000
--- a/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/agent.general.interaction.dialog.html/agent.general.interaction.dialog-[chunkhash].html
+++ /dev/null
@@ -1,7 +0,0 @@
-<md-dialog id="agent-general-dialog" aria-label="Spy Dialog">
-  <div
-    id="interaction-app"
-    class="agent-content"
-    ng-include="'app/main/apps/dashboards/views/general/agent/interaction/agent.general.interaction.html'"
-  ></div>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/agent.general.interaction.dialog.html/agent.general.interaction.dialog.html b/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/agent.general.interaction.dialog.html/agent.general.interaction.dialog.html
new file mode 100644
index 0000000..07c99c5
--- /dev/null
+++ b/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/agent.general.interaction.dialog.html/agent.general.interaction.dialog.html
@@ -0,0 +1,7 @@
+<md-dialog id="agent-general-dialog" aria-label="Spy Dialog">
+  <div
+    id="interaction-app"
+    class="agent-content"
+    ng-include="'app/main/apps/dashboards/views/general/agent/interaction/agent.general.interaction.html'"
+  ></div>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeFax/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeFax/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 97083af..0000000
--- a/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeFax/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,110 +0,0 @@
-<md-dialog class="compose-dialog-fax" aria-label="New Message">
-  <form class="md-inline-form" name="composeForm" novalidate>
-    <md-toolbar class="md-background-bg">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <div layout="row">
-          <md-button
-            ng-click="vm.send()"
-            class="md-raised md-blue-bg white-fg"
-            aria-label="Send message"
-          >
-            <span translate="FAX.SEND">SEND</span>
-          </md-button>
-          <md-button
-            ng-disabled="vm.message.attachments.length === 1"
-            class="md-fab md-mini md-white-bg"
-            aria-label="attachment"
-            translate-attr-aria-label="DASHBOARDS.ATTACHMENT"
-            flow-btn
-            flow-name="vm.ngFlow.flow"
-            flow-files-submitted="vm.upload()"
-            flow-init="vm.ngFlowOptions"
-            flow-file-added="vm.fileAdded($file)"
-            flow-file-success="vm.fileSuccess($file, $message)"
-          >
-            <md-icon md-font-icon="icon-paperclip" class="red-fg"></md-icon>
-          </md-button>
-        </div>
-        <span class="title">{{vm.message.from}}</span>
-        <md-button
-          class="md-icon-button"
-          ng-click="vm.closeDialog()"
-          aria-label="Close dialog"
-          tranlate
-          translate-aria-label="FAX.CLOSE_DIALOG"
-        >
-          <md-icon md-font-icon="icon-close"></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <md-input-container class="md-block to">
-        <label translate="FAX.TO">To</label>
-        <md-chips
-          name="to"
-          ng-model="vm.message.to"
-          md-transform-chip="vm.transformContact($chip)"
-          md-separator-keys="vm.separatorKeys"
-          md-require-match="false"
-          md-max-chips="1"
-          required
-        >
-          <!-- <input ng-model="vm.message.subject" type="text"> -->
-          <md-autocomplete
-            ng-hide="vm.message.to.length === 1"
-            md-search-text="vm.searchTo"
-            md-items="contact in vm.contactSearch(vm.searchTo)"
-            md-item-text="contact.fax"
-            md-min-length="3"
-          >
-            <md-item-template>
-              <span>{{ vm.getContact(contact) }}</span>
-            </md-item-template>
-          </md-autocomplete>
-        </md-chips>
-        <div ng-messages="composeForm.to.$error" ng-if="composeForm.$dirty">
-          <div ng-message="required">
-            <span translate="FAX.ERRORS.TO_REQUIRED">To field is required</span>
-          </div>
-          <div ng-message="md-max-chips">
-            You reached the maximum amount of chips
-          </div>
-        </div>
-      </md-input-container>
-
-      <div
-        class="attachment-list"
-        ng-if="vm.message.attachments.length"
-        layout="row"
-        layout-wrap
-      >
-        <div
-          class="attachment"
-          layout="row"
-          layout-align="space-between center"
-          ng-repeat="attachment in vm.message.attachments"
-        >
-          <div>
-            <md-icon md-font-icon="icon-paperclip" class="s16"></md-icon>
-            <span class="filename">{{attachment.name}}</span>
-            <span class="size">({{attachment.size | byteFmt: 0}})</span>
-          </div>
-
-          <md-button
-            class="md-icon-button"
-            aria-label="Delete attachment"
-            translate
-            translate-attr-aria-label="FAX.DELETE_ATTACHMENT"
-          >
-            <!-- <md-icon md-font-icon="icon-close" class="s16"></md-icon> -->
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeFax/dialog.html/dialog.html b/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeFax/dialog.html/dialog.html
new file mode 100644
index 0000000..97083af
--- /dev/null
+++ b/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeFax/dialog.html/dialog.html
@@ -0,0 +1,110 @@
+<md-dialog class="compose-dialog-fax" aria-label="New Message">
+  <form class="md-inline-form" name="composeForm" novalidate>
+    <md-toolbar class="md-background-bg">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <div layout="row">
+          <md-button
+            ng-click="vm.send()"
+            class="md-raised md-blue-bg white-fg"
+            aria-label="Send message"
+          >
+            <span translate="FAX.SEND">SEND</span>
+          </md-button>
+          <md-button
+            ng-disabled="vm.message.attachments.length === 1"
+            class="md-fab md-mini md-white-bg"
+            aria-label="attachment"
+            translate-attr-aria-label="DASHBOARDS.ATTACHMENT"
+            flow-btn
+            flow-name="vm.ngFlow.flow"
+            flow-files-submitted="vm.upload()"
+            flow-init="vm.ngFlowOptions"
+            flow-file-added="vm.fileAdded($file)"
+            flow-file-success="vm.fileSuccess($file, $message)"
+          >
+            <md-icon md-font-icon="icon-paperclip" class="red-fg"></md-icon>
+          </md-button>
+        </div>
+        <span class="title">{{vm.message.from}}</span>
+        <md-button
+          class="md-icon-button"
+          ng-click="vm.closeDialog()"
+          aria-label="Close dialog"
+          tranlate
+          translate-aria-label="FAX.CLOSE_DIALOG"
+        >
+          <md-icon md-font-icon="icon-close"></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <md-input-container class="md-block to">
+        <label translate="FAX.TO">To</label>
+        <md-chips
+          name="to"
+          ng-model="vm.message.to"
+          md-transform-chip="vm.transformContact($chip)"
+          md-separator-keys="vm.separatorKeys"
+          md-require-match="false"
+          md-max-chips="1"
+          required
+        >
+          <!-- <input ng-model="vm.message.subject" type="text"> -->
+          <md-autocomplete
+            ng-hide="vm.message.to.length === 1"
+            md-search-text="vm.searchTo"
+            md-items="contact in vm.contactSearch(vm.searchTo)"
+            md-item-text="contact.fax"
+            md-min-length="3"
+          >
+            <md-item-template>
+              <span>{{ vm.getContact(contact) }}</span>
+            </md-item-template>
+          </md-autocomplete>
+        </md-chips>
+        <div ng-messages="composeForm.to.$error" ng-if="composeForm.$dirty">
+          <div ng-message="required">
+            <span translate="FAX.ERRORS.TO_REQUIRED">To field is required</span>
+          </div>
+          <div ng-message="md-max-chips">
+            You reached the maximum amount of chips
+          </div>
+        </div>
+      </md-input-container>
+
+      <div
+        class="attachment-list"
+        ng-if="vm.message.attachments.length"
+        layout="row"
+        layout-wrap
+      >
+        <div
+          class="attachment"
+          layout="row"
+          layout-align="space-between center"
+          ng-repeat="attachment in vm.message.attachments"
+        >
+          <div>
+            <md-icon md-font-icon="icon-paperclip" class="s16"></md-icon>
+            <span class="filename">{{attachment.name}}</span>
+            <span class="size">({{attachment.size | byteFmt: 0}})</span>
+          </div>
+
+          <md-button
+            class="md-icon-button"
+            aria-label="Delete attachment"
+            translate
+            translate-attr-aria-label="FAX.DELETE_ATTACHMENT"
+          >
+            <!-- <md-icon md-font-icon="icon-close" class="s16"></md-icon> -->
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeMail/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeMail/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index d4b467a..0000000
--- a/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeMail/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,348 +0,0 @@
-<md-dialog
-  class="compose-dialog"
-  aria-label="New Message"
-  ng-style="{
-      'max-width':  {true: '620px', false: '90%'}[ vm.secret ],
-      'width': {true: '620px', false: '100%'}[ vm.secret ],
-      'max-height': {true: undefined, false: '97%'}[ vm.secret ]
-    }"
->
-  <form class="md-inline-form" name="composeForm" novalidate>
-    <md-toolbar ng-class="md-background-bg">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <div layout="row">
-          <div
-            ng-if="!vm.secret"
-            class="md-button md-raised blue-bg no-padding"
-          >
-            <button
-              class="white-fg margin-horizontal-10"
-              aria-label="Send message"
-              ng-disabled="!vm.verifySmtp"
-              ng-click="vm.send($event, false, null)"
-            >
-              <span>{{ 'MAIL.SEND' | translate | uppercase }}</span>
-            </button>
-            <span class="white-fg secondary-text vertical-divider"></span>
-            <md-menu>
-              <button
-                ng-disabled="!vm.verifySmtp"
-                class="white-fg margin-left-0"
-                aria-label="More"
-                translate
-                translate-attr-aria-label="STAFF.MORE"
-                ng-click="$mdMenu.open($event)"
-              >
-                <md-icon
-                  md-font-icon="icon-menu-down"
-                  class="icon s24"
-                ></md-icon>
-              </button>
-
-              <md-menu-content width="2">
-                <md-menu-item ng-if="vm.subStatuses.rows.length">
-                  <md-menu>
-                    <md-button
-                      ng-click="$mdMenu.open()"
-                      class="text-capitalize"
-                      translate="MAIL.SEND_AS"
-                    >
-                      Send as
-                    </md-button>
-                    <md-menu-content>
-                      <md-menu-item
-                        ng-repeat="subStatus in vm.subStatuses.rows"
-                      >
-                        <md-button
-                          ng-click="vm.send($event, false, subStatus.name)"
-                        >
-                          {{subStatus.name}}
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </md-menu-item>
-                <md-menu-item>
-                  <md-button
-                    ng-click="vm.send($event, true, null)"
-                    translate="MAIL.SEND_AND_CLOSE"
-                  >
-                    Send and Close
-                  </md-button>
-                </md-menu-item>
-              </md-menu-content>
-            </md-menu>
-          </div>
-          <md-button
-            ng-if="!vm.secret"
-            class="md-button md-raised blue-bg white-fg margin-horizontal-10"
-            aria-label="Save draft"
-            ng-click="vm.saveDraft()"
-          >
-            <span
-              >{{ (vm.isDraft ? 'DASHBOARDS.UPDATE_DRAFT' :
-              'DASHBOARDS.SAVE_AS_DRAFT') | translate | uppercase }}</span
-            >
-          </md-button>
-          <md-button
-            ng-if="vm.secret"
-            ng-click="vm.addNote()"
-            class="md-raised md-blue-bg white-fg"
-            aria-label="Send message"
-          >
-            <span translate="MAIL.ADD_NOTE">Add note</span>
-          </md-button>
-          <md-button
-            ng-disabled="!vm.verifySmtp"
-            class="md-fab md-mini md-white-bg"
-            aria-label="attachment"
-            translate-attr-aria-label="DASHBOARDS.ATTACHMENT"
-            flow-btn
-            flow-name="vm.ngFlow.flow"
-            flow-files-submitted="vm.upload($files)"
-            flow-init="vm.ngFlowOptions"
-            flow-file-success="vm.fileSuccess($file, $message)"
-            flow-file-added="vm.fileAdded($file)"
-          >
-            <md-icon md-font-icon="icon-paperclip" class="red-fg"></md-icon>
-          </md-button>
-        </div>
-        <span ng-if="!vm.secret" class="title">{{vm.message.from}}</span>
-        <md-button
-          class="md-icon-button"
-          ng-click="vm.closeDialog()"
-          aria-label="Close dialog"
-          tranlate
-          translate-aria-label="MAIL.CLOSE_DIALOG"
-        >
-          <md-icon md-font-icon="icon-close"></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container
-        ng-if="!vm.secret"
-        class="md-block to"
-        ng-class="{'hidden-cc': vm.hiddenCC, 'hidden-bcc': vm.hiddenBCC}"
-      >
-        <label translate="MAIL.TO">To</label>
-        <md-chips
-          name="to"
-          ng-model="vm.message.to"
-          md-transform-chip="vm.transformContact($chip, vm.message.to)"
-          md-separator-keys="vm.separatorKeys"
-          md-require-match="false"
-          required
-        >
-          <md-autocomplete
-            md-search-text="vm.searchTo"
-            md-items="contact in vm.contactSearch(vm.searchTo)"
-            md-item-text="contact.email"
-            md-min-length="3"
-          >
-            <md-item-template>
-              <span>{{ vm.getContact(contact) }}</span>
-            </md-item-template>
-          </md-autocomplete>
-        </md-chips>
-        <div ng-messages="composeForm.to.$error" role="alert">
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.TO_REQUIRED"
-              >To field is required</span
-            >
-          </div>
-        </div>
-
-        <div class="cc-bcc" layout="row" layout-align="start center">
-          <div
-            class="show-cc"
-            ng-show="vm.hiddenCC"
-            ng-click="vm.hiddenCC = false"
-          >
-            CC
-          </div>
-          <div
-            class="show-bcc"
-            ng-show="vm.hiddenBCC"
-            ng-click="vm.hiddenBCC = false"
-          >
-            BCC
-          </div>
-        </div>
-      </md-input-container>
-
-      <md-input-container
-        ng-if="!vm.secret"
-        class="md-block"
-        ng-hide="vm.hiddenCC"
-      >
-        <label translate="MAIL.CC">Cc</label>
-        <md-chips
-          name="cc"
-          ng-model="vm.message.cc"
-          md-transform-chip="vm.transformContact($chip, vm.message.cc)"
-          md-separator-keys="vm.separatorKeys"
-          md-require-match="false"
-          required
-        >
-          <md-autocomplete
-            md-search-text="vm.searchCc"
-            md-items="contact in vm.contactSearch(vm.searchCc)"
-            md-item-text="contact.email"
-            md-min-length="3"
-          >
-            <md-item-template>
-              <span>{{ vm.getContact(contact) }}</span>
-            </md-item-template>
-          </md-autocomplete>
-        </md-chips>
-      </md-input-container>
-
-      <md-input-container
-        ng-if="!vm.secret"
-        class="md-block"
-        ng-hide="vm.hiddenBCC"
-      >
-        <label translate="MAIL.BCC">Bcc</label>
-        <md-chips
-          name="bcc"
-          ng-model="vm.message.bcc"
-          md-transform-chip="vm.transformContact($chip, vm.message.bcc)"
-          md-separator-keys="vm.separatorKeys"
-          md-require-match="false"
-          required
-        >
-          <md-autocomplete
-            md-search-text="vm.searchBcc"
-            md-items="contact in vm.contactSearch(vm.searchBcc)"
-            md-item-text="contact.email"
-            md-min-length="3"
-          >
-            <md-item-template>
-              <span>{{ vm.getContact(contact) }}</span>
-            </md-item-template>
-          </md-autocomplete>
-        </md-chips>
-      </md-input-container>
-
-      <md-input-container ng-if="!vm.secret" class="md-block no-margin">
-        <label translate="MAIL.SUBJECT">Subject</label>
-        <input ng-model="vm.message.subject" type="text" />
-      </md-input-container>
-
-      <div
-        class="attachment-list"
-        ng-if="vm.message.attachments.length"
-        layout="row"
-        layout-wrap
-      >
-        <div
-          class="attachment"
-          layout="row"
-          layout-align="space-between center"
-          ng-repeat="attachment in vm.message.attachments"
-        >
-          <div>
-            <md-icon md-font-icon="icon-paperclip" class="s16"></md-icon>
-            <span class="filename">{{attachment.name}}</span>
-            <span class="size" ng-if="attachment.size"
-              >({{attachment.size | byteFmt: 0}})</span
-            >
-          </div>
-
-          <md-button
-            ng-click="vm.removeAttachment(attachment)"
-            class="md-icon-button"
-            aria-label="Delete attachment"
-            translate
-            translate-attr-aria-label="MAIL.DELETE_ATTACHMENT"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <div class="padding-top-5">
-        <textarea
-          ckeditor="vm.ckeditor"
-          id="html-area"
-          ng-model="vm.message.body"
-          md-select-on-focus=""
-          ready="vm.onReadyEditor()"
-        ></textarea>
-      </div>
-
-      <md-switch
-        ng-if="!vm.message.showLastMessage && !vm.secret"
-        ng-model="vm.message.showLastMessage"
-        ng-change="vm.loadLastMessage()"
-        aria-label="load last message"
-        ><span translate="MAIL.SHOW_ORIGINAL_MESSAGE"
-          >Show original message</span
-        ></md-switch
-      >
-
-      <md-autocomplete
-        ng-if="!vm.secret"
-        md-selected-item="vm.selectedItem"
-        md-search-text="vm.searchText"
-        md-selected-item-change="vm.selectedItemChange(item)"
-        md-items="item in vm.searchTextChange(vm.searchText)"
-        md-item-text="item.value"
-        md-min-length="1"
-        md-floating-label="{{ 'MAIL.CANNED_ANSWER_SEARCH' | translate}}"
-        class="input-show-hide no-container-margin"
-      >
-        <md-item-template>
-          <md-icon
-            ng-if="!item.MailAccountId"
-            md-font-icon="icon-earth"
-            aria-label="alert email"
-            class="s16"
-          >
-          </md-icon>
-          <md-icon
-            ng-if="item.MailAccountId"
-            md-font-icon="icon-email"
-            aria-label="alert email"
-            class="s16 teal-fg"
-          ></md-icon>
-          <span md-highlight-text="vm.searchText" md-highlight-flags="^i"
-            >{{ item.key }} - {{ item.value | htmlToPlaintext }}</span
-          >
-        </md-item-template>
-
-        <md-not-found>
-          <span translate="MAIL.CANNED_ANSWER_NOT_FOUND"
-            >No canned answers were found</span
-          >
-        </md-not-found>
-      </md-autocomplete>
-    </md-dialog-content>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeMail/dialog.html/dialog.html b/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeMail/dialog.html/dialog.html
new file mode 100644
index 0000000..d4b467a
--- /dev/null
+++ b/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeMail/dialog.html/dialog.html
@@ -0,0 +1,348 @@
+<md-dialog
+  class="compose-dialog"
+  aria-label="New Message"
+  ng-style="{
+      'max-width':  {true: '620px', false: '90%'}[ vm.secret ],
+      'width': {true: '620px', false: '100%'}[ vm.secret ],
+      'max-height': {true: undefined, false: '97%'}[ vm.secret ]
+    }"
+>
+  <form class="md-inline-form" name="composeForm" novalidate>
+    <md-toolbar ng-class="md-background-bg">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <div layout="row">
+          <div
+            ng-if="!vm.secret"
+            class="md-button md-raised blue-bg no-padding"
+          >
+            <button
+              class="white-fg margin-horizontal-10"
+              aria-label="Send message"
+              ng-disabled="!vm.verifySmtp"
+              ng-click="vm.send($event, false, null)"
+            >
+              <span>{{ 'MAIL.SEND' | translate | uppercase }}</span>
+            </button>
+            <span class="white-fg secondary-text vertical-divider"></span>
+            <md-menu>
+              <button
+                ng-disabled="!vm.verifySmtp"
+                class="white-fg margin-left-0"
+                aria-label="More"
+                translate
+                translate-attr-aria-label="STAFF.MORE"
+                ng-click="$mdMenu.open($event)"
+              >
+                <md-icon
+                  md-font-icon="icon-menu-down"
+                  class="icon s24"
+                ></md-icon>
+              </button>
+
+              <md-menu-content width="2">
+                <md-menu-item ng-if="vm.subStatuses.rows.length">
+                  <md-menu>
+                    <md-button
+                      ng-click="$mdMenu.open()"
+                      class="text-capitalize"
+                      translate="MAIL.SEND_AS"
+                    >
+                      Send as
+                    </md-button>
+                    <md-menu-content>
+                      <md-menu-item
+                        ng-repeat="subStatus in vm.subStatuses.rows"
+                      >
+                        <md-button
+                          ng-click="vm.send($event, false, subStatus.name)"
+                        >
+                          {{subStatus.name}}
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </md-menu-item>
+                <md-menu-item>
+                  <md-button
+                    ng-click="vm.send($event, true, null)"
+                    translate="MAIL.SEND_AND_CLOSE"
+                  >
+                    Send and Close
+                  </md-button>
+                </md-menu-item>
+              </md-menu-content>
+            </md-menu>
+          </div>
+          <md-button
+            ng-if="!vm.secret"
+            class="md-button md-raised blue-bg white-fg margin-horizontal-10"
+            aria-label="Save draft"
+            ng-click="vm.saveDraft()"
+          >
+            <span
+              >{{ (vm.isDraft ? 'DASHBOARDS.UPDATE_DRAFT' :
+              'DASHBOARDS.SAVE_AS_DRAFT') | translate | uppercase }}</span
+            >
+          </md-button>
+          <md-button
+            ng-if="vm.secret"
+            ng-click="vm.addNote()"
+            class="md-raised md-blue-bg white-fg"
+            aria-label="Send message"
+          >
+            <span translate="MAIL.ADD_NOTE">Add note</span>
+          </md-button>
+          <md-button
+            ng-disabled="!vm.verifySmtp"
+            class="md-fab md-mini md-white-bg"
+            aria-label="attachment"
+            translate-attr-aria-label="DASHBOARDS.ATTACHMENT"
+            flow-btn
+            flow-name="vm.ngFlow.flow"
+            flow-files-submitted="vm.upload($files)"
+            flow-init="vm.ngFlowOptions"
+            flow-file-success="vm.fileSuccess($file, $message)"
+            flow-file-added="vm.fileAdded($file)"
+          >
+            <md-icon md-font-icon="icon-paperclip" class="red-fg"></md-icon>
+          </md-button>
+        </div>
+        <span ng-if="!vm.secret" class="title">{{vm.message.from}}</span>
+        <md-button
+          class="md-icon-button"
+          ng-click="vm.closeDialog()"
+          aria-label="Close dialog"
+          tranlate
+          translate-aria-label="MAIL.CLOSE_DIALOG"
+        >
+          <md-icon md-font-icon="icon-close"></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container
+        ng-if="!vm.secret"
+        class="md-block to"
+        ng-class="{'hidden-cc': vm.hiddenCC, 'hidden-bcc': vm.hiddenBCC}"
+      >
+        <label translate="MAIL.TO">To</label>
+        <md-chips
+          name="to"
+          ng-model="vm.message.to"
+          md-transform-chip="vm.transformContact($chip, vm.message.to)"
+          md-separator-keys="vm.separatorKeys"
+          md-require-match="false"
+          required
+        >
+          <md-autocomplete
+            md-search-text="vm.searchTo"
+            md-items="contact in vm.contactSearch(vm.searchTo)"
+            md-item-text="contact.email"
+            md-min-length="3"
+          >
+            <md-item-template>
+              <span>{{ vm.getContact(contact) }}</span>
+            </md-item-template>
+          </md-autocomplete>
+        </md-chips>
+        <div ng-messages="composeForm.to.$error" role="alert">
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.TO_REQUIRED"
+              >To field is required</span
+            >
+          </div>
+        </div>
+
+        <div class="cc-bcc" layout="row" layout-align="start center">
+          <div
+            class="show-cc"
+            ng-show="vm.hiddenCC"
+            ng-click="vm.hiddenCC = false"
+          >
+            CC
+          </div>
+          <div
+            class="show-bcc"
+            ng-show="vm.hiddenBCC"
+            ng-click="vm.hiddenBCC = false"
+          >
+            BCC
+          </div>
+        </div>
+      </md-input-container>
+
+      <md-input-container
+        ng-if="!vm.secret"
+        class="md-block"
+        ng-hide="vm.hiddenCC"
+      >
+        <label translate="MAIL.CC">Cc</label>
+        <md-chips
+          name="cc"
+          ng-model="vm.message.cc"
+          md-transform-chip="vm.transformContact($chip, vm.message.cc)"
+          md-separator-keys="vm.separatorKeys"
+          md-require-match="false"
+          required
+        >
+          <md-autocomplete
+            md-search-text="vm.searchCc"
+            md-items="contact in vm.contactSearch(vm.searchCc)"
+            md-item-text="contact.email"
+            md-min-length="3"
+          >
+            <md-item-template>
+              <span>{{ vm.getContact(contact) }}</span>
+            </md-item-template>
+          </md-autocomplete>
+        </md-chips>
+      </md-input-container>
+
+      <md-input-container
+        ng-if="!vm.secret"
+        class="md-block"
+        ng-hide="vm.hiddenBCC"
+      >
+        <label translate="MAIL.BCC">Bcc</label>
+        <md-chips
+          name="bcc"
+          ng-model="vm.message.bcc"
+          md-transform-chip="vm.transformContact($chip, vm.message.bcc)"
+          md-separator-keys="vm.separatorKeys"
+          md-require-match="false"
+          required
+        >
+          <md-autocomplete
+            md-search-text="vm.searchBcc"
+            md-items="contact in vm.contactSearch(vm.searchBcc)"
+            md-item-text="contact.email"
+            md-min-length="3"
+          >
+            <md-item-template>
+              <span>{{ vm.getContact(contact) }}</span>
+            </md-item-template>
+          </md-autocomplete>
+        </md-chips>
+      </md-input-container>
+
+      <md-input-container ng-if="!vm.secret" class="md-block no-margin">
+        <label translate="MAIL.SUBJECT">Subject</label>
+        <input ng-model="vm.message.subject" type="text" />
+      </md-input-container>
+
+      <div
+        class="attachment-list"
+        ng-if="vm.message.attachments.length"
+        layout="row"
+        layout-wrap
+      >
+        <div
+          class="attachment"
+          layout="row"
+          layout-align="space-between center"
+          ng-repeat="attachment in vm.message.attachments"
+        >
+          <div>
+            <md-icon md-font-icon="icon-paperclip" class="s16"></md-icon>
+            <span class="filename">{{attachment.name}}</span>
+            <span class="size" ng-if="attachment.size"
+              >({{attachment.size | byteFmt: 0}})</span
+            >
+          </div>
+
+          <md-button
+            ng-click="vm.removeAttachment(attachment)"
+            class="md-icon-button"
+            aria-label="Delete attachment"
+            translate
+            translate-attr-aria-label="MAIL.DELETE_ATTACHMENT"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <div class="padding-top-5">
+        <textarea
+          ckeditor="vm.ckeditor"
+          id="html-area"
+          ng-model="vm.message.body"
+          md-select-on-focus=""
+          ready="vm.onReadyEditor()"
+        ></textarea>
+      </div>
+
+      <md-switch
+        ng-if="!vm.message.showLastMessage && !vm.secret"
+        ng-model="vm.message.showLastMessage"
+        ng-change="vm.loadLastMessage()"
+        aria-label="load last message"
+        ><span translate="MAIL.SHOW_ORIGINAL_MESSAGE"
+          >Show original message</span
+        ></md-switch
+      >
+
+      <md-autocomplete
+        ng-if="!vm.secret"
+        md-selected-item="vm.selectedItem"
+        md-search-text="vm.searchText"
+        md-selected-item-change="vm.selectedItemChange(item)"
+        md-items="item in vm.searchTextChange(vm.searchText)"
+        md-item-text="item.value"
+        md-min-length="1"
+        md-floating-label="{{ 'MAIL.CANNED_ANSWER_SEARCH' | translate}}"
+        class="input-show-hide no-container-margin"
+      >
+        <md-item-template>
+          <md-icon
+            ng-if="!item.MailAccountId"
+            md-font-icon="icon-earth"
+            aria-label="alert email"
+            class="s16"
+          >
+          </md-icon>
+          <md-icon
+            ng-if="item.MailAccountId"
+            md-font-icon="icon-email"
+            aria-label="alert email"
+            class="s16 teal-fg"
+          ></md-icon>
+          <span md-highlight-text="vm.searchText" md-highlight-flags="^i"
+            >{{ item.key }} - {{ item.value | htmlToPlaintext }}</span
+          >
+        </md-item-template>
+
+        <md-not-found>
+          <span translate="MAIL.CANNED_ANSWER_NOT_FOUND"
+            >No canned answers were found</span
+          >
+        </md-not-found>
+      </md-autocomplete>
+    </md-dialog-content>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeOpenchannel/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeOpenchannel/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 824abc9..0000000
--- a/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeOpenchannel/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,140 +0,0 @@
-<md-dialog class="compose-dialog" aria-label="New Message">
-  <form class="md-inline-form" name="composeForm" novalidate>
-    <md-toolbar class="md-background-bg">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <div layout="row">
-          <md-button
-            ng-if="!vm.secret"
-            ng-click="vm.send()"
-            class="md-raised md-blue-bg white-fg"
-            aria-label="Send message"
-          >
-            <span translate="OPENCHANNEL.SEND">SEND</span>
-          </md-button>
-          <md-button
-            ng-if="vm.secret"
-            ng-click="vm.addNote()"
-            class="md-raised md-blue-bg white-fg"
-            aria-label="Add note"
-          >
-            <span translate="OPENCHANNEL.ADD_NOTE">Add note</span>
-          </md-button>
-        </div>
-        <span ng-if="!vm.secret" class="title">{{vm.message.from}}</span>
-        <md-button
-          class="md-icon-button"
-          ng-click="vm.closeDialog()"
-          aria-label="Close dialog"
-          tranlate
-          translate-aria-label="OPENCHANNEL.CLOSE_DIALOG"
-        >
-          <md-icon md-font-icon="icon-close"></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <md-input-container ng-if="!vm.secret" class="md-block to">
-        <label translate="OPENCHANNEL.TO">To</label>
-        <md-chips
-          name="to"
-          ng-model="vm.message.to"
-          md-transform-chip="vm.transformContact($chip)"
-          md-separator-keys="vm.separatorKeys"
-          md-require-match="false"
-          md-max-chips="1"
-          required
-        >
-          <md-autocomplete
-            md-search-text="vm.searchTo"
-            md-items="contact in vm.contactSearch(vm.searchTo)"
-            md-item-text="contact.mapkey"
-            md-min-length="3"
-          >
-            <md-item-template>
-              <span>{{ vm.getContact(contact) }}</span>
-            </md-item-template>
-          </md-autocomplete>
-        </md-chips>
-        <div ng-messages="composeForm.to.$error" role="alert">
-          <div ng-message="required">
-            <span translate="OPENCHANNEL.ERRORS.TO_REQUIRED"
-              >To field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <!-- msEmojyArea directive -->
-      <ms-emoji-area
-        on-reply="vm.reply(event, body)"
-        ctrl-methods="vm.ctrlMethods"
-        ng-model="vm.message.body"
-        placeholder="'OPENCHANNEL.INSERT_MESSAGE_HERE'"
-      ></ms-emoji-area>
-      <!-- / msEmojyArea directive -->
-
-      <md-autocomplete
-        ng-if="!vm.secret"
-        class="padding-top-5"
-        md-selected-item="vm.selectedItem"
-        md-search-text="vm.searchText"
-        md-selected-item-change="vm.selectedItemChange(item)"
-        md-items="item in vm.searchTextChange(vm.searchText)"
-        md-item-text="item.value"
-        md-min-length="1"
-        md-floating-label="{{ 'OPENCHANNEL.CANNED_ANSWER_SEARCH' | translate}}"
-        class="input-show-hide no-container-margin"
-      >
-        <md-item-template>
-          <md-icon
-            ng-if="!item.OpenchannelAccountId"
-            md-font-icon="icon-earth"
-            aria-label="alert openchannel"
-            class="s16"
-          ></md-icon>
-          <md-icon
-            ng-if="item.OpenchannelAccountId"
-            md-font-icon="icon-message-text"
-            aria-label="alert openchannel"
-            class="s16 orange-fg"
-          ></md-icon>
-          <span md-highlight-text="vm.searchText" md-highlight-flags="^i"
-            >{{item.key}} - {{item.value}}</span
-          >
-        </md-item-template>
-
-        <md-not-found>
-          <span translate="OPENCHANNEL.CANNED_ANSWER_NOT_FOUND"
-            >No canned answers were found</span
-          >
-        </md-not-found>
-      </md-autocomplete>
-    </md-dialog-content>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeOpenchannel/dialog.html/dialog.html b/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeOpenchannel/dialog.html/dialog.html
new file mode 100644
index 0000000..824abc9
--- /dev/null
+++ b/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeOpenchannel/dialog.html/dialog.html
@@ -0,0 +1,140 @@
+<md-dialog class="compose-dialog" aria-label="New Message">
+  <form class="md-inline-form" name="composeForm" novalidate>
+    <md-toolbar class="md-background-bg">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <div layout="row">
+          <md-button
+            ng-if="!vm.secret"
+            ng-click="vm.send()"
+            class="md-raised md-blue-bg white-fg"
+            aria-label="Send message"
+          >
+            <span translate="OPENCHANNEL.SEND">SEND</span>
+          </md-button>
+          <md-button
+            ng-if="vm.secret"
+            ng-click="vm.addNote()"
+            class="md-raised md-blue-bg white-fg"
+            aria-label="Add note"
+          >
+            <span translate="OPENCHANNEL.ADD_NOTE">Add note</span>
+          </md-button>
+        </div>
+        <span ng-if="!vm.secret" class="title">{{vm.message.from}}</span>
+        <md-button
+          class="md-icon-button"
+          ng-click="vm.closeDialog()"
+          aria-label="Close dialog"
+          tranlate
+          translate-aria-label="OPENCHANNEL.CLOSE_DIALOG"
+        >
+          <md-icon md-font-icon="icon-close"></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <md-input-container ng-if="!vm.secret" class="md-block to">
+        <label translate="OPENCHANNEL.TO">To</label>
+        <md-chips
+          name="to"
+          ng-model="vm.message.to"
+          md-transform-chip="vm.transformContact($chip)"
+          md-separator-keys="vm.separatorKeys"
+          md-require-match="false"
+          md-max-chips="1"
+          required
+        >
+          <md-autocomplete
+            md-search-text="vm.searchTo"
+            md-items="contact in vm.contactSearch(vm.searchTo)"
+            md-item-text="contact.mapkey"
+            md-min-length="3"
+          >
+            <md-item-template>
+              <span>{{ vm.getContact(contact) }}</span>
+            </md-item-template>
+          </md-autocomplete>
+        </md-chips>
+        <div ng-messages="composeForm.to.$error" role="alert">
+          <div ng-message="required">
+            <span translate="OPENCHANNEL.ERRORS.TO_REQUIRED"
+              >To field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <!-- msEmojyArea directive -->
+      <ms-emoji-area
+        on-reply="vm.reply(event, body)"
+        ctrl-methods="vm.ctrlMethods"
+        ng-model="vm.message.body"
+        placeholder="'OPENCHANNEL.INSERT_MESSAGE_HERE'"
+      ></ms-emoji-area>
+      <!-- / msEmojyArea directive -->
+
+      <md-autocomplete
+        ng-if="!vm.secret"
+        class="padding-top-5"
+        md-selected-item="vm.selectedItem"
+        md-search-text="vm.searchText"
+        md-selected-item-change="vm.selectedItemChange(item)"
+        md-items="item in vm.searchTextChange(vm.searchText)"
+        md-item-text="item.value"
+        md-min-length="1"
+        md-floating-label="{{ 'OPENCHANNEL.CANNED_ANSWER_SEARCH' | translate}}"
+        class="input-show-hide no-container-margin"
+      >
+        <md-item-template>
+          <md-icon
+            ng-if="!item.OpenchannelAccountId"
+            md-font-icon="icon-earth"
+            aria-label="alert openchannel"
+            class="s16"
+          ></md-icon>
+          <md-icon
+            ng-if="item.OpenchannelAccountId"
+            md-font-icon="icon-message-text"
+            aria-label="alert openchannel"
+            class="s16 orange-fg"
+          ></md-icon>
+          <span md-highlight-text="vm.searchText" md-highlight-flags="^i"
+            >{{item.key}} - {{item.value}}</span
+          >
+        </md-item-template>
+
+        <md-not-found>
+          <span translate="OPENCHANNEL.CANNED_ANSWER_NOT_FOUND"
+            >No canned answers were found</span
+          >
+        </md-not-found>
+      </md-autocomplete>
+    </md-dialog-content>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeSms/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeSms/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 3c8724d..0000000
--- a/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeSms/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,138 +0,0 @@
-<md-dialog class="compose-dialog" aria-label="New Message">
-  <form class="md-inline-form" name="composeForm" novalidate>
-    <md-toolbar class="md-background-bg">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <div layout="row">
-          <md-button
-            ng-if="!vm.secret"
-            ng-click="vm.send()"
-            class="md-raised md-blue-bg white-fg"
-            aria-label="Send message"
-          >
-            <span translate="SMS.SEND">SEND</span>
-          </md-button>
-          <md-button
-            ng-if="vm.secret"
-            ng-click="vm.addNote()"
-            class="md-raised md-blue-bg white-fg"
-            aria-label="Add note"
-          >
-            <span translate="SMS.ADD_NOTE">Add note</span>
-          </md-button>
-        </div>
-        <span ng-if="!vm.secret" class="title">{{vm.message.from}}</span>
-        <md-button
-          class="md-icon-button"
-          ng-click="vm.closeDialog()"
-          aria-label="Close dialog"
-          tranlate
-          translate-aria-label="SMS.CLOSE_DIALOG"
-        >
-          <md-icon md-font-icon="icon-close"></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <md-input-container ng-if="!vm.secret" class="md-block to">
-        <label translate="SMS.TO">To</label>
-        <md-chips
-          name="to"
-          ng-model="vm.message.to"
-          md-transform-chip="vm.transformContact($chip)"
-          md-separator-keys="vm.separatorKeys"
-          md-require-match="false"
-          md-max-chips="1"
-          required
-        >
-          <md-autocomplete
-            md-search-text="vm.searchTo"
-            md-items="contact in vm.contactSearch(vm.searchTo)"
-            md-item-text="contact.mobile"
-            md-min-length="3"
-          >
-            <md-item-template>
-              <span>{{ vm.getContact(contact) }}</span>
-            </md-item-template>
-          </md-autocomplete>
-        </md-chips>
-        <div ng-messages="composeForm.to.$error" role="alert">
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.TO_REQUIRED">To field is required</span>
-          </div>
-        </div>
-      </md-input-container>
-
-      <!-- msEmojyArea directive -->
-      <ms-emoji-area
-        on-reply="vm.reply(event, body)"
-        ctrl-methods="vm.ctrlMethods"
-        ng-model="vm.message.body"
-        placeholder="'SMS.INSERT_MESSAGE_HERE'"
-      ></ms-emoji-area>
-      <!-- / msEmojyArea directive -->
-
-      <md-autocomplete
-        ng-if="!vm.secret"
-        class="padding-top-5"
-        md-selected-item="vm.selectedItem"
-        md-search-text="vm.searchText"
-        md-selected-item-change="vm.selectedItemChange(item)"
-        md-items="item in vm.searchTextChange(vm.searchText)"
-        md-item-text="item.value"
-        md-min-length="1"
-        md-floating-label="{{ 'SMS.CANNED_ANSWER_SEARCH' | translate}}"
-        class="input-show-hide no-container-margin"
-      >
-        <md-item-template>
-          <md-icon
-            ng-if="!item.SmsAccountId"
-            md-font-icon="icon-earth"
-            aria-label="alert sms"
-            class="s16"
-          ></md-icon>
-          <md-icon
-            ng-if="item.SmsAccountId"
-            md-font-icon="icon-message-text"
-            aria-label="alert sms"
-            class="s16 orange-fg"
-          ></md-icon>
-          <span md-highlight-text="vm.searchText" md-highlight-flags="^i"
-            >{{item.key}} - {{item.value}}</span
-          >
-        </md-item-template>
-
-        <md-not-found>
-          <span translate="SMS.CANNED_ANSWER_NOT_FOUND"
-            >No canned answers were found</span
-          >
-        </md-not-found>
-      </md-autocomplete>
-    </md-dialog-content>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeSms/dialog.html/dialog.html b/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeSms/dialog.html/dialog.html
new file mode 100644
index 0000000..3c8724d
--- /dev/null
+++ b/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeSms/dialog.html/dialog.html
@@ -0,0 +1,138 @@
+<md-dialog class="compose-dialog" aria-label="New Message">
+  <form class="md-inline-form" name="composeForm" novalidate>
+    <md-toolbar class="md-background-bg">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <div layout="row">
+          <md-button
+            ng-if="!vm.secret"
+            ng-click="vm.send()"
+            class="md-raised md-blue-bg white-fg"
+            aria-label="Send message"
+          >
+            <span translate="SMS.SEND">SEND</span>
+          </md-button>
+          <md-button
+            ng-if="vm.secret"
+            ng-click="vm.addNote()"
+            class="md-raised md-blue-bg white-fg"
+            aria-label="Add note"
+          >
+            <span translate="SMS.ADD_NOTE">Add note</span>
+          </md-button>
+        </div>
+        <span ng-if="!vm.secret" class="title">{{vm.message.from}}</span>
+        <md-button
+          class="md-icon-button"
+          ng-click="vm.closeDialog()"
+          aria-label="Close dialog"
+          tranlate
+          translate-aria-label="SMS.CLOSE_DIALOG"
+        >
+          <md-icon md-font-icon="icon-close"></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <md-input-container ng-if="!vm.secret" class="md-block to">
+        <label translate="SMS.TO">To</label>
+        <md-chips
+          name="to"
+          ng-model="vm.message.to"
+          md-transform-chip="vm.transformContact($chip)"
+          md-separator-keys="vm.separatorKeys"
+          md-require-match="false"
+          md-max-chips="1"
+          required
+        >
+          <md-autocomplete
+            md-search-text="vm.searchTo"
+            md-items="contact in vm.contactSearch(vm.searchTo)"
+            md-item-text="contact.mobile"
+            md-min-length="3"
+          >
+            <md-item-template>
+              <span>{{ vm.getContact(contact) }}</span>
+            </md-item-template>
+          </md-autocomplete>
+        </md-chips>
+        <div ng-messages="composeForm.to.$error" role="alert">
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.TO_REQUIRED">To field is required</span>
+          </div>
+        </div>
+      </md-input-container>
+
+      <!-- msEmojyArea directive -->
+      <ms-emoji-area
+        on-reply="vm.reply(event, body)"
+        ctrl-methods="vm.ctrlMethods"
+        ng-model="vm.message.body"
+        placeholder="'SMS.INSERT_MESSAGE_HERE'"
+      ></ms-emoji-area>
+      <!-- / msEmojyArea directive -->
+
+      <md-autocomplete
+        ng-if="!vm.secret"
+        class="padding-top-5"
+        md-selected-item="vm.selectedItem"
+        md-search-text="vm.searchText"
+        md-selected-item-change="vm.selectedItemChange(item)"
+        md-items="item in vm.searchTextChange(vm.searchText)"
+        md-item-text="item.value"
+        md-min-length="1"
+        md-floating-label="{{ 'SMS.CANNED_ANSWER_SEARCH' | translate}}"
+        class="input-show-hide no-container-margin"
+      >
+        <md-item-template>
+          <md-icon
+            ng-if="!item.SmsAccountId"
+            md-font-icon="icon-earth"
+            aria-label="alert sms"
+            class="s16"
+          ></md-icon>
+          <md-icon
+            ng-if="item.SmsAccountId"
+            md-font-icon="icon-message-text"
+            aria-label="alert sms"
+            class="s16 orange-fg"
+          ></md-icon>
+          <span md-highlight-text="vm.searchText" md-highlight-flags="^i"
+            >{{item.key}} - {{item.value}}</span
+          >
+        </md-item-template>
+
+        <md-not-found>
+          <span translate="SMS.CANNED_ANSWER_NOT_FOUND"
+            >No canned answers were found</span
+          >
+        </md-not-found>
+      </md-autocomplete>
+    </md-dialog-content>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeWhatsapp/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeWhatsapp/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index b2f621b..0000000
--- a/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeWhatsapp/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,140 +0,0 @@
-<md-dialog class="compose-dialog" aria-label="New Message">
-  <form class="md-inline-form" name="composeForm" novalidate>
-    <md-toolbar class="md-background-bg">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <div layout="row">
-          <md-button
-            ng-if="!vm.secret"
-            ng-click="vm.send()"
-            class="md-raised md-blue-bg white-fg"
-            aria-label="Send message"
-          >
-            <span translate="WHATSAPP.SEND">SEND</span>
-          </md-button>
-          <md-button
-            ng-if="vm.secret"
-            ng-click="vm.addNote()"
-            class="md-raised md-blue-bg white-fg"
-            aria-label="Add note"
-          >
-            <span translate="WHATSAPP.ADD_NOTE">Add note</span>
-          </md-button>
-        </div>
-        <span ng-if="!vm.secret" class="title">{{vm.message.from}}</span>
-        <md-button
-          class="md-icon-button"
-          ng-click="vm.closeDialog()"
-          aria-label="Close dialog"
-          tranlate
-          translate-aria-label="WHATSAPP.CLOSE_DIALOG"
-        >
-          <md-icon md-font-icon="icon-close"></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <md-input-container ng-if="!vm.secret" class="md-block to">
-        <label translate="WHATSAPP.TO">To</label>
-        <md-chips
-          name="to"
-          ng-model="vm.message.to"
-          md-transform-chip="vm.transformContact($chip)"
-          md-separator-keys="vm.separatorKeys"
-          md-require-match="false"
-          md-max-chips="1"
-          required
-        >
-          <md-autocomplete
-            md-search-text="vm.searchTo"
-            md-items="contact in vm.contactSearch(vm.searchTo)"
-            md-item-text="contact.mobile"
-            md-min-length="3"
-          >
-            <md-item-template>
-              <span>{{ vm.getContact(contact) }}</span>
-            </md-item-template>
-          </md-autocomplete>
-        </md-chips>
-        <div ng-messages="composeForm.to.$error" role="alert">
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.TO_REQUIRED"
-              >To field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <!-- msEmojyArea directive -->
-      <ms-emoji-area
-        on-reply="vm.reply(event, body)"
-        ctrl-methods="vm.ctrlMethods"
-        ng-model="vm.message.body"
-        placeholder="'WHATSAPP.INSERT_MESSAGE_HERE'"
-      ></ms-emoji-area>
-      <!-- / msEmojyArea directive -->
-
-      <md-autocomplete
-        ng-if="!vm.secret"
-        class="padding-top-5"
-        md-selected-item="vm.selectedItem"
-        md-search-text="vm.searchText"
-        md-selected-item-change="vm.selectedItemChange(item)"
-        md-items="item in vm.searchTextChange(vm.searchText)"
-        md-item-text="item.value"
-        md-min-length="1"
-        md-floating-label="{{ 'WHATSAPP.CANNED_ANSWER_SEARCH' | translate}}"
-        class="input-show-hide no-container-margin"
-      >
-        <md-item-template>
-          <md-icon
-            ng-if="!item.WhatsappAccountId"
-            md-font-icon="icon-earth"
-            aria-label="alert whatsapp"
-            class="s16"
-          ></md-icon>
-          <md-icon
-            ng-if="item.WhatsappAccountId"
-            md-font-icon="icon-message-text"
-            aria-label="alert whatsapp"
-            class="s16 orange-fg"
-          ></md-icon>
-          <span md-highlight-text="vm.searchText" md-highlight-flags="^i"
-            >{{item.key}} - {{item.value}}</span
-          >
-        </md-item-template>
-
-        <md-not-found>
-          <span translate="WHATSAPP.CANNED_ANSWER_NOT_FOUND"
-            >No canned answers were found</span
-          >
-        </md-not-found>
-      </md-autocomplete>
-    </md-dialog-content>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeWhatsapp/dialog.html/dialog.html b/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeWhatsapp/dialog.html/dialog.html
new file mode 100644
index 0000000..b2f621b
--- /dev/null
+++ b/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/composeWhatsapp/dialog.html/dialog.html
@@ -0,0 +1,140 @@
+<md-dialog class="compose-dialog" aria-label="New Message">
+  <form class="md-inline-form" name="composeForm" novalidate>
+    <md-toolbar class="md-background-bg">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <div layout="row">
+          <md-button
+            ng-if="!vm.secret"
+            ng-click="vm.send()"
+            class="md-raised md-blue-bg white-fg"
+            aria-label="Send message"
+          >
+            <span translate="WHATSAPP.SEND">SEND</span>
+          </md-button>
+          <md-button
+            ng-if="vm.secret"
+            ng-click="vm.addNote()"
+            class="md-raised md-blue-bg white-fg"
+            aria-label="Add note"
+          >
+            <span translate="WHATSAPP.ADD_NOTE">Add note</span>
+          </md-button>
+        </div>
+        <span ng-if="!vm.secret" class="title">{{vm.message.from}}</span>
+        <md-button
+          class="md-icon-button"
+          ng-click="vm.closeDialog()"
+          aria-label="Close dialog"
+          tranlate
+          translate-aria-label="WHATSAPP.CLOSE_DIALOG"
+        >
+          <md-icon md-font-icon="icon-close"></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <md-input-container ng-if="!vm.secret" class="md-block to">
+        <label translate="WHATSAPP.TO">To</label>
+        <md-chips
+          name="to"
+          ng-model="vm.message.to"
+          md-transform-chip="vm.transformContact($chip)"
+          md-separator-keys="vm.separatorKeys"
+          md-require-match="false"
+          md-max-chips="1"
+          required
+        >
+          <md-autocomplete
+            md-search-text="vm.searchTo"
+            md-items="contact in vm.contactSearch(vm.searchTo)"
+            md-item-text="contact.mobile"
+            md-min-length="3"
+          >
+            <md-item-template>
+              <span>{{ vm.getContact(contact) }}</span>
+            </md-item-template>
+          </md-autocomplete>
+        </md-chips>
+        <div ng-messages="composeForm.to.$error" role="alert">
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.TO_REQUIRED"
+              >To field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <!-- msEmojyArea directive -->
+      <ms-emoji-area
+        on-reply="vm.reply(event, body)"
+        ctrl-methods="vm.ctrlMethods"
+        ng-model="vm.message.body"
+        placeholder="'WHATSAPP.INSERT_MESSAGE_HERE'"
+      ></ms-emoji-area>
+      <!-- / msEmojyArea directive -->
+
+      <md-autocomplete
+        ng-if="!vm.secret"
+        class="padding-top-5"
+        md-selected-item="vm.selectedItem"
+        md-search-text="vm.searchText"
+        md-selected-item-change="vm.selectedItemChange(item)"
+        md-items="item in vm.searchTextChange(vm.searchText)"
+        md-item-text="item.value"
+        md-min-length="1"
+        md-floating-label="{{ 'WHATSAPP.CANNED_ANSWER_SEARCH' | translate}}"
+        class="input-show-hide no-container-margin"
+      >
+        <md-item-template>
+          <md-icon
+            ng-if="!item.WhatsappAccountId"
+            md-font-icon="icon-earth"
+            aria-label="alert whatsapp"
+            class="s16"
+          ></md-icon>
+          <md-icon
+            ng-if="item.WhatsappAccountId"
+            md-font-icon="icon-message-text"
+            aria-label="alert whatsapp"
+            class="s16 orange-fg"
+          ></md-icon>
+          <span md-highlight-text="vm.searchText" md-highlight-flags="^i"
+            >{{item.key}} - {{item.value}}</span
+          >
+        </md-item-template>
+
+        <md-not-found>
+          <span translate="WHATSAPP.CANNED_ANSWER_NOT_FOUND"
+            >No canned answers were found</span
+          >
+        </md-not-found>
+      </md-autocomplete>
+    </md-dialog-content>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/dispose/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/dispose/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 90299fe..0000000
--- a/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/dispose/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,233 +0,0 @@
-<md-dialog
-  class="disposition-dialog"
-  aria-label="disposition"
-  ng-init="vm.onInit()"
->
-  <form name="dispositionForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-background-bg">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span
-          ng-if="!vm.interaction.closed"
-          class="title"
-          translate="DASHBOARDS.DISPOSE"
-        ></span>
-        <span
-          ng-if="vm.interaction.closed"
-          class="title"
-          translate="DASHBOARDS.INFO"
-        ></span>
-        <md-button
-          class="md-icon-button"
-          ng-click="vm.closeDialog()"
-          ng-if="!vm.mandatoryDisposition"
-        >
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="DASHBOARDS.DISPOSITION">Disposition</label>
-        <md-select
-          name="disposition"
-          ng-model="vm.firstLevelDisposition"
-          ng-change="vm.onDispositionChange('first')"
-          required
-        >
-          <md-option ng-value="null" ng-if="!vm.mandatoryDisposition"
-            >NONE</md-option
-          >
-          <md-option
-            ng-value="disposition"
-            ng-repeat="disposition in vm.dispositions | filter: { level: 'first' }"
-          >
-            {{ disposition.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="dispositionForm.disposition.$error"
-          ng-show="dispositionForm.disposition.$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="DASHBOARDS.ERRORS.DISPOSITION_REQUIRED"
-              >Disposition field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <div
-        ng-if="vm.firstLevelDisposition && vm.anySecondLevelDisposition"
-        layout="row"
-        layout-align="start center"
-      >
-        <md-input-container class="md-block" flex>
-          <label translate="DASHBOARDS.SECOND_LEVEL_DISPOSITION"
-            >Second Level Disposition</label
-          >
-          <md-select
-            name="secondLevelDisposition"
-            ng-model="vm.secondLevelDisposition"
-            ng-change="vm.onDispositionChange('second')"
-          >
-            <md-option
-              ng-value="disposition"
-              ng-repeat="disposition in vm.dispositions | filter: { level: 'second', ParentId: vm.firstLevelDisposition.id }"
-            >
-              {{ disposition.name }}</md-option
-            >
-          </md-select>
-        </md-input-container>
-        <md-button
-          ng-if="vm.secondLevelDisposition"
-          ng-click="vm.clearDispositionSelection('second')"
-          class="md-icon-button"
-        >
-          <md-icon
-            md-font-icon="icon-cancel"
-            aria-label="Clear second level disposition selection"
-          >
-          </md-icon>
-        </md-button>
-      </div>
-      <div
-        ng-if="vm.secondLevelDisposition && vm.anyThirdLevelDisposition"
-        layout="row"
-        layout-align="start center"
-      >
-        <md-input-container class="md-block" flex>
-          <label translate="DASHBOARDS.THIRD_LEVEL_DISPOSITION"
-            >Third Level Disposition</label
-          >
-          <md-select
-            name="thirdLevelDisposition"
-            ng-model="vm.thirdLevelDisposition"
-          >
-            <md-option
-              ng-value="disposition"
-              ng-repeat="disposition in vm.dispositions | filter: { level: 'third', ParentId: vm.secondLevelDisposition.id }"
-              ng-disabled="disposition.canSelect === false"
-              >{{ disposition.name }}</md-option
-            >
-          </md-select>
-        </md-input-container>
-        <md-button
-          ng-if="vm.thirdLevelDisposition"
-          ng-click="vm.clearDispositionSelection('third')"
-          class="md-icon-button"
-        >
-          <md-icon
-            md-font-icon="icon-cancel"
-            aria-label="Clear third level disposition selection"
-          >
-          </md-icon>
-        </md-button>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="DASHBOARDS.NOTE">Note</label>
-        <textarea
-          ng-model="vm.interaction.note"
-          md-maxlength="255"
-          max-rows="5"
-          autofocus
-        ></textarea>
-      </md-input-container>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-click="vm.saveDisposition()"
-          class="send-button md-accent md-raised"
-          ng-if="!vm.interaction.closed && (vm.firstLevelDisposition || vm.secondLevelDisposition || vm.thirdLevelDisposition)"
-          aria-label="CLOSE_AND_DISPOSE"
-          translate="DASHBOARDS.CLOSE_AND_DISPOSE"
-          translate-attr-aria-label="DASHBOARDS.CLOSE_AND_DISPOSE"
-        >
-          CLOSE AND DISPOSE
-        </md-button>
-        <md-button
-          type="submit"
-          ng-click="vm.saveDisposition(false)"
-          class="send-button md-accent md-raised"
-          ng-if="!vm.interaction.closed && !vm.firstLevelDisposition"
-          ng-disabled="vm.mandatoryDisposition"
-          aria-label="CLOSE_WITHOUT_DISPOSE"
-          translate="DASHBOARDS.CLOSE_WITHOUT_DISPOSE"
-          translate-attr-aria-label="DASHBOARDS.CLOSE_WITHOUT_DISPOSE"
-        >
-          CLOSE WITHOUT DISPOSE
-        </md-button>
-        <md-button
-          type="submit"
-          ng-click="vm.saveDisposition()"
-          class="send-button md-accent md-raised"
-          ng-if="vm.interaction.closed"
-          ng-disabled="vm.mandatoryDisposition && !vm.firstLevelDisposition"
-          aria-label="DISPOSE"
-          translate="DASHBOARDS.DISPOSE"
-          translate-attr-aria-label="DASHBOARDS.DISPOSE"
-        >
-          DISPOSE
-        </md-button>
-        <div ng-if="vm.mandatoryDisposition">
-          <md-icon
-            md-font-icon="icon-information-outline"
-            aria-label="Mandatory Disposition"
-          ></md-icon>
-          <span
-            class="no-margin font-size-12 line-height-30"
-            translate="DASHBOARDS.HELP.MANDATORY_DISPOSITION_ENABLED"
-          ></span>
-        </div>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/dispose/dialog.html/dialog.html b/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/dispose/dialog.html/dialog.html
new file mode 100644
index 0000000..90299fe
--- /dev/null
+++ b/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/dispose/dialog.html/dialog.html
@@ -0,0 +1,233 @@
+<md-dialog
+  class="disposition-dialog"
+  aria-label="disposition"
+  ng-init="vm.onInit()"
+>
+  <form name="dispositionForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-background-bg">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span
+          ng-if="!vm.interaction.closed"
+          class="title"
+          translate="DASHBOARDS.DISPOSE"
+        ></span>
+        <span
+          ng-if="vm.interaction.closed"
+          class="title"
+          translate="DASHBOARDS.INFO"
+        ></span>
+        <md-button
+          class="md-icon-button"
+          ng-click="vm.closeDialog()"
+          ng-if="!vm.mandatoryDisposition"
+        >
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="DASHBOARDS.DISPOSITION">Disposition</label>
+        <md-select
+          name="disposition"
+          ng-model="vm.firstLevelDisposition"
+          ng-change="vm.onDispositionChange('first')"
+          required
+        >
+          <md-option ng-value="null" ng-if="!vm.mandatoryDisposition"
+            >NONE</md-option
+          >
+          <md-option
+            ng-value="disposition"
+            ng-repeat="disposition in vm.dispositions | filter: { level: 'first' }"
+          >
+            {{ disposition.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="dispositionForm.disposition.$error"
+          ng-show="dispositionForm.disposition.$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="DASHBOARDS.ERRORS.DISPOSITION_REQUIRED"
+              >Disposition field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <div
+        ng-if="vm.firstLevelDisposition && vm.anySecondLevelDisposition"
+        layout="row"
+        layout-align="start center"
+      >
+        <md-input-container class="md-block" flex>
+          <label translate="DASHBOARDS.SECOND_LEVEL_DISPOSITION"
+            >Second Level Disposition</label
+          >
+          <md-select
+            name="secondLevelDisposition"
+            ng-model="vm.secondLevelDisposition"
+            ng-change="vm.onDispositionChange('second')"
+          >
+            <md-option
+              ng-value="disposition"
+              ng-repeat="disposition in vm.dispositions | filter: { level: 'second', ParentId: vm.firstLevelDisposition.id }"
+            >
+              {{ disposition.name }}</md-option
+            >
+          </md-select>
+        </md-input-container>
+        <md-button
+          ng-if="vm.secondLevelDisposition"
+          ng-click="vm.clearDispositionSelection('second')"
+          class="md-icon-button"
+        >
+          <md-icon
+            md-font-icon="icon-cancel"
+            aria-label="Clear second level disposition selection"
+          >
+          </md-icon>
+        </md-button>
+      </div>
+      <div
+        ng-if="vm.secondLevelDisposition && vm.anyThirdLevelDisposition"
+        layout="row"
+        layout-align="start center"
+      >
+        <md-input-container class="md-block" flex>
+          <label translate="DASHBOARDS.THIRD_LEVEL_DISPOSITION"
+            >Third Level Disposition</label
+          >
+          <md-select
+            name="thirdLevelDisposition"
+            ng-model="vm.thirdLevelDisposition"
+          >
+            <md-option
+              ng-value="disposition"
+              ng-repeat="disposition in vm.dispositions | filter: { level: 'third', ParentId: vm.secondLevelDisposition.id }"
+              ng-disabled="disposition.canSelect === false"
+              >{{ disposition.name }}</md-option
+            >
+          </md-select>
+        </md-input-container>
+        <md-button
+          ng-if="vm.thirdLevelDisposition"
+          ng-click="vm.clearDispositionSelection('third')"
+          class="md-icon-button"
+        >
+          <md-icon
+            md-font-icon="icon-cancel"
+            aria-label="Clear third level disposition selection"
+          >
+          </md-icon>
+        </md-button>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="DASHBOARDS.NOTE">Note</label>
+        <textarea
+          ng-model="vm.interaction.note"
+          md-maxlength="255"
+          max-rows="5"
+          autofocus
+        ></textarea>
+      </md-input-container>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-click="vm.saveDisposition()"
+          class="send-button md-accent md-raised"
+          ng-if="!vm.interaction.closed && (vm.firstLevelDisposition || vm.secondLevelDisposition || vm.thirdLevelDisposition)"
+          aria-label="CLOSE_AND_DISPOSE"
+          translate="DASHBOARDS.CLOSE_AND_DISPOSE"
+          translate-attr-aria-label="DASHBOARDS.CLOSE_AND_DISPOSE"
+        >
+          CLOSE AND DISPOSE
+        </md-button>
+        <md-button
+          type="submit"
+          ng-click="vm.saveDisposition(false)"
+          class="send-button md-accent md-raised"
+          ng-if="!vm.interaction.closed && !vm.firstLevelDisposition"
+          ng-disabled="vm.mandatoryDisposition"
+          aria-label="CLOSE_WITHOUT_DISPOSE"
+          translate="DASHBOARDS.CLOSE_WITHOUT_DISPOSE"
+          translate-attr-aria-label="DASHBOARDS.CLOSE_WITHOUT_DISPOSE"
+        >
+          CLOSE WITHOUT DISPOSE
+        </md-button>
+        <md-button
+          type="submit"
+          ng-click="vm.saveDisposition()"
+          class="send-button md-accent md-raised"
+          ng-if="vm.interaction.closed"
+          ng-disabled="vm.mandatoryDisposition && !vm.firstLevelDisposition"
+          aria-label="DISPOSE"
+          translate="DASHBOARDS.DISPOSE"
+          translate-attr-aria-label="DASHBOARDS.DISPOSE"
+        >
+          DISPOSE
+        </md-button>
+        <div ng-if="vm.mandatoryDisposition">
+          <md-icon
+            md-font-icon="icon-information-outline"
+            aria-label="Mandatory Disposition"
+          ></md-icon>
+          <span
+            class="no-margin font-size-12 line-height-30"
+            translate="DASHBOARDS.HELP.MANDATORY_DISPOSITION_ENABLED"
+          ></span>
+        </div>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/tag/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/tag/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index eee2393..0000000
--- a/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/tag/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,104 +0,0 @@
-<md-dialog class="tag-dialog" aria-label="tag">
-  <form name="tagForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-background-bg">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title" translate="DASHBOARDS.TAGS"></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <md-chips
-          ng-model="vm.interaction.Tags"
-          md-autocomplete-snap
-          md-require-match="vm.autocompleteRequireMatch"
-        >
-          <md-autocomplete
-            ng-blur="vm.searchText = ''"
-            md-min-length="0"
-            md-selected-item-change="vm.selectedItemChange"
-            md-selected-item="vm.selectedItem"
-            md-search-text="vm.searchText"
-            md-items="item in vm.tags.rows | filter:{ name: vm.searchText }"
-            md-item-text="item.name"
-            placeholder="Search for a tag"
-          >
-            <span md-highlight-text="vm.searchText">{{item.name}}</span>
-          </md-autocomplete>
-          <md-chip-template>
-            <span>
-              <strong>{{$chip.name}}</strong>
-            </span>
-          </md-chip-template>
-        </md-chips>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-click="vm.saveTag(false)"
-          ng-disabled="tagForm.$pristine"
-          class="send-button md-accent md-raised"
-          aria-label="TAG"
-          translate="DASHBOARDS.SAVE"
-          translate-attr-aria-label="DASHBOARDS.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/tag/dialog.html/dialog.html b/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/tag/dialog.html/dialog.html
new file mode 100644
index 0000000..eee2393
--- /dev/null
+++ b/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/tag/dialog.html/dialog.html
@@ -0,0 +1,104 @@
+<md-dialog class="tag-dialog" aria-label="tag">
+  <form name="tagForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-background-bg">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title" translate="DASHBOARDS.TAGS"></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <md-chips
+          ng-model="vm.interaction.Tags"
+          md-autocomplete-snap
+          md-require-match="vm.autocompleteRequireMatch"
+        >
+          <md-autocomplete
+            ng-blur="vm.searchText = ''"
+            md-min-length="0"
+            md-selected-item-change="vm.selectedItemChange"
+            md-selected-item="vm.selectedItem"
+            md-search-text="vm.searchText"
+            md-items="item in vm.tags.rows | filter:{ name: vm.searchText }"
+            md-item-text="item.name"
+            placeholder="Search for a tag"
+          >
+            <span md-highlight-text="vm.searchText">{{item.name}}</span>
+          </md-autocomplete>
+          <md-chip-template>
+            <span>
+              <strong>{{$chip.name}}</strong>
+            </span>
+          </md-chip-template>
+        </md-chips>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-click="vm.saveTag(false)"
+          ng-disabled="tagForm.$pristine"
+          class="send-button md-accent md-raised"
+          aria-label="TAG"
+          translate="DASHBOARDS.SAVE"
+          translate-attr-aria-label="DASHBOARDS.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/transfer/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/transfer/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 3c8229a..0000000
--- a/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/transfer/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,146 +0,0 @@
-<md-dialog class="disposition-dialog" aria-label="disposition">
-  <form name="transferForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-background-bg">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title" translate="DASHBOARDS.TRANSFER"></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog(false)">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <md-input-container class="md-block">
-        <label translate="DASHBOARDS.TYPE">Type</label>
-        <md-select name="type" ng-model="vm.transfer.type" required>
-          <md-option ng-value="'queue'" ng-if="vm.account.queueTransfer"
-            >Queue</md-option
-          >
-          <md-option ng-value="'agent'" ng-if="vm.account.agentTransfer"
-            >Agent</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="transferForm.type.$error"
-          ng-show="transferForm.type.$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="DASHBOARDS.ERRORS.TYPE_REQUIRED"
-              >Type field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <md-input-container class="md-block" ng-if="vm.transfer.type === 'queue'">
-        <label translate="DASHBOARDS.QUEUES">Queues</label>
-        <md-select name="queue" ng-model="vm.transfer.id" required>
-          <md-option ng-value="queue.id" ng-repeat="queue in vm.queues.rows"
-            >{{ queue.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="transferForm.queue.$error"
-          ng-show="transferForm.queue.$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="DASHBOARDS.ERRORS.QUEUE_REQUIRED"
-              >Queue field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <md-input-container class="md-block" ng-if="vm.transfer.type === 'agent'">
-        <label translate="DASHBOARDS.AGENTS">Agents</label>
-        <md-select name="agent" ng-model="vm.transfer.id" required>
-          <md-option
-            ng-value="agent.id"
-            ng-repeat="agent in vm.agents.rows"
-            ng-if="vm.currentUser.id != agent.id"
-            >{{ agent.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="transferForm.agent.$error"
-          ng-show="transferForm.agent.$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="DASHBOARDS.ERRORS.AGENT_REQUIRED"
-              >Agent field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <!-- <md-dialog-actions ng-if="!vm.interaction.closed || !vm.interaction.disposition" layout="row" layout-align="space-between center"> -->
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-click="vm.onTransfer(true)"
-          ng-disabled="transferForm.$pristine"
-          class="send-button md-accent md-raised"
-          aria-label="DASHBOARDS.TRANSFER"
-          translate="DASHBOARDS.TRANSFER"
-          translate-attr-aria-label="DASHBOARDS.TRANSFER"
-        >
-          TRANSFER
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/transfer/dialog.html/dialog.html b/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/transfer/dialog.html/dialog.html
new file mode 100644
index 0000000..3c8229a
--- /dev/null
+++ b/public/src/js/modules/main/apps/dashboards/views/general/agent/interaction/transfer/dialog.html/dialog.html
@@ -0,0 +1,146 @@
+<md-dialog class="disposition-dialog" aria-label="disposition">
+  <form name="transferForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-background-bg">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title" translate="DASHBOARDS.TRANSFER"></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog(false)">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <md-input-container class="md-block">
+        <label translate="DASHBOARDS.TYPE">Type</label>
+        <md-select name="type" ng-model="vm.transfer.type" required>
+          <md-option ng-value="'queue'" ng-if="vm.account.queueTransfer"
+            >Queue</md-option
+          >
+          <md-option ng-value="'agent'" ng-if="vm.account.agentTransfer"
+            >Agent</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="transferForm.type.$error"
+          ng-show="transferForm.type.$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="DASHBOARDS.ERRORS.TYPE_REQUIRED"
+              >Type field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <md-input-container class="md-block" ng-if="vm.transfer.type === 'queue'">
+        <label translate="DASHBOARDS.QUEUES">Queues</label>
+        <md-select name="queue" ng-model="vm.transfer.id" required>
+          <md-option ng-value="queue.id" ng-repeat="queue in vm.queues.rows"
+            >{{ queue.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="transferForm.queue.$error"
+          ng-show="transferForm.queue.$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="DASHBOARDS.ERRORS.QUEUE_REQUIRED"
+              >Queue field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <md-input-container class="md-block" ng-if="vm.transfer.type === 'agent'">
+        <label translate="DASHBOARDS.AGENTS">Agents</label>
+        <md-select name="agent" ng-model="vm.transfer.id" required>
+          <md-option
+            ng-value="agent.id"
+            ng-repeat="agent in vm.agents.rows"
+            ng-if="vm.currentUser.id != agent.id"
+            >{{ agent.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="transferForm.agent.$error"
+          ng-show="transferForm.agent.$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="DASHBOARDS.ERRORS.AGENT_REQUIRED"
+              >Agent field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <!-- <md-dialog-actions ng-if="!vm.interaction.closed || !vm.interaction.disposition" layout="row" layout-align="space-between center"> -->
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-click="vm.onTransfer(true)"
+          ng-disabled="transferForm.$pristine"
+          class="send-button md-accent md-raised"
+          aria-label="DASHBOARDS.TRANSFER"
+          translate="DASHBOARDS.TRANSFER"
+          translate-attr-aria-label="DASHBOARDS.TRANSFER"
+        >
+          TRANSFER
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/user/chat/user.general.chat.html/user.general.chat-[chunkhash].html b/public/src/js/modules/main/apps/dashboards/views/general/user/chat/user.general.chat.html/user.general.chat-[chunkhash].html
deleted file mode 100644
index ab4aeb7..0000000
--- a/public/src/js/modules/main/apps/dashboards/views/general/user/chat/user.general.chat.html/user.general.chat-[chunkhash].html
+++ /dev/null
@@ -1,642 +0,0 @@
-<!-- WIDGET INBOUND -->
-<div class="dashboard-container md-background-bg md-whiteframe-1dp">
-  <div class="pb-16" layout="row" layout-align="start center">
-    <md-icon md-font-icon="icon-hangouts" class="m-0 mr-16"></md-icon>
-    <div
-      class="h2 secondary-text"
-      translate="DASHBOARDS.TODAY_INTERACTIONS_STATS"
-    >
-      Today Interactions STATS
-    </div>
-  </div>
-
-  <!-- WIDGET GROUP -->
-  <div class="widget-group" layout="row" flex="100" layout-wrap>
-    <!-- WIDGET 1 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="ph-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="light-blue-fg font-size-52 line-height-72">
-            {{vm.inbound.waiting || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.WAITING' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 light-blue-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.WAITING_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.WAITING' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 1 -->
-
-    <!-- WIDGET 3 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="orange-fg font-size-52 line-height-72">
-            {{vm.inbound.talking || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.OPENED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 orange-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.OPENED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.OPENED' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 3 -->
-
-    <!-- WIDGET 2 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="ph-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="red-fg font-size-52 line-height-72">
-            {{vm.inbound.answered || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.MANAGED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 red-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.MANAGED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.MANAGED' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 2 -->
-
-    <!-- WIDGET 4 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="blue-grey-fg font-size-52 line-height-72">
-            {{vm.inbound.abandoned || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.ABANDONED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 blue-grey-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.ABANDONED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.ABANDONED' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 4 -->
-
-    <!-- WIDGET 4 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="blue-green-fg font-size-52 line-height-72">
-            {{vm.inbound.total || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.TOTAL_OFFERED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 blue-green-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.TOTAL_OFFERED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.TOTAL_OFFERED' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 4 -->
-  </div>
-  <!-- / WIDGET GROUP -->
-
-  <!-- WIDGET GROUP -->
-  <div class="widget-group" layout="row" flex="100" layout-wrap>
-    <!-- WIDGET 1 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="ph-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="light-blue-fg font-size-42 line-height-72">
-            {{ vm.inbound.avgHoldTime || '00:00:00' }}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.AVG_HOLD_TIME' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 light-blue-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.AVG_HOLD_TIME_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.AVG_HOLD_TIME' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 1 -->
-
-    <!-- WIDGET 3 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="orange-fg font-size-42 line-height-72">
-            {{ vm.inbound.avgTalkTime || '00:00:00' }}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.AVG_MANAGED_TIME' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 orange-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.AVG_MANAGED_TIME_TEXT' | translate |
-            uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.AVG_MANAGED_TIME' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 3 -->
-
-    <!-- WIDGET 2 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="ph-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="red-fg font-size-42 line-height-72">
-            {{ vm.inbound.answerRate || 0 }}%
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.MANAGED_RATE' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 red-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.MANAGED_RATE_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.MANAGED_RATE' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 2 -->
-
-    <!-- WIDGET 4 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="blue-grey-fg font-size-42 line-height-72">
-            {{ vm.inbound.abandonRate || 0 }}%
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.ABANDONED_RATE' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 blue-grey-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.ABANDONED_RATE_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.ABANDONED_RATE' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 4 -->
-
-    <!-- WIDGET 4 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="blue-green-fg font-size-52 line-height-72">
-            {{vm.inbound.unmanaged || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.UNMANAGED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 blue-green-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.UNMANAGED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.UNMANAGED' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 4 -->
-  </div>
-  <!-- / WIDGET GROUP -->
-</div>
-<!-- / WIDGET INBOUND -->
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/user/chat/user.general.chat.html/user.general.chat.html b/public/src/js/modules/main/apps/dashboards/views/general/user/chat/user.general.chat.html/user.general.chat.html
new file mode 100644
index 0000000..ab4aeb7
--- /dev/null
+++ b/public/src/js/modules/main/apps/dashboards/views/general/user/chat/user.general.chat.html/user.general.chat.html
@@ -0,0 +1,642 @@
+<!-- WIDGET INBOUND -->
+<div class="dashboard-container md-background-bg md-whiteframe-1dp">
+  <div class="pb-16" layout="row" layout-align="start center">
+    <md-icon md-font-icon="icon-hangouts" class="m-0 mr-16"></md-icon>
+    <div
+      class="h2 secondary-text"
+      translate="DASHBOARDS.TODAY_INTERACTIONS_STATS"
+    >
+      Today Interactions STATS
+    </div>
+  </div>
+
+  <!-- WIDGET GROUP -->
+  <div class="widget-group" layout="row" flex="100" layout-wrap>
+    <!-- WIDGET 1 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="ph-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="light-blue-fg font-size-52 line-height-72">
+            {{vm.inbound.waiting || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.WAITING' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 light-blue-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.WAITING_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.WAITING' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 1 -->
+
+    <!-- WIDGET 3 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="orange-fg font-size-52 line-height-72">
+            {{vm.inbound.talking || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.OPENED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 orange-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.OPENED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.OPENED' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 3 -->
+
+    <!-- WIDGET 2 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="ph-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="red-fg font-size-52 line-height-72">
+            {{vm.inbound.answered || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.MANAGED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 red-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.MANAGED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.MANAGED' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 2 -->
+
+    <!-- WIDGET 4 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="blue-grey-fg font-size-52 line-height-72">
+            {{vm.inbound.abandoned || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.ABANDONED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 blue-grey-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.ABANDONED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.ABANDONED' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 4 -->
+
+    <!-- WIDGET 4 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="blue-green-fg font-size-52 line-height-72">
+            {{vm.inbound.total || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.TOTAL_OFFERED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 blue-green-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.TOTAL_OFFERED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.TOTAL_OFFERED' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 4 -->
+  </div>
+  <!-- / WIDGET GROUP -->
+
+  <!-- WIDGET GROUP -->
+  <div class="widget-group" layout="row" flex="100" layout-wrap>
+    <!-- WIDGET 1 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="ph-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="light-blue-fg font-size-42 line-height-72">
+            {{ vm.inbound.avgHoldTime || '00:00:00' }}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.AVG_HOLD_TIME' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 light-blue-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.AVG_HOLD_TIME_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.AVG_HOLD_TIME' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 1 -->
+
+    <!-- WIDGET 3 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="orange-fg font-size-42 line-height-72">
+            {{ vm.inbound.avgTalkTime || '00:00:00' }}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.AVG_MANAGED_TIME' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 orange-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.AVG_MANAGED_TIME_TEXT' | translate |
+            uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.AVG_MANAGED_TIME' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 3 -->
+
+    <!-- WIDGET 2 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="ph-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="red-fg font-size-42 line-height-72">
+            {{ vm.inbound.answerRate || 0 }}%
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.MANAGED_RATE' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 red-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.MANAGED_RATE_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.MANAGED_RATE' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 2 -->
+
+    <!-- WIDGET 4 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="blue-grey-fg font-size-42 line-height-72">
+            {{ vm.inbound.abandonRate || 0 }}%
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.ABANDONED_RATE' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 blue-grey-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.ABANDONED_RATE_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.ABANDONED_RATE' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 4 -->
+
+    <!-- WIDGET 4 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="blue-green-fg font-size-52 line-height-72">
+            {{vm.inbound.unmanaged || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.UNMANAGED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 blue-green-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.UNMANAGED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.UNMANAGED' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 4 -->
+  </div>
+  <!-- / WIDGET GROUP -->
+</div>
+<!-- / WIDGET INBOUND -->
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/user/dialer/user.general.dialer.html/user.general.dialer-[chunkhash].html b/public/src/js/modules/main/apps/dashboards/views/general/user/dialer/user.general.dialer.html/user.general.dialer-[chunkhash].html
deleted file mode 100644
index a12df23..0000000
--- a/public/src/js/modules/main/apps/dashboards/views/general/user/dialer/user.general.dialer.html/user.general.dialer-[chunkhash].html
+++ /dev/null
@@ -1,802 +0,0 @@
-<!-- WIDGET INBOUND -->
-<div class="dashboard-container md-background-bg md-whiteframe-1dp">
-  <div class="pb-16" layout="row" layout-align="start center">
-    <md-icon md-font-icon="icon-phone-outgoing" class="m-0 mr-16"></md-icon>
-    <div
-      class="h2 secondary-text"
-      translate="DASHBOARDS.TODAY_MOTION_BULL_STATS"
-    >
-      Today Motion Bull STATS
-    </div>
-  </div>
-
-  <!-- WIDGET GROUP -->
-  <div class="widget-group" layout="row" flex="100" layout-wrap>
-    <!-- WIDGET 1 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="ph-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-          <md-button
-            style="cursor: auto"
-            class="md-icon-button"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-timelapse"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="light-blue-fg font-size-52 line-height-72">
-            {{vm.inbound.waiting || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.VOICE_WAITING' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 light-blue-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.VOICE_WAITING_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.VOICE_WAITING' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 1 -->
-
-    <!-- WIDGET 3 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-          <md-button
-            style="cursor: auto"
-            class="md-icon-button"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-phone-in-talk"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="orange-fg font-size-52 line-height-72">
-            {{(vm.inbound.talking || 0) + (vm.inbound.pTalking || 0)}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.VOICE_TALKING' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 orange-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.VOICE_TALKING_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.VOICE_TALKING' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 3 -->
-
-    <!-- WIDGET 2 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="ph-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-          <md-button
-            style="cursor: auto"
-            class="md-icon-button"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-phone"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="red-fg font-size-52 line-height-72">
-            {{vm.inbound.answered || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.VOICE_ANSWERED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 red-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.VOICE_ANSWERED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.VOICE_ANSWERED' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 2 -->
-
-    <!-- WIDGET 4 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-          <md-button
-            style="cursor: auto"
-            class="md-icon-button"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-phone-missed"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="blue-grey-fg font-size-52 line-height-72">
-            {{vm.inbound.outboundDropCallsDayCallersExit || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.VOICE_ABANDONED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 blue-grey-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.VOICE_ABANDONED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.ABANDON_RATE' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 4 -->
-
-    <!-- WIDGET 4 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-          <md-button
-            style="cursor: auto"
-            class="md-icon-button"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-phone-outgoing"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="blue-green-fg font-size-52 line-height-72">
-            {{vm.inbound.outboundDropCallsDayTimeout || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.DROPPED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 blue-green-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.DROPPED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.DROPPED' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 4 -->
-  </div>
-  <!-- / WIDGET GROUP -->
-
-  <!-- WIDGET GROUP -->
-  <div class="widget-group" layout="row" flex="100" layout-wrap>
-    <!-- WIDGET 4 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-          <md-button
-            style="cursor: auto"
-            class="md-icon-button"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-phone-dots"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="blue-green-fg font-size-52 line-height-72">
-            {{vm.inbound.originated || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.ORIGINATED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 blue-green-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.ORIGINATED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.ORIGINATED' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 4 -->
-
-    <!-- WIDGET 3 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-          <md-button
-            style="cursor: auto"
-            class="md-icon-button"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-phone-in-talk"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="orange-fg font-size-42 line-height-72">
-            {{ vm.inbound.avgTalkTime || '00:00:00' }}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.VOICE_AVG_TALK_TIME' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 orange-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.VOICE_AVG_TALK_TIME_TEXT' | translate |
-            uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.VOICE_AVG_TALK_TIME' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 3 -->
-
-    <!-- WIDGET 2 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="ph-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-          <md-button
-            style="cursor: auto"
-            class="md-icon-button"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-percent"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="red-fg font-size-42 line-height-72">
-            {{ vm.inbound.outboundanswerRate || 0 |number : 1}}%
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.VOICE_ANSWER_RATE' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 red-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.VOICE_ANSWER_RATE_TEXT' | translate |
-            uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.VOICE_ANSWER_RATE' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 2 -->
-
-    <!-- WIDGET 4 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-          <md-button
-            style="cursor: auto"
-            class="md-icon-button"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-percent"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="blue-grey-fg font-size-42 line-height-72">
-            {{ vm.inbound.outboundAbandonRate || 0}}%
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.VOICE_ABANDON_RATE' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 blue-grey-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.VOICE_ABANDON_RATE_TEXT' | translate |
-            uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.VOICE_ABANDON_RATE' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 4 -->
-
-    <!-- WIDGET 4 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-          <md-button
-            style="cursor: auto"
-            class="md-icon-button"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-percent"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="blue-grey-fg font-size-42 line-height-72">
-            {{ vm.inbound.outboundDropRate }}%
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.DROP_RATE' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 blue-grey-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.DROP_RATE_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.DROP_RATE' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 4 -->
-  </div>
-  <!-- / WIDGET GROUP -->
-</div>
-<!-- / WIDGET OUTBOUND -->
-
-<!-- WIDGET INBOUND -->
-<div class="dashboard-container md-background-bg md-whiteframe-1dp">
-  <div class="pb-16" layout="row" layout-align="start center">
-    <md-icon md-font-icon="icon-phone-outgoing" class="m-0 mr-16"></md-icon>
-    <div
-      class="h2 secondary-text"
-      translate="DASHBOARDS.TODAY_IVR_CAMPAIGNS_STATS"
-    >
-      Today IVR campaigns stats
-    </div>
-  </div>
-
-  <!-- WIDGET GROUP -->
-  <div class="widget-group" layout="row" flex="100" layout-wrap>
-    <!-- WIDGET 4 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-          <md-button
-            style="cursor: auto"
-            class="md-icon-button"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-phone-dots"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="blue-green-fg font-size-52 line-height-72">
-            {{vm.ivr.originated || 0}}/{{vm.ivr.limitCalls || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.ORIGINATED' | translate |
-            uppercase}}/{{'DASHBOARDS.LIMITED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 blue-green-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.LIMITED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.ORIGINATEDLIMITED' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 4 -->
-  </div>
-  <!-- / WIDGET GROUP -->
-</div>
-<!-- / WIDGET IVR -->
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/user/dialer/user.general.dialer.html/user.general.dialer.html b/public/src/js/modules/main/apps/dashboards/views/general/user/dialer/user.general.dialer.html/user.general.dialer.html
new file mode 100644
index 0000000..a12df23
--- /dev/null
+++ b/public/src/js/modules/main/apps/dashboards/views/general/user/dialer/user.general.dialer.html/user.general.dialer.html
@@ -0,0 +1,802 @@
+<!-- WIDGET INBOUND -->
+<div class="dashboard-container md-background-bg md-whiteframe-1dp">
+  <div class="pb-16" layout="row" layout-align="start center">
+    <md-icon md-font-icon="icon-phone-outgoing" class="m-0 mr-16"></md-icon>
+    <div
+      class="h2 secondary-text"
+      translate="DASHBOARDS.TODAY_MOTION_BULL_STATS"
+    >
+      Today Motion Bull STATS
+    </div>
+  </div>
+
+  <!-- WIDGET GROUP -->
+  <div class="widget-group" layout="row" flex="100" layout-wrap>
+    <!-- WIDGET 1 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="ph-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+          <md-button
+            style="cursor: auto"
+            class="md-icon-button"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-timelapse"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="light-blue-fg font-size-52 line-height-72">
+            {{vm.inbound.waiting || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.VOICE_WAITING' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 light-blue-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.VOICE_WAITING_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.VOICE_WAITING' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 1 -->
+
+    <!-- WIDGET 3 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+          <md-button
+            style="cursor: auto"
+            class="md-icon-button"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-phone-in-talk"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="orange-fg font-size-52 line-height-72">
+            {{(vm.inbound.talking || 0) + (vm.inbound.pTalking || 0)}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.VOICE_TALKING' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 orange-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.VOICE_TALKING_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.VOICE_TALKING' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 3 -->
+
+    <!-- WIDGET 2 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="ph-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+          <md-button
+            style="cursor: auto"
+            class="md-icon-button"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-phone"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="red-fg font-size-52 line-height-72">
+            {{vm.inbound.answered || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.VOICE_ANSWERED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 red-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.VOICE_ANSWERED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.VOICE_ANSWERED' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 2 -->
+
+    <!-- WIDGET 4 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+          <md-button
+            style="cursor: auto"
+            class="md-icon-button"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-phone-missed"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="blue-grey-fg font-size-52 line-height-72">
+            {{vm.inbound.outboundDropCallsDayCallersExit || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.VOICE_ABANDONED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 blue-grey-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.VOICE_ABANDONED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.ABANDON_RATE' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 4 -->
+
+    <!-- WIDGET 4 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+          <md-button
+            style="cursor: auto"
+            class="md-icon-button"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-phone-outgoing"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="blue-green-fg font-size-52 line-height-72">
+            {{vm.inbound.outboundDropCallsDayTimeout || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.DROPPED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 blue-green-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.DROPPED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.DROPPED' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 4 -->
+  </div>
+  <!-- / WIDGET GROUP -->
+
+  <!-- WIDGET GROUP -->
+  <div class="widget-group" layout="row" flex="100" layout-wrap>
+    <!-- WIDGET 4 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+          <md-button
+            style="cursor: auto"
+            class="md-icon-button"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-phone-dots"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="blue-green-fg font-size-52 line-height-72">
+            {{vm.inbound.originated || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.ORIGINATED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 blue-green-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.ORIGINATED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.ORIGINATED' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 4 -->
+
+    <!-- WIDGET 3 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+          <md-button
+            style="cursor: auto"
+            class="md-icon-button"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-phone-in-talk"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="orange-fg font-size-42 line-height-72">
+            {{ vm.inbound.avgTalkTime || '00:00:00' }}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.VOICE_AVG_TALK_TIME' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 orange-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.VOICE_AVG_TALK_TIME_TEXT' | translate |
+            uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.VOICE_AVG_TALK_TIME' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 3 -->
+
+    <!-- WIDGET 2 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="ph-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+          <md-button
+            style="cursor: auto"
+            class="md-icon-button"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-percent"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="red-fg font-size-42 line-height-72">
+            {{ vm.inbound.outboundanswerRate || 0 |number : 1}}%
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.VOICE_ANSWER_RATE' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 red-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.VOICE_ANSWER_RATE_TEXT' | translate |
+            uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.VOICE_ANSWER_RATE' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 2 -->
+
+    <!-- WIDGET 4 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+          <md-button
+            style="cursor: auto"
+            class="md-icon-button"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-percent"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="blue-grey-fg font-size-42 line-height-72">
+            {{ vm.inbound.outboundAbandonRate || 0}}%
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.VOICE_ABANDON_RATE' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 blue-grey-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.VOICE_ABANDON_RATE_TEXT' | translate |
+            uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.VOICE_ABANDON_RATE' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 4 -->
+
+    <!-- WIDGET 4 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+          <md-button
+            style="cursor: auto"
+            class="md-icon-button"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-percent"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="blue-grey-fg font-size-42 line-height-72">
+            {{ vm.inbound.outboundDropRate }}%
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.DROP_RATE' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 blue-grey-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.DROP_RATE_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.DROP_RATE' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 4 -->
+  </div>
+  <!-- / WIDGET GROUP -->
+</div>
+<!-- / WIDGET OUTBOUND -->
+
+<!-- WIDGET INBOUND -->
+<div class="dashboard-container md-background-bg md-whiteframe-1dp">
+  <div class="pb-16" layout="row" layout-align="start center">
+    <md-icon md-font-icon="icon-phone-outgoing" class="m-0 mr-16"></md-icon>
+    <div
+      class="h2 secondary-text"
+      translate="DASHBOARDS.TODAY_IVR_CAMPAIGNS_STATS"
+    >
+      Today IVR campaigns stats
+    </div>
+  </div>
+
+  <!-- WIDGET GROUP -->
+  <div class="widget-group" layout="row" flex="100" layout-wrap>
+    <!-- WIDGET 4 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+          <md-button
+            style="cursor: auto"
+            class="md-icon-button"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-phone-dots"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="blue-green-fg font-size-52 line-height-72">
+            {{vm.ivr.originated || 0}}/{{vm.ivr.limitCalls || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.ORIGINATED' | translate |
+            uppercase}}/{{'DASHBOARDS.LIMITED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 blue-green-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.LIMITED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.ORIGINATEDLIMITED' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 4 -->
+  </div>
+  <!-- / WIDGET GROUP -->
+</div>
+<!-- / WIDGET IVR -->
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/user/fax/user.general.fax.html/user.general.fax-[chunkhash].html b/public/src/js/modules/main/apps/dashboards/views/general/user/fax/user.general.fax.html/user.general.fax-[chunkhash].html
deleted file mode 100644
index 6e40f14..0000000
--- a/public/src/js/modules/main/apps/dashboards/views/general/user/fax/user.general.fax.html/user.general.fax-[chunkhash].html
+++ /dev/null
@@ -1,517 +0,0 @@
-<!-- WIDGET INBOUND -->
-<div class="dashboard-container md-background-bg md-whiteframe-1dp">
-  <div class="pb-16" layout="row" layout-align="start center">
-    <md-icon md-font-icon="icon-deskphone" class="m-0 mr-16"></md-icon>
-    <div
-      class="h2 secondary-text"
-      translate="DASHBOARDS.TODAY_INTERACTIONS_STATS"
-    >
-      Today Interactions STATS
-    </div>
-  </div>
-
-  <!-- WIDGET GROUP -->
-  <div class="widget-group" layout="row" flex="100" layout-wrap>
-    <!-- WIDGET 1 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="ph-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="light-blue-fg font-size-52 line-height-72">
-            {{vm.inbound.waiting || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.WAITING' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 light-blue-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.WAITING_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.WAITING' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 1 -->
-
-    <!-- WIDGET 3 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="orange-fg font-size-52 line-height-72">
-            {{vm.inbound.talking || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.OPENED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 orange-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.OPENED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.OPENED' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 3 -->
-
-    <!-- WIDGET 2 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="ph-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="red-fg font-size-52 line-height-72">
-            {{vm.inbound.answered || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.MANAGED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 red-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.MANAGED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.MANAGED' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 2 -->
-
-    <!-- WIDGET 4 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="blue-green-fg font-size-52 line-height-72">
-            {{vm.inbound.unmanaged || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.UNMANAGED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 blue-green-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.UNMANAGED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.UNMANAGED' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 4 -->
-
-    <!-- WIDGET 4 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="blue-green-fg font-size-52 line-height-72">
-            {{vm.inbound.total || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.TOTAL_OFFERED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 blue-green-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.TOTAL_OFFERED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.TOTAL_OFFERED' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 4 -->
-  </div>
-  <!-- / WIDGET GROUP -->
-
-  <!-- WIDGET GROUP -->
-  <div class="widget-group" layout="row" flex="100" layout-wrap>
-    <!-- WIDGET 1 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="50"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="ph-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="light-blue-fg font-size-42 line-height-72">
-            {{ vm.inbound.avgHoldTime || '00:00:00' }}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.AVG_HOLD_TIME' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 light-blue-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.AVG_HOLD_TIME_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.AVG_HOLD_TIME' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 1 -->
-
-    <!-- WIDGET 2 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="25"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="ph-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="red-fg font-size-42 line-height-72">
-            {{ vm.inbound.answerRate || 0 }}%
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.MANAGED_RATE' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 red-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.MANAGED_RATE_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.MANAGED_RATE' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 2 -->
-
-    <!-- WIDGET 4 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="25"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="blue-grey-fg font-size-42 line-height-72">
-            {{ vm.inbound.abandonRate || 0 }}%
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.UNMANAGED_RATE' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 blue-grey-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.UNMANAGED_RATE_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.UNMANAGED_RATE' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 4 -->
-  </div>
-  <!-- / WIDGET GROUP -->
-</div>
-<!-- / WIDGET INBOUND -->
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/user/fax/user.general.fax.html/user.general.fax.html b/public/src/js/modules/main/apps/dashboards/views/general/user/fax/user.general.fax.html/user.general.fax.html
new file mode 100644
index 0000000..6e40f14
--- /dev/null
+++ b/public/src/js/modules/main/apps/dashboards/views/general/user/fax/user.general.fax.html/user.general.fax.html
@@ -0,0 +1,517 @@
+<!-- WIDGET INBOUND -->
+<div class="dashboard-container md-background-bg md-whiteframe-1dp">
+  <div class="pb-16" layout="row" layout-align="start center">
+    <md-icon md-font-icon="icon-deskphone" class="m-0 mr-16"></md-icon>
+    <div
+      class="h2 secondary-text"
+      translate="DASHBOARDS.TODAY_INTERACTIONS_STATS"
+    >
+      Today Interactions STATS
+    </div>
+  </div>
+
+  <!-- WIDGET GROUP -->
+  <div class="widget-group" layout="row" flex="100" layout-wrap>
+    <!-- WIDGET 1 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="ph-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="light-blue-fg font-size-52 line-height-72">
+            {{vm.inbound.waiting || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.WAITING' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 light-blue-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.WAITING_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.WAITING' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 1 -->
+
+    <!-- WIDGET 3 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="orange-fg font-size-52 line-height-72">
+            {{vm.inbound.talking || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.OPENED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 orange-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.OPENED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.OPENED' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 3 -->
+
+    <!-- WIDGET 2 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="ph-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="red-fg font-size-52 line-height-72">
+            {{vm.inbound.answered || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.MANAGED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 red-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.MANAGED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.MANAGED' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 2 -->
+
+    <!-- WIDGET 4 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="blue-green-fg font-size-52 line-height-72">
+            {{vm.inbound.unmanaged || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.UNMANAGED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 blue-green-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.UNMANAGED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.UNMANAGED' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 4 -->
+
+    <!-- WIDGET 4 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="blue-green-fg font-size-52 line-height-72">
+            {{vm.inbound.total || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.TOTAL_OFFERED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 blue-green-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.TOTAL_OFFERED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.TOTAL_OFFERED' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 4 -->
+  </div>
+  <!-- / WIDGET GROUP -->
+
+  <!-- WIDGET GROUP -->
+  <div class="widget-group" layout="row" flex="100" layout-wrap>
+    <!-- WIDGET 1 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="50"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="ph-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="light-blue-fg font-size-42 line-height-72">
+            {{ vm.inbound.avgHoldTime || '00:00:00' }}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.AVG_HOLD_TIME' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 light-blue-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.AVG_HOLD_TIME_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.AVG_HOLD_TIME' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 1 -->
+
+    <!-- WIDGET 2 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="25"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="ph-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="red-fg font-size-42 line-height-72">
+            {{ vm.inbound.answerRate || 0 }}%
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.MANAGED_RATE' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 red-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.MANAGED_RATE_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.MANAGED_RATE' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 2 -->
+
+    <!-- WIDGET 4 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="25"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="blue-grey-fg font-size-42 line-height-72">
+            {{ vm.inbound.abandonRate || 0 }}%
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.UNMANAGED_RATE' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 blue-grey-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.UNMANAGED_RATE_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.UNMANAGED_RATE' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 4 -->
+  </div>
+  <!-- / WIDGET GROUP -->
+</div>
+<!-- / WIDGET INBOUND -->
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/user/mail/user.general.mail.html/user.general.mail-[chunkhash].html b/public/src/js/modules/main/apps/dashboards/views/general/user/mail/user.general.mail.html/user.general.mail-[chunkhash].html
deleted file mode 100644
index d64af77..0000000
--- a/public/src/js/modules/main/apps/dashboards/views/general/user/mail/user.general.mail.html/user.general.mail-[chunkhash].html
+++ /dev/null
@@ -1,517 +0,0 @@
-<!-- WIDGET INBOUND -->
-<div class="dashboard-container md-background-bg md-whiteframe-1dp">
-  <div class="pb-16" layout="row" layout-align="start center">
-    <md-icon md-font-icon="icon-email" class="m-0 mr-16"></md-icon>
-    <div
-      class="h2 secondary-text"
-      translate="DASHBOARDS.TODAY_INTERACTIONS_STATS"
-    >
-      Today Interactions STATS
-    </div>
-  </div>
-
-  <!-- WIDGET GROUP -->
-  <div class="widget-group" layout="row" flex="100" layout-wrap>
-    <!-- WIDGET 1 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="ph-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="light-blue-fg font-size-52 line-height-72">
-            {{vm.inbound.waiting || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.WAITING' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 light-blue-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.WAITING_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.WAITING' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 1 -->
-
-    <!-- WIDGET 3 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="orange-fg font-size-52 line-height-72">
-            {{vm.inbound.talking || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.OPENED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 orange-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.OPENED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.OPENED' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 3 -->
-
-    <!-- WIDGET 2 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="ph-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="red-fg font-size-52 line-height-72">
-            {{vm.inbound.answered || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.MANAGED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 red-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.MANAGED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.MANAGED' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 2 -->
-
-    <!-- WIDGET 4 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="blue-green-fg font-size-52 line-height-72">
-            {{vm.inbound.unmanaged || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.UNMANAGED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 blue-green-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.UNMANAGED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.UNMANAGED' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 4 -->
-
-    <!-- WIDGET 4 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="blue-green-fg font-size-52 line-height-72">
-            {{vm.inbound.total || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.TOTAL_OFFERED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 blue-green-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.TOTAL_OFFERED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.TOTAL_OFFERED' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 4 -->
-  </div>
-  <!-- / WIDGET GROUP -->
-
-  <!-- WIDGET GROUP -->
-  <div class="widget-group" layout="row" flex="100" layout-wrap>
-    <!-- WIDGET 1 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="50"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="ph-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="light-blue-fg font-size-42 line-height-72">
-            {{ vm.inbound.avgHoldTime || '00:00:00' }}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.AVG_HOLD_TIME' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 light-blue-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.AVG_HOLD_TIME_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.AVG_HOLD_TIME' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 1 -->
-
-    <!-- WIDGET 2 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="25"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="ph-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="red-fg font-size-42 line-height-72">
-            {{ vm.inbound.answerRate || 0 }}%
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.MANAGED_RATE' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 red-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.MANAGED_RATE_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.MANAGED_RATE' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 2 -->
-
-    <!-- WIDGET 4 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="25"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="blue-grey-fg font-size-42 line-height-72">
-            {{ vm.inbound.abandonRate || 0 }}%
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.UNMANAGED_RATE' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 blue-grey-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.UNMANAGED_RATE_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.UNMANAGED_RATE' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 4 -->
-  </div>
-  <!-- / WIDGET GROUP -->
-</div>
-<!-- / WIDGET INBOUND -->
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/user/mail/user.general.mail.html/user.general.mail.html b/public/src/js/modules/main/apps/dashboards/views/general/user/mail/user.general.mail.html/user.general.mail.html
new file mode 100644
index 0000000..d64af77
--- /dev/null
+++ b/public/src/js/modules/main/apps/dashboards/views/general/user/mail/user.general.mail.html/user.general.mail.html
@@ -0,0 +1,517 @@
+<!-- WIDGET INBOUND -->
+<div class="dashboard-container md-background-bg md-whiteframe-1dp">
+  <div class="pb-16" layout="row" layout-align="start center">
+    <md-icon md-font-icon="icon-email" class="m-0 mr-16"></md-icon>
+    <div
+      class="h2 secondary-text"
+      translate="DASHBOARDS.TODAY_INTERACTIONS_STATS"
+    >
+      Today Interactions STATS
+    </div>
+  </div>
+
+  <!-- WIDGET GROUP -->
+  <div class="widget-group" layout="row" flex="100" layout-wrap>
+    <!-- WIDGET 1 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="ph-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="light-blue-fg font-size-52 line-height-72">
+            {{vm.inbound.waiting || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.WAITING' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 light-blue-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.WAITING_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.WAITING' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 1 -->
+
+    <!-- WIDGET 3 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="orange-fg font-size-52 line-height-72">
+            {{vm.inbound.talking || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.OPENED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 orange-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.OPENED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.OPENED' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 3 -->
+
+    <!-- WIDGET 2 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="ph-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="red-fg font-size-52 line-height-72">
+            {{vm.inbound.answered || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.MANAGED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 red-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.MANAGED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.MANAGED' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 2 -->
+
+    <!-- WIDGET 4 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="blue-green-fg font-size-52 line-height-72">
+            {{vm.inbound.unmanaged || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.UNMANAGED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 blue-green-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.UNMANAGED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.UNMANAGED' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 4 -->
+
+    <!-- WIDGET 4 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="blue-green-fg font-size-52 line-height-72">
+            {{vm.inbound.total || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.TOTAL_OFFERED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 blue-green-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.TOTAL_OFFERED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.TOTAL_OFFERED' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 4 -->
+  </div>
+  <!-- / WIDGET GROUP -->
+
+  <!-- WIDGET GROUP -->
+  <div class="widget-group" layout="row" flex="100" layout-wrap>
+    <!-- WIDGET 1 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="50"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="ph-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="light-blue-fg font-size-42 line-height-72">
+            {{ vm.inbound.avgHoldTime || '00:00:00' }}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.AVG_HOLD_TIME' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 light-blue-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.AVG_HOLD_TIME_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.AVG_HOLD_TIME' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 1 -->
+
+    <!-- WIDGET 2 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="25"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="ph-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="red-fg font-size-42 line-height-72">
+            {{ vm.inbound.answerRate || 0 }}%
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.MANAGED_RATE' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 red-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.MANAGED_RATE_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.MANAGED_RATE' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 2 -->
+
+    <!-- WIDGET 4 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="25"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="blue-grey-fg font-size-42 line-height-72">
+            {{ vm.inbound.abandonRate || 0 }}%
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.UNMANAGED_RATE' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 blue-grey-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.UNMANAGED_RATE_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.UNMANAGED_RATE' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 4 -->
+  </div>
+  <!-- / WIDGET GROUP -->
+</div>
+<!-- / WIDGET INBOUND -->
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/user/openchannel/user.general.openchannel.html/user.general.openchannel-[chunkhash].html b/public/src/js/modules/main/apps/dashboards/views/general/user/openchannel/user.general.openchannel.html/user.general.openchannel-[chunkhash].html
deleted file mode 100644
index dae6805..0000000
--- a/public/src/js/modules/main/apps/dashboards/views/general/user/openchannel/user.general.openchannel.html/user.general.openchannel-[chunkhash].html
+++ /dev/null
@@ -1,517 +0,0 @@
-<!-- WIDGET INBOUND -->
-<div class="dashboard-container md-background-bg md-whiteframe-1dp">
-  <div class="pb-16" layout="row" layout-align="start center">
-    <md-icon md-font-icon="icon-google-earth" class="m-0 mr-16"></md-icon>
-    <div
-      class="h2 secondary-text"
-      translate="DASHBOARDS.TODAY_INTERACTIONS_STATS"
-    >
-      Today Interactions STATS
-    </div>
-  </div>
-
-  <!-- WIDGET GROUP -->
-  <div class="widget-group" layout="row" flex="100" layout-wrap>
-    <!-- WIDGET 1 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="ph-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="light-blue-fg font-size-52 line-height-72">
-            {{vm.inbound.waiting || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.WAITING' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 light-blue-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.WAITING_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.WAITING' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 1 -->
-
-    <!-- WIDGET 3 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="orange-fg font-size-52 line-height-72">
-            {{vm.inbound.talking || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.OPENED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 orange-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.OPENED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.OPENED' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 3 -->
-
-    <!-- WIDGET 2 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="ph-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="red-fg font-size-52 line-height-72">
-            {{vm.inbound.answered || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.MANAGED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 red-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.MANAGED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.MANAGED' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 2 -->
-
-    <!-- WIDGET 4 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="blue-green-fg font-size-52 line-height-72">
-            {{vm.inbound.unmanaged || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.UNMANAGED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 blue-green-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.UNMANAGED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.UNMANAGED' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 4 -->
-
-    <!-- WIDGET 4 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="blue-green-fg font-size-52 line-height-72">
-            {{vm.inbound.total || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.TOTAL_OFFERED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 blue-green-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.TOTAL_OFFERED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.TOTAL_OFFERED' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 4 -->
-  </div>
-  <!-- / WIDGET GROUP -->
-
-  <!-- WIDGET GROUP -->
-  <div class="widget-group" layout="row" flex="100" layout-wrap>
-    <!-- WIDGET 1 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="50"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="ph-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="light-blue-fg font-size-42 line-height-72">
-            {{ vm.inbound.avgHoldTime || '00:00:00' }}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.AVG_HOLD_TIME' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 light-blue-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.AVG_HOLD_TIME_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.AVG_HOLD_TIME' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 1 -->
-
-    <!-- WIDGET 2 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="25"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="ph-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="red-fg font-size-42 line-height-72">
-            {{ vm.inbound.answerRate || 0 }}%
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.MANAGED_RATE' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 red-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.MANAGED_RATE_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.MANAGED_RATE' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 2 -->
-
-    <!-- WIDGET 4 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="25"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="blue-grey-fg font-size-42 line-height-72">
-            {{ vm.inbound.abandonRate || 0 }}%
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.UNMANAGED_RATE' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 blue-grey-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.UNMANAGED_RATE_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.UNMANAGED_RATE' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 4 -->
-  </div>
-  <!-- / WIDGET GROUP -->
-</div>
-<!-- / WIDGET INBOUND -->
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/user/openchannel/user.general.openchannel.html/user.general.openchannel.html b/public/src/js/modules/main/apps/dashboards/views/general/user/openchannel/user.general.openchannel.html/user.general.openchannel.html
new file mode 100644
index 0000000..dae6805
--- /dev/null
+++ b/public/src/js/modules/main/apps/dashboards/views/general/user/openchannel/user.general.openchannel.html/user.general.openchannel.html
@@ -0,0 +1,517 @@
+<!-- WIDGET INBOUND -->
+<div class="dashboard-container md-background-bg md-whiteframe-1dp">
+  <div class="pb-16" layout="row" layout-align="start center">
+    <md-icon md-font-icon="icon-google-earth" class="m-0 mr-16"></md-icon>
+    <div
+      class="h2 secondary-text"
+      translate="DASHBOARDS.TODAY_INTERACTIONS_STATS"
+    >
+      Today Interactions STATS
+    </div>
+  </div>
+
+  <!-- WIDGET GROUP -->
+  <div class="widget-group" layout="row" flex="100" layout-wrap>
+    <!-- WIDGET 1 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="ph-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="light-blue-fg font-size-52 line-height-72">
+            {{vm.inbound.waiting || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.WAITING' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 light-blue-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.WAITING_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.WAITING' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 1 -->
+
+    <!-- WIDGET 3 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="orange-fg font-size-52 line-height-72">
+            {{vm.inbound.talking || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.OPENED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 orange-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.OPENED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.OPENED' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 3 -->
+
+    <!-- WIDGET 2 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="ph-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="red-fg font-size-52 line-height-72">
+            {{vm.inbound.answered || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.MANAGED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 red-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.MANAGED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.MANAGED' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 2 -->
+
+    <!-- WIDGET 4 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="blue-green-fg font-size-52 line-height-72">
+            {{vm.inbound.unmanaged || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.UNMANAGED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 blue-green-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.UNMANAGED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.UNMANAGED' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 4 -->
+
+    <!-- WIDGET 4 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="blue-green-fg font-size-52 line-height-72">
+            {{vm.inbound.total || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.TOTAL_OFFERED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 blue-green-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.TOTAL_OFFERED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.TOTAL_OFFERED' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 4 -->
+  </div>
+  <!-- / WIDGET GROUP -->
+
+  <!-- WIDGET GROUP -->
+  <div class="widget-group" layout="row" flex="100" layout-wrap>
+    <!-- WIDGET 1 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="50"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="ph-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="light-blue-fg font-size-42 line-height-72">
+            {{ vm.inbound.avgHoldTime || '00:00:00' }}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.AVG_HOLD_TIME' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 light-blue-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.AVG_HOLD_TIME_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.AVG_HOLD_TIME' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 1 -->
+
+    <!-- WIDGET 2 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="25"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="ph-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="red-fg font-size-42 line-height-72">
+            {{ vm.inbound.answerRate || 0 }}%
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.MANAGED_RATE' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 red-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.MANAGED_RATE_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.MANAGED_RATE' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 2 -->
+
+    <!-- WIDGET 4 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="25"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="blue-grey-fg font-size-42 line-height-72">
+            {{ vm.inbound.abandonRate || 0 }}%
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.UNMANAGED_RATE' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 blue-grey-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.UNMANAGED_RATE_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.UNMANAGED_RATE' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 4 -->
+  </div>
+  <!-- / WIDGET GROUP -->
+</div>
+<!-- / WIDGET INBOUND -->
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/user/sms/user.general.sms.html/user.general.sms-[chunkhash].html b/public/src/js/modules/main/apps/dashboards/views/general/user/sms/user.general.sms.html/user.general.sms-[chunkhash].html
deleted file mode 100644
index bc403f7..0000000
--- a/public/src/js/modules/main/apps/dashboards/views/general/user/sms/user.general.sms.html/user.general.sms-[chunkhash].html
+++ /dev/null
@@ -1,517 +0,0 @@
-<!-- WIDGET INBOUND -->
-<div class="dashboard-container md-background-bg md-whiteframe-1dp">
-  <div class="pb-16" layout="row" layout-align="start center">
-    <md-icon md-font-icon="icon-message-text" class="m-0 mr-16"></md-icon>
-    <div
-      class="h2 secondary-text"
-      translate="DASHBOARDS.TODAY_INTERACTIONS_STATS"
-    >
-      Today Interactions STATS
-    </div>
-  </div>
-
-  <!-- WIDGET GROUP -->
-  <div class="widget-group" layout="row" flex="100" layout-wrap>
-    <!-- WIDGET 1 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="ph-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="light-blue-fg font-size-52 line-height-72">
-            {{vm.inbound.waiting || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.WAITING' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 light-blue-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.WAITING_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.WAITING' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 1 -->
-
-    <!-- WIDGET 3 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="orange-fg font-size-52 line-height-72">
-            {{vm.inbound.talking || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.OPENED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 orange-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.OPENED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.OPENED' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 3 -->
-
-    <!-- WIDGET 2 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="ph-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="red-fg font-size-52 line-height-72">
-            {{vm.inbound.answered || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.MANAGED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 red-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.MANAGED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.MANAGED' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 2 -->
-
-    <!-- WIDGET 4 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="blue-green-fg font-size-52 line-height-72">
-            {{vm.inbound.unmanaged || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.UNMANAGED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 blue-green-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.UNMANAGED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.UNMANAGED' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 4 -->
-
-    <!-- WIDGET 4 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="blue-green-fg font-size-52 line-height-72">
-            {{vm.inbound.total || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.TOTAL_OFFERED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 blue-green-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.TOTAL_OFFERED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.TOTAL_OFFERED' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 4 -->
-  </div>
-  <!-- / WIDGET GROUP -->
-
-  <!-- WIDGET GROUP -->
-  <div class="widget-group" layout="row" flex="100" layout-wrap>
-    <!-- WIDGET 1 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="50"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="ph-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="light-blue-fg font-size-42 line-height-72">
-            {{ vm.inbound.avgHoldTime || '00:00:00' }}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.AVG_HOLD_TIME' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 light-blue-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.AVG_HOLD_TIME_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.AVG_HOLD_TIME' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 1 -->
-
-    <!-- WIDGET 2 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="25"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="ph-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="red-fg font-size-42 line-height-72">
-            {{ vm.inbound.answerRate || 0 }}%
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.MANAGED_RATE' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 red-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.MANAGED_RATE_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.MANAGED_RATE' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 2 -->
-
-    <!-- WIDGET 4 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="25"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="blue-grey-fg font-size-42 line-height-72">
-            {{ vm.inbound.abandonRate || 0 }}%
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.UNMANAGED_RATE' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 blue-grey-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.UNMANAGED_RATE_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.UNMANAGED_RATE' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 4 -->
-  </div>
-  <!-- / WIDGET GROUP -->
-</div>
-<!-- / WIDGET INBOUND -->
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/user/sms/user.general.sms.html/user.general.sms.html b/public/src/js/modules/main/apps/dashboards/views/general/user/sms/user.general.sms.html/user.general.sms.html
new file mode 100644
index 0000000..bc403f7
--- /dev/null
+++ b/public/src/js/modules/main/apps/dashboards/views/general/user/sms/user.general.sms.html/user.general.sms.html
@@ -0,0 +1,517 @@
+<!-- WIDGET INBOUND -->
+<div class="dashboard-container md-background-bg md-whiteframe-1dp">
+  <div class="pb-16" layout="row" layout-align="start center">
+    <md-icon md-font-icon="icon-message-text" class="m-0 mr-16"></md-icon>
+    <div
+      class="h2 secondary-text"
+      translate="DASHBOARDS.TODAY_INTERACTIONS_STATS"
+    >
+      Today Interactions STATS
+    </div>
+  </div>
+
+  <!-- WIDGET GROUP -->
+  <div class="widget-group" layout="row" flex="100" layout-wrap>
+    <!-- WIDGET 1 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="ph-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="light-blue-fg font-size-52 line-height-72">
+            {{vm.inbound.waiting || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.WAITING' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 light-blue-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.WAITING_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.WAITING' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 1 -->
+
+    <!-- WIDGET 3 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="orange-fg font-size-52 line-height-72">
+            {{vm.inbound.talking || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.OPENED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 orange-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.OPENED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.OPENED' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 3 -->
+
+    <!-- WIDGET 2 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="ph-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="red-fg font-size-52 line-height-72">
+            {{vm.inbound.answered || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.MANAGED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 red-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.MANAGED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.MANAGED' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 2 -->
+
+    <!-- WIDGET 4 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="blue-green-fg font-size-52 line-height-72">
+            {{vm.inbound.unmanaged || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.UNMANAGED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 blue-green-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.UNMANAGED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.UNMANAGED' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 4 -->
+
+    <!-- WIDGET 4 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="blue-green-fg font-size-52 line-height-72">
+            {{vm.inbound.total || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.TOTAL_OFFERED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 blue-green-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.TOTAL_OFFERED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.TOTAL_OFFERED' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 4 -->
+  </div>
+  <!-- / WIDGET GROUP -->
+
+  <!-- WIDGET GROUP -->
+  <div class="widget-group" layout="row" flex="100" layout-wrap>
+    <!-- WIDGET 1 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="50"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="ph-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="light-blue-fg font-size-42 line-height-72">
+            {{ vm.inbound.avgHoldTime || '00:00:00' }}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.AVG_HOLD_TIME' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 light-blue-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.AVG_HOLD_TIME_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.AVG_HOLD_TIME' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 1 -->
+
+    <!-- WIDGET 2 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="25"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="ph-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="red-fg font-size-42 line-height-72">
+            {{ vm.inbound.answerRate || 0 }}%
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.MANAGED_RATE' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 red-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.MANAGED_RATE_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.MANAGED_RATE' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 2 -->
+
+    <!-- WIDGET 4 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="25"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="blue-grey-fg font-size-42 line-height-72">
+            {{ vm.inbound.abandonRate || 0 }}%
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.UNMANAGED_RATE' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 blue-grey-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.UNMANAGED_RATE_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.UNMANAGED_RATE' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 4 -->
+  </div>
+  <!-- / WIDGET GROUP -->
+</div>
+<!-- / WIDGET INBOUND -->
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/user/user.general.html/user.general-[chunkhash].html b/public/src/js/modules/main/apps/dashboards/views/general/user/user.general.html/user.general-[chunkhash].html
deleted file mode 100644
index c8c75fe..0000000
--- a/public/src/js/modules/main/apps/dashboards/views/general/user/user.general.html/user.general-[chunkhash].html
+++ /dev/null
@@ -1,100 +0,0 @@
-<div
-  id="dashboard-general"
-  ng-init="vm.onInit()"
-  class="page-layout simple right-sidenav"
-  layout="row"
->
-  <!-- CENTER -->
-  <div class="center" flex ms-scroll>
-    <!-- CONTENT -->
-    <div class="content">
-      <md-tabs
-        ng-if="vm.hasDashboardPermissions"
-        md-selected="vm.selectedTab"
-        md-dynamic-height
-      >
-        <md-tab
-          ng-if="vm.license.voice"
-          label="{{'DASHBOARDS.VOICE' | translate}}"
-          ui-sref="app.dashboards.general.voice"
-        >
-          <div ui-view="voice"></div>
-        </md-tab>
-        <md-tab
-          ng-if="vm.license.dialer"
-          label="{{'DASHBOARDS.MOTIONDIALER' | translate}}"
-          ui-sref="app.dashboards.general.dialer"
-        >
-          <div ui-view="dialer"></div>
-        </md-tab>
-        <md-tab
-          ng-if="vm.license.chat"
-          label="{{'DASHBOARDS.CHAT' | translate}}"
-          ui-sref="app.dashboards.general.chat"
-        >
-          <div ui-view="chat"></div>
-        </md-tab>
-        <md-tab
-          ng-if="vm.license.mail"
-          label="{{'DASHBOARDS.MAIL' | translate}}"
-          ui-sref="app.dashboards.general.mail"
-        >
-          <div ui-view="mail"></div>
-        </md-tab>
-        <md-tab
-          ng-if="vm.license.messaging"
-          label="{{'DASHBOARDS.SMS' | translate}}"
-          ui-sref="app.dashboards.general.sms"
-        >
-          <div ui-view="sms"></div>
-        </md-tab>
-        <md-tab
-          ng-if="vm.license.openchannel"
-          label="{{'DASHBOARDS.OPENCHANNEL' | translate}}"
-          ui-sref="app.dashboards.general.openchannel"
-        >
-          <div ui-view="openchannel"></div>
-        </md-tab>
-        <md-tab
-          ng-if="vm.license.fax"
-          label="{{'DASHBOARDS.FAX' | translate}}"
-          ui-sref="app.dashboards.general.fax"
-        >
-          <div ui-view="fax"></div>
-        </md-tab>
-        <md-tab
-          ng-if="vm.license.whatsapp"
-          label="{{'DASHBOARDS.WHATSAPP' | translate}}"
-          ui-sref="app.dashboards.general.whatsapp"
-        >
-          <div ui-view="whatsapp"></div>
-        </md-tab>
-      </md-tabs>
-    </div>
-    <!-- END CONTENT -->
-
-    <md-content
-      ng-if="!vm.hasDashboardPermissions"
-      layout="row"
-      layout-align="space-around center"
-      flex
-      layout-padding
-      layout-wrap
-    >
-      <div layout="column" layout-align="space-around center" flex="50">
-        <span class="font-size-40 text-center"
-          >{{ 'DASHBOARDS.WELCOME_TO_MOTION' | translate }}!</span
-        >
-        <span
-          class="font-size-30 text-center"
-          translate="DASHBOARDS.WELCOME_MESSAGE"
-          >Use the left sidebar to navigate through available sections.</span
-        >
-      </div>
-
-      <div layout="column" flex="50">
-        <img src="assets/images/avatars/permissions.png" alt="permissions" />
-      </div>
-    </md-content>
-  </div>
-</div>
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/user/user.general.html/user.general.html b/public/src/js/modules/main/apps/dashboards/views/general/user/user.general.html/user.general.html
new file mode 100644
index 0000000..c8c75fe
--- /dev/null
+++ b/public/src/js/modules/main/apps/dashboards/views/general/user/user.general.html/user.general.html
@@ -0,0 +1,100 @@
+<div
+  id="dashboard-general"
+  ng-init="vm.onInit()"
+  class="page-layout simple right-sidenav"
+  layout="row"
+>
+  <!-- CENTER -->
+  <div class="center" flex ms-scroll>
+    <!-- CONTENT -->
+    <div class="content">
+      <md-tabs
+        ng-if="vm.hasDashboardPermissions"
+        md-selected="vm.selectedTab"
+        md-dynamic-height
+      >
+        <md-tab
+          ng-if="vm.license.voice"
+          label="{{'DASHBOARDS.VOICE' | translate}}"
+          ui-sref="app.dashboards.general.voice"
+        >
+          <div ui-view="voice"></div>
+        </md-tab>
+        <md-tab
+          ng-if="vm.license.dialer"
+          label="{{'DASHBOARDS.MOTIONDIALER' | translate}}"
+          ui-sref="app.dashboards.general.dialer"
+        >
+          <div ui-view="dialer"></div>
+        </md-tab>
+        <md-tab
+          ng-if="vm.license.chat"
+          label="{{'DASHBOARDS.CHAT' | translate}}"
+          ui-sref="app.dashboards.general.chat"
+        >
+          <div ui-view="chat"></div>
+        </md-tab>
+        <md-tab
+          ng-if="vm.license.mail"
+          label="{{'DASHBOARDS.MAIL' | translate}}"
+          ui-sref="app.dashboards.general.mail"
+        >
+          <div ui-view="mail"></div>
+        </md-tab>
+        <md-tab
+          ng-if="vm.license.messaging"
+          label="{{'DASHBOARDS.SMS' | translate}}"
+          ui-sref="app.dashboards.general.sms"
+        >
+          <div ui-view="sms"></div>
+        </md-tab>
+        <md-tab
+          ng-if="vm.license.openchannel"
+          label="{{'DASHBOARDS.OPENCHANNEL' | translate}}"
+          ui-sref="app.dashboards.general.openchannel"
+        >
+          <div ui-view="openchannel"></div>
+        </md-tab>
+        <md-tab
+          ng-if="vm.license.fax"
+          label="{{'DASHBOARDS.FAX' | translate}}"
+          ui-sref="app.dashboards.general.fax"
+        >
+          <div ui-view="fax"></div>
+        </md-tab>
+        <md-tab
+          ng-if="vm.license.whatsapp"
+          label="{{'DASHBOARDS.WHATSAPP' | translate}}"
+          ui-sref="app.dashboards.general.whatsapp"
+        >
+          <div ui-view="whatsapp"></div>
+        </md-tab>
+      </md-tabs>
+    </div>
+    <!-- END CONTENT -->
+
+    <md-content
+      ng-if="!vm.hasDashboardPermissions"
+      layout="row"
+      layout-align="space-around center"
+      flex
+      layout-padding
+      layout-wrap
+    >
+      <div layout="column" layout-align="space-around center" flex="50">
+        <span class="font-size-40 text-center"
+          >{{ 'DASHBOARDS.WELCOME_TO_MOTION' | translate }}!</span
+        >
+        <span
+          class="font-size-30 text-center"
+          translate="DASHBOARDS.WELCOME_MESSAGE"
+          >Use the left sidebar to navigate through available sections.</span
+        >
+      </div>
+
+      <div layout="column" flex="50">
+        <img src="assets/images/avatars/permissions.png" alt="permissions" />
+      </div>
+    </md-content>
+  </div>
+</div>
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/user/whatsapp/user.general.whatsapp.html/user.general.whatsapp-[chunkhash].html b/public/src/js/modules/main/apps/dashboards/views/general/user/whatsapp/user.general.whatsapp.html/user.general.whatsapp-[chunkhash].html
deleted file mode 100644
index bc72f03..0000000
--- a/public/src/js/modules/main/apps/dashboards/views/general/user/whatsapp/user.general.whatsapp.html/user.general.whatsapp-[chunkhash].html
+++ /dev/null
@@ -1,517 +0,0 @@
-<!-- WIDGET INBOUND -->
-<div class="dashboard-container md-background-bg md-whiteframe-1dp">
-  <div class="pb-16" layout="row" layout-align="start center">
-    <md-icon md-font-icon="icon-whatsapp" class="m-0 mr-16"></md-icon>
-    <div
-      class="h2 secondary-text"
-      translate="DASHBOARDS.TODAY_INTERACTIONS_STATS"
-    >
-      Today Interactions STATS
-    </div>
-  </div>
-
-  <!-- WIDGET GROUP -->
-  <div class="widget-group" layout="row" flex="100" layout-wrap>
-    <!-- WIDGET 1 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="ph-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="light-blue-fg font-size-52 line-height-72">
-            {{vm.inbound.waiting || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.WAITING' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 light-blue-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.WAITING_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.WAITING' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 1 -->
-
-    <!-- WIDGET 3 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="orange-fg font-size-52 line-height-72">
-            {{vm.inbound.talking || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.OPENED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 orange-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.OPENED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.OPENED' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 3 -->
-
-    <!-- WIDGET 2 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="ph-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="red-fg font-size-52 line-height-72">
-            {{vm.inbound.answered || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.MANAGED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 red-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.MANAGED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.MANAGED' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 2 -->
-
-    <!-- WIDGET 4 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="blue-green-fg font-size-52 line-height-72">
-            {{vm.inbound.unmanaged || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.UNMANAGED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 blue-green-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.UNMANAGED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.UNMANAGED' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 4 -->
-
-    <!-- WIDGET 4 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="20"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="blue-green-fg font-size-52 line-height-72">
-            {{vm.inbound.total || 0}}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.TOTAL_OFFERED' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 blue-green-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.TOTAL_OFFERED_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.TOTAL_OFFERED' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 4 -->
-  </div>
-  <!-- / WIDGET GROUP -->
-
-  <!-- WIDGET GROUP -->
-  <div class="widget-group" layout="row" flex="100" layout-wrap>
-    <!-- WIDGET 1 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="50"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="ph-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="light-blue-fg font-size-42 line-height-72">
-            {{ vm.inbound.avgHoldTime || '00:00:00' }}
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.AVG_HOLD_TIME' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 light-blue-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.AVG_HOLD_TIME_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.AVG_HOLD_TIME' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 1 -->
-
-    <!-- WIDGET 2 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="25"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="ph-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="red-fg font-size-42 line-height-72">
-            {{ vm.inbound.answerRate || 0 }}%
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.MANAGED_RATE' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 red-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.MANAGED_RATE_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.MANAGED_RATE' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 2 -->
-
-    <!-- WIDGET 4 -->
-    <ms-widget
-      flippable="true"
-      layout="column"
-      flex="100"
-      flex-gt-xs="50"
-      flex-gt-md="25"
-    >
-      <!-- Front -->
-      <ms-widget-front class="grey-50-bg">
-        <div
-          class="pl-16 pr-8 pv-16 h-55"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="more"
-          >
-            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-        </div>
-
-        <div class="pt-8 pb-32" layout="column" layout-align="center center">
-          <div class="blue-grey-fg font-size-42 line-height-72">
-            {{ vm.inbound.abandonRate || 0 }}%
-          </div>
-          <div class="h3 secondary-text font-weight-500">
-            {{'DASHBOARDS.UNMANAGED_RATE' | translate | uppercase}}
-          </div>
-        </div>
-
-        <div
-          class="p-16 grey-200-bg text-center border-top"
-          layout-align="start center"
-        >
-          <span class="h6 blue-grey-fg secondary-text text-truncate"
-            >{{'DASHBOARDS.UNMANAGED_RATE_TEXT' | translate | uppercase}}</span
-          >
-        </div>
-      </ms-widget-front>
-      <!-- / Front -->
-
-      <!-- Back -->
-      <ms-widget-back class="p-16 grey-50-bg">
-        <div class="flip-to-front">
-          <md-button
-            class="md-icon-button"
-            ng-click="flipWidget()"
-            aria-label="Flip widget"
-          >
-            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
-          </md-button>
-        </div>
-
-        <div>{{'DASHBOARDS.HELP.UNMANAGED_RATE' | translate}}</div>
-      </ms-widget-back>
-      <!-- / Back -->
-    </ms-widget>
-    <!-- / WIDGET 4 -->
-  </div>
-  <!-- / WIDGET GROUP -->
-</div>
-<!-- / WIDGET INBOUND -->
diff --git a/public/src/js/modules/main/apps/dashboards/views/general/user/whatsapp/user.general.whatsapp.html/user.general.whatsapp.html b/public/src/js/modules/main/apps/dashboards/views/general/user/whatsapp/user.general.whatsapp.html/user.general.whatsapp.html
new file mode 100644
index 0000000..bc72f03
--- /dev/null
+++ b/public/src/js/modules/main/apps/dashboards/views/general/user/whatsapp/user.general.whatsapp.html/user.general.whatsapp.html
@@ -0,0 +1,517 @@
+<!-- WIDGET INBOUND -->
+<div class="dashboard-container md-background-bg md-whiteframe-1dp">
+  <div class="pb-16" layout="row" layout-align="start center">
+    <md-icon md-font-icon="icon-whatsapp" class="m-0 mr-16"></md-icon>
+    <div
+      class="h2 secondary-text"
+      translate="DASHBOARDS.TODAY_INTERACTIONS_STATS"
+    >
+      Today Interactions STATS
+    </div>
+  </div>
+
+  <!-- WIDGET GROUP -->
+  <div class="widget-group" layout="row" flex="100" layout-wrap>
+    <!-- WIDGET 1 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="ph-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="light-blue-fg font-size-52 line-height-72">
+            {{vm.inbound.waiting || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.WAITING' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 light-blue-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.WAITING_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.WAITING' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 1 -->
+
+    <!-- WIDGET 3 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="orange-fg font-size-52 line-height-72">
+            {{vm.inbound.talking || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.OPENED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 orange-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.OPENED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.OPENED' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 3 -->
+
+    <!-- WIDGET 2 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="ph-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="red-fg font-size-52 line-height-72">
+            {{vm.inbound.answered || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.MANAGED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 red-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.MANAGED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.MANAGED' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 2 -->
+
+    <!-- WIDGET 4 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="blue-green-fg font-size-52 line-height-72">
+            {{vm.inbound.unmanaged || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.UNMANAGED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 blue-green-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.UNMANAGED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.UNMANAGED' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 4 -->
+
+    <!-- WIDGET 4 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="20"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="blue-green-fg font-size-52 line-height-72">
+            {{vm.inbound.total || 0}}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.TOTAL_OFFERED' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 blue-green-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.TOTAL_OFFERED_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.TOTAL_OFFERED' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 4 -->
+  </div>
+  <!-- / WIDGET GROUP -->
+
+  <!-- WIDGET GROUP -->
+  <div class="widget-group" layout="row" flex="100" layout-wrap>
+    <!-- WIDGET 1 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="50"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="ph-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="light-blue-fg font-size-42 line-height-72">
+            {{ vm.inbound.avgHoldTime || '00:00:00' }}
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.AVG_HOLD_TIME' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 light-blue-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.AVG_HOLD_TIME_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.AVG_HOLD_TIME' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 1 -->
+
+    <!-- WIDGET 2 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="25"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="ph-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="red-fg font-size-42 line-height-72">
+            {{ vm.inbound.answerRate || 0 }}%
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.MANAGED_RATE' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 red-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.MANAGED_RATE_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.MANAGED_RATE' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 2 -->
+
+    <!-- WIDGET 4 -->
+    <ms-widget
+      flippable="true"
+      layout="column"
+      flex="100"
+      flex-gt-xs="50"
+      flex-gt-md="25"
+    >
+      <!-- Front -->
+      <ms-widget-front class="grey-50-bg">
+        <div
+          class="pl-16 pr-8 pv-16 h-55"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="more"
+          >
+            <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+        </div>
+
+        <div class="pt-8 pb-32" layout="column" layout-align="center center">
+          <div class="blue-grey-fg font-size-42 line-height-72">
+            {{ vm.inbound.abandonRate || 0 }}%
+          </div>
+          <div class="h3 secondary-text font-weight-500">
+            {{'DASHBOARDS.UNMANAGED_RATE' | translate | uppercase}}
+          </div>
+        </div>
+
+        <div
+          class="p-16 grey-200-bg text-center border-top"
+          layout-align="start center"
+        >
+          <span class="h6 blue-grey-fg secondary-text text-truncate"
+            >{{'DASHBOARDS.UNMANAGED_RATE_TEXT' | translate | uppercase}}</span
+          >
+        </div>
+      </ms-widget-front>
+      <!-- / Front -->
+
+      <!-- Back -->
+      <ms-widget-back class="p-16 grey-50-bg">
+        <div class="flip-to-front">
+          <md-button
+            class="md-icon-button"
+            ng-click="flipWidget()"
+            aria-label="Flip widget"
+          >
+            <md-icon md-font-icon="icon-close" class="s16"></md-icon>
+          </md-button>
+        </div>
+
+        <div>{{'DASHBOARDS.HELP.UNMANAGED_RATE' | translate}}</div>
+      </ms-widget-back>
+      <!-- / Back -->
+    </ms-widget>
+    <!-- / WIDGET 4 -->
+  </div>
+  <!-- / WIDGET GROUP -->
+</div>
+<!-- / WIDGET INBOUND -->
diff --git a/public/src/js/modules/main/apps/fax/views/faxAccounts/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/fax/views/faxAccounts/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 8364f62..0000000
--- a/public/src/js/modules/main/apps/fax/views/faxAccounts/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,249 +0,0 @@
-<md-dialog class="faxAccount-dialog" aria-label="New FaxAccount">
-  <form name="faxAccountForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="FAX.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.faxAccount.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="faxAccountForm['name'].$error"
-          ng-show="faxAccountForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="FAX.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="FAX.KEY">key</label>
-        <input
-          type="text"
-          name="key"
-          ng-model="vm.faxAccount.key"
-          md-maxlength="5"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="faxAccountForm['key'].$error"
-          ng-show="faxAccountForm['key'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="FAX.ERRORS.KEY_REQUIRED"
-              >key field is required</span
-            >
-          </div>
-          <div ng-message="md-maxlength">
-            <span
-              translate="FAX.ERRORS.KEY_MAX_LENGTH"
-              translate-values="{max: 5}"
-              >key must have a maximum length equal to 5</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="FAX.TRUNK">trunk</label>
-        <md-select name="TrunkId" ng-model="vm.faxAccount.TrunkId" required>
-          <md-option
-            ng-value="TrunkId.id"
-            ng-repeat="TrunkId in vm.trunks"
-            ng-disabled="TrunkId.canSelect === false"
-            >{{ TrunkId.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="faxAccountForm['TrunkId'].$error"
-          ng-show="faxAccountForm['TrunkId'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="FAX.ERRORS.TRUNK_REQUIRED"
-              >trunk field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="FAX.LOCALSTATIONID">localstationid</label>
-        <input
-          type="text"
-          name="localstationid"
-          ng-model="vm.faxAccount.localstationid"
-          ng-required="true"
-        />
-
-        <div class="hint">
-          <span translate="FAX.HELP.LOCALSTATIONID"></span>
-        </div>
-        <div
-          ng-messages="faxAccountForm['localstationid'].$error"
-          ng-show="faxAccountForm['localstationid'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="FAX.ERRORS.LOCALSTATIONID_REQUIRED"
-              >localstationid field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="FAX.LIST">List</label>
-        <md-select name="ListId" ng-model="vm.faxAccount.ListId" required>
-          <md-option
-            ng-value="ListId.id"
-            ng-repeat="ListId in vm.lists"
-            ng-disabled="ListId.canSelect === false"
-            >{{ ListId.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="faxAccountForm['ListId'].$error"
-          ng-show="faxAccountForm['ListId'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="FAX.ERRORS.LIST_REQUIRED"
-              >List field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="FAX.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.faxAccount.description"
-        />
-
-        <div
-          ng-messages="faxAccountForm['description'].$error"
-          ng-show="faxAccountForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="FAX.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newFaxAccount"
-          ng-click="vm.saveFaxAccount()"
-          class="send-button md-accent md-raised"
-          ng-disabled="faxAccountForm.$invalid || faxAccountForm.$pristine"
-          aria-label="SAVE"
-          translate="FAX.SAVE"
-          translate-attr-aria-label="FAX.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newFaxAccount"
-          ng-click="vm.addNewFaxAccount()"
-          class="send-button md-accent md-raised"
-          ng-disabled="faxAccountForm.$invalid"
-          aria-label="ADD"
-          translate="FAX.ADD_FAXACCOUNT"
-          translate-attr-aria-label="FAX.ADD_FAXACCOUNT"
-        >
-          ADD FAXACCOUNT
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newFaxAccount"
-          ng-click="vm.deleteFaxAccount($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="FAX.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="FAX.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/fax/views/faxAccounts/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/fax/views/faxAccounts/create/dialog.html/dialog.html
new file mode 100644
index 0000000..8364f62
--- /dev/null
+++ b/public/src/js/modules/main/apps/fax/views/faxAccounts/create/dialog.html/dialog.html
@@ -0,0 +1,249 @@
+<md-dialog class="faxAccount-dialog" aria-label="New FaxAccount">
+  <form name="faxAccountForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="FAX.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.faxAccount.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="faxAccountForm['name'].$error"
+          ng-show="faxAccountForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="FAX.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="FAX.KEY">key</label>
+        <input
+          type="text"
+          name="key"
+          ng-model="vm.faxAccount.key"
+          md-maxlength="5"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="faxAccountForm['key'].$error"
+          ng-show="faxAccountForm['key'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="FAX.ERRORS.KEY_REQUIRED"
+              >key field is required</span
+            >
+          </div>
+          <div ng-message="md-maxlength">
+            <span
+              translate="FAX.ERRORS.KEY_MAX_LENGTH"
+              translate-values="{max: 5}"
+              >key must have a maximum length equal to 5</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="FAX.TRUNK">trunk</label>
+        <md-select name="TrunkId" ng-model="vm.faxAccount.TrunkId" required>
+          <md-option
+            ng-value="TrunkId.id"
+            ng-repeat="TrunkId in vm.trunks"
+            ng-disabled="TrunkId.canSelect === false"
+            >{{ TrunkId.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="faxAccountForm['TrunkId'].$error"
+          ng-show="faxAccountForm['TrunkId'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="FAX.ERRORS.TRUNK_REQUIRED"
+              >trunk field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="FAX.LOCALSTATIONID">localstationid</label>
+        <input
+          type="text"
+          name="localstationid"
+          ng-model="vm.faxAccount.localstationid"
+          ng-required="true"
+        />
+
+        <div class="hint">
+          <span translate="FAX.HELP.LOCALSTATIONID"></span>
+        </div>
+        <div
+          ng-messages="faxAccountForm['localstationid'].$error"
+          ng-show="faxAccountForm['localstationid'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="FAX.ERRORS.LOCALSTATIONID_REQUIRED"
+              >localstationid field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="FAX.LIST">List</label>
+        <md-select name="ListId" ng-model="vm.faxAccount.ListId" required>
+          <md-option
+            ng-value="ListId.id"
+            ng-repeat="ListId in vm.lists"
+            ng-disabled="ListId.canSelect === false"
+            >{{ ListId.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="faxAccountForm['ListId'].$error"
+          ng-show="faxAccountForm['ListId'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="FAX.ERRORS.LIST_REQUIRED"
+              >List field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="FAX.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.faxAccount.description"
+        />
+
+        <div
+          ng-messages="faxAccountForm['description'].$error"
+          ng-show="faxAccountForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="FAX.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newFaxAccount"
+          ng-click="vm.saveFaxAccount()"
+          class="send-button md-accent md-raised"
+          ng-disabled="faxAccountForm.$invalid || faxAccountForm.$pristine"
+          aria-label="SAVE"
+          translate="FAX.SAVE"
+          translate-attr-aria-label="FAX.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newFaxAccount"
+          ng-click="vm.addNewFaxAccount()"
+          class="send-button md-accent md-raised"
+          ng-disabled="faxAccountForm.$invalid"
+          aria-label="ADD"
+          translate="FAX.ADD_FAXACCOUNT"
+          translate-attr-aria-label="FAX.ADD_FAXACCOUNT"
+        >
+          ADD FAXACCOUNT
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newFaxAccount"
+          ng-click="vm.deleteFaxAccount($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="FAX.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="FAX.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/agentadd/agentadd.html/agentadd-[chunkhash].html b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
deleted file mode 100644
index 489aa1c..0000000
--- a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
+++ /dev/null
@@ -1,44 +0,0 @@
-<md-dialog
-  class="faxAccount-dialog"
-  aria-label="faxAccount"
-  ng-init="vm.onInit()"
->
-  <form name="faxAccountForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="FAX.AGENTADD_FAXACCOUNT">Add Agent to faxAccount</h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <ms-dual-multiselect
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveAgents()"
-        class="send-button md-accent md-raised"
-        ng-disabled="!vm.pendingChanges"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/agentadd/agentadd.html/agentadd.html b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/agentadd/agentadd.html/agentadd.html
new file mode 100644
index 0000000..489aa1c
--- /dev/null
+++ b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/agentadd/agentadd.html/agentadd.html
@@ -0,0 +1,44 @@
+<md-dialog
+  class="faxAccount-dialog"
+  aria-label="faxAccount"
+  ng-init="vm.onInit()"
+>
+  <form name="faxAccountForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="FAX.AGENTADD_FAXACCOUNT">Add Agent to faxAccount</h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <ms-dual-multiselect
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveAgents()"
+        class="send-button md-accent md-raised"
+        ng-disabled="!vm.pendingChanges"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/agent/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/agent/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index e011007..0000000
--- a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/agent/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,148 +0,0 @@
-<md-dialog class="faxAccount-dialog" aria-label="New FaxAccount">
-  <form name="faxAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="FAX.AGENT">Agent</label>
-        <md-select
-          name="agent"
-          ng-model="vm.agent.agent"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="agent.name"
-            ng-repeat="agent in vm.agents"
-            ng-disabled="agent.canSelect === false"
-            >{{ agent.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="faxAccountFormApp['agent'].$error"
-          ng-show="faxAccountFormApp['agent'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="FAX.ERRORS.AGENT_REQUIRED"
-              >Agent field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="FAX.TIMEOUT">Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.agent.timeout"
-          min="0"
-          max="2147483"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="faxAccountFormApp['timeout'].$error"
-          ng-show="faxAccountFormApp['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="FAX.ERRORS.TIMEOUT_REQUIRED"
-              >Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="FAX.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-          <div ng-message="max">
-            <span translate="FAX.ERRORS.TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>2147483</span>
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveFaxAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="faxAccountFormApp.$invalid || faxAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="FAX.SAVE"
-          translate-attr-aria-label="FAX.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/agent/dialog.html/dialog.html b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/agent/dialog.html/dialog.html
new file mode 100644
index 0000000..e011007
--- /dev/null
+++ b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/agent/dialog.html/dialog.html
@@ -0,0 +1,148 @@
+<md-dialog class="faxAccount-dialog" aria-label="New FaxAccount">
+  <form name="faxAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="FAX.AGENT">Agent</label>
+        <md-select
+          name="agent"
+          ng-model="vm.agent.agent"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="agent.name"
+            ng-repeat="agent in vm.agents"
+            ng-disabled="agent.canSelect === false"
+            >{{ agent.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="faxAccountFormApp['agent'].$error"
+          ng-show="faxAccountFormApp['agent'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="FAX.ERRORS.AGENT_REQUIRED"
+              >Agent field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="FAX.TIMEOUT">Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.agent.timeout"
+          min="0"
+          max="2147483"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="faxAccountFormApp['timeout'].$error"
+          ng-show="faxAccountFormApp['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="FAX.ERRORS.TIMEOUT_REQUIRED"
+              >Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="FAX.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+          <div ng-message="max">
+            <span translate="FAX.ERRORS.TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>2147483</span>
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveFaxAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="faxAccountFormApp.$invalid || faxAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="FAX.SAVE"
+          translate-attr-aria-label="FAX.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/close/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/close/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 00ee0ec..0000000
--- a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/close/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,106 +0,0 @@
-<md-dialog class="faxAccount-dialog" aria-label="New FaxAccount">
-  <form name="faxAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="FAX.DISPOSITION">Disposition</label>
-        <input
-          type="text"
-          name="disposition"
-          ng-model="vm.close.disposition"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="faxAccountFormApp['disposition'].$error"
-          ng-show="faxAccountFormApp['disposition'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="FAX.ERRORS.DISPOSITION_REQUIRED"
-              >Disposition field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveFaxAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="faxAccountFormApp.$invalid || faxAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="FAX.SAVE"
-          translate-attr-aria-label="FAX.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/close/dialog.html/dialog.html b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/close/dialog.html/dialog.html
new file mode 100644
index 0000000..00ee0ec
--- /dev/null
+++ b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/close/dialog.html/dialog.html
@@ -0,0 +1,106 @@
+<md-dialog class="faxAccount-dialog" aria-label="New FaxAccount">
+  <form name="faxAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="FAX.DISPOSITION">Disposition</label>
+        <input
+          type="text"
+          name="disposition"
+          ng-model="vm.close.disposition"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="faxAccountFormApp['disposition'].$error"
+          ng-show="faxAccountFormApp['disposition'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="FAX.ERRORS.DISPOSITION_REQUIRED"
+              >Disposition field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveFaxAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="faxAccountFormApp.$invalid || faxAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="FAX.SAVE"
+          translate-attr-aria-label="FAX.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/gotoif/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/gotoif/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index f248839..0000000
--- a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/gotoif/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,166 +0,0 @@
-<md-dialog class="faxAccount-dialog" aria-label="New FaxAccount">
-  <form name="faxAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="FAX.CONDITION">Condition</label>
-        <input
-          type="text"
-          name="condition"
-          ng-model="vm.gotoif.condition"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="faxAccountFormApp['condition'].$error"
-          ng-show="faxAccountFormApp['condition'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="FAX.ERRORS.CONDITION_REQUIRED"
-              >Condition field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="FAX.TRUEPRIORITY">truepriority</label>
-        <input
-          type="number"
-          name="truepriority"
-          ng-model="vm.gotoif.truepriority"
-          min="1"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="faxAccountFormApp['truepriority'].$error"
-          ng-show="faxAccountFormApp['truepriority'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="FAX.ERRORS.TRUEPRIORITY_REQUIRED"
-              >truepriority field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="FAX.ERRORS.TRUEPRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >truepriority must be a valid greater or equal than</span
-            >
-            <span>1</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="FAX.FALSEPRIORITY">falsepriority</label>
-        <input
-          type="number"
-          name="falsepriority"
-          ng-model="vm.gotoif.falsepriority"
-          min="1"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="faxAccountFormApp['falsepriority'].$error"
-          ng-show="faxAccountFormApp['falsepriority'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="FAX.ERRORS.FALSEPRIORITY_REQUIRED"
-              >falsepriority field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="FAX.ERRORS.FALSEPRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >falsepriority must be a valid greater or equal than</span
-            >
-            <span>1</span>
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveFaxAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="faxAccountFormApp.$invalid || faxAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="FAX.SAVE"
-          translate-attr-aria-label="FAX.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/gotoif/dialog.html/dialog.html b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/gotoif/dialog.html/dialog.html
new file mode 100644
index 0000000..f248839
--- /dev/null
+++ b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/gotoif/dialog.html/dialog.html
@@ -0,0 +1,166 @@
+<md-dialog class="faxAccount-dialog" aria-label="New FaxAccount">
+  <form name="faxAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="FAX.CONDITION">Condition</label>
+        <input
+          type="text"
+          name="condition"
+          ng-model="vm.gotoif.condition"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="faxAccountFormApp['condition'].$error"
+          ng-show="faxAccountFormApp['condition'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="FAX.ERRORS.CONDITION_REQUIRED"
+              >Condition field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="FAX.TRUEPRIORITY">truepriority</label>
+        <input
+          type="number"
+          name="truepriority"
+          ng-model="vm.gotoif.truepriority"
+          min="1"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="faxAccountFormApp['truepriority'].$error"
+          ng-show="faxAccountFormApp['truepriority'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="FAX.ERRORS.TRUEPRIORITY_REQUIRED"
+              >truepriority field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="FAX.ERRORS.TRUEPRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >truepriority must be a valid greater or equal than</span
+            >
+            <span>1</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="FAX.FALSEPRIORITY">falsepriority</label>
+        <input
+          type="number"
+          name="falsepriority"
+          ng-model="vm.gotoif.falsepriority"
+          min="1"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="faxAccountFormApp['falsepriority'].$error"
+          ng-show="faxAccountFormApp['falsepriority'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="FAX.ERRORS.FALSEPRIORITY_REQUIRED"
+              >falsepriority field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="FAX.ERRORS.FALSEPRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >falsepriority must be a valid greater or equal than</span
+            >
+            <span>1</span>
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveFaxAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="faxAccountFormApp.$invalid || faxAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="FAX.SAVE"
+          translate-attr-aria-label="FAX.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/gotop/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/gotop/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 13c33d0..0000000
--- a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/gotop/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,114 +0,0 @@
-<md-dialog class="faxAccount-dialog" aria-label="New FaxAccount">
-  <form name="faxAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="FAX.PRIORITY">Priority</label>
-        <input
-          type="number"
-          name="priority"
-          ng-model="vm.gotop.priority"
-          min="0"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="faxAccountFormApp['priority'].$error"
-          ng-show="faxAccountFormApp['priority'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="FAX.ERRORS.PRIORITY_REQUIRED"
-              >Priority field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="FAX.ERRORS.PRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Priority must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveFaxAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="faxAccountFormApp.$invalid || faxAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="FAX.SAVE"
-          translate-attr-aria-label="FAX.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/gotop/dialog.html/dialog.html b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/gotop/dialog.html/dialog.html
new file mode 100644
index 0000000..13c33d0
--- /dev/null
+++ b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/gotop/dialog.html/dialog.html
@@ -0,0 +1,114 @@
+<md-dialog class="faxAccount-dialog" aria-label="New FaxAccount">
+  <form name="faxAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="FAX.PRIORITY">Priority</label>
+        <input
+          type="number"
+          name="priority"
+          ng-model="vm.gotop.priority"
+          min="0"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="faxAccountFormApp['priority'].$error"
+          ng-show="faxAccountFormApp['priority'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="FAX.ERRORS.PRIORITY_REQUIRED"
+              >Priority field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="FAX.ERRORS.PRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Priority must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveFaxAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="faxAccountFormApp.$invalid || faxAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="FAX.SAVE"
+          translate-attr-aria-label="FAX.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/interval/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/interval/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index ca0ed91..0000000
--- a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/interval/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,313 +0,0 @@
-<md-dialog class="inboundroute-dialog" aria-label="New Interval">
-  <form name="intervalForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <md-input-container class="md-block">
-        <label translate="TOOLS.TYPE">Type</label>
-        <md-select
-          ng-model="vm.type"
-          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="type" ng-repeat="type in vm.types"
-            >{{ type | ucfirst }}</md-option
-          >
-        </md-select>
-      </md-input-container>
-
-      <md-input-container class="md-block" ng-if="vm.type === 'list'">
-        <label translate="TOOLS.INTERVALS">Intervals</label>
-        <md-select
-          ng-model="vm.interval.IntervalId"
-          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="interval.id" ng-repeat="interval in vm.intervals"
-            >{{ interval.name }}</md-option
-          >
-        </md-select>
-      </md-input-container>
-
-      <!-- TIMERANGE START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.TIME_RANGE"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <div class="md-block" flex>
-          <mdp-time-picker
-            name="timeRangeFrom"
-            mdp-placeholder="FROM"
-            ng-model="vm.timeRangeFrom"
-            mdp-format="HH:mm"
-            mdp-auto-switch="true"
-            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <div
-              ng-messages="intervalForm.timeRangeFrom.$error"
-              ng-show="intervalForm.timeRangeFrom.$touched"
-              role="alert"
-            >
-              <div ng-message="format">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_FROM_INVALID"
-                  >Time Range From field is invalid</span
-                >
-              </div>
-            </div>
-          </mdp-time-picker>
-        </div>
-        <div class="md-block" flex ng-if="vm.timeRangeFrom">
-          <mdp-time-picker
-            name="timeRangeTo"
-            mdp-placeholder="TO*"
-            ng-model="vm.timeRangeTo"
-            mdp-format="HH:mm"
-            mdp-auto-switch="true"
-            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-            required
-          >
-            <div
-              ng-messages="intervalForm.timeRangeTo.$error"
-              ng-show="intervalForm.timeRangeTo.$invalid"
-              role="alert"
-            >
-              <div ng-message="format">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_INVALID"
-                  >Time Range To field is invalid</span
-                >
-              </div>
-              <div ng-message="required">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_REQUIRED"
-                  >Time Range To field is required</span
-                >
-              </div>
-            </div>
-          </mdp-time-picker>
-        </div>
-      </div>
-      <!-- TIMERANGE END -->
-
-      <!-- DAYSOFWEEK START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.WEEK_DAYS"
-        >Week Days</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.dayOfWeekFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
-              ><span translate="TOOLS.{{day.value | uppercase}}"
-                >{{ day.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container flex class="md-block" ng-if="vm.dayOfWeekFrom">
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="dayOfWeekTo"
-            ng-model="vm.dayOfWeekTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
-              ><span translate="TOOLS.{{day.value | uppercase}}"
-                >{{ day.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.dayOfWeekTo.$error"
-            ng-show="intervalForm.dayOfWeekTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- DAYSOFWEEK END -->
-
-      <!-- MONTHDAY START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTH_DAYS"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex layout="column" class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.monthDayFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
-              >{{ month }}</md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container
-          flex
-          layout="column"
-          class="md-block"
-          ng-if="vm.monthDayFrom"
-        >
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="monthDayTo"
-            ng-model="vm.monthDayTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
-              >{{ month }}</md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.monthDayTo.$error"
-            ng-show="intervalForm.monthDayTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- MONTHDAY END -->
-
-      <!-- MONTH START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTHS"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex layout="column" class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.monthFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
-              ><span translate="TOOLS.{{month.value | uppercase}}"
-                >{{ month.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container
-          flex
-          layout="column"
-          class="md-block"
-          ng-if="vm.monthFrom"
-        >
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="monthTo"
-            ng-model="vm.monthTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
-              ><span translate="TOOLS.{{month.value | uppercase}}"
-                >{{ month.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.monthTo.$error"
-            ng-show="intervalForm.monthTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- MONTH END -->
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="!vm.newInterval && vm.crudPermissions.canEdit"
-          ng-click="vm.saveInterval()"
-          class="send-button md-accent md-raised"
-          ng-disabled="intervalForm.$invalid || intervalForm.$pristine"
-          aria-label="SAVE"
-          translate="TOOLS.SAVE"
-          translate-attr-aria-label="TOOLS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.newInterval && vm.crudPermissions.canEdit"
-          ng-click="vm.addNewInterval()"
-          class="send-button md-accent md-raised"
-          ng-disabled="intervalForm.$invalid"
-          aria-label="ADD"
-          translate="TOOLS.ADD_INTERVAL"
-          translate-attr-aria-label="TOOLS.ADD_INTERVAL"
-        >
-          ADD INTERVAL
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/interval/dialog.html/dialog.html b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/interval/dialog.html/dialog.html
new file mode 100644
index 0000000..ca0ed91
--- /dev/null
+++ b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/interval/dialog.html/dialog.html
@@ -0,0 +1,313 @@
+<md-dialog class="inboundroute-dialog" aria-label="New Interval">
+  <form name="intervalForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <md-input-container class="md-block">
+        <label translate="TOOLS.TYPE">Type</label>
+        <md-select
+          ng-model="vm.type"
+          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="type" ng-repeat="type in vm.types"
+            >{{ type | ucfirst }}</md-option
+          >
+        </md-select>
+      </md-input-container>
+
+      <md-input-container class="md-block" ng-if="vm.type === 'list'">
+        <label translate="TOOLS.INTERVALS">Intervals</label>
+        <md-select
+          ng-model="vm.interval.IntervalId"
+          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="interval.id" ng-repeat="interval in vm.intervals"
+            >{{ interval.name }}</md-option
+          >
+        </md-select>
+      </md-input-container>
+
+      <!-- TIMERANGE START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.TIME_RANGE"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <div class="md-block" flex>
+          <mdp-time-picker
+            name="timeRangeFrom"
+            mdp-placeholder="FROM"
+            ng-model="vm.timeRangeFrom"
+            mdp-format="HH:mm"
+            mdp-auto-switch="true"
+            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <div
+              ng-messages="intervalForm.timeRangeFrom.$error"
+              ng-show="intervalForm.timeRangeFrom.$touched"
+              role="alert"
+            >
+              <div ng-message="format">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_FROM_INVALID"
+                  >Time Range From field is invalid</span
+                >
+              </div>
+            </div>
+          </mdp-time-picker>
+        </div>
+        <div class="md-block" flex ng-if="vm.timeRangeFrom">
+          <mdp-time-picker
+            name="timeRangeTo"
+            mdp-placeholder="TO*"
+            ng-model="vm.timeRangeTo"
+            mdp-format="HH:mm"
+            mdp-auto-switch="true"
+            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+            required
+          >
+            <div
+              ng-messages="intervalForm.timeRangeTo.$error"
+              ng-show="intervalForm.timeRangeTo.$invalid"
+              role="alert"
+            >
+              <div ng-message="format">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_INVALID"
+                  >Time Range To field is invalid</span
+                >
+              </div>
+              <div ng-message="required">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_REQUIRED"
+                  >Time Range To field is required</span
+                >
+              </div>
+            </div>
+          </mdp-time-picker>
+        </div>
+      </div>
+      <!-- TIMERANGE END -->
+
+      <!-- DAYSOFWEEK START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.WEEK_DAYS"
+        >Week Days</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.dayOfWeekFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
+              ><span translate="TOOLS.{{day.value | uppercase}}"
+                >{{ day.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container flex class="md-block" ng-if="vm.dayOfWeekFrom">
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="dayOfWeekTo"
+            ng-model="vm.dayOfWeekTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
+              ><span translate="TOOLS.{{day.value | uppercase}}"
+                >{{ day.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.dayOfWeekTo.$error"
+            ng-show="intervalForm.dayOfWeekTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- DAYSOFWEEK END -->
+
+      <!-- MONTHDAY START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTH_DAYS"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex layout="column" class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.monthDayFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
+              >{{ month }}</md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container
+          flex
+          layout="column"
+          class="md-block"
+          ng-if="vm.monthDayFrom"
+        >
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="monthDayTo"
+            ng-model="vm.monthDayTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
+              >{{ month }}</md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.monthDayTo.$error"
+            ng-show="intervalForm.monthDayTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- MONTHDAY END -->
+
+      <!-- MONTH START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTHS"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex layout="column" class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.monthFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
+              ><span translate="TOOLS.{{month.value | uppercase}}"
+                >{{ month.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container
+          flex
+          layout="column"
+          class="md-block"
+          ng-if="vm.monthFrom"
+        >
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="monthTo"
+            ng-model="vm.monthTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
+              ><span translate="TOOLS.{{month.value | uppercase}}"
+                >{{ month.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.monthTo.$error"
+            ng-show="intervalForm.monthTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- MONTH END -->
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="!vm.newInterval && vm.crudPermissions.canEdit"
+          ng-click="vm.saveInterval()"
+          class="send-button md-accent md-raised"
+          ng-disabled="intervalForm.$invalid || intervalForm.$pristine"
+          aria-label="SAVE"
+          translate="TOOLS.SAVE"
+          translate-attr-aria-label="TOOLS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.newInterval && vm.crudPermissions.canEdit"
+          ng-click="vm.addNewInterval()"
+          class="send-button md-accent md-raised"
+          ng-disabled="intervalForm.$invalid"
+          aria-label="ADD"
+          translate="TOOLS.ADD_INTERVAL"
+          translate-attr-aria-label="TOOLS.ADD_INTERVAL"
+        >
+          ADD INTERVAL
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/noop/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/noop/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 87e5a94..0000000
--- a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/noop/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,105 +0,0 @@
-<md-dialog class="faxAccount-dialog" aria-label="New FaxAccount">
-  <form name="faxAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="FAX.VALUE">Value</label>
-        <input
-          type="text"
-          name="value"
-          ng-model="vm.noop.value"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="faxAccountFormApp['value'].$error"
-          ng-show="faxAccountFormApp['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="FAX.ERRORS.VALUE_REQUIRED"
-              >Value field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveFaxAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="faxAccountFormApp.$invalid || faxAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="FAX.SAVE"
-          translate-attr-aria-label="FAX.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/noop/dialog.html/dialog.html b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/noop/dialog.html/dialog.html
new file mode 100644
index 0000000..87e5a94
--- /dev/null
+++ b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/noop/dialog.html/dialog.html
@@ -0,0 +1,105 @@
+<md-dialog class="faxAccount-dialog" aria-label="New FaxAccount">
+  <form name="faxAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="FAX.VALUE">Value</label>
+        <input
+          type="text"
+          name="value"
+          ng-model="vm.noop.value"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="faxAccountFormApp['value'].$error"
+          ng-show="faxAccountFormApp['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="FAX.ERRORS.VALUE_REQUIRED"
+              >Value field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveFaxAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="faxAccountFormApp.$invalid || faxAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="FAX.SAVE"
+          translate-attr-aria-label="FAX.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/queue/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/queue/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index f552718..0000000
--- a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/queue/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,148 +0,0 @@
-<md-dialog class="faxAccount-dialog" aria-label="New FaxAccount">
-  <form name="faxAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="FAX.QUEUE">Queue</label>
-        <md-select
-          name="queue"
-          ng-model="vm.queue.queue"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="queue.name"
-            ng-repeat="queue in vm.queues"
-            ng-disabled="queue.canSelect === false"
-            >{{ queue.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="faxAccountFormApp['queue'].$error"
-          ng-show="faxAccountFormApp['queue'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="FAX.ERRORS.QUEUE_REQUIRED"
-              >Queue field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="FAX.TIMEOUT">Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.queue.timeout"
-          min="0"
-          max="2147483"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="faxAccountFormApp['timeout'].$error"
-          ng-show="faxAccountFormApp['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="FAX.ERRORS.TIMEOUT_REQUIRED"
-              >Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="FAX.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-          <div ng-message="max">
-            <span translate="FAX.ERRORS.TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>2147483</span>
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveFaxAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="faxAccountFormApp.$invalid || faxAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="FAX.SAVE"
-          translate-attr-aria-label="FAX.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/queue/dialog.html/dialog.html b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/queue/dialog.html/dialog.html
new file mode 100644
index 0000000..f552718
--- /dev/null
+++ b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/queue/dialog.html/dialog.html
@@ -0,0 +1,148 @@
+<md-dialog class="faxAccount-dialog" aria-label="New FaxAccount">
+  <form name="faxAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="FAX.QUEUE">Queue</label>
+        <md-select
+          name="queue"
+          ng-model="vm.queue.queue"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="queue.name"
+            ng-repeat="queue in vm.queues"
+            ng-disabled="queue.canSelect === false"
+            >{{ queue.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="faxAccountFormApp['queue'].$error"
+          ng-show="faxAccountFormApp['queue'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="FAX.ERRORS.QUEUE_REQUIRED"
+              >Queue field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="FAX.TIMEOUT">Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.queue.timeout"
+          min="0"
+          max="2147483"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="faxAccountFormApp['timeout'].$error"
+          ng-show="faxAccountFormApp['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="FAX.ERRORS.TIMEOUT_REQUIRED"
+              >Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="FAX.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+          <div ng-message="max">
+            <span translate="FAX.ERRORS.TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>2147483</span>
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveFaxAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="faxAccountFormApp.$invalid || faxAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="FAX.SAVE"
+          translate-attr-aria-label="FAX.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/system/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/system/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index c59d831..0000000
--- a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/system/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,133 +0,0 @@
-<md-dialog class="faxAccount-dialog" aria-label="New FaxAccount">
-  <form name="faxAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="FAX.COMMAND">Command</label>
-        <input
-          type="text"
-          name="command"
-          ng-model="vm.system.command"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="faxAccountFormApp['command'].$error"
-          ng-show="faxAccountFormApp['command'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="FAX.ERRORS.COMMAND_REQUIRED"
-              >Command field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="FAX.VARIABLE">Variable</label>
-        <md-select
-          name="variable"
-          ng-model="vm.system.variable"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="''">None</md-option>
-          <md-option
-            ng-value="variable.name"
-            ng-repeat="variable in vm.variables"
-            ng-disabled="variable.canSelect === false"
-            >{{ variable.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="faxAccountFormApp['variable'].$error"
-          ng-show="faxAccountFormApp['variable'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="FAX.ERRORS.VARIABLE_REQUIRED"
-              >Variable field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveFaxAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="faxAccountFormApp.$invalid || faxAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="FAX.SAVE"
-          translate-attr-aria-label="FAX.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/system/dialog.html/dialog.html b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/system/dialog.html/dialog.html
new file mode 100644
index 0000000..c59d831
--- /dev/null
+++ b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/system/dialog.html/dialog.html
@@ -0,0 +1,133 @@
+<md-dialog class="faxAccount-dialog" aria-label="New FaxAccount">
+  <form name="faxAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="FAX.COMMAND">Command</label>
+        <input
+          type="text"
+          name="command"
+          ng-model="vm.system.command"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="faxAccountFormApp['command'].$error"
+          ng-show="faxAccountFormApp['command'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="FAX.ERRORS.COMMAND_REQUIRED"
+              >Command field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="FAX.VARIABLE">Variable</label>
+        <md-select
+          name="variable"
+          ng-model="vm.system.variable"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="''">None</md-option>
+          <md-option
+            ng-value="variable.name"
+            ng-repeat="variable in vm.variables"
+            ng-disabled="variable.canSelect === false"
+            >{{ variable.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="faxAccountFormApp['variable'].$error"
+          ng-show="faxAccountFormApp['variable'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="FAX.ERRORS.VARIABLE_REQUIRED"
+              >Variable field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveFaxAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="faxAccountFormApp.$invalid || faxAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="FAX.SAVE"
+          translate-attr-aria-label="FAX.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/tag/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/tag/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 8377807..0000000
--- a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/tag/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,111 +0,0 @@
-<md-dialog class="faxAccount-dialog" aria-label="New FaxAccount">
-  <form name="faxAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="FAX.TAG">Tag</label>
-        <md-select
-          name="tag"
-          ng-model="vm.tag.tag"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="tag.name"
-            ng-repeat="tag in vm.tags"
-            ng-disabled="tag.canSelect === false"
-            >{{ tag.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="faxAccountFormApp['tag'].$error"
-          ng-show="faxAccountFormApp['tag'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="FAX.ERRORS.TAG_REQUIRED"
-              >Tag field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveFaxAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="faxAccountFormApp.$invalid || faxAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="FAX.SAVE"
-          translate-attr-aria-label="FAX.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/tag/dialog.html/dialog.html b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/tag/dialog.html/dialog.html
new file mode 100644
index 0000000..8377807
--- /dev/null
+++ b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/apps/tag/dialog.html/dialog.html
@@ -0,0 +1,111 @@
+<md-dialog class="faxAccount-dialog" aria-label="New FaxAccount">
+  <form name="faxAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="FAX.TAG">Tag</label>
+        <md-select
+          name="tag"
+          ng-model="vm.tag.tag"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="tag.name"
+            ng-repeat="tag in vm.tags"
+            ng-disabled="tag.canSelect === false"
+            >{{ tag.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="faxAccountFormApp['tag'].$error"
+          ng-show="faxAccountFormApp['tag'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="FAX.ERRORS.TAG_REQUIRED"
+              >Tag field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveFaxAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="faxAccountFormApp.$invalid || faxAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="FAX.SAVE"
+          translate-attr-aria-label="FAX.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index a7228ff..0000000
--- a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,1634 +0,0 @@
-<div id="fax-faxAccount" class="page-layout simple tabbed" layout="column">
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-faxAccounts-button md-icon-button"
-        aria-label="Go to faxAccounts"
-        ng-click="vm.gotoFaxAccounts()"
-        translate
-        translate-attr-aria-label="FAX.GO_TO_FAXACCOUNTS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="faxAccount-image" hide-xs>
-          <img ng-src="assets/images/business/faxAccounts.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.faxAccount.id}}
-            <span ng-if="vm.faxAccount.name">{{vm.faxAccount.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="FAX.CREATED_AT"></span>
-            <span>{{vm.faxAccount.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.gotogoto(vm.faxAccount, $event)"
-        class="md-fab md-warn md-icon-button"
-        aria-label="goto"
-      >
-        <md-tooltip><span translate="FAX.GOTO_FAXACCOUNT"></span></md-tooltip>
-        <md-icon md-font-icon="icon-cast"></md-icon>
-      </md-button>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.agentadddialog(vm.faxAccount, $event)"
-        class="md-fab md-warn md-icon-button"
-        aria-label="agentadd"
-      >
-        <md-tooltip
-          ><span translate="FAX.AGENTADD_FAXACCOUNT"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
-      </md-button>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveFaxAccount()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (notificationForm.$invalid) || (transferForm.$invalid) || (advancedForm.$invalid) || (dispositionForm.$invalid) || (faxDispositionsForm.$invalid) || (actionsForm.$invalid) || (interactionsForm.$invalid)"
-        translate="FAX.SAVE"
-        translate-attr-aria-label="FAX.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="FAX.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="faxAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="FAX.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="FAX.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.faxAccount.name"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="FAX.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="FAX.KEY">key</label>
-                <input
-                  type="text"
-                  name="key"
-                  ng-model="vm.faxAccount.key"
-                  md-maxlength="5"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['key'].$error"
-                  ng-show="generalForm['key'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="FAX.ERRORS.KEY_REQUIRED"
-                      >key field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="FAX.ERRORS.KEY_MAX_LENGTH"
-                      translate-values="{max: 5}"
-                      >key must have a maximum length equal to 5</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="FAX.HEADERINFO">headerinfo</label>
-                <input
-                  type="text"
-                  name="headerinfo"
-                  ng-model="vm.faxAccount.headerinfo"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="FAX.HELP.HEADERINFO"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['headerinfo'].$error"
-                  ng-show="generalForm['headerinfo'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="FAX.ERRORS.HEADERINFO_REQUIRED"
-                      >headerinfo field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="FAX.TRUNK">trunk</label>
-                <md-select
-                  name="TrunkId"
-                  ng-model="vm.faxAccount.TrunkId"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="TrunkId.id"
-                    ng-repeat="TrunkId in vm.trunks"
-                    ng-disabled="TrunkId.canSelect === false"
-                    >{{ TrunkId.name }}</md-option
-                  >
-                </md-select>
-                <div
-                  ng-messages="generalForm['TrunkId'].$error"
-                  ng-show="generalForm['TrunkId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="FAX.ERRORS.TRUNK_REQUIRED"
-                      >trunk field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="FAX.LOCALSTATIONID">localstationid</label>
-                <input
-                  type="text"
-                  name="localstationid"
-                  ng-model="vm.faxAccount.localstationid"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="FAX.HELP.LOCALSTATIONID"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['localstationid'].$error"
-                  ng-show="generalForm['localstationid'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="FAX.ERRORS.LOCALSTATIONID_REQUIRED"
-                      >localstationid field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="FAX.LIST">List</label>
-                <md-select
-                  name="ListId"
-                  ng-model="vm.faxAccount.ListId"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="ListId.id"
-                    ng-repeat="ListId in vm.lists"
-                    ng-disabled="ListId.canSelect === false"
-                    >{{ ListId.name }}</md-option
-                  >
-                </md-select>
-                <div
-                  ng-messages="generalForm['ListId'].$error"
-                  ng-show="generalForm['ListId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="FAX.ERRORS.LIST_REQUIRED"
-                      >List field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="FAX.WAITFORTHEASSIGNEDAGENT"
-                  >WaitForTheAssignedAgent</label
-                >
-                <input
-                  type="number"
-                  name="waitForTheAssignedAgent"
-                  ng-model="vm.faxAccount.waitForTheAssignedAgent"
-                  min="1"
-                  max="2147483"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['waitForTheAssignedAgent'].$error"
-                  ng-show="generalForm['waitForTheAssignedAgent'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="FAX.ERRORS.WAITFORTHEASSIGNEDAGENT_REQUIRED"
-                      >WaitForTheAssignedAgent field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="FAX.ERRORS.WAITFORTHEASSIGNEDAGENT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >WaitForTheAssignedAgent must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="FAX.ERRORS.WAITFORTHEASSIGNEDAGENT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >WaitForTheAssignedAgent must be a valid greater or equal
-                      than</span
-                    >
-                    <span>2147483</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="FAX.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.faxAccount.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="FAX.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="faxAccount-detail-form-container notification md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="FAX.NOTIFICATION">
-                NOTIFICATION
-              </div>
-            </div>
-            <form name="notificationForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.faxAccount.notificationSound"
-                  aria-label="notificationSound"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="FAX.NOTIFICATIONSOUND"
-                    >notificationSound</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.faxAccount.notificationShake"
-                  aria-label="notificationShake"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="FAX.NOTIFICATIONSHAKE"
-                    >notificationShake</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <div class="md-block">
-                <label
-                  class="md-caption grey-fg"
-                  translate="FAX.NOTIFICATIONTEMPLATE"
-                  >notificationTemplate</label
-                >
-                <textarea
-                  aria-label="notificationTemplate notificationTemplate"
-                  ckeditor="{ skin: 'office2013', language: 'en', allowedContent: true, extraPlugins: 'font,colorbutton,autoembed,autocorrect,googlethisterm,pastebase64', toolbarGroups: [{ name: 'styles', groups: ['styles'] }, { name: 'clipboard', groups: ['undo'] }, { name: 'colors', groups: ['colors'] }, { name: 'basicstyles', groups: ['basicstyles'] }, { name: 'paragraph', groups: ['list', 'indent', 'align'] }, { name: 'mode' }], autocorrect_enabled: true, disableNativeSpellChecker: false, fontSize_sizes: '8/8pt;9/9pt;10/10pt;11/11pt;12/12pt;14/14pt;16/16pt;18/18pt;20/20pt;22/22pt;24/24pt;26/26pt;28/28pt;36/36pt;48/48pt;72/72pt',  removePlugins: 'magicline' }"
-                  ng-model="vm.faxAccount.notificationTemplate"
-                ></textarea>
-              </div>
-            </form>
-          </div>
-          <div
-            class="faxAccount-detail-form-container transfer md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="FAX.TRANSFER">
-                TRANSFER
-              </div>
-            </div>
-            <form name="transferForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.faxAccount.queueTransfer"
-                  aria-label="queueTransfer"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="FAX.QUEUETRANSFER"
-                    >queueTransfer</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.faxAccount.queueTransfer == true"
-                class="md-block"
-              >
-                <label translate="FAX.QUEUETRANSFERTIMEOUT"
-                  >queueTransferTimeout</label
-                >
-                <input
-                  type="number"
-                  name="queueTransferTimeout"
-                  ng-model="vm.faxAccount.queueTransferTimeout"
-                  min="1"
-                  max="2147483"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="transferForm['queueTransferTimeout'].$error"
-                  ng-show="transferForm['queueTransferTimeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="FAX.ERRORS.QUEUETRANSFERTIMEOUT_REQUIRED"
-                      >queueTransferTimeout field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="FAX.ERRORS.QUEUETRANSFERTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >queueTransferTimeout must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="FAX.ERRORS.QUEUETRANSFERTIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >queueTransferTimeout must be a valid greater or equal
-                      than</span
-                    >
-                    <span>2147483</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.faxAccount.agentTransfer"
-                  aria-label="agentTransfer"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="FAX.AGENTTRANSFER"
-                    >agentTransfer</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.faxAccount.agentTransfer == true"
-                class="md-block"
-              >
-                <label translate="FAX.AGENTTRANSFERTIMEOUT"
-                  >agentTransferTimeout</label
-                >
-                <input
-                  type="number"
-                  name="agentTransferTimeout"
-                  ng-model="vm.faxAccount.agentTransferTimeout"
-                  min="1"
-                  max="2147483"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="transferForm['agentTransferTimeout'].$error"
-                  ng-show="transferForm['agentTransferTimeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="FAX.ERRORS.AGENTTRANSFERTIMEOUT_REQUIRED"
-                      >agentTransferTimeout field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="FAX.ERRORS.AGENTTRANSFERTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >agentTransferTimeout must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="FAX.ERRORS.AGENTTRANSFERTIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >agentTransferTimeout must be a valid greater or equal
-                      than</span
-                    >
-                    <span>2147483</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="FAX.ADVANCED">ADVANCED</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="faxAccount-detail-form-container advanced md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="FAX.ADVANCED">
-                ADVANCED
-              </div>
-            </div>
-            <form name="advancedForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="FAX.ECM">ECM</label>
-                <md-select
-                  name="ecm"
-                  ng-model="vm.faxAccount.ecm"
-                  autofocus
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">yes</md-option>
-                  <md-option ng-value="'no'">no</md-option>
-                </md-select>
-                <div class="hint"><span translate="FAX.HELP.ECM"></span></div>
-                <div
-                  ng-messages="advancedForm['ecm'].$error"
-                  ng-show="advancedForm['ecm'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="FAX.ERRORS.ECM_REQUIRED"
-                      >ECM field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="FAX.MINRATE">minrate</label>
-                <md-select
-                  name="minrate"
-                  ng-model="vm.faxAccount.minrate"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'2400'">2400</md-option>
-                  <md-option ng-value="'4800'">4800</md-option>
-                  <md-option ng-value="'7200'">7200</md-option>
-                  <md-option ng-value="'9600'">9600</md-option>
-                  <md-option ng-value="'12000'">12000</md-option>
-                  <md-option ng-value="'14400'">14400</md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="FAX.HELP.MINRATE"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['minrate'].$error"
-                  ng-show="advancedForm['minrate'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="FAX.ERRORS.MINRATE_REQUIRED"
-                      >minrate field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="FAX.MAXRATE">maxrate</label>
-                <md-select
-                  name="maxrate"
-                  ng-model="vm.faxAccount.maxrate"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'2400'">2400</md-option>
-                  <md-option ng-value="'4800'">4800</md-option>
-                  <md-option ng-value="'7200'">7200</md-option>
-                  <md-option ng-value="'9600'">9600</md-option>
-                  <md-option ng-value="'12000'">12000</md-option>
-                  <md-option ng-value="'14400'">14400</md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="FAX.HELP.MAXRATE"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['maxrate'].$error"
-                  ng-show="advancedForm['maxrate'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="FAX.ERRORS.MAXRATE_REQUIRED"
-                      >maxrate field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="FAX.MODEM">modem</label>
-                <input
-                  type="text"
-                  name="modem"
-                  ng-model="vm.faxAccount.modem"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint"><span translate="FAX.HELP.MODEM"></span></div>
-                <div
-                  ng-messages="advancedForm['modem'].$error"
-                  ng-show="advancedForm['modem'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="FAX.ERRORS.MODEM_REQUIRED"
-                      >modem field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="FAX.GATEWAY">gateway</label>
-                <input
-                  type="text"
-                  name="gateway"
-                  ng-model="vm.faxAccount.gateway"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="FAX.HELP.GATEWAY"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['gateway'].$error"
-                  ng-show="advancedForm['gateway'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="FAX.ERRORS.GATEWAY_REQUIRED"
-                      >gateway field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="FAX.FAXDETECT">faxdetect</label>
-                <input
-                  type="text"
-                  name="faxdetect"
-                  ng-model="vm.faxAccount.faxdetect"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="FAX.HELP.FAXDETECT"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['faxdetect'].$error"
-                  ng-show="advancedForm['faxdetect'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="FAX.ERRORS.FAXDETECT_REQUIRED"
-                      >faxdetect field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="FAX.T38TIMEOUT">t38timeout</label>
-                <input
-                  type="number"
-                  name="t38timeout"
-                  ng-model="vm.faxAccount.t38timeout"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="FAX.HELP.T38TIMEOUT"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['t38timeout'].$error"
-                  ng-show="advancedForm['t38timeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="FAX.ERRORS.T38TIMEOUT_REQUIRED"
-                      >t38timeout field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="FAX.SIP">SIP</label>
-                <md-select
-                  name="tech"
-                  ng-model="vm.faxAccount.tech"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'SIP'">SIP</md-option>
-                  <md-option ng-value="'IAX'">IAX</md-option>
-                  <md-option ng-value="'DADHI'">DADHI</md-option>
-                  <md-option ng-value="'KHOMP'">KHOMP</md-option>
-                </md-select>
-                <div
-                  ng-messages="advancedForm['tech'].$error"
-                  ng-show="advancedForm['tech'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="FAX.ERRORS.SIP_REQUIRED"
-                      >SIP field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="faxAccount-detail-form-container disposition md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="FAX.DISPOSITION">
-                DISPOSITION
-              </div>
-            </div>
-            <form name="dispositionForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.faxAccount.mandatoryDisposition"
-                  aria-label="MandatoryDisposition"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="FAX.MANDATORYDISPOSITION"
-                    >MandatoryDisposition</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.faxAccount.mandatoryDisposition"
-                class="md-block"
-              >
-                <label translate="FAX.MANDATORYDISPOSITIONPAUSEID"
-                  >MandatoryDispositionPauseId</label
-                >
-                <md-select
-                  name="mandatoryDispositionPauseId"
-                  ng-model="vm.faxAccount.mandatoryDispositionPauseId"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="mandatoryDispositionPauseId.id"
-                    ng-repeat="mandatoryDispositionPauseId in vm.pauses"
-                    ng-disabled="mandatoryDispositionPauseId.canSelect === false"
-                    >{{ mandatoryDispositionPauseId.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span translate="FAX.HELP.MANDATORYDISPOSITIONPAUSEID"></span>
-                </div>
-                <div
-                  ng-messages="dispositionForm['mandatoryDispositionPauseId'].$error"
-                  ng-show="dispositionForm['mandatoryDispositionPauseId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="FAX.ERRORS.MANDATORYDISPOSITIONPAUSEID_REQUIRED"
-                      >MandatoryDispositionPauseId field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="FAX.DISPOSITIONS">DISPOSITIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            ng-controller="FaxAccountDispositionsController as vm_dc"
-            ng-init="vm_dc.init(vm.faxAccount, vm.crudPermissions)"
-          >
-            <div layout="row">
-              <div class="column" flex="20">
-                <md-card class="mt-0">
-                  <md-card-content>
-                    <button
-                      layout-align="center center"
-                      md-mini-fab
-                      ng-click="vm_dc.query.level = null; vm_dc.getDispositions()"
-                    >
-                      <div layout="row" layout-align="start center">
-                        <md-icon md-font-icon="icon-refresh"></md-icon>
-                        <span class="ph-5"
-                          >{{ 'TOOLS.ALL_DISPOSITIONS' | translate }}</span
-                        >
-                      </div>
-                    </button>
-                  </md-card-content>
-                </md-card>
-                <md-card>
-                  <md-card-content>
-                    <md-input-container class="md-block" flex-gt-sm="">
-                      <label translate="TOOLS.SELECT_LEVEL"
-                        >Select a level</label
-                      >
-                      <md-select
-                        placeholder="{{ 'TOOLS.SELECT_LEVEL' | translate }}"
-                        ng-model="vm_dc.query.level"
-                        ng-change="vm_dc.getDispositions()"
-                      >
-                        <md-option ng-value="null"
-                          ><em translate="TOOLS.ALL">All</em></md-option
-                        >
-                        <md-option
-                          ng-value="key"
-                          ng-repeat="(key, value) in vm_dc.levels"
-                          >{{ value }}</md-option
-                        >
-                      </md-select>
-                    </md-input-container>
-                  </md-card-content>
-                </md-card>
-              </div>
-              <div
-                class="faxAccount-detail-form-container faxdispositions md-background-bg md-whiteframe-1dp"
-                flex="80"
-              >
-                <md-toolbar
-                  class="md-table-toolbar md-default"
-                  ng-hide="vm_dc.selectedFaxAccountDispositions.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead" translate="FAX.DISPOSITIONS"
-                      >Dispositions</span
-                    >
-                    <ms-search-bar
-                      on-search="vm_dc.query.filter = query"
-                      on-collapse="vm_dc.query.filter = undefined"
-                      debounce="300"
-                      direction="down"
-                    ></ms-search-bar>
-                    <div flex></div>
-                    <md-button
-                      ng-if="vm_dc.crudPermissions.canEdit"
-                      class="md-icon-button"
-                      ng-click="vm_dc.createOrEditDisposition($event)"
-                      aria-label="Add fax dispositions"
-                      translate
-                      translate-attr-label="FAX.ADD_DISPOSITION"
-                    >
-                      <md-icon md-font-icon="icon-plus"></md-icon>
-                    </md-button>
-                  </div>
-                </md-toolbar>
-                <md-toolbar
-                  class="md-table-toolbar md-accent"
-                  ng-show="vm_dc.selectedDispositions.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead"
-                      >{{vm_dc.selectedDispositions.length}}
-                      {{vm_dc.selectedDispositions.length > 1 ? 'items' :
-                      'item'}} selected</span
-                    >
-                    <div flex></div>
-                    <button
-                      class="md-icon-button"
-                      ng-csv="vm_dc.exportSelectedDispositions"
-                      csv-label="true"
-                      filename="faxAccounts.csv"
-                    >
-                      <md-icon md-font-icon="icon-file-excel"></md-icon>
-                    </button>
-                    <md-button
-                      ng-if="vm_dc.crudPermissions.canDelete"
-                      class="md-icon-button"
-                      ng-click="vm_dc.deleteSelectedDispositions($event)"
-                      aria-label="delete selected"
-                      translate
-                      translate-attr-label="FAX.DELETE_SELECTED"
-                    >
-                      <md-icon md-font-icon="icon-delete"></md-icon>
-                    </md-button>
-                  </div>
-                </md-toolbar>
-                <md-table-container>
-                  <table
-                    md-table
-                    md-row-select
-                    multiple
-                    ng-model="vm_dc.selectedDispositions"
-                    md-progress="vm_dc.promise"
-                  >
-                    <thead
-                      md-head
-                      md-order="vm_dc.query.sort"
-                      md-on-reorder="vm_dc.getDispositions"
-                    >
-                      <tr md-row>
-                        <th md-column md-order-by="id">
-                          {{ 'FAX.ID' | translate }}
-                        </th>
-                        <th md-column md-order-by="level">
-                          {{ 'TOOLS.LEVEL' | translate }}
-                        </th>
-                        <th md-column md-order-by="name">
-                          {{ 'FAX.NAME' | translate }}
-                        </th>
-                        <th md-column md-order-by="description">
-                          {{ 'FAX.DESCRIPTION' | translate }}
-                        </th>
-                        <th md-column width="10px"></th>
-                      </tr>
-                    </thead>
-                    <tbody md-body>
-                      <tr md-row ng-hide="vm_dc.dispositions.rows.length">
-                        <td md-cell colspan="5">
-                          <div layout="row" layout-align="center center">
-                            <span translate="FAX.NO_AVAILABLE_INFO"
-                              >No Available Info</span
-                            >
-                          </div>
-                        </td>
-                      </tr>
-                      <tr
-                        md-row
-                        md-select="disposition"
-                        md-select-id="id"
-                        ng-repeat="disposition in vm_dc.dispositions.rows"
-                      >
-                        <td
-                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                          md-cell
-                          class="id"
-                        >
-                          {{disposition.id}}
-                        </td>
-                        <td
-                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                          md-cell
-                          class="level"
-                        >
-                          {{ vm_dc.levels[disposition.level] }}
-                        </td>
-                        <td
-                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                          md-cell
-                          class="name"
-                        >
-                          {{disposition.name}}
-                        </td>
-                        <td
-                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                          md-cell
-                          class="description"
-                        >
-                          {{disposition.description}}
-                        </td>
-                        <td
-                          md-cell
-                          class="actions"
-                          ng-if="!vm_dc.crudPermissions.readOnly"
-                        >
-                          <md-menu>
-                            <md-button
-                              class="md-icon-button"
-                              aria-label="More"
-                              translate
-                              translate-attr-aria-label="FAX.MORE"
-                              ng-click="$mdOpenMenu($event)"
-                            >
-                              <md-icon
-                                md-font-icon="icon-dots-vertical"
-                              ></md-icon>
-                            </md-button>
-                            <md-menu-content width="3">
-                              <!-- SUBACTIONS -->
-                              <!-- ACTIONS -->
-                              <md-menu-item
-                                ng-if="vm_dc.crudPermissions.canEdit"
-                              >
-                                <md-button
-                                  ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                                  translate="TOOLS.EDIT_DISPOSITION"
-                                >
-                                  Edit Disposition
-                                </md-button>
-                              </md-menu-item>
-                              <!-- SUBACTIONS -->
-                              <!-- ACTIONS -->
-                              <md-menu-item
-                                ng-if="vm_dc.crudPermissions.canDelete"
-                              >
-                                <md-button
-                                  ng-click="vm_dc.deleteConfirm(disposition, $event)"
-                                  translate="TOOLS.DELETE_DISPOSITION"
-                                >
-                                  Delete Disposition
-                                </md-button>
-                              </md-menu-item>
-                            </md-menu-content>
-                          </md-menu>
-                        </td>
-                      </tr>
-                    </tbody>
-                  </table>
-                </md-table-container>
-                <md-table-pagination
-                  md-label="{page: '{{'FAX.PAGE' | translate}}:', rowsPerPage: '{{'FAX.ROWSPERPAGE' | translate}}:', of: '{{'FAX.OF' | translate}}'}"
-                  md-limit="vm_dc.query.limit"
-                  md-limit-options="[10, 15, 20, 50, 100, 250]"
-                  md-page="vm_dc.query.page"
-                  md-total="{{vm_dc.dispositions.count}}"
-                  md-on-paginate="vm_dc.getDispositions"
-                  md-page-select
-                >
-                </md-table-pagination>
-              </div>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="FAX.ACTIONS">ACTIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="faxAccount-detail-form-container actions md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="FaxAccountActionsController as vm_ac"
-              ng-init="vm_ac.init(vm.faxAccount, vm.crudPermissions)"
-              class="content"
-              md-background-bg
-              layout="row"
-              layout-align="start start"
-            >
-              <!-- SIDENAV -->
-              <div
-                class="navigation-simple sidenav main-sidenav md-background-bg md-whiteframe-1dp"
-                ms-scroll
-                layout="column"
-                flex="20"
-                ng-if="vm_ac.crudPermissions.canEdit"
-              >
-                <!-- SIDENAV CONTENT -->
-                <md-list class="no-padding">
-                  <md-subheader class="md-no-sticky">
-                    <span translate="VOICE.APPLICATIONS_LIST">
-                      Applications List
-                    </span>
-                  </md-subheader>
-                </md-list>
-                <md-divider></md-divider>
-                <md-list ng-sortable="vm_ac.list">
-                  <md-list-item class="handle" ng-repeat="a in vm_ac.apps">
-                    <md-icon md-font-icon="{{a.icon}}" class="s16"></md-icon>
-                    <p
-                      class="text-truncate"
-                      translate="FAX.{{(a.alias || a.appType) | uppercase}}"
-                    >
-                      {{a.alias || a.appType}}
-                    </p>
-                  </md-list-item>
-                </md-list>
-                <!-- / SIDENAV CONTENT -->
-              </div>
-              <!-- / SIDENAV -->
-              <div flex></div>
-              <!-- MAIN -->
-              <div
-                class="main scrollable md-background-bg md-whiteframe-1dp"
-                ms-scroll
-                layout="column"
-                flex="{{vm_ac.crudPermissions.canEdit ? 75 : 100}}"
-              >
-                <md-toolbar
-                  class="md-table-toolbar md-default"
-                  ng-hide="vm_ac.selectedFaxAccountApps.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead">Drag & Drop Routing</span>
-                    <div flex></div>
-                    <ms-search-bar
-                      on-search="vm_ac.query.filter = query"
-                      on-collapse="vm_ac.query.filter = undefined"
-                      debounce="300"
-                    ></ms-search-bar>
-                  </div>
-                </md-toolbar>
-                <md-toolbar
-                  class="md-table-toolbar md-accent"
-                  ng-show="vm_ac.selectedFaxAccountApps.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead"
-                      >{{vm_ac.selectedFaxAccountApps.length}}
-                      {{vm_ac.selectedFaxAccountApps.length > 1 ? 'items' :
-                      'item'}} selected</span
-                    >
-                    <div flex></div>
-                    <md-button
-                      ng-if="vm_ac.crudPermissions.canDelete"
-                      class="md-icon-button"
-                      ng-click="vm_ac.deleteSelectedFaxAccountApps($event)"
-                      aria-label="delete selected"
-                      translate
-                      translate-attr-label="FAX.DELETE_SELECTED"
-                    >
-                      <md-icon md-font-icon="icon-delete"></md-icon>
-                    </md-button>
-                  </div>
-                </md-toolbar>
-
-                <!-- QUEUES TABLE -->
-                <md-table-container>
-                  <table
-                    md-table
-                    md-row-select
-                    multiple
-                    ng-model="vm_ac.selectedFaxAccountApps"
-                  >
-                    <thead md-head>
-                      <tr md-row>
-                        <th md-column width="10px"></th>
-                        <th md-column width="10px">
-                          <span translate="VOICE.PRIORITY">Priority</span>
-                        </th>
-                        <th md-column>
-                          <span>Type</span>
-                        </th>
-                        <th md-column>
-                          <span>Appdata</span>
-                        </th>
-                        <th md-column>
-                          <span>Interval</span>
-                        </th>
-                        <th md-column width="10px"></th>
-                        <th md-column width="10px"></th>
-                      </tr>
-                    </thead>
-                    <tbody md-body ng-sortable="vm_ac.applications">
-                      <tr
-                        md-row
-                        md-select="app"
-                        md-select-id="id"
-                        ng-repeat="app in vm_ac.faxAccountApps.rows | filter: vm_ac.query.filter"
-                      >
-                        <td md-cell>
-                          <md-icon
-                            md-font-icon="icon-drag-vertical"
-                            class="s16 handle"
-                          ></md-icon>
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editFaxAccountApp($event, $index)"
-                        >
-                          <span>{{app.priority}}</span>
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editFaxAccountApp($event, $index)"
-                        >
-                          {{app.app.toLowerCase() === 'agi' ? 'Cally-Square' :
-                          app.app | ucfirst}}<span
-                            ng-if="app.appType.toLowerCase() === 'custom'"
-                            >*</span
-                          >
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editFaxAccountApp($event, $index)"
-                        >
-                          <span class="text-truncate" style="width: 200px"
-                            >{{app.appdata}}</span
-                          >
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editInterval($event, $index)"
-                        >
-                          {{app.IntervalId ? 'From List' : app.interval}}
-                        </td>
-                        <td md-cell>
-                          <md-button
-                            ng-click="vm_ac.editInterval($event, $index)"
-                            class="md-icon-button"
-                            aria-label="Interval"
-                          >
-                            <md-icon md-font-icon="icon-timer"></md-icon>
-                            <md-tooltip>
-                              {{app.IntervalId ? 'From List' : (app.interval ===
-                              '*,*,*,*' ? 'Always' : 'Custom')}}
-                            </md-tooltip>
-                          </md-button>
-                        </td>
-                        <td
-                          md-cell
-                          class="actions"
-                          ng-if="!vm_ac.crudPermissions.readOnly"
-                        >
-                          <md-menu>
-                            <md-button
-                              class="md-icon-button"
-                              aria-label="More"
-                              translate
-                              translate-attr-aria-label="VOICE.MORE"
-                              ng-click="$mdOpenMenu($event)"
-                            >
-                              <md-icon
-                                md-font-icon="icon-dots-vertical"
-                              ></md-icon>
-                            </md-button>
-
-                            <md-menu-content width="3">
-                              <md-menu-item
-                                ng-if="vm_ac.crudPermissions.canEdit"
-                              >
-                                <md-button
-                                  ng-click="vm_ac.editFaxAccountApp($event, $index)"
-                                  translate="VOICE.EDIT_APP"
-                                >
-                                  Edit App
-                                </md-button>
-                              </md-menu-item>
-                              <md-menu-item
-                                ng-if="vm_ac.crudPermissions.canEdit"
-                              >
-                                <md-button
-                                  ng-click="vm_ac.editInterval($event, $index)"
-                                  translate="VOICE.EDIT_INTERVAL"
-                                >
-                                  Edit Interval
-                                </md-button>
-                              </md-menu-item>
-                              <md-menu-item
-                                ng-if="vm_ac.crudPermissions.canDelete"
-                              >
-                                <md-button
-                                  ng-click="vm_ac.deleteConfirm(app, $index, $event)"
-                                  translate="VOICE.DELETE_APP"
-                                >
-                                  Delete App
-                                </md-button>
-                              </md-menu-item>
-                            </md-menu-content>
-                          </md-menu>
-                        </td>
-                      </tr>
-                      <tr md-row ng-hide="vm_ac.faxAccountApps.rows.length">
-                        <td md-cell colspan="7">
-                          <span
-                            class="text-boxed-light"
-                            translate="VOICE.NO_APPS_AVAILABLE"
-                            >No apps available</span
-                          >
-                        </td>
-                      </tr>
-                    </tbody>
-                  </table>
-                </md-table-container>
-                <!-- / QUEUES TABLE -->
-
-                <!-- NO RESULTS -->
-
-                <!-- / NO RESULTS -->
-              </div>
-              <!-- / MAIN -->
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="FAX.INTERACTIONS">INTERACTIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="faxAccount-detail-form-container interactions md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="FaxAccountInteractionsController as vm_dc"
-              ng-init="vm_dc.init(vm.faxAccount, vm.crudPermissions)"
-            >
-              <md-toolbar
-                class="md-table-toolbar md-default"
-                ng-hide="vm_dc.selectedFaxAccountInteractions.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead" translate="FAX.INTERACTIONS"
-                    >Interactions</span
-                  >
-                  <ms-search-bar
-                    on-search="vm_dc.query.filter = query"
-                    on-collapse="vm_dc.query.filter = undefined"
-                    debounce="300"
-                    direction="down"
-                  ></ms-search-bar>
-                  <div flex></div>
-                  <ms-quick-filter
-                    filters="vm_dc.quickFilters"
-                    query="vm_dc.query"
-                    search="vm_dc.getFaxAccountInteractions()"
-                  ></ms-quick-filter>
-                  <div layout="column">
-                    <md-button
-                      class="md-icon-button advanced-search"
-                      ng-class="{ 'md-fab md-mini md-accent-bg': vm_dc.query.search }"
-                      aria-label="Filter"
-                      translate
-                      translate-attr-aria-label="DASHBOARDS.FILTER"
-                      ng-click="vm_dc.openAdvancedSearch()"
-                    >
-                      <md-icon
-                        md-font-icon="{{ vm_dc.query.search ? 'icon-filter' : 'icon-filter-outline' }}"
-                        ng-class="{ 'blink': vm_dc.query.search }"
-                      ></md-icon>
-                    </md-button>
-                  </div>
-                  <md-button
-                    class="md-icon-button"
-                    ng-click="vm_dc.getFaxAccountInteractions()"
-                    aria-label="refresh Interactions"
-                    translate
-                    translate-attr-label="FAX.REFRESH_INTERACTIONS"
-                  >
-                    <md-icon md-font-icon="icon-refresh"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-toolbar
-                class="md-table-toolbar md-accent"
-                ng-show="vm_dc.selectedFaxAccountInteractions.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead"
-                    >{{vm_dc.selectedFaxAccountInteractions.length}}
-                    {{vm_dc.selectedFaxAccountInteractions.length > 1 ? 'items'
-                    : 'item'}} selected</span
-                  >
-                  <div flex></div>
-                  <button
-                    class="md-icon-button"
-                    ng-csv="vm_dc.exportSelectedFaxAccountInteractions"
-                    csv-label="true"
-                    filename="faxAccounts.csv"
-                  >
-                    <md-icon md-font-icon="icon-file-excel"></md-icon>
-                  </button>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canDelete"
-                    class="md-icon-button"
-                    ng-click="vm_dc.deleteSelectedFaxAccountInteractions($event)"
-                    aria-label="delete selected"
-                    translate
-                    translate-attr-label="FAX.DELETE_SELECTED"
-                  >
-                    <md-icon md-font-icon="icon-delete"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-table-container class="font-size-12">
-                <table
-                  md-table
-                  md-row-select
-                  multiple
-                  ng-model="vm_dc.selectedFaxAccountInteractions"
-                  md-progress="vm_dc.promise"
-                >
-                  <thead
-                    md-head
-                    md-order="vm_dc.query.sort"
-                    md-on-reorder="vm_dc.getFaxAccountInteractions"
-                  >
-                    <tr md-row>
-                      <th md-column md-order-by="id">
-                        {{ 'FAX.ID' | translate }}
-                      </th>
-                      <th md-column class="no-padding">
-                        <md-icon md-font-icon="icon-eye" class="s16"></md-icon>
-                      </th>
-                      <th md-column class="no-padding"></th>
-                      <th md-column class="no-padding"></th>
-                      <th md-column>{{ 'FAX.CONTACT' | translate }}</th>
-                      <th md-column md-order-by="createdAt">
-                        {{ 'FAX.STARTEDAT' | translate }}
-                      </th>
-                      <th md-column md-order-by="lastMsgAt">
-                        {{ 'FAX.LASTMESSAGE' | translate }}
-                      </th>
-                      <th md-column md-order-by="closed">
-                        {{ 'FAX.STATUS' | translate }}
-                      </th>
-                      <th md-column>{{ 'FAX.AGENT' | translate }}</th>
-                      <th md-column md-order-by="tag">
-                        {{ 'FAX.TAGS' | translate }}
-                      </th>
-                      <th md-column width="10px"></th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr
-                      md-row
-                      md-select="interaction"
-                      md-select-id="id"
-                      ng-repeat="interaction in vm_dc.faxAccountInteractions.rows"
-                      ng-class="{'text-bold text-italic': interaction.unreadMessages > 0}"
-                    >
-                      <td md-cell>{{interaction.id}}</td>
-                      <td md-cell class="no-padding">
-                        <div
-                          ng-if="!interaction.closed && interaction.Users.length"
-                        >
-                          <md-icon
-                            md-font-icon="icon-eye"
-                            class="s16"
-                          ></md-icon>
-                          <md-tooltip>
-                            <span ng-repeat="user in interaction.Users"
-                              >{{ user.fullname | translate }}
-                              <span ng-if="!$last">, </span>
-                            </span>
-                          </md-tooltip>
-                        </div>
-                      </td>
-                      <td md-cell class="no-padding">
-                        <div
-                          ng-if="interaction.unreadMessages > 0"
-                          layout="row"
-                          layout-align="start center"
-                        >
-                          <span
-                            class="badge white-fg md-primary-bg"
-                            layout-margin
-                            >{{ interaction.unreadMessages}}</span
-                          >
-                        </div>
-                      </td>
-                      <td md-cell class="no-padding">
-                        <div ng-if="interaction.attach">
-                          <md-icon
-                            md-font-icon="icon-paperclip"
-                            class="s16"
-                          ></md-icon>
-                        </div>
-                      </td>
-                      <td md-cell>
-                        <div layout="column" layout-align="start start">
-                          <span
-                            class="font-size-12 text-truncate contact-text"
-                            ng-class="{'margin-bottom-0' : interaction.contactInfo}"
-                            layout-margin
-                            >{{ interaction.contactName }}</span
-                          >
-                          <span
-                            ng-if="interaction.contactInfo"
-                            class="font-size-12 text-truncate contact-text margin-top-0"
-                            layout-margin
-                            >{{ interaction.contactInfo }}</span
-                          >
-                        </div>
-                      </td>
-                      <td md-cell>{{ interaction.createdAt | formatdate }}</td>
-                      <td md-cell>
-                        <div layout="row">
-                          <span>
-                            <md-icon
-                              md-font-icon="{{interaction.lastMsgDirection == 'in' ? 'icon-arrow-down-bold blue-grey-800-fg' : 'icon-arrow-up-bold blue-grey-300-fg'}}"
-                            ></md-icon>
-                          </span>
-                          <div layout="column" layout-align="center center">
-                            <span class="text-truncate"
-                              >{{ interaction.lastMsgAt | formatdate }}</span
-                            >
-                          </div>
-                        </div>
-                      </td>
-                      <td md-cell>
-                        <span ng-if="interaction.closed === 0" class="green-fg">
-                          {{ 'FAX.OPENED' | translate }}
-                          <span ng-if="interaction.substatus">
-                            - {{ interaction.substatus }}
-                          </span>
-                        </span>
-                        <span ng-if="interaction.closed === 1" class="red-fg">
-                          {{ 'FAX.CLOSED' | translate }}
-                          <span ng-if="interaction.disposition">
-                            - {{ interaction.thirdDisposition ||
-                            interaction.secondDisposition ||
-                            interaction.disposition }}
-                          </span>
-                          <md-tooltip class="multiline">
-                            <div layout="column">
-                              <div layout="column">
-                                <span
-                                  >{{ 'DASHBOARDS.CLOSED_AT' |
-                                  translate}}:</span
-                                >
-                                <span class="text-bold"
-                                  >{{ interaction.closedAt | formatdate }}</span
-                                >
-                              </div>
-                              <div
-                                ng-if="interaction.disposition"
-                                layout="column"
-                              >
-                                <span
-                                  >{{ 'DASHBOARDS.DISPOSITION' |
-                                  translate}}:</span
-                                >
-                                <span class="text-bold"
-                                  >{{ interaction.disposition }}</span
-                                >
-                              </div>
-                              <div
-                                ng-if="interaction.secondDisposition"
-                                layout="column"
-                              >
-                                <span
-                                  >{{ 'DASHBOARDS.SECOND_LEVEL_DISPOSITION' |
-                                  translate}}:</span
-                                >
-                                <span class="text-bold"
-                                  >{{ interaction.secondDisposition }}</span
-                                >
-                              </div>
-                              <div
-                                ng-if="interaction.thirdDisposition"
-                                layout="column"
-                              >
-                                <span
-                                  >{{ 'DASHBOARDS.THIRD_LEVEL_DISPOSITION' |
-                                  translate}}:</span
-                                >
-                                <span class="text-bold"
-                                  >{{ interaction.thirdDisposition }}</span
-                                >
-                              </div>
-                            </div>
-                          </md-tooltip>
-                        </span>
-                      </td>
-
-                      <td md-cell>{{interaction.Owner.name}}</td>
-                      <td md-cell>
-                        <div ng-if="interaction.Tags.length">
-                          <md-tooltip md-direction="left" layout="row">
-                            <span ng-repeat="tag in interaction.Tags"
-                              >{{tag.name}}<span ng-if="!$last">, </span></span
-                            >
-                          </md-tooltip>
-                          <md-icon
-                            md-font-icon="icon-tag"
-                            ng-style="{'color': interaction.Tags.length == 1 && interaction.Tags[0].color }"
-                          >
-                          </md-icon>
-                        </div>
-                      </td>
-                      <td md-cell class="actions">
-                        <md-menu>
-                          <md-button
-                            class="md-icon-button"
-                            aria-label="More"
-                            translate
-                            translate-attr-aria-label="FAX.MORE"
-                            ng-click="$mdOpenMenu($event)"
-                          >
-                            <md-icon
-                              md-font-icon="icon-dots-vertical"
-                            ></md-icon>
-                          </md-button>
-
-                          <md-menu-content width="3">
-                            <md-menu-item>
-                              <md-button
-                                ng-click="vm_dc.spyfaxInteraction($event, interaction)"
-                                translate="FAX.SPYINTERACTION"
-                              >
-                                Spy Interaction
-                              </md-button>
-                            </md-menu-item>
-                            <md-menu-item>
-                              <md-button
-                                class="md-primary"
-                                ng-click="vm_dc.faxInteractionDownload(interaction, $event)"
-                                translate="FAX.DOWNLOAD_INTERACTION"
-                              >
-                                Download
-                              </md-button>
-                            </md-menu-item>
-                            <md-menu-item
-                              ng-if="vm_dc.crudPermissions.canDelete"
-                            >
-                              <md-button
-                                ng-click="vm_dc.deleteConfirm(interaction, $event)"
-                                translate="FAX.DELETE_INTERACTION"
-                              >
-                                Delete Interaction
-                              </md-button>
-                            </md-menu-item>
-                          </md-menu-content>
-                        </md-menu>
-                      </td>
-                    </tr>
-                    <tr
-                      md-row
-                      ng-if="!vm_dc.faxAccountInteractions.rows.length"
-                    >
-                      <td md-cell colspan="12">
-                        <div layout="row" layout-align="center center">
-                          <span
-                            class="text-boxed-light"
-                            translate="FAX.NO_INTERACTION_AVAILABLE"
-                            >No interaction available</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-              <md-table-pagination
-                md-label="{page: '{{'FAX.PAGE' | translate}}:', rowsPerPage: '{{'FAX.ROWSPERPAGE' | translate}}:', of: '{{'FAX.OF' | translate}}'}"
-                md-limit="vm_dc.query.limit"
-                md-limit-options="[10, 15, 20, 50, 100, 250]"
-                md-page="vm_dc.query.page"
-                md-total="{{vm_dc.faxAccountInteractions.count}}"
-                md-on-paginate="vm_dc.getFaxAccountInteractions"
-                md-page-select
-              ></md-table-pagination>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/view.html/view.html b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/view.html/view.html
new file mode 100644
index 0000000..a7228ff
--- /dev/null
+++ b/public/src/js/modules/main/apps/fax/views/faxAccounts/edit/view.html/view.html
@@ -0,0 +1,1634 @@
+<div id="fax-faxAccount" class="page-layout simple tabbed" layout="column">
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-faxAccounts-button md-icon-button"
+        aria-label="Go to faxAccounts"
+        ng-click="vm.gotoFaxAccounts()"
+        translate
+        translate-attr-aria-label="FAX.GO_TO_FAXACCOUNTS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="faxAccount-image" hide-xs>
+          <img ng-src="assets/images/business/faxAccounts.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.faxAccount.id}}
+            <span ng-if="vm.faxAccount.name">{{vm.faxAccount.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="FAX.CREATED_AT"></span>
+            <span>{{vm.faxAccount.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.gotogoto(vm.faxAccount, $event)"
+        class="md-fab md-warn md-icon-button"
+        aria-label="goto"
+      >
+        <md-tooltip><span translate="FAX.GOTO_FAXACCOUNT"></span></md-tooltip>
+        <md-icon md-font-icon="icon-cast"></md-icon>
+      </md-button>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.agentadddialog(vm.faxAccount, $event)"
+        class="md-fab md-warn md-icon-button"
+        aria-label="agentadd"
+      >
+        <md-tooltip
+          ><span translate="FAX.AGENTADD_FAXACCOUNT"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
+      </md-button>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveFaxAccount()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (notificationForm.$invalid) || (transferForm.$invalid) || (advancedForm.$invalid) || (dispositionForm.$invalid) || (faxDispositionsForm.$invalid) || (actionsForm.$invalid) || (interactionsForm.$invalid)"
+        translate="FAX.SAVE"
+        translate-attr-aria-label="FAX.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="FAX.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="faxAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="FAX.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="FAX.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.faxAccount.name"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="FAX.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="FAX.KEY">key</label>
+                <input
+                  type="text"
+                  name="key"
+                  ng-model="vm.faxAccount.key"
+                  md-maxlength="5"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['key'].$error"
+                  ng-show="generalForm['key'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="FAX.ERRORS.KEY_REQUIRED"
+                      >key field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="FAX.ERRORS.KEY_MAX_LENGTH"
+                      translate-values="{max: 5}"
+                      >key must have a maximum length equal to 5</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="FAX.HEADERINFO">headerinfo</label>
+                <input
+                  type="text"
+                  name="headerinfo"
+                  ng-model="vm.faxAccount.headerinfo"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="FAX.HELP.HEADERINFO"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['headerinfo'].$error"
+                  ng-show="generalForm['headerinfo'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="FAX.ERRORS.HEADERINFO_REQUIRED"
+                      >headerinfo field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="FAX.TRUNK">trunk</label>
+                <md-select
+                  name="TrunkId"
+                  ng-model="vm.faxAccount.TrunkId"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="TrunkId.id"
+                    ng-repeat="TrunkId in vm.trunks"
+                    ng-disabled="TrunkId.canSelect === false"
+                    >{{ TrunkId.name }}</md-option
+                  >
+                </md-select>
+                <div
+                  ng-messages="generalForm['TrunkId'].$error"
+                  ng-show="generalForm['TrunkId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="FAX.ERRORS.TRUNK_REQUIRED"
+                      >trunk field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="FAX.LOCALSTATIONID">localstationid</label>
+                <input
+                  type="text"
+                  name="localstationid"
+                  ng-model="vm.faxAccount.localstationid"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="FAX.HELP.LOCALSTATIONID"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['localstationid'].$error"
+                  ng-show="generalForm['localstationid'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="FAX.ERRORS.LOCALSTATIONID_REQUIRED"
+                      >localstationid field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="FAX.LIST">List</label>
+                <md-select
+                  name="ListId"
+                  ng-model="vm.faxAccount.ListId"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="ListId.id"
+                    ng-repeat="ListId in vm.lists"
+                    ng-disabled="ListId.canSelect === false"
+                    >{{ ListId.name }}</md-option
+                  >
+                </md-select>
+                <div
+                  ng-messages="generalForm['ListId'].$error"
+                  ng-show="generalForm['ListId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="FAX.ERRORS.LIST_REQUIRED"
+                      >List field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="FAX.WAITFORTHEASSIGNEDAGENT"
+                  >WaitForTheAssignedAgent</label
+                >
+                <input
+                  type="number"
+                  name="waitForTheAssignedAgent"
+                  ng-model="vm.faxAccount.waitForTheAssignedAgent"
+                  min="1"
+                  max="2147483"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['waitForTheAssignedAgent'].$error"
+                  ng-show="generalForm['waitForTheAssignedAgent'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="FAX.ERRORS.WAITFORTHEASSIGNEDAGENT_REQUIRED"
+                      >WaitForTheAssignedAgent field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="FAX.ERRORS.WAITFORTHEASSIGNEDAGENT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >WaitForTheAssignedAgent must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="FAX.ERRORS.WAITFORTHEASSIGNEDAGENT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >WaitForTheAssignedAgent must be a valid greater or equal
+                      than</span
+                    >
+                    <span>2147483</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="FAX.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.faxAccount.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="FAX.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="faxAccount-detail-form-container notification md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="FAX.NOTIFICATION">
+                NOTIFICATION
+              </div>
+            </div>
+            <form name="notificationForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.faxAccount.notificationSound"
+                  aria-label="notificationSound"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="FAX.NOTIFICATIONSOUND"
+                    >notificationSound</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.faxAccount.notificationShake"
+                  aria-label="notificationShake"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="FAX.NOTIFICATIONSHAKE"
+                    >notificationShake</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <div class="md-block">
+                <label
+                  class="md-caption grey-fg"
+                  translate="FAX.NOTIFICATIONTEMPLATE"
+                  >notificationTemplate</label
+                >
+                <textarea
+                  aria-label="notificationTemplate notificationTemplate"
+                  ckeditor="{ skin: 'office2013', language: 'en', allowedContent: true, extraPlugins: 'font,colorbutton,autoembed,autocorrect,googlethisterm,pastebase64', toolbarGroups: [{ name: 'styles', groups: ['styles'] }, { name: 'clipboard', groups: ['undo'] }, { name: 'colors', groups: ['colors'] }, { name: 'basicstyles', groups: ['basicstyles'] }, { name: 'paragraph', groups: ['list', 'indent', 'align'] }, { name: 'mode' }], autocorrect_enabled: true, disableNativeSpellChecker: false, fontSize_sizes: '8/8pt;9/9pt;10/10pt;11/11pt;12/12pt;14/14pt;16/16pt;18/18pt;20/20pt;22/22pt;24/24pt;26/26pt;28/28pt;36/36pt;48/48pt;72/72pt',  removePlugins: 'magicline' }"
+                  ng-model="vm.faxAccount.notificationTemplate"
+                ></textarea>
+              </div>
+            </form>
+          </div>
+          <div
+            class="faxAccount-detail-form-container transfer md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="FAX.TRANSFER">
+                TRANSFER
+              </div>
+            </div>
+            <form name="transferForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.faxAccount.queueTransfer"
+                  aria-label="queueTransfer"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="FAX.QUEUETRANSFER"
+                    >queueTransfer</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.faxAccount.queueTransfer == true"
+                class="md-block"
+              >
+                <label translate="FAX.QUEUETRANSFERTIMEOUT"
+                  >queueTransferTimeout</label
+                >
+                <input
+                  type="number"
+                  name="queueTransferTimeout"
+                  ng-model="vm.faxAccount.queueTransferTimeout"
+                  min="1"
+                  max="2147483"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="transferForm['queueTransferTimeout'].$error"
+                  ng-show="transferForm['queueTransferTimeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="FAX.ERRORS.QUEUETRANSFERTIMEOUT_REQUIRED"
+                      >queueTransferTimeout field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="FAX.ERRORS.QUEUETRANSFERTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >queueTransferTimeout must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="FAX.ERRORS.QUEUETRANSFERTIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >queueTransferTimeout must be a valid greater or equal
+                      than</span
+                    >
+                    <span>2147483</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.faxAccount.agentTransfer"
+                  aria-label="agentTransfer"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="FAX.AGENTTRANSFER"
+                    >agentTransfer</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.faxAccount.agentTransfer == true"
+                class="md-block"
+              >
+                <label translate="FAX.AGENTTRANSFERTIMEOUT"
+                  >agentTransferTimeout</label
+                >
+                <input
+                  type="number"
+                  name="agentTransferTimeout"
+                  ng-model="vm.faxAccount.agentTransferTimeout"
+                  min="1"
+                  max="2147483"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="transferForm['agentTransferTimeout'].$error"
+                  ng-show="transferForm['agentTransferTimeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="FAX.ERRORS.AGENTTRANSFERTIMEOUT_REQUIRED"
+                      >agentTransferTimeout field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="FAX.ERRORS.AGENTTRANSFERTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >agentTransferTimeout must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="FAX.ERRORS.AGENTTRANSFERTIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >agentTransferTimeout must be a valid greater or equal
+                      than</span
+                    >
+                    <span>2147483</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="FAX.ADVANCED">ADVANCED</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="faxAccount-detail-form-container advanced md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="FAX.ADVANCED">
+                ADVANCED
+              </div>
+            </div>
+            <form name="advancedForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="FAX.ECM">ECM</label>
+                <md-select
+                  name="ecm"
+                  ng-model="vm.faxAccount.ecm"
+                  autofocus
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">yes</md-option>
+                  <md-option ng-value="'no'">no</md-option>
+                </md-select>
+                <div class="hint"><span translate="FAX.HELP.ECM"></span></div>
+                <div
+                  ng-messages="advancedForm['ecm'].$error"
+                  ng-show="advancedForm['ecm'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="FAX.ERRORS.ECM_REQUIRED"
+                      >ECM field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="FAX.MINRATE">minrate</label>
+                <md-select
+                  name="minrate"
+                  ng-model="vm.faxAccount.minrate"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'2400'">2400</md-option>
+                  <md-option ng-value="'4800'">4800</md-option>
+                  <md-option ng-value="'7200'">7200</md-option>
+                  <md-option ng-value="'9600'">9600</md-option>
+                  <md-option ng-value="'12000'">12000</md-option>
+                  <md-option ng-value="'14400'">14400</md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="FAX.HELP.MINRATE"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['minrate'].$error"
+                  ng-show="advancedForm['minrate'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="FAX.ERRORS.MINRATE_REQUIRED"
+                      >minrate field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="FAX.MAXRATE">maxrate</label>
+                <md-select
+                  name="maxrate"
+                  ng-model="vm.faxAccount.maxrate"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'2400'">2400</md-option>
+                  <md-option ng-value="'4800'">4800</md-option>
+                  <md-option ng-value="'7200'">7200</md-option>
+                  <md-option ng-value="'9600'">9600</md-option>
+                  <md-option ng-value="'12000'">12000</md-option>
+                  <md-option ng-value="'14400'">14400</md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="FAX.HELP.MAXRATE"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['maxrate'].$error"
+                  ng-show="advancedForm['maxrate'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="FAX.ERRORS.MAXRATE_REQUIRED"
+                      >maxrate field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="FAX.MODEM">modem</label>
+                <input
+                  type="text"
+                  name="modem"
+                  ng-model="vm.faxAccount.modem"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint"><span translate="FAX.HELP.MODEM"></span></div>
+                <div
+                  ng-messages="advancedForm['modem'].$error"
+                  ng-show="advancedForm['modem'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="FAX.ERRORS.MODEM_REQUIRED"
+                      >modem field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="FAX.GATEWAY">gateway</label>
+                <input
+                  type="text"
+                  name="gateway"
+                  ng-model="vm.faxAccount.gateway"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="FAX.HELP.GATEWAY"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['gateway'].$error"
+                  ng-show="advancedForm['gateway'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="FAX.ERRORS.GATEWAY_REQUIRED"
+                      >gateway field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="FAX.FAXDETECT">faxdetect</label>
+                <input
+                  type="text"
+                  name="faxdetect"
+                  ng-model="vm.faxAccount.faxdetect"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="FAX.HELP.FAXDETECT"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['faxdetect'].$error"
+                  ng-show="advancedForm['faxdetect'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="FAX.ERRORS.FAXDETECT_REQUIRED"
+                      >faxdetect field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="FAX.T38TIMEOUT">t38timeout</label>
+                <input
+                  type="number"
+                  name="t38timeout"
+                  ng-model="vm.faxAccount.t38timeout"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="FAX.HELP.T38TIMEOUT"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['t38timeout'].$error"
+                  ng-show="advancedForm['t38timeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="FAX.ERRORS.T38TIMEOUT_REQUIRED"
+                      >t38timeout field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="FAX.SIP">SIP</label>
+                <md-select
+                  name="tech"
+                  ng-model="vm.faxAccount.tech"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'SIP'">SIP</md-option>
+                  <md-option ng-value="'IAX'">IAX</md-option>
+                  <md-option ng-value="'DADHI'">DADHI</md-option>
+                  <md-option ng-value="'KHOMP'">KHOMP</md-option>
+                </md-select>
+                <div
+                  ng-messages="advancedForm['tech'].$error"
+                  ng-show="advancedForm['tech'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="FAX.ERRORS.SIP_REQUIRED"
+                      >SIP field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="faxAccount-detail-form-container disposition md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="FAX.DISPOSITION">
+                DISPOSITION
+              </div>
+            </div>
+            <form name="dispositionForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.faxAccount.mandatoryDisposition"
+                  aria-label="MandatoryDisposition"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="FAX.MANDATORYDISPOSITION"
+                    >MandatoryDisposition</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.faxAccount.mandatoryDisposition"
+                class="md-block"
+              >
+                <label translate="FAX.MANDATORYDISPOSITIONPAUSEID"
+                  >MandatoryDispositionPauseId</label
+                >
+                <md-select
+                  name="mandatoryDispositionPauseId"
+                  ng-model="vm.faxAccount.mandatoryDispositionPauseId"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="mandatoryDispositionPauseId.id"
+                    ng-repeat="mandatoryDispositionPauseId in vm.pauses"
+                    ng-disabled="mandatoryDispositionPauseId.canSelect === false"
+                    >{{ mandatoryDispositionPauseId.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span translate="FAX.HELP.MANDATORYDISPOSITIONPAUSEID"></span>
+                </div>
+                <div
+                  ng-messages="dispositionForm['mandatoryDispositionPauseId'].$error"
+                  ng-show="dispositionForm['mandatoryDispositionPauseId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="FAX.ERRORS.MANDATORYDISPOSITIONPAUSEID_REQUIRED"
+                      >MandatoryDispositionPauseId field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="FAX.DISPOSITIONS">DISPOSITIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            ng-controller="FaxAccountDispositionsController as vm_dc"
+            ng-init="vm_dc.init(vm.faxAccount, vm.crudPermissions)"
+          >
+            <div layout="row">
+              <div class="column" flex="20">
+                <md-card class="mt-0">
+                  <md-card-content>
+                    <button
+                      layout-align="center center"
+                      md-mini-fab
+                      ng-click="vm_dc.query.level = null; vm_dc.getDispositions()"
+                    >
+                      <div layout="row" layout-align="start center">
+                        <md-icon md-font-icon="icon-refresh"></md-icon>
+                        <span class="ph-5"
+                          >{{ 'TOOLS.ALL_DISPOSITIONS' | translate }}</span
+                        >
+                      </div>
+                    </button>
+                  </md-card-content>
+                </md-card>
+                <md-card>
+                  <md-card-content>
+                    <md-input-container class="md-block" flex-gt-sm="">
+                      <label translate="TOOLS.SELECT_LEVEL"
+                        >Select a level</label
+                      >
+                      <md-select
+                        placeholder="{{ 'TOOLS.SELECT_LEVEL' | translate }}"
+                        ng-model="vm_dc.query.level"
+                        ng-change="vm_dc.getDispositions()"
+                      >
+                        <md-option ng-value="null"
+                          ><em translate="TOOLS.ALL">All</em></md-option
+                        >
+                        <md-option
+                          ng-value="key"
+                          ng-repeat="(key, value) in vm_dc.levels"
+                          >{{ value }}</md-option
+                        >
+                      </md-select>
+                    </md-input-container>
+                  </md-card-content>
+                </md-card>
+              </div>
+              <div
+                class="faxAccount-detail-form-container faxdispositions md-background-bg md-whiteframe-1dp"
+                flex="80"
+              >
+                <md-toolbar
+                  class="md-table-toolbar md-default"
+                  ng-hide="vm_dc.selectedFaxAccountDispositions.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead" translate="FAX.DISPOSITIONS"
+                      >Dispositions</span
+                    >
+                    <ms-search-bar
+                      on-search="vm_dc.query.filter = query"
+                      on-collapse="vm_dc.query.filter = undefined"
+                      debounce="300"
+                      direction="down"
+                    ></ms-search-bar>
+                    <div flex></div>
+                    <md-button
+                      ng-if="vm_dc.crudPermissions.canEdit"
+                      class="md-icon-button"
+                      ng-click="vm_dc.createOrEditDisposition($event)"
+                      aria-label="Add fax dispositions"
+                      translate
+                      translate-attr-label="FAX.ADD_DISPOSITION"
+                    >
+                      <md-icon md-font-icon="icon-plus"></md-icon>
+                    </md-button>
+                  </div>
+                </md-toolbar>
+                <md-toolbar
+                  class="md-table-toolbar md-accent"
+                  ng-show="vm_dc.selectedDispositions.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead"
+                      >{{vm_dc.selectedDispositions.length}}
+                      {{vm_dc.selectedDispositions.length > 1 ? 'items' :
+                      'item'}} selected</span
+                    >
+                    <div flex></div>
+                    <button
+                      class="md-icon-button"
+                      ng-csv="vm_dc.exportSelectedDispositions"
+                      csv-label="true"
+                      filename="faxAccounts.csv"
+                    >
+                      <md-icon md-font-icon="icon-file-excel"></md-icon>
+                    </button>
+                    <md-button
+                      ng-if="vm_dc.crudPermissions.canDelete"
+                      class="md-icon-button"
+                      ng-click="vm_dc.deleteSelectedDispositions($event)"
+                      aria-label="delete selected"
+                      translate
+                      translate-attr-label="FAX.DELETE_SELECTED"
+                    >
+                      <md-icon md-font-icon="icon-delete"></md-icon>
+                    </md-button>
+                  </div>
+                </md-toolbar>
+                <md-table-container>
+                  <table
+                    md-table
+                    md-row-select
+                    multiple
+                    ng-model="vm_dc.selectedDispositions"
+                    md-progress="vm_dc.promise"
+                  >
+                    <thead
+                      md-head
+                      md-order="vm_dc.query.sort"
+                      md-on-reorder="vm_dc.getDispositions"
+                    >
+                      <tr md-row>
+                        <th md-column md-order-by="id">
+                          {{ 'FAX.ID' | translate }}
+                        </th>
+                        <th md-column md-order-by="level">
+                          {{ 'TOOLS.LEVEL' | translate }}
+                        </th>
+                        <th md-column md-order-by="name">
+                          {{ 'FAX.NAME' | translate }}
+                        </th>
+                        <th md-column md-order-by="description">
+                          {{ 'FAX.DESCRIPTION' | translate }}
+                        </th>
+                        <th md-column width="10px"></th>
+                      </tr>
+                    </thead>
+                    <tbody md-body>
+                      <tr md-row ng-hide="vm_dc.dispositions.rows.length">
+                        <td md-cell colspan="5">
+                          <div layout="row" layout-align="center center">
+                            <span translate="FAX.NO_AVAILABLE_INFO"
+                              >No Available Info</span
+                            >
+                          </div>
+                        </td>
+                      </tr>
+                      <tr
+                        md-row
+                        md-select="disposition"
+                        md-select-id="id"
+                        ng-repeat="disposition in vm_dc.dispositions.rows"
+                      >
+                        <td
+                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                          md-cell
+                          class="id"
+                        >
+                          {{disposition.id}}
+                        </td>
+                        <td
+                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                          md-cell
+                          class="level"
+                        >
+                          {{ vm_dc.levels[disposition.level] }}
+                        </td>
+                        <td
+                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                          md-cell
+                          class="name"
+                        >
+                          {{disposition.name}}
+                        </td>
+                        <td
+                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                          md-cell
+                          class="description"
+                        >
+                          {{disposition.description}}
+                        </td>
+                        <td
+                          md-cell
+                          class="actions"
+                          ng-if="!vm_dc.crudPermissions.readOnly"
+                        >
+                          <md-menu>
+                            <md-button
+                              class="md-icon-button"
+                              aria-label="More"
+                              translate
+                              translate-attr-aria-label="FAX.MORE"
+                              ng-click="$mdOpenMenu($event)"
+                            >
+                              <md-icon
+                                md-font-icon="icon-dots-vertical"
+                              ></md-icon>
+                            </md-button>
+                            <md-menu-content width="3">
+                              <!-- SUBACTIONS -->
+                              <!-- ACTIONS -->
+                              <md-menu-item
+                                ng-if="vm_dc.crudPermissions.canEdit"
+                              >
+                                <md-button
+                                  ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                                  translate="TOOLS.EDIT_DISPOSITION"
+                                >
+                                  Edit Disposition
+                                </md-button>
+                              </md-menu-item>
+                              <!-- SUBACTIONS -->
+                              <!-- ACTIONS -->
+                              <md-menu-item
+                                ng-if="vm_dc.crudPermissions.canDelete"
+                              >
+                                <md-button
+                                  ng-click="vm_dc.deleteConfirm(disposition, $event)"
+                                  translate="TOOLS.DELETE_DISPOSITION"
+                                >
+                                  Delete Disposition
+                                </md-button>
+                              </md-menu-item>
+                            </md-menu-content>
+                          </md-menu>
+                        </td>
+                      </tr>
+                    </tbody>
+                  </table>
+                </md-table-container>
+                <md-table-pagination
+                  md-label="{page: '{{'FAX.PAGE' | translate}}:', rowsPerPage: '{{'FAX.ROWSPERPAGE' | translate}}:', of: '{{'FAX.OF' | translate}}'}"
+                  md-limit="vm_dc.query.limit"
+                  md-limit-options="[10, 15, 20, 50, 100, 250]"
+                  md-page="vm_dc.query.page"
+                  md-total="{{vm_dc.dispositions.count}}"
+                  md-on-paginate="vm_dc.getDispositions"
+                  md-page-select
+                >
+                </md-table-pagination>
+              </div>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="FAX.ACTIONS">ACTIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="faxAccount-detail-form-container actions md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="FaxAccountActionsController as vm_ac"
+              ng-init="vm_ac.init(vm.faxAccount, vm.crudPermissions)"
+              class="content"
+              md-background-bg
+              layout="row"
+              layout-align="start start"
+            >
+              <!-- SIDENAV -->
+              <div
+                class="navigation-simple sidenav main-sidenav md-background-bg md-whiteframe-1dp"
+                ms-scroll
+                layout="column"
+                flex="20"
+                ng-if="vm_ac.crudPermissions.canEdit"
+              >
+                <!-- SIDENAV CONTENT -->
+                <md-list class="no-padding">
+                  <md-subheader class="md-no-sticky">
+                    <span translate="VOICE.APPLICATIONS_LIST">
+                      Applications List
+                    </span>
+                  </md-subheader>
+                </md-list>
+                <md-divider></md-divider>
+                <md-list ng-sortable="vm_ac.list">
+                  <md-list-item class="handle" ng-repeat="a in vm_ac.apps">
+                    <md-icon md-font-icon="{{a.icon}}" class="s16"></md-icon>
+                    <p
+                      class="text-truncate"
+                      translate="FAX.{{(a.alias || a.appType) | uppercase}}"
+                    >
+                      {{a.alias || a.appType}}
+                    </p>
+                  </md-list-item>
+                </md-list>
+                <!-- / SIDENAV CONTENT -->
+              </div>
+              <!-- / SIDENAV -->
+              <div flex></div>
+              <!-- MAIN -->
+              <div
+                class="main scrollable md-background-bg md-whiteframe-1dp"
+                ms-scroll
+                layout="column"
+                flex="{{vm_ac.crudPermissions.canEdit ? 75 : 100}}"
+              >
+                <md-toolbar
+                  class="md-table-toolbar md-default"
+                  ng-hide="vm_ac.selectedFaxAccountApps.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead">Drag & Drop Routing</span>
+                    <div flex></div>
+                    <ms-search-bar
+                      on-search="vm_ac.query.filter = query"
+                      on-collapse="vm_ac.query.filter = undefined"
+                      debounce="300"
+                    ></ms-search-bar>
+                  </div>
+                </md-toolbar>
+                <md-toolbar
+                  class="md-table-toolbar md-accent"
+                  ng-show="vm_ac.selectedFaxAccountApps.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead"
+                      >{{vm_ac.selectedFaxAccountApps.length}}
+                      {{vm_ac.selectedFaxAccountApps.length > 1 ? 'items' :
+                      'item'}} selected</span
+                    >
+                    <div flex></div>
+                    <md-button
+                      ng-if="vm_ac.crudPermissions.canDelete"
+                      class="md-icon-button"
+                      ng-click="vm_ac.deleteSelectedFaxAccountApps($event)"
+                      aria-label="delete selected"
+                      translate
+                      translate-attr-label="FAX.DELETE_SELECTED"
+                    >
+                      <md-icon md-font-icon="icon-delete"></md-icon>
+                    </md-button>
+                  </div>
+                </md-toolbar>
+
+                <!-- QUEUES TABLE -->
+                <md-table-container>
+                  <table
+                    md-table
+                    md-row-select
+                    multiple
+                    ng-model="vm_ac.selectedFaxAccountApps"
+                  >
+                    <thead md-head>
+                      <tr md-row>
+                        <th md-column width="10px"></th>
+                        <th md-column width="10px">
+                          <span translate="VOICE.PRIORITY">Priority</span>
+                        </th>
+                        <th md-column>
+                          <span>Type</span>
+                        </th>
+                        <th md-column>
+                          <span>Appdata</span>
+                        </th>
+                        <th md-column>
+                          <span>Interval</span>
+                        </th>
+                        <th md-column width="10px"></th>
+                        <th md-column width="10px"></th>
+                      </tr>
+                    </thead>
+                    <tbody md-body ng-sortable="vm_ac.applications">
+                      <tr
+                        md-row
+                        md-select="app"
+                        md-select-id="id"
+                        ng-repeat="app in vm_ac.faxAccountApps.rows | filter: vm_ac.query.filter"
+                      >
+                        <td md-cell>
+                          <md-icon
+                            md-font-icon="icon-drag-vertical"
+                            class="s16 handle"
+                          ></md-icon>
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editFaxAccountApp($event, $index)"
+                        >
+                          <span>{{app.priority}}</span>
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editFaxAccountApp($event, $index)"
+                        >
+                          {{app.app.toLowerCase() === 'agi' ? 'Cally-Square' :
+                          app.app | ucfirst}}<span
+                            ng-if="app.appType.toLowerCase() === 'custom'"
+                            >*</span
+                          >
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editFaxAccountApp($event, $index)"
+                        >
+                          <span class="text-truncate" style="width: 200px"
+                            >{{app.appdata}}</span
+                          >
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editInterval($event, $index)"
+                        >
+                          {{app.IntervalId ? 'From List' : app.interval}}
+                        </td>
+                        <td md-cell>
+                          <md-button
+                            ng-click="vm_ac.editInterval($event, $index)"
+                            class="md-icon-button"
+                            aria-label="Interval"
+                          >
+                            <md-icon md-font-icon="icon-timer"></md-icon>
+                            <md-tooltip>
+                              {{app.IntervalId ? 'From List' : (app.interval ===
+                              '*,*,*,*' ? 'Always' : 'Custom')}}
+                            </md-tooltip>
+                          </md-button>
+                        </td>
+                        <td
+                          md-cell
+                          class="actions"
+                          ng-if="!vm_ac.crudPermissions.readOnly"
+                        >
+                          <md-menu>
+                            <md-button
+                              class="md-icon-button"
+                              aria-label="More"
+                              translate
+                              translate-attr-aria-label="VOICE.MORE"
+                              ng-click="$mdOpenMenu($event)"
+                            >
+                              <md-icon
+                                md-font-icon="icon-dots-vertical"
+                              ></md-icon>
+                            </md-button>
+
+                            <md-menu-content width="3">
+                              <md-menu-item
+                                ng-if="vm_ac.crudPermissions.canEdit"
+                              >
+                                <md-button
+                                  ng-click="vm_ac.editFaxAccountApp($event, $index)"
+                                  translate="VOICE.EDIT_APP"
+                                >
+                                  Edit App
+                                </md-button>
+                              </md-menu-item>
+                              <md-menu-item
+                                ng-if="vm_ac.crudPermissions.canEdit"
+                              >
+                                <md-button
+                                  ng-click="vm_ac.editInterval($event, $index)"
+                                  translate="VOICE.EDIT_INTERVAL"
+                                >
+                                  Edit Interval
+                                </md-button>
+                              </md-menu-item>
+                              <md-menu-item
+                                ng-if="vm_ac.crudPermissions.canDelete"
+                              >
+                                <md-button
+                                  ng-click="vm_ac.deleteConfirm(app, $index, $event)"
+                                  translate="VOICE.DELETE_APP"
+                                >
+                                  Delete App
+                                </md-button>
+                              </md-menu-item>
+                            </md-menu-content>
+                          </md-menu>
+                        </td>
+                      </tr>
+                      <tr md-row ng-hide="vm_ac.faxAccountApps.rows.length">
+                        <td md-cell colspan="7">
+                          <span
+                            class="text-boxed-light"
+                            translate="VOICE.NO_APPS_AVAILABLE"
+                            >No apps available</span
+                          >
+                        </td>
+                      </tr>
+                    </tbody>
+                  </table>
+                </md-table-container>
+                <!-- / QUEUES TABLE -->
+
+                <!-- NO RESULTS -->
+
+                <!-- / NO RESULTS -->
+              </div>
+              <!-- / MAIN -->
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="FAX.INTERACTIONS">INTERACTIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="faxAccount-detail-form-container interactions md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="FaxAccountInteractionsController as vm_dc"
+              ng-init="vm_dc.init(vm.faxAccount, vm.crudPermissions)"
+            >
+              <md-toolbar
+                class="md-table-toolbar md-default"
+                ng-hide="vm_dc.selectedFaxAccountInteractions.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead" translate="FAX.INTERACTIONS"
+                    >Interactions</span
+                  >
+                  <ms-search-bar
+                    on-search="vm_dc.query.filter = query"
+                    on-collapse="vm_dc.query.filter = undefined"
+                    debounce="300"
+                    direction="down"
+                  ></ms-search-bar>
+                  <div flex></div>
+                  <ms-quick-filter
+                    filters="vm_dc.quickFilters"
+                    query="vm_dc.query"
+                    search="vm_dc.getFaxAccountInteractions()"
+                  ></ms-quick-filter>
+                  <div layout="column">
+                    <md-button
+                      class="md-icon-button advanced-search"
+                      ng-class="{ 'md-fab md-mini md-accent-bg': vm_dc.query.search }"
+                      aria-label="Filter"
+                      translate
+                      translate-attr-aria-label="DASHBOARDS.FILTER"
+                      ng-click="vm_dc.openAdvancedSearch()"
+                    >
+                      <md-icon
+                        md-font-icon="{{ vm_dc.query.search ? 'icon-filter' : 'icon-filter-outline' }}"
+                        ng-class="{ 'blink': vm_dc.query.search }"
+                      ></md-icon>
+                    </md-button>
+                  </div>
+                  <md-button
+                    class="md-icon-button"
+                    ng-click="vm_dc.getFaxAccountInteractions()"
+                    aria-label="refresh Interactions"
+                    translate
+                    translate-attr-label="FAX.REFRESH_INTERACTIONS"
+                  >
+                    <md-icon md-font-icon="icon-refresh"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-toolbar
+                class="md-table-toolbar md-accent"
+                ng-show="vm_dc.selectedFaxAccountInteractions.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead"
+                    >{{vm_dc.selectedFaxAccountInteractions.length}}
+                    {{vm_dc.selectedFaxAccountInteractions.length > 1 ? 'items'
+                    : 'item'}} selected</span
+                  >
+                  <div flex></div>
+                  <button
+                    class="md-icon-button"
+                    ng-csv="vm_dc.exportSelectedFaxAccountInteractions"
+                    csv-label="true"
+                    filename="faxAccounts.csv"
+                  >
+                    <md-icon md-font-icon="icon-file-excel"></md-icon>
+                  </button>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canDelete"
+                    class="md-icon-button"
+                    ng-click="vm_dc.deleteSelectedFaxAccountInteractions($event)"
+                    aria-label="delete selected"
+                    translate
+                    translate-attr-label="FAX.DELETE_SELECTED"
+                  >
+                    <md-icon md-font-icon="icon-delete"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-table-container class="font-size-12">
+                <table
+                  md-table
+                  md-row-select
+                  multiple
+                  ng-model="vm_dc.selectedFaxAccountInteractions"
+                  md-progress="vm_dc.promise"
+                >
+                  <thead
+                    md-head
+                    md-order="vm_dc.query.sort"
+                    md-on-reorder="vm_dc.getFaxAccountInteractions"
+                  >
+                    <tr md-row>
+                      <th md-column md-order-by="id">
+                        {{ 'FAX.ID' | translate }}
+                      </th>
+                      <th md-column class="no-padding">
+                        <md-icon md-font-icon="icon-eye" class="s16"></md-icon>
+                      </th>
+                      <th md-column class="no-padding"></th>
+                      <th md-column class="no-padding"></th>
+                      <th md-column>{{ 'FAX.CONTACT' | translate }}</th>
+                      <th md-column md-order-by="createdAt">
+                        {{ 'FAX.STARTEDAT' | translate }}
+                      </th>
+                      <th md-column md-order-by="lastMsgAt">
+                        {{ 'FAX.LASTMESSAGE' | translate }}
+                      </th>
+                      <th md-column md-order-by="closed">
+                        {{ 'FAX.STATUS' | translate }}
+                      </th>
+                      <th md-column>{{ 'FAX.AGENT' | translate }}</th>
+                      <th md-column md-order-by="tag">
+                        {{ 'FAX.TAGS' | translate }}
+                      </th>
+                      <th md-column width="10px"></th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr
+                      md-row
+                      md-select="interaction"
+                      md-select-id="id"
+                      ng-repeat="interaction in vm_dc.faxAccountInteractions.rows"
+                      ng-class="{'text-bold text-italic': interaction.unreadMessages > 0}"
+                    >
+                      <td md-cell>{{interaction.id}}</td>
+                      <td md-cell class="no-padding">
+                        <div
+                          ng-if="!interaction.closed && interaction.Users.length"
+                        >
+                          <md-icon
+                            md-font-icon="icon-eye"
+                            class="s16"
+                          ></md-icon>
+                          <md-tooltip>
+                            <span ng-repeat="user in interaction.Users"
+                              >{{ user.fullname | translate }}
+                              <span ng-if="!$last">, </span>
+                            </span>
+                          </md-tooltip>
+                        </div>
+                      </td>
+                      <td md-cell class="no-padding">
+                        <div
+                          ng-if="interaction.unreadMessages > 0"
+                          layout="row"
+                          layout-align="start center"
+                        >
+                          <span
+                            class="badge white-fg md-primary-bg"
+                            layout-margin
+                            >{{ interaction.unreadMessages}}</span
+                          >
+                        </div>
+                      </td>
+                      <td md-cell class="no-padding">
+                        <div ng-if="interaction.attach">
+                          <md-icon
+                            md-font-icon="icon-paperclip"
+                            class="s16"
+                          ></md-icon>
+                        </div>
+                      </td>
+                      <td md-cell>
+                        <div layout="column" layout-align="start start">
+                          <span
+                            class="font-size-12 text-truncate contact-text"
+                            ng-class="{'margin-bottom-0' : interaction.contactInfo}"
+                            layout-margin
+                            >{{ interaction.contactName }}</span
+                          >
+                          <span
+                            ng-if="interaction.contactInfo"
+                            class="font-size-12 text-truncate contact-text margin-top-0"
+                            layout-margin
+                            >{{ interaction.contactInfo }}</span
+                          >
+                        </div>
+                      </td>
+                      <td md-cell>{{ interaction.createdAt | formatdate }}</td>
+                      <td md-cell>
+                        <div layout="row">
+                          <span>
+                            <md-icon
+                              md-font-icon="{{interaction.lastMsgDirection == 'in' ? 'icon-arrow-down-bold blue-grey-800-fg' : 'icon-arrow-up-bold blue-grey-300-fg'}}"
+                            ></md-icon>
+                          </span>
+                          <div layout="column" layout-align="center center">
+                            <span class="text-truncate"
+                              >{{ interaction.lastMsgAt | formatdate }}</span
+                            >
+                          </div>
+                        </div>
+                      </td>
+                      <td md-cell>
+                        <span ng-if="interaction.closed === 0" class="green-fg">
+                          {{ 'FAX.OPENED' | translate }}
+                          <span ng-if="interaction.substatus">
+                            - {{ interaction.substatus }}
+                          </span>
+                        </span>
+                        <span ng-if="interaction.closed === 1" class="red-fg">
+                          {{ 'FAX.CLOSED' | translate }}
+                          <span ng-if="interaction.disposition">
+                            - {{ interaction.thirdDisposition ||
+                            interaction.secondDisposition ||
+                            interaction.disposition }}
+                          </span>
+                          <md-tooltip class="multiline">
+                            <div layout="column">
+                              <div layout="column">
+                                <span
+                                  >{{ 'DASHBOARDS.CLOSED_AT' |
+                                  translate}}:</span
+                                >
+                                <span class="text-bold"
+                                  >{{ interaction.closedAt | formatdate }}</span
+                                >
+                              </div>
+                              <div
+                                ng-if="interaction.disposition"
+                                layout="column"
+                              >
+                                <span
+                                  >{{ 'DASHBOARDS.DISPOSITION' |
+                                  translate}}:</span
+                                >
+                                <span class="text-bold"
+                                  >{{ interaction.disposition }}</span
+                                >
+                              </div>
+                              <div
+                                ng-if="interaction.secondDisposition"
+                                layout="column"
+                              >
+                                <span
+                                  >{{ 'DASHBOARDS.SECOND_LEVEL_DISPOSITION' |
+                                  translate}}:</span
+                                >
+                                <span class="text-bold"
+                                  >{{ interaction.secondDisposition }}</span
+                                >
+                              </div>
+                              <div
+                                ng-if="interaction.thirdDisposition"
+                                layout="column"
+                              >
+                                <span
+                                  >{{ 'DASHBOARDS.THIRD_LEVEL_DISPOSITION' |
+                                  translate}}:</span
+                                >
+                                <span class="text-bold"
+                                  >{{ interaction.thirdDisposition }}</span
+                                >
+                              </div>
+                            </div>
+                          </md-tooltip>
+                        </span>
+                      </td>
+
+                      <td md-cell>{{interaction.Owner.name}}</td>
+                      <td md-cell>
+                        <div ng-if="interaction.Tags.length">
+                          <md-tooltip md-direction="left" layout="row">
+                            <span ng-repeat="tag in interaction.Tags"
+                              >{{tag.name}}<span ng-if="!$last">, </span></span
+                            >
+                          </md-tooltip>
+                          <md-icon
+                            md-font-icon="icon-tag"
+                            ng-style="{'color': interaction.Tags.length == 1 && interaction.Tags[0].color }"
+                          >
+                          </md-icon>
+                        </div>
+                      </td>
+                      <td md-cell class="actions">
+                        <md-menu>
+                          <md-button
+                            class="md-icon-button"
+                            aria-label="More"
+                            translate
+                            translate-attr-aria-label="FAX.MORE"
+                            ng-click="$mdOpenMenu($event)"
+                          >
+                            <md-icon
+                              md-font-icon="icon-dots-vertical"
+                            ></md-icon>
+                          </md-button>
+
+                          <md-menu-content width="3">
+                            <md-menu-item>
+                              <md-button
+                                ng-click="vm_dc.spyfaxInteraction($event, interaction)"
+                                translate="FAX.SPYINTERACTION"
+                              >
+                                Spy Interaction
+                              </md-button>
+                            </md-menu-item>
+                            <md-menu-item>
+                              <md-button
+                                class="md-primary"
+                                ng-click="vm_dc.faxInteractionDownload(interaction, $event)"
+                                translate="FAX.DOWNLOAD_INTERACTION"
+                              >
+                                Download
+                              </md-button>
+                            </md-menu-item>
+                            <md-menu-item
+                              ng-if="vm_dc.crudPermissions.canDelete"
+                            >
+                              <md-button
+                                ng-click="vm_dc.deleteConfirm(interaction, $event)"
+                                translate="FAX.DELETE_INTERACTION"
+                              >
+                                Delete Interaction
+                              </md-button>
+                            </md-menu-item>
+                          </md-menu-content>
+                        </md-menu>
+                      </td>
+                    </tr>
+                    <tr
+                      md-row
+                      ng-if="!vm_dc.faxAccountInteractions.rows.length"
+                    >
+                      <td md-cell colspan="12">
+                        <div layout="row" layout-align="center center">
+                          <span
+                            class="text-boxed-light"
+                            translate="FAX.NO_INTERACTION_AVAILABLE"
+                            >No interaction available</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+              <md-table-pagination
+                md-label="{page: '{{'FAX.PAGE' | translate}}:', rowsPerPage: '{{'FAX.ROWSPERPAGE' | translate}}:', of: '{{'FAX.OF' | translate}}'}"
+                md-limit="vm_dc.query.limit"
+                md-limit-options="[10, 15, 20, 50, 100, 250]"
+                md-page="vm_dc.query.page"
+                md-total="{{vm_dc.faxAccountInteractions.count}}"
+                md-on-paginate="vm_dc.getFaxAccountInteractions"
+                md-page-select
+              ></md-table-pagination>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/fax/views/faxAccounts/faxAccounts.html/faxAccounts-[chunkhash].html b/public/src/js/modules/main/apps/fax/views/faxAccounts/faxAccounts.html/faxAccounts-[chunkhash].html
deleted file mode 100644
index b34cde2..0000000
--- a/public/src/js/modules/main/apps/fax/views/faxAccounts/faxAccounts.html/faxAccounts-[chunkhash].html
+++ /dev/null
@@ -1,361 +0,0 @@
-<div
-  id="faxAccounts"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-deskphone" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="FAX.FAXACCOUNTS">FaxAccounts</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="FAX.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedFaxAccounts.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedFaxAccounts =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="FAX.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-faxAccounts-count">
-          <span>{{vm.selectedFaxAccounts.length}}</span>
-          <span translate="FAX.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="FAX.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllFaxAccounts()"
-                translate="FAX.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectFaxAccounts()"
-                translate="FAX.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedFaxAccounts"
-          csv-label="true"
-          filename="faxAccounts.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedFaxAccounts($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="FAX.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- FAXACCOUNT TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedFaxAccounts"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getFaxAccounts"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'FAX.ID' | translate }}</th>
-                <th md-column md-order-by="name">
-                  {{ 'FAX.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="key">{{ 'FAX.KEY' | translate }}</th>
-                <th md-column md-order-by="TrunkId">
-                  {{ 'FAX.TRUNK' | translate }}
-                </th>
-                <th md-column md-order-by="localstationid">
-                  {{ 'FAX.LOCALSTATIONID' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'FAX.DESCRIPTION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.faxAccounts.rows.length">
-                <td md-cell colspan="7">
-                  <div layout="row" layout-align="center center">
-                    <span translate="FAX.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="faxAccount"
-                md-select-id="id"
-                ng-repeat="faxAccount in vm.faxAccounts.rows"
-              >
-                <td md-cell ng-if="faxAccount.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{faxAccount.name}}"
-                    ng-src="api/users/{{faxAccount.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!faxAccount.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{faxAccount.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(faxAccount, ev) : vm.createOrEditFaxAccount($event, faxAccount)"
-                  md-cell
-                  class="id"
-                >
-                  {{faxAccount.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(faxAccount, ev) : vm.createOrEditFaxAccount($event, faxAccount)"
-                  md-cell
-                  class="name"
-                >
-                  {{faxAccount.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(faxAccount, ev) : vm.createOrEditFaxAccount($event, faxAccount)"
-                  md-cell
-                  class="key"
-                >
-                  {{faxAccount.key}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(faxAccount, ev) : vm.createOrEditFaxAccount($event, faxAccount)"
-                  md-cell
-                  class="TrunkId"
-                >
-                  {{ (vm.trunks | filter : {'id':faxAccount.TrunkId} :
-                  true)[0].name }}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(faxAccount, ev) : vm.createOrEditFaxAccount($event, faxAccount)"
-                  md-cell
-                  class="localstationid"
-                >
-                  {{faxAccount.localstationid}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(faxAccount, ev) : vm.createOrEditFaxAccount($event, faxAccount)"
-                  md-cell
-                  class="description"
-                >
-                  {{faxAccount.description}}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="FAX.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(faxAccount, $event    )"
-                          translate="FAX.EDIT_FAXACCOUNT"
-                        >
-                          Edit FaxAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.interactionsgoto(faxAccount, $event    )"
-                          translate="FAX.INTERACTIONS_FAXACCOUNT"
-                        >
-                          Interactions FaxAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.gotorealtimegoto(faxAccount, $event    )"
-                          translate="FAX.GOTOREALTIME_FAXACCOUNT"
-                        >
-                          goToRealtime FaxAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.agentadddialog(faxAccount, $event    )"
-                          translate="FAX.AGENTADD_FAXACCOUNT"
-                        >
-                          AgentAdd FaxAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(faxAccount, $event    )"
-                          translate="FAX.DELETE_FAXACCOUNT"
-                        >
-                          Delete FaxAccount
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'FAX.PAGE' | translate}}:', rowsPerPage: '{{'FAX.ROWSPERPAGE' | translate}}:', of: '{{'FAX.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.faxAccounts.count}}"
-          md-on-paginate="vm.getFaxAccounts"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / FAXACCOUNT TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD FAXACCOUNT BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-faxAccount-button"
-    ng-click="vm.createOrEditFaxAccount($event)"
-    aria-label="add faxAccount"
-    translate
-    translate-attr-aria-label="FAX.ADD_FAXACCOUNT"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD FAXACCOUNT BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/fax/views/faxAccounts/faxAccounts.html/faxAccounts.html b/public/src/js/modules/main/apps/fax/views/faxAccounts/faxAccounts.html/faxAccounts.html
new file mode 100644
index 0000000..b34cde2
--- /dev/null
+++ b/public/src/js/modules/main/apps/fax/views/faxAccounts/faxAccounts.html/faxAccounts.html
@@ -0,0 +1,361 @@
+<div
+  id="faxAccounts"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-deskphone" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="FAX.FAXACCOUNTS">FaxAccounts</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="FAX.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedFaxAccounts.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedFaxAccounts =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="FAX.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-faxAccounts-count">
+          <span>{{vm.selectedFaxAccounts.length}}</span>
+          <span translate="FAX.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="FAX.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllFaxAccounts()"
+                translate="FAX.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectFaxAccounts()"
+                translate="FAX.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedFaxAccounts"
+          csv-label="true"
+          filename="faxAccounts.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedFaxAccounts($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="FAX.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- FAXACCOUNT TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedFaxAccounts"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getFaxAccounts"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'FAX.ID' | translate }}</th>
+                <th md-column md-order-by="name">
+                  {{ 'FAX.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="key">{{ 'FAX.KEY' | translate }}</th>
+                <th md-column md-order-by="TrunkId">
+                  {{ 'FAX.TRUNK' | translate }}
+                </th>
+                <th md-column md-order-by="localstationid">
+                  {{ 'FAX.LOCALSTATIONID' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'FAX.DESCRIPTION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.faxAccounts.rows.length">
+                <td md-cell colspan="7">
+                  <div layout="row" layout-align="center center">
+                    <span translate="FAX.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="faxAccount"
+                md-select-id="id"
+                ng-repeat="faxAccount in vm.faxAccounts.rows"
+              >
+                <td md-cell ng-if="faxAccount.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{faxAccount.name}}"
+                    ng-src="api/users/{{faxAccount.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!faxAccount.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{faxAccount.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(faxAccount, ev) : vm.createOrEditFaxAccount($event, faxAccount)"
+                  md-cell
+                  class="id"
+                >
+                  {{faxAccount.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(faxAccount, ev) : vm.createOrEditFaxAccount($event, faxAccount)"
+                  md-cell
+                  class="name"
+                >
+                  {{faxAccount.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(faxAccount, ev) : vm.createOrEditFaxAccount($event, faxAccount)"
+                  md-cell
+                  class="key"
+                >
+                  {{faxAccount.key}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(faxAccount, ev) : vm.createOrEditFaxAccount($event, faxAccount)"
+                  md-cell
+                  class="TrunkId"
+                >
+                  {{ (vm.trunks | filter : {'id':faxAccount.TrunkId} :
+                  true)[0].name }}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(faxAccount, ev) : vm.createOrEditFaxAccount($event, faxAccount)"
+                  md-cell
+                  class="localstationid"
+                >
+                  {{faxAccount.localstationid}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(faxAccount, ev) : vm.createOrEditFaxAccount($event, faxAccount)"
+                  md-cell
+                  class="description"
+                >
+                  {{faxAccount.description}}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="FAX.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(faxAccount, $event    )"
+                          translate="FAX.EDIT_FAXACCOUNT"
+                        >
+                          Edit FaxAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.interactionsgoto(faxAccount, $event    )"
+                          translate="FAX.INTERACTIONS_FAXACCOUNT"
+                        >
+                          Interactions FaxAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.gotorealtimegoto(faxAccount, $event    )"
+                          translate="FAX.GOTOREALTIME_FAXACCOUNT"
+                        >
+                          goToRealtime FaxAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.agentadddialog(faxAccount, $event    )"
+                          translate="FAX.AGENTADD_FAXACCOUNT"
+                        >
+                          AgentAdd FaxAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(faxAccount, $event    )"
+                          translate="FAX.DELETE_FAXACCOUNT"
+                        >
+                          Delete FaxAccount
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'FAX.PAGE' | translate}}:', rowsPerPage: '{{'FAX.ROWSPERPAGE' | translate}}:', of: '{{'FAX.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.faxAccounts.count}}"
+          md-on-paginate="vm.getFaxAccounts"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / FAXACCOUNT TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD FAXACCOUNT BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-faxAccount-button"
+    ng-click="vm.createOrEditFaxAccount($event)"
+    aria-label="add faxAccount"
+    translate
+    translate-attr-aria-label="FAX.ADD_FAXACCOUNT"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD FAXACCOUNT BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/fax/views/faxQueues/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/fax/views/faxQueues/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index fd8becc..0000000
--- a/public/src/js/modules/main/apps/fax/views/faxQueues/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,217 +0,0 @@
-<md-dialog class="faxQueue-dialog" aria-label="New FaxQueue">
-  <form name="faxQueueForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="FAX.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.faxQueue.name"
-          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.newFaxQueue"
-        />
-
-        <div class="hint"><span translate="FAX.HELP.NAME"></span></div>
-        <div
-          ng-messages="faxQueueForm['name'].$error"
-          ng-show="faxQueueForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="FAX.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span
-              translate="FAX.ERRORS.NAME_MUST_VALID_PATTERN"
-              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-              >Name must be valid pattern
-            </span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="FAX.STRATEGY">Strategy</label>
-        <md-select name="strategy" ng-model="vm.faxQueue.strategy" required>
-          <md-option ng-value="'beepall'">Beepall</md-option>
-          <md-option ng-value="'rrmemory'">RR Memory</md-option>
-        </md-select>
-        <div
-          ng-messages="faxQueueForm['strategy'].$error"
-          ng-show="faxQueueForm['strategy'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="FAX.ERRORS.STRATEGY_REQUIRED"
-              >Strategy field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="FAX.AGENT_TIMEOUT">Agent_Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.faxQueue.timeout"
-          min="1"
-          max="2147483"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="faxQueueForm['timeout'].$error"
-          ng-show="faxQueueForm['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="FAX.ERRORS.AGENT_TIMEOUT_REQUIRED"
-              >Agent_Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="FAX.ERRORS.AGENT_TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Agent_Timeout must be a valid greater or equal than</span
-            >
-            <span>1</span>
-          </div>
-          <div ng-message="max">
-            <span
-              translate="FAX.ERRORS.AGENT_TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-              >Agent_Timeout must be a valid greater or equal than</span
-            >
-            <span>2147483</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="FAX.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.faxQueue.description"
-        />
-
-        <div
-          ng-messages="faxQueueForm['description'].$error"
-          ng-show="faxQueueForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="FAX.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newFaxQueue"
-          ng-click="vm.saveFaxQueue()"
-          class="send-button md-accent md-raised"
-          ng-disabled="faxQueueForm.$invalid || faxQueueForm.$pristine"
-          aria-label="SAVE"
-          translate="FAX.SAVE"
-          translate-attr-aria-label="FAX.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newFaxQueue"
-          ng-click="vm.addNewFaxQueue()"
-          class="send-button md-accent md-raised"
-          ng-disabled="faxQueueForm.$invalid"
-          aria-label="ADD"
-          translate="FAX.ADD_FAXQUEUE"
-          translate-attr-aria-label="FAX.ADD_FAXQUEUE"
-        >
-          ADD FAXQUEUE
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newFaxQueue"
-          ng-click="vm.deleteFaxQueue($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="FAX.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="FAX.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/fax/views/faxQueues/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/fax/views/faxQueues/create/dialog.html/dialog.html
new file mode 100644
index 0000000..fd8becc
--- /dev/null
+++ b/public/src/js/modules/main/apps/fax/views/faxQueues/create/dialog.html/dialog.html
@@ -0,0 +1,217 @@
+<md-dialog class="faxQueue-dialog" aria-label="New FaxQueue">
+  <form name="faxQueueForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="FAX.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.faxQueue.name"
+          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.newFaxQueue"
+        />
+
+        <div class="hint"><span translate="FAX.HELP.NAME"></span></div>
+        <div
+          ng-messages="faxQueueForm['name'].$error"
+          ng-show="faxQueueForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="FAX.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span
+              translate="FAX.ERRORS.NAME_MUST_VALID_PATTERN"
+              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+              >Name must be valid pattern
+            </span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="FAX.STRATEGY">Strategy</label>
+        <md-select name="strategy" ng-model="vm.faxQueue.strategy" required>
+          <md-option ng-value="'beepall'">Beepall</md-option>
+          <md-option ng-value="'rrmemory'">RR Memory</md-option>
+        </md-select>
+        <div
+          ng-messages="faxQueueForm['strategy'].$error"
+          ng-show="faxQueueForm['strategy'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="FAX.ERRORS.STRATEGY_REQUIRED"
+              >Strategy field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="FAX.AGENT_TIMEOUT">Agent_Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.faxQueue.timeout"
+          min="1"
+          max="2147483"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="faxQueueForm['timeout'].$error"
+          ng-show="faxQueueForm['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="FAX.ERRORS.AGENT_TIMEOUT_REQUIRED"
+              >Agent_Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="FAX.ERRORS.AGENT_TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Agent_Timeout must be a valid greater or equal than</span
+            >
+            <span>1</span>
+          </div>
+          <div ng-message="max">
+            <span
+              translate="FAX.ERRORS.AGENT_TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+              >Agent_Timeout must be a valid greater or equal than</span
+            >
+            <span>2147483</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="FAX.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.faxQueue.description"
+        />
+
+        <div
+          ng-messages="faxQueueForm['description'].$error"
+          ng-show="faxQueueForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="FAX.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newFaxQueue"
+          ng-click="vm.saveFaxQueue()"
+          class="send-button md-accent md-raised"
+          ng-disabled="faxQueueForm.$invalid || faxQueueForm.$pristine"
+          aria-label="SAVE"
+          translate="FAX.SAVE"
+          translate-attr-aria-label="FAX.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newFaxQueue"
+          ng-click="vm.addNewFaxQueue()"
+          class="send-button md-accent md-raised"
+          ng-disabled="faxQueueForm.$invalid"
+          aria-label="ADD"
+          translate="FAX.ADD_FAXQUEUE"
+          translate-attr-aria-label="FAX.ADD_FAXQUEUE"
+        >
+          ADD FAXQUEUE
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newFaxQueue"
+          ng-click="vm.deleteFaxQueue($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="FAX.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="FAX.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/fax/views/faxQueues/edit/agentadd/agentadd.html/agentadd-[chunkhash].html b/public/src/js/modules/main/apps/fax/views/faxQueues/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
deleted file mode 100644
index c667948..0000000
--- a/public/src/js/modules/main/apps/fax/views/faxQueues/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
+++ /dev/null
@@ -1,40 +0,0 @@
-<md-dialog class="faxQueue-dialog" aria-label="faxQueue" ng-init="vm.onInit()">
-  <form name="faxQueueForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="FAX.AGENTADD_FAXQUEUE">Add Agent to faxQueue</h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <ms-dual-multiselect
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveAgents()"
-        class="send-button md-accent md-raised"
-        ng-disabled="!vm.pendingChanges"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/fax/views/faxQueues/edit/agentadd/agentadd.html/agentadd.html b/public/src/js/modules/main/apps/fax/views/faxQueues/edit/agentadd/agentadd.html/agentadd.html
new file mode 100644
index 0000000..c667948
--- /dev/null
+++ b/public/src/js/modules/main/apps/fax/views/faxQueues/edit/agentadd/agentadd.html/agentadd.html
@@ -0,0 +1,40 @@
+<md-dialog class="faxQueue-dialog" aria-label="faxQueue" ng-init="vm.onInit()">
+  <form name="faxQueueForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="FAX.AGENTADD_FAXQUEUE">Add Agent to faxQueue</h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <ms-dual-multiselect
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveAgents()"
+        class="send-button md-accent md-raised"
+        ng-disabled="!vm.pendingChanges"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/fax/views/faxQueues/edit/teamadd/teamadd.html/teamadd-[chunkhash].html b/public/src/js/modules/main/apps/fax/views/faxQueues/edit/teamadd/teamadd.html/teamadd-[chunkhash].html
deleted file mode 100644
index 11d6c16..0000000
--- a/public/src/js/modules/main/apps/fax/views/faxQueues/edit/teamadd/teamadd.html/teamadd-[chunkhash].html
+++ /dev/null
@@ -1,40 +0,0 @@
-<md-dialog class="faxQueue-dialog" aria-label="faxQueue" ng-init="vm.onInit()">
-  <form name="faxQueueForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="FAX.TEAMS_ASSOCIATION">Teams Association</h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <ms-dual-multiselect
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveTeams()"
-        ng-disabled="!vm.pendingChanges"
-        class="send-button md-accent md-raised"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/fax/views/faxQueues/edit/teamadd/teamadd.html/teamadd.html b/public/src/js/modules/main/apps/fax/views/faxQueues/edit/teamadd/teamadd.html/teamadd.html
new file mode 100644
index 0000000..11d6c16
--- /dev/null
+++ b/public/src/js/modules/main/apps/fax/views/faxQueues/edit/teamadd/teamadd.html/teamadd.html
@@ -0,0 +1,40 @@
+<md-dialog class="faxQueue-dialog" aria-label="faxQueue" ng-init="vm.onInit()">
+  <form name="faxQueueForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="FAX.TEAMS_ASSOCIATION">Teams Association</h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <ms-dual-multiselect
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveTeams()"
+        ng-disabled="!vm.pendingChanges"
+        class="send-button md-accent md-raised"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/fax/views/faxQueues/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/fax/views/faxQueues/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index 5ff7545..0000000
--- a/public/src/js/modules/main/apps/fax/views/faxQueues/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,214 +0,0 @@
-<div id="fax-faxQueue" class="page-layout simple tabbed" layout="column">
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-faxQueues-button md-icon-button"
-        aria-label="Go to faxQueues"
-        ng-click="vm.gotoFaxQueues()"
-        translate
-        translate-attr-aria-label="FAX.GO_TO_FAXQUEUES"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="faxQueue-image" hide-xs>
-          <img ng-src="assets/images/business/faxQueues.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.faxQueue.id}}
-            <span ng-if="vm.faxQueue.name">{{vm.faxQueue.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="FAX.CREATED_AT"></span>
-            <span>{{vm.faxQueue.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.teamadddialog(vm.faxQueue, $event)"
-        class="md-fab md-orange-500-bg md-icon-button"
-        aria-label="teamadd"
-      >
-        <md-tooltip><span translate="FAX.TEAMADD_FAXQUEUE"></span></md-tooltip>
-        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
-      </md-button>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.agentadddialog(vm.faxQueue, $event)"
-        class="md-fab md-purple-500-bg md-icon-button"
-        aria-label="agentadd"
-      >
-        <md-tooltip><span translate="FAX.AGENTADD_FAXQUEUE"></span></md-tooltip>
-        <md-icon md-font-icon="icon-account-plus"></md-icon>
-      </md-button>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveFaxQueue()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid)"
-        translate="FAX.SAVE"
-        translate-attr-aria-label="FAX.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="FAX.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="faxQueue-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="FAX.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="FAX.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.faxQueue.name"
-                  ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-                  ng-required="true"
-                  autofocus
-                  disabled
-                />
-
-                <div class="hint"><span translate="FAX.HELP.NAME"></span></div>
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="FAX.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                  <div ng-message="pattern">
-                    <span
-                      translate="FAX.ERRORS.NAME_MUST_VALID_PATTERN"
-                      translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-                      >Name must be valid pattern
-                    </span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="FAX.STRATEGY">Strategy</label>
-                <md-select
-                  name="strategy"
-                  ng-model="vm.faxQueue.strategy"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'beepall'">Beepall</md-option>
-                  <md-option ng-value="'rrmemory'">RR Memory</md-option>
-                </md-select>
-                <div
-                  ng-messages="generalForm['strategy'].$error"
-                  ng-show="generalForm['strategy'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="FAX.ERRORS.STRATEGY_REQUIRED"
-                      >Strategy field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="FAX.AGENT_TIMEOUT">Agent_Timeout</label>
-                <input
-                  type="number"
-                  name="timeout"
-                  ng-model="vm.faxQueue.timeout"
-                  min="1"
-                  max="2147483"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['timeout'].$error"
-                  ng-show="generalForm['timeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="FAX.ERRORS.AGENT_TIMEOUT_REQUIRED"
-                      >Agent_Timeout field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="FAX.ERRORS.AGENT_TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >Agent_Timeout must be a valid greater or equal than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="FAX.ERRORS.AGENT_TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >Agent_Timeout must be a valid greater or equal than</span
-                    >
-                    <span>2147483</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="FAX.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.faxQueue.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="FAX.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/fax/views/faxQueues/edit/view.html/view.html b/public/src/js/modules/main/apps/fax/views/faxQueues/edit/view.html/view.html
new file mode 100644
index 0000000..5ff7545
--- /dev/null
+++ b/public/src/js/modules/main/apps/fax/views/faxQueues/edit/view.html/view.html
@@ -0,0 +1,214 @@
+<div id="fax-faxQueue" class="page-layout simple tabbed" layout="column">
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-faxQueues-button md-icon-button"
+        aria-label="Go to faxQueues"
+        ng-click="vm.gotoFaxQueues()"
+        translate
+        translate-attr-aria-label="FAX.GO_TO_FAXQUEUES"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="faxQueue-image" hide-xs>
+          <img ng-src="assets/images/business/faxQueues.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.faxQueue.id}}
+            <span ng-if="vm.faxQueue.name">{{vm.faxQueue.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="FAX.CREATED_AT"></span>
+            <span>{{vm.faxQueue.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.teamadddialog(vm.faxQueue, $event)"
+        class="md-fab md-orange-500-bg md-icon-button"
+        aria-label="teamadd"
+      >
+        <md-tooltip><span translate="FAX.TEAMADD_FAXQUEUE"></span></md-tooltip>
+        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
+      </md-button>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.agentadddialog(vm.faxQueue, $event)"
+        class="md-fab md-purple-500-bg md-icon-button"
+        aria-label="agentadd"
+      >
+        <md-tooltip><span translate="FAX.AGENTADD_FAXQUEUE"></span></md-tooltip>
+        <md-icon md-font-icon="icon-account-plus"></md-icon>
+      </md-button>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveFaxQueue()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid)"
+        translate="FAX.SAVE"
+        translate-attr-aria-label="FAX.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="FAX.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="faxQueue-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="FAX.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="FAX.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.faxQueue.name"
+                  ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+                  ng-required="true"
+                  autofocus
+                  disabled
+                />
+
+                <div class="hint"><span translate="FAX.HELP.NAME"></span></div>
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="FAX.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                  <div ng-message="pattern">
+                    <span
+                      translate="FAX.ERRORS.NAME_MUST_VALID_PATTERN"
+                      translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+                      >Name must be valid pattern
+                    </span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="FAX.STRATEGY">Strategy</label>
+                <md-select
+                  name="strategy"
+                  ng-model="vm.faxQueue.strategy"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'beepall'">Beepall</md-option>
+                  <md-option ng-value="'rrmemory'">RR Memory</md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['strategy'].$error"
+                  ng-show="generalForm['strategy'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="FAX.ERRORS.STRATEGY_REQUIRED"
+                      >Strategy field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="FAX.AGENT_TIMEOUT">Agent_Timeout</label>
+                <input
+                  type="number"
+                  name="timeout"
+                  ng-model="vm.faxQueue.timeout"
+                  min="1"
+                  max="2147483"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['timeout'].$error"
+                  ng-show="generalForm['timeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="FAX.ERRORS.AGENT_TIMEOUT_REQUIRED"
+                      >Agent_Timeout field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="FAX.ERRORS.AGENT_TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >Agent_Timeout must be a valid greater or equal than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="FAX.ERRORS.AGENT_TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >Agent_Timeout must be a valid greater or equal than</span
+                    >
+                    <span>2147483</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="FAX.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.faxQueue.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="FAX.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/fax/views/faxQueues/faxQueues.html/faxQueues-[chunkhash].html b/public/src/js/modules/main/apps/fax/views/faxQueues/faxQueues.html/faxQueues-[chunkhash].html
deleted file mode 100644
index 0bd0765..0000000
--- a/public/src/js/modules/main/apps/fax/views/faxQueues/faxQueues.html/faxQueues-[chunkhash].html
+++ /dev/null
@@ -1,332 +0,0 @@
-<div
-  id="faxQueues"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-deskphone" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="FAX.FAXQUEUES">FaxQueues</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="FAX.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedFaxQueues.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedFaxQueues =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="FAX.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-faxQueues-count">
-          <span>{{vm.selectedFaxQueues.length}}</span>
-          <span translate="FAX.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="FAX.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllFaxQueues()"
-                translate="FAX.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectFaxQueues()"
-                translate="FAX.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedFaxQueues"
-          csv-label="true"
-          filename="faxQueues.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedFaxQueues($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="FAX.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- FAXQUEUE TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedFaxQueues"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getFaxQueues"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'FAX.ID' | translate }}</th>
-                <th md-column md-order-by="name">
-                  {{ 'FAX.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="strategy">
-                  {{ 'FAX.STRATEGY' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.faxQueues.rows.length">
-                <td md-cell colspan="4">
-                  <div layout="row" layout-align="center center">
-                    <span translate="FAX.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="faxQueue"
-                md-select-id="id"
-                ng-repeat="faxQueue in vm.faxQueues.rows"
-              >
-                <td md-cell ng-if="faxQueue.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{faxQueue.name}}"
-                    ng-src="api/users/{{faxQueue.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!faxQueue.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{faxQueue.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(faxQueue, ev) : vm.createOrEditFaxQueue($event, faxQueue)"
-                  md-cell
-                  class="id"
-                >
-                  {{faxQueue.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(faxQueue, ev) : vm.createOrEditFaxQueue($event, faxQueue)"
-                  md-cell
-                  class="name"
-                >
-                  {{faxQueue.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(faxQueue, ev) : vm.createOrEditFaxQueue($event, faxQueue)"
-                  md-cell
-                  class="strategy"
-                >
-                  {{ vm.arraystrategy[faxQueue.strategy].option }}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="FAX.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(faxQueue, $event    )"
-                          translate="FAX.EDIT_FAXQUEUE"
-                        >
-                          Edit FaxQueue
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.teamadddialog(faxQueue, $event    )"
-                          translate="FAX.TEAMADD_FAXQUEUE"
-                        >
-                          teamadd FaxQueue
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.agentadddialog(faxQueue, $event    )"
-                          translate="FAX.AGENTADD_FAXQUEUE"
-                        >
-                          agentadd FaxQueue
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(faxQueue, $event    )"
-                          translate="FAX.DELETE_FAXQUEUE"
-                        >
-                          Delete FaxQueue
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.gotorealtimegoto(faxQueue, $event    )"
-                          translate="FAX.GOTOREALTIME_FAXQUEUE"
-                        >
-                          goToRealtime FaxQueue
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'FAX.PAGE' | translate}}:', rowsPerPage: '{{'FAX.ROWSPERPAGE' | translate}}:', of: '{{'FAX.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.faxQueues.count}}"
-          md-on-paginate="vm.getFaxQueues"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / FAXQUEUE TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD FAXQUEUE BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-faxQueue-button"
-    ng-click="vm.createOrEditFaxQueue($event)"
-    aria-label="add faxQueue"
-    translate
-    translate-attr-aria-label="FAX.ADD_FAXQUEUE"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD FAXQUEUE BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/fax/views/faxQueues/faxQueues.html/faxQueues.html b/public/src/js/modules/main/apps/fax/views/faxQueues/faxQueues.html/faxQueues.html
new file mode 100644
index 0000000..0bd0765
--- /dev/null
+++ b/public/src/js/modules/main/apps/fax/views/faxQueues/faxQueues.html/faxQueues.html
@@ -0,0 +1,332 @@
+<div
+  id="faxQueues"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-deskphone" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="FAX.FAXQUEUES">FaxQueues</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="FAX.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedFaxQueues.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedFaxQueues =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="FAX.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-faxQueues-count">
+          <span>{{vm.selectedFaxQueues.length}}</span>
+          <span translate="FAX.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="FAX.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllFaxQueues()"
+                translate="FAX.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectFaxQueues()"
+                translate="FAX.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedFaxQueues"
+          csv-label="true"
+          filename="faxQueues.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedFaxQueues($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="FAX.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- FAXQUEUE TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedFaxQueues"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getFaxQueues"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'FAX.ID' | translate }}</th>
+                <th md-column md-order-by="name">
+                  {{ 'FAX.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="strategy">
+                  {{ 'FAX.STRATEGY' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.faxQueues.rows.length">
+                <td md-cell colspan="4">
+                  <div layout="row" layout-align="center center">
+                    <span translate="FAX.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="faxQueue"
+                md-select-id="id"
+                ng-repeat="faxQueue in vm.faxQueues.rows"
+              >
+                <td md-cell ng-if="faxQueue.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{faxQueue.name}}"
+                    ng-src="api/users/{{faxQueue.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!faxQueue.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{faxQueue.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(faxQueue, ev) : vm.createOrEditFaxQueue($event, faxQueue)"
+                  md-cell
+                  class="id"
+                >
+                  {{faxQueue.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(faxQueue, ev) : vm.createOrEditFaxQueue($event, faxQueue)"
+                  md-cell
+                  class="name"
+                >
+                  {{faxQueue.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(faxQueue, ev) : vm.createOrEditFaxQueue($event, faxQueue)"
+                  md-cell
+                  class="strategy"
+                >
+                  {{ vm.arraystrategy[faxQueue.strategy].option }}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="FAX.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(faxQueue, $event    )"
+                          translate="FAX.EDIT_FAXQUEUE"
+                        >
+                          Edit FaxQueue
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.teamadddialog(faxQueue, $event    )"
+                          translate="FAX.TEAMADD_FAXQUEUE"
+                        >
+                          teamadd FaxQueue
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.agentadddialog(faxQueue, $event    )"
+                          translate="FAX.AGENTADD_FAXQUEUE"
+                        >
+                          agentadd FaxQueue
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(faxQueue, $event    )"
+                          translate="FAX.DELETE_FAXQUEUE"
+                        >
+                          Delete FaxQueue
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.gotorealtimegoto(faxQueue, $event    )"
+                          translate="FAX.GOTOREALTIME_FAXQUEUE"
+                        >
+                          goToRealtime FaxQueue
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'FAX.PAGE' | translate}}:', rowsPerPage: '{{'FAX.ROWSPERPAGE' | translate}}:', of: '{{'FAX.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.faxQueues.count}}"
+          md-on-paginate="vm.getFaxQueues"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / FAXQUEUE TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD FAXQUEUE BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-faxQueue-button"
+    ng-click="vm.createOrEditFaxQueue($event)"
+    aria-label="add faxQueue"
+    translate
+    translate-attr-aria-label="FAX.ADD_FAXQUEUE"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD FAXQUEUE BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/fax/views/realtime/accounts/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/fax/views/realtime/accounts/view.html/view-[chunkhash].html
deleted file mode 100644
index d65a2fb..0000000
--- a/public/src/js/modules/main/apps/fax/views/realtime/accounts/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,116 +0,0 @@
-<!-- MAIN -->
-<md-toolbar class="md-table-toolbar md-default">
-  <div class="md-toolbar-tools">
-    <span class="md-subhead" translate="FAX.ACCOUNTS">Accounts</span>
-    <div flex></div>
-    <ms-search-bar
-      on-search="vm.query.filter = query;"
-      on-collapse="vm.query.filter = undefined;"
-      debounce="300"
-    ></ms-search-bar>
-  </div>
-</md-toolbar>
-
-<!-- AGENT TABLE -->
-<md-table-container>
-  <table md-table multiple md-progress="vm.promise">
-    <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getFaxAccounts">
-      <tr md-row>
-        <th md-column md-order-by="name">{{ 'FAX.NAME' | translate }}</th>
-        <th md-column>{{ 'FAX.KEY' | translate }}</th>
-        <th md-column>{{ 'FAX.TOTAL' | translate }}</th>
-        <th md-column>{{ 'FAX.IN' | translate }}</th>
-        <th md-column>{{ 'FAX.OUT' | translate }}</th>
-        <th md-column width="10px"></th>
-      </tr>
-    </thead>
-    <tbody md-body>
-      <tr md-row ng-hide="vm.faxAccounts">
-        <td md-cell colspan="4">
-          <div layout="row" layout-align="center center">
-            <span translate="FAX.NO_AVAILABLE_INFO">No Available Info</span>
-          </div>
-        </td>
-      </tr>
-      <tr
-        md-row
-        md-select="vm.faxAccounts[value]"
-        md-select-id="id"
-        ng-repeat="(id, value) in vm.order"
-      >
-        <td md-cell>{{vm.faxAccounts[value].name}}</td>
-        <td md-cell>{{vm.faxAccounts[value].key}}</td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{(vm.faxAccounts[value].in || 0) + (vm.faxAccounts[value].out ||
-            0)}}</span
-          >
-        </td>
-        <td md-cell>
-          <div layout="row">
-            <span
-              ><md-icon md-font-icon="icon-arrow-down-bold blue-fg"></md-icon
-            ></span>
-            <span class="md-capture blue-fg"
-              >{{vm.faxAccounts[value].in || 0}}</span
-            >
-            <span class="text-boxed" ng-if="mailAccount.in"
-              >{{vm.faxAccounts[value].lastIn ? (vm.faxAccounts[value].lastIn |
-              date: 'shortTime') : ''}}</span
-            >
-          </div>
-        </td>
-        <td md-cell>
-          <div layout="row">
-            <span
-              ><md-icon md-font-icon="icon-arrow-up-bold green-fg"></md-icon
-            ></span>
-            <span class="md-capture green-fg"
-              >{{vm.faxAccounts[value].out || 0}}</span
-            >
-            <span class="text-boxed" ng-if="mailAccount.out"
-              >{{vm.faxAccounts[value].lastOut ? (vm.faxAccounts[value].lastOut
-              | date: 'shortTime') : ''}}</span
-            >
-          </div>
-        </td>
-        <td md-cell class="actions" ng-if="vm.crudPermissions.canEdit">
-          <md-menu>
-            <md-button
-              class="md-icon-button"
-              aria-label="More"
-              translate
-              translate-attr-aria-label="STAFF.MORE"
-              ng-click="$mdMenu.open($event)"
-            >
-              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-            </md-button>
-
-            <md-menu-content width="4">
-              <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                <md-button
-                  ng-click="vm.goToFaxAccount($event, vm.faxAccounts[value])"
-                  translate="FAX.EDIT_ACCOUNT"
-                >
-                  Edit Account
-                </md-button>
-              </md-menu-item>
-            </md-menu-content>
-          </md-menu>
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</md-table-container>
-
-<md-table-pagination
-  md-label="{page: '{{'FAX.PAGE' | translate}}:', rowsPerPage: '{{'FAX.ROWSPERPAGE' | translate}}:', of: '{{'FAX.OF' | translate}}'}"
-  md-limit="vm.query.limit"
-  md-limit-options="[10, 15, 20, 50, 100, 250]"
-  md-page="vm.query.page"
-  md-total="{{vm.count}}"
-  md-on-paginate="vm.getfaxAccounts"
-  md-page-select
-></md-table-pagination>
-<!-- / AGENT TABLE -->
-<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/fax/views/realtime/accounts/view.html/view.html b/public/src/js/modules/main/apps/fax/views/realtime/accounts/view.html/view.html
new file mode 100644
index 0000000..d65a2fb
--- /dev/null
+++ b/public/src/js/modules/main/apps/fax/views/realtime/accounts/view.html/view.html
@@ -0,0 +1,116 @@
+<!-- MAIN -->
+<md-toolbar class="md-table-toolbar md-default">
+  <div class="md-toolbar-tools">
+    <span class="md-subhead" translate="FAX.ACCOUNTS">Accounts</span>
+    <div flex></div>
+    <ms-search-bar
+      on-search="vm.query.filter = query;"
+      on-collapse="vm.query.filter = undefined;"
+      debounce="300"
+    ></ms-search-bar>
+  </div>
+</md-toolbar>
+
+<!-- AGENT TABLE -->
+<md-table-container>
+  <table md-table multiple md-progress="vm.promise">
+    <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getFaxAccounts">
+      <tr md-row>
+        <th md-column md-order-by="name">{{ 'FAX.NAME' | translate }}</th>
+        <th md-column>{{ 'FAX.KEY' | translate }}</th>
+        <th md-column>{{ 'FAX.TOTAL' | translate }}</th>
+        <th md-column>{{ 'FAX.IN' | translate }}</th>
+        <th md-column>{{ 'FAX.OUT' | translate }}</th>
+        <th md-column width="10px"></th>
+      </tr>
+    </thead>
+    <tbody md-body>
+      <tr md-row ng-hide="vm.faxAccounts">
+        <td md-cell colspan="4">
+          <div layout="row" layout-align="center center">
+            <span translate="FAX.NO_AVAILABLE_INFO">No Available Info</span>
+          </div>
+        </td>
+      </tr>
+      <tr
+        md-row
+        md-select="vm.faxAccounts[value]"
+        md-select-id="id"
+        ng-repeat="(id, value) in vm.order"
+      >
+        <td md-cell>{{vm.faxAccounts[value].name}}</td>
+        <td md-cell>{{vm.faxAccounts[value].key}}</td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{(vm.faxAccounts[value].in || 0) + (vm.faxAccounts[value].out ||
+            0)}}</span
+          >
+        </td>
+        <td md-cell>
+          <div layout="row">
+            <span
+              ><md-icon md-font-icon="icon-arrow-down-bold blue-fg"></md-icon
+            ></span>
+            <span class="md-capture blue-fg"
+              >{{vm.faxAccounts[value].in || 0}}</span
+            >
+            <span class="text-boxed" ng-if="mailAccount.in"
+              >{{vm.faxAccounts[value].lastIn ? (vm.faxAccounts[value].lastIn |
+              date: 'shortTime') : ''}}</span
+            >
+          </div>
+        </td>
+        <td md-cell>
+          <div layout="row">
+            <span
+              ><md-icon md-font-icon="icon-arrow-up-bold green-fg"></md-icon
+            ></span>
+            <span class="md-capture green-fg"
+              >{{vm.faxAccounts[value].out || 0}}</span
+            >
+            <span class="text-boxed" ng-if="mailAccount.out"
+              >{{vm.faxAccounts[value].lastOut ? (vm.faxAccounts[value].lastOut
+              | date: 'shortTime') : ''}}</span
+            >
+          </div>
+        </td>
+        <td md-cell class="actions" ng-if="vm.crudPermissions.canEdit">
+          <md-menu>
+            <md-button
+              class="md-icon-button"
+              aria-label="More"
+              translate
+              translate-attr-aria-label="STAFF.MORE"
+              ng-click="$mdMenu.open($event)"
+            >
+              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+            </md-button>
+
+            <md-menu-content width="4">
+              <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                <md-button
+                  ng-click="vm.goToFaxAccount($event, vm.faxAccounts[value])"
+                  translate="FAX.EDIT_ACCOUNT"
+                >
+                  Edit Account
+                </md-button>
+              </md-menu-item>
+            </md-menu-content>
+          </md-menu>
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</md-table-container>
+
+<md-table-pagination
+  md-label="{page: '{{'FAX.PAGE' | translate}}:', rowsPerPage: '{{'FAX.ROWSPERPAGE' | translate}}:', of: '{{'FAX.OF' | translate}}'}"
+  md-limit="vm.query.limit"
+  md-limit-options="[10, 15, 20, 50, 100, 250]"
+  md-page="vm.query.page"
+  md-total="{{vm.count}}"
+  md-on-paginate="vm.getfaxAccounts"
+  md-page-select
+></md-table-pagination>
+<!-- / AGENT TABLE -->
+<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/fax/views/realtime/agents/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/fax/views/realtime/agents/view.html/view-[chunkhash].html
deleted file mode 100644
index 37cd28d..0000000
--- a/public/src/js/modules/main/apps/fax/views/realtime/agents/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,515 +0,0 @@
-<!-- MAIN -->
-<md-toolbar class="md-table-toolbar md-default">
-  <div class="md-toolbar-tools">
-    <span class="md-subhead" translate="FAX.AGENTS">Agents</span>
-    <div flex></div>
-    <ms-search-bar
-      on-search="vm.query.filter = query; vm.onInit()"
-      on-collapse="vm.query.filter = undefined; vm.onInit()"
-      debounce="300"
-    ></ms-search-bar>
-    <md-select
-      ng-model="vm.query.globalStatusFilter"
-      class="md-caption"
-      ng-change="vm.query.pauseTypeFilter = ''; vm.onInit()"
-    >
-      <md-option ng-value="''">{{ 'FAX.ALL' | translate }}</md-option>
-      <md-option value="pause">{{ 'FAX.PAUSE' | translate }}</md-option>
-      <md-option value="*pause">{{ 'FAX.PARTIALPAUSE' | translate }}</md-option>
-      <md-option value="busy">{{ 'FAX.BUSY' | translate }}</md-option>
-      <md-option value="idle">{{ 'FAX.IDLE' | translate }}</md-option>
-    </md-select>
-
-    <md-select
-      ng-if="vm.isPause(vm.query.globalStatusFilter)"
-      ng-model="vm.query.pauseTypeFilter"
-      class="md-caption"
-      ng-change="vm.onInit()"
-    >
-      <md-option ng-value="''">All</md-option>
-      <md-option value="DEFAULT PAUSE">DEFAULT PAUSE</md-option>
-      <md-option value="ACW">ACW</md-option>
-      <md-option value="LOGININPAUSE">LOGININPAUSE</md-option>
-      <md-option value="Auto-Pause">AUTOPAUSE</md-option>
-      <md-option ng-value="pause.name" ng-repeat="pause in vm.pauses.rows"
-        >{{pause.name}}</md-option
-      >
-    </md-select>
-  </div>
-</md-toolbar>
-
-<!-- AGENT TABLE -->
-<md-table-container>
-  <table md-table multiple md-progress="vm.promise">
-    <thead md-head md-order="vm.query.order" md-on-reorder="vm.onInit">
-      <tr md-row border="1">
-        <th class="bv text-center" colspan="5">
-          {{ 'FAX.AGENT' | translate }}
-        </th>
-        <th class="bv bl text-center" colspan="2">
-          {{ 'VOICE.VOICE' | translate }}
-        </th>
-        <th ng-if="vm.license.chat" class="bv bl text-center" colspan="2">
-          {{ 'CHAT.CHAT' | translate }}
-        </th>
-        <th ng-if="vm.license.mail" class="bv bl text-center" colspan="2">
-          {{ 'MAIL.MAIL' | translate }}
-        </th>
-        <th ng-if="vm.license.messaging" class="bv bl text-center" colspan="2">
-          {{ 'SMS.SMS' | translate }}
-        </th>
-        <th
-          ng-if="vm.license.openchannel"
-          class="bv bl text-center"
-          colspan="2"
-        >
-          {{ 'OPENCHANNEL.OPENCHANNEL' | translate }}
-        </th>
-        <th ng-if="vm.license.fax" class="bv bl text-center" colspan="2">
-          {{ 'FAX.FAX' | translate }}
-        </th>
-        <th ng-if="vm.license.whatsapp" class="bv bl text-center" colspan="2">
-          {{ 'WHATSAPP.WHATSAPP' | translate }}
-        </th>
-        <th width="10px" class="bt bl" rowspan="2"></th>
-      </tr>
-      <tr md-row>
-        <th class="bl" colspan="2" md-column md-order-by="fullname">
-          {{ 'FAX.NAME' | translate }}
-        </th>
-        <th class="bl custom-column" md-column md-order-by="globalStatus">
-          {{ 'FAX.STATUS' | translate }}
-        </th>
-        <th class="bl custom-column" md-column md-order-by="lastLoginAt">
-          {{ 'FAX.LOGIN_TIME' | translate }}
-        </th>
-        <th class="bl custom-column" md-column md-order-by="lastPauseAt">
-          {{ 'FAX.PAUSE_TIME' | translate }}
-        </th>
-
-        <th class="bl custom-column">{{ 'VOICE.STATUS' | translate }}</th>
-        <th class="bl custom-column">Info</th>
-
-        <th ng-if="vm.license.chat" class="bl text-center">
-          {{ 'CHAT.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.chat" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'CHAT.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.mail" class="bl text-center">
-          {{ 'MAIL.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.mail" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'MAIL.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.messaging" class="bl text-center">
-          {{ 'SMS.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.messaging" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'SMS.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.openchannel" class="bl text-center">
-          {{ 'OPENCHANNEL.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.openchannel" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'OPENCHANNEL.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.fax" class="bl text-center">
-          {{ 'FAX.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.fax" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'FAX.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.whatsapp" class="bl text-center">
-          {{ 'WHATSAPP.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.whatsapp" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'WHATSAPP.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-      </tr>
-    </thead>
-    <tbody md-body>
-      <tr md-row ng-hide="vm.order.length">
-        <td md-cell colspan="19">
-          <div layout="row" layout-align="center center">
-            <span>{{ 'FAX.NO_AGENT_ONLINE' | translate }}</span>
-          </div>
-        </td>
-      </tr>
-      <tr
-        md-select="vm.agents[value]"
-        md-select-id="id"
-        ng-repeat="(id, value) in vm.order"
-      >
-        <td class="bt padding-5">
-          <div layout="row" layout-align="start center">
-            <img
-              class="avatar"
-              ng-src="{{vm.agents[value].userpic && 'api/users/'+vm.agents[value].id+'/avatar' || 'assets/images/avatars/profile.png'}}"
-            />
-            <div layout="column">
-              <span>{{vm.agents[value].fullname}}</span>
-              <span>{{vm.agents[value].internal}}</span>
-            </div>
-          </div>
-        </td>
-        <td class="bt padding-5">
-          <div
-            layout="row"
-            layout-align="start center"
-            ng-if="vm.license.screenrecording && (vm.agents[value].phoneBarEnableScreenRecordingByAgent || vm.agents[value].phoneBarEnableAutomaticScreenRecording)"
-          >
-            <div class="column" ng-if="vm.agents[value].screenrecording">
-              <span>
-                <md-icon
-                  md-font-icon="icon-camcorder-box"
-                  style="color: green; font-size: 36px"
-                  aria-label="icon-camcorder-box26"
-                >
-                  <md-tooltip>
-                    {{ 'FAX.TOOLTIP_SCREENRECORDING_ON' | translate }}
-                  </md-tooltip>
-                </md-icon>
-              </span>
-            </div>
-            <div class="column" ng-if="!vm.agents[value].screenrecording">
-              <span>
-                <md-icon
-                  md-font-icon="icon-camcorder-box"
-                  style="color: gray"
-                  aria-label="icon-camcorder-box26"
-                >
-                  <md-tooltip>
-                    {{ 'FAX.TOOLTIP_SCREENRECORDING_OFF' | translate }}
-                  </md-tooltip>
-                </md-icon>
-              </span>
-            </div>
-          </div>
-        </td>
-
-        <td class="bt">
-          <span
-            class="text-boxed md-background-bg bl bt padding-5"
-            ng-class="{'idle':'lime-300-bg','busy':'indigo-100-bg','*pause':'amber-50-bg','pause':'amber-200-bg'}[vm.agents[value].globalStatus]"
-            >{{ vm.isPause(vm.agents[value].globalStatus) ? '' :
-            vm.agents[value].globalStatus | uppercase }} {{
-            vm.isPause(vm.agents[value].globalStatus) ?
-            (vm.isPartialPause(vm.agents[value].globalStatus) ?
-            '*'+vm.agents[value].pauseType || 'DEFAULT PAUSE' :
-            vm.agents[value].pauseType || 'DEFAULT PAUSE') : ''}}</span
-          >
-        </td>
-        <td class="bt custom-column">
-          <timer start-time="vm.agents[value].lastLoginAt" interval="1000"
-            >{{ days > 0 ? days + 'd' : '' }}
-            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
-          >
-        </td>
-        <td class="bt custom-column">
-          <timer
-            ng-if="vm.isPause(vm.agents[value].globalStatus) || vm.isPartialPause(vm.agents[value].globalStatus)"
-            start-time="vm.agents[value].lastPauseAt"
-            interval="1000"
-            >{{ days > 0 ? days + 'd' : '' }}
-            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
-          >
-        </td>
-        <td class="bt bl">
-          <div layout="row">
-            <span
-              ng-if="!vm.agents[value].onhold"
-              class="text-boxed md-background-bg bl bt padding-5"
-              ng-class="{'idle':'lime-300-bg','talking':'indigo-100-bg','ringing':'orange-400-bg','pause':'amber-200-bg'}[vm.agents[value].voiceStatus]"
-              >{{ vm.agents[value].voiceStatus | uppercase }}</span
-            >
-            <span
-              ng-if="vm.agents[value].onhold"
-              class="text-boxed md-background-bg bl bt padding-5 orange-400-bg"
-              >ONHOLD</span
-            >
-          </div>
-        </td>
-        <td class="bt bl">
-          <div layout="column">
-            <span
-              ng-if="vm.agents[value].queue"
-              class="padding-5"
-              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
-              >{{ vm.agents[value].queue }}</span
-            >
-            <span
-              ng-if="vm.agents[value].destconnectedlinenum"
-              class="padding-5"
-              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
-              >{{ vm.agents[value].destconnectedlinenum }}</span
-            >
-            <span
-              class="padding-5"
-              ng-if="vm.agents[value].queue || vm.agents[value].destconnectedlinenum"
-            >
-              <timer
-                start-time="vm.agents[value].voiceStatusTime"
-                interval="1000"
-                ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
-              >
-                {{hhours}}:{{mminutes}}:{{sseconds}}</timer
-              >
-            </span>
-          </div>
-        </td>
-
-        <td class="bt bl" ng-if="vm.license.chat">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].chatStatus]"
-                >{{ vm.agents[value].chatStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          md-number
-          class="bt text-center font-size-20"
-          ng-if="vm.license.chat"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].chatStatus]"
-        >
-          {{ vm.agents[value].chatCurrentCapacity }}
-        </td>
-
-        <td class="bl bt" ng-if="vm.license.mail">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].mailStatus]"
-                >{{ vm.agents[value].mailStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.mail"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].mailStatus]"
-        >
-          {{ vm.agents[value].mailCurrentCapacity }}
-        </td>
-
-        <td class="bl bt" ng-if="vm.license.messaging">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].smsStatus]"
-                >{{ vm.agents[value].smsStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.messaging"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].smsStatus]"
-        >
-          {{ vm.agents[value].smsCurrentCapacity }}
-        </td>
-
-        <td class="bt bl" ng-if="vm.license.openchannel">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].openchannelStatus]"
-                >{{ vm.agents[value].openchannelStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.openchannel"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].openchannelStatus]"
-        >
-          {{ vm.agents[value].openchannelCurrentCapacity }}
-        </td>
-
-        <td class="bt bl" ng-if="vm.license.fax">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].faxStatus]"
-                >{{ vm.agents[value].faxStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.fax"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].faxStatus]"
-        >
-          {{ vm.agents[value].faxCurrentCapacity }}
-        </td>
-
-        <td class="bl bt" ng-if="vm.license.whatsapp">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].whatsappStatus]"
-                >{{ vm.agents[value].whatsappStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.whatsapp"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].whatsappStatus]"
-        >
-          {{ vm.agents[value].whatsappCurrentCapacity }}
-        </td>
-
-        <td
-          class="bl bt padding-5 text-center"
-          ng-if="vm.crudPermissions.canEdit"
-        >
-          <md-menu>
-            <md-button
-              class="md-icon-button"
-              aria-label="More"
-              translate
-              translate-attr-aria-label="STAFF.MORE"
-              ng-click="$mdMenu.open($event)"
-            >
-              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-            </md-button>
-
-            <md-menu-content width="4">
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.logout(vm.agents[value], $event)"
-                  translate="FAX.LOGOUT"
-                >
-                  Logout
-                </md-button>
-              </md-menu-item>
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.queueAdd(vm.agents[value], $event)"
-                  translate="FAX.AGENTADD_QUEUE"
-                >
-                  Add Agent In Queue
-                </md-button>
-              </md-menu-item>
-
-              <md-menu-item
-                ng-if="vm.license.screenrecording && vm.agents[value].phoneBarEnableScreenRecordingByAgent"
-              >
-                <md-menu>
-                  <md-button
-                    ng-click="$mdMenu.open()"
-                    class="text-capitalize"
-                    translate="FAX.SCREENRECORDING"
-                    >Screen Recording
-                  </md-button>
-                  <md-menu-content>
-                    <md-menu-item ng-if="!vm.agents[value].screenrecording">
-                      <md-button
-                        ng-click="vm.screenRecording(vm.agents[value], true)"
-                        ><em translate="FAX.START_SCREENRECORDING"
-                          >Start Screen Recording</em
-                        ></md-button
-                      >
-                    </md-menu-item>
-                    <md-menu-item ng-if="vm.agents[value].screenrecording">
-                      <md-button
-                        ng-click="vm.screenRecording(vm.agents[value], false)"
-                        ><em translate="FAX.STOP_SCREENRECORDING"
-                          >Stop Screen Recording</em
-                        ></md-button
-                      >
-                    </md-menu-item>
-                  </md-menu-content>
-                </md-menu>
-              </md-menu-item>
-
-              <md-menu-item>
-                <md-menu>
-                  <md-button
-                    ng-click="$mdMenu.open()"
-                    class="text-capitalize"
-                    translate="FAX.PAUSE"
-                    >Pause</md-button
-                  >
-                  <md-menu-content>
-                    <md-menu-item>
-                      <md-button
-                        ng-disabled=" vm.agents[value].voicePause && 'DEFAULT PAUSE' === vm.agents[value].pauseType"
-                        ng-click="vm.pause(vm.agents[value])"
-                        ><em translate="FAX.DEFAULT_PAUSE"
-                          >Default Pause</em
-                        ></md-button
-                      >
-                    </md-menu-item>
-                    <md-menu-item
-                      ng-if="vm.pauses.rows.length"
-                      ng-repeat="pause in vm.pauses.rows"
-                    >
-                      <md-button
-                        ng-disabled="vm.agents[value].voicePause && pause.name === vm.agents[value].pauseType"
-                        ng-click="vm.pause(vm.agents[value], pause.name)"
-                        >{{pause.name}}
-                      </md-button>
-                    </md-menu-item>
-                  </md-menu-content>
-                </md-menu>
-              </md-menu-item>
-              <md-menu-item ng-if="vm.isPause(vm.agents[value].globalStatus)">
-                <md-button
-                  ng-click="vm.unPause(vm.agents[value])"
-                  translate="FAX.UNPAUSE"
-                >
-                  Unpause
-                </md-button>
-              </md-menu-item>
-            </md-menu-content>
-          </md-menu>
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</md-table-container>
-
-<md-table-pagination
-  md-label="{page: '{{'FAX.PAGE' | translate}}:', rowsPerPage: '{{'FAX.ROWSPERPAGE' | translate}}:', of: '{{'FAX.OF' | translate}}'}"
-  md-limit="vm.query.limit"
-  md-limit-options="[10, 15, 20, 50, 100, 250]"
-  md-page="vm.query.page"
-  md-total="{{vm.filteredAgents.length}}"
-  md-on-paginate="vm.onInit"
-  md-page-select
-></md-table-pagination>
-<!-- / AGENT TABLE -->
-<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/fax/views/realtime/agents/view.html/view.html b/public/src/js/modules/main/apps/fax/views/realtime/agents/view.html/view.html
new file mode 100644
index 0000000..37cd28d
--- /dev/null
+++ b/public/src/js/modules/main/apps/fax/views/realtime/agents/view.html/view.html
@@ -0,0 +1,515 @@
+<!-- MAIN -->
+<md-toolbar class="md-table-toolbar md-default">
+  <div class="md-toolbar-tools">
+    <span class="md-subhead" translate="FAX.AGENTS">Agents</span>
+    <div flex></div>
+    <ms-search-bar
+      on-search="vm.query.filter = query; vm.onInit()"
+      on-collapse="vm.query.filter = undefined; vm.onInit()"
+      debounce="300"
+    ></ms-search-bar>
+    <md-select
+      ng-model="vm.query.globalStatusFilter"
+      class="md-caption"
+      ng-change="vm.query.pauseTypeFilter = ''; vm.onInit()"
+    >
+      <md-option ng-value="''">{{ 'FAX.ALL' | translate }}</md-option>
+      <md-option value="pause">{{ 'FAX.PAUSE' | translate }}</md-option>
+      <md-option value="*pause">{{ 'FAX.PARTIALPAUSE' | translate }}</md-option>
+      <md-option value="busy">{{ 'FAX.BUSY' | translate }}</md-option>
+      <md-option value="idle">{{ 'FAX.IDLE' | translate }}</md-option>
+    </md-select>
+
+    <md-select
+      ng-if="vm.isPause(vm.query.globalStatusFilter)"
+      ng-model="vm.query.pauseTypeFilter"
+      class="md-caption"
+      ng-change="vm.onInit()"
+    >
+      <md-option ng-value="''">All</md-option>
+      <md-option value="DEFAULT PAUSE">DEFAULT PAUSE</md-option>
+      <md-option value="ACW">ACW</md-option>
+      <md-option value="LOGININPAUSE">LOGININPAUSE</md-option>
+      <md-option value="Auto-Pause">AUTOPAUSE</md-option>
+      <md-option ng-value="pause.name" ng-repeat="pause in vm.pauses.rows"
+        >{{pause.name}}</md-option
+      >
+    </md-select>
+  </div>
+</md-toolbar>
+
+<!-- AGENT TABLE -->
+<md-table-container>
+  <table md-table multiple md-progress="vm.promise">
+    <thead md-head md-order="vm.query.order" md-on-reorder="vm.onInit">
+      <tr md-row border="1">
+        <th class="bv text-center" colspan="5">
+          {{ 'FAX.AGENT' | translate }}
+        </th>
+        <th class="bv bl text-center" colspan="2">
+          {{ 'VOICE.VOICE' | translate }}
+        </th>
+        <th ng-if="vm.license.chat" class="bv bl text-center" colspan="2">
+          {{ 'CHAT.CHAT' | translate }}
+        </th>
+        <th ng-if="vm.license.mail" class="bv bl text-center" colspan="2">
+          {{ 'MAIL.MAIL' | translate }}
+        </th>
+        <th ng-if="vm.license.messaging" class="bv bl text-center" colspan="2">
+          {{ 'SMS.SMS' | translate }}
+        </th>
+        <th
+          ng-if="vm.license.openchannel"
+          class="bv bl text-center"
+          colspan="2"
+        >
+          {{ 'OPENCHANNEL.OPENCHANNEL' | translate }}
+        </th>
+        <th ng-if="vm.license.fax" class="bv bl text-center" colspan="2">
+          {{ 'FAX.FAX' | translate }}
+        </th>
+        <th ng-if="vm.license.whatsapp" class="bv bl text-center" colspan="2">
+          {{ 'WHATSAPP.WHATSAPP' | translate }}
+        </th>
+        <th width="10px" class="bt bl" rowspan="2"></th>
+      </tr>
+      <tr md-row>
+        <th class="bl" colspan="2" md-column md-order-by="fullname">
+          {{ 'FAX.NAME' | translate }}
+        </th>
+        <th class="bl custom-column" md-column md-order-by="globalStatus">
+          {{ 'FAX.STATUS' | translate }}
+        </th>
+        <th class="bl custom-column" md-column md-order-by="lastLoginAt">
+          {{ 'FAX.LOGIN_TIME' | translate }}
+        </th>
+        <th class="bl custom-column" md-column md-order-by="lastPauseAt">
+          {{ 'FAX.PAUSE_TIME' | translate }}
+        </th>
+
+        <th class="bl custom-column">{{ 'VOICE.STATUS' | translate }}</th>
+        <th class="bl custom-column">Info</th>
+
+        <th ng-if="vm.license.chat" class="bl text-center">
+          {{ 'CHAT.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.chat" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'CHAT.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.mail" class="bl text-center">
+          {{ 'MAIL.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.mail" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'MAIL.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.messaging" class="bl text-center">
+          {{ 'SMS.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.messaging" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'SMS.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.openchannel" class="bl text-center">
+          {{ 'OPENCHANNEL.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.openchannel" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'OPENCHANNEL.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.fax" class="bl text-center">
+          {{ 'FAX.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.fax" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'FAX.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.whatsapp" class="bl text-center">
+          {{ 'WHATSAPP.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.whatsapp" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'WHATSAPP.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+      </tr>
+    </thead>
+    <tbody md-body>
+      <tr md-row ng-hide="vm.order.length">
+        <td md-cell colspan="19">
+          <div layout="row" layout-align="center center">
+            <span>{{ 'FAX.NO_AGENT_ONLINE' | translate }}</span>
+          </div>
+        </td>
+      </tr>
+      <tr
+        md-select="vm.agents[value]"
+        md-select-id="id"
+        ng-repeat="(id, value) in vm.order"
+      >
+        <td class="bt padding-5">
+          <div layout="row" layout-align="start center">
+            <img
+              class="avatar"
+              ng-src="{{vm.agents[value].userpic && 'api/users/'+vm.agents[value].id+'/avatar' || 'assets/images/avatars/profile.png'}}"
+            />
+            <div layout="column">
+              <span>{{vm.agents[value].fullname}}</span>
+              <span>{{vm.agents[value].internal}}</span>
+            </div>
+          </div>
+        </td>
+        <td class="bt padding-5">
+          <div
+            layout="row"
+            layout-align="start center"
+            ng-if="vm.license.screenrecording && (vm.agents[value].phoneBarEnableScreenRecordingByAgent || vm.agents[value].phoneBarEnableAutomaticScreenRecording)"
+          >
+            <div class="column" ng-if="vm.agents[value].screenrecording">
+              <span>
+                <md-icon
+                  md-font-icon="icon-camcorder-box"
+                  style="color: green; font-size: 36px"
+                  aria-label="icon-camcorder-box26"
+                >
+                  <md-tooltip>
+                    {{ 'FAX.TOOLTIP_SCREENRECORDING_ON' | translate }}
+                  </md-tooltip>
+                </md-icon>
+              </span>
+            </div>
+            <div class="column" ng-if="!vm.agents[value].screenrecording">
+              <span>
+                <md-icon
+                  md-font-icon="icon-camcorder-box"
+                  style="color: gray"
+                  aria-label="icon-camcorder-box26"
+                >
+                  <md-tooltip>
+                    {{ 'FAX.TOOLTIP_SCREENRECORDING_OFF' | translate }}
+                  </md-tooltip>
+                </md-icon>
+              </span>
+            </div>
+          </div>
+        </td>
+
+        <td class="bt">
+          <span
+            class="text-boxed md-background-bg bl bt padding-5"
+            ng-class="{'idle':'lime-300-bg','busy':'indigo-100-bg','*pause':'amber-50-bg','pause':'amber-200-bg'}[vm.agents[value].globalStatus]"
+            >{{ vm.isPause(vm.agents[value].globalStatus) ? '' :
+            vm.agents[value].globalStatus | uppercase }} {{
+            vm.isPause(vm.agents[value].globalStatus) ?
+            (vm.isPartialPause(vm.agents[value].globalStatus) ?
+            '*'+vm.agents[value].pauseType || 'DEFAULT PAUSE' :
+            vm.agents[value].pauseType || 'DEFAULT PAUSE') : ''}}</span
+          >
+        </td>
+        <td class="bt custom-column">
+          <timer start-time="vm.agents[value].lastLoginAt" interval="1000"
+            >{{ days > 0 ? days + 'd' : '' }}
+            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
+          >
+        </td>
+        <td class="bt custom-column">
+          <timer
+            ng-if="vm.isPause(vm.agents[value].globalStatus) || vm.isPartialPause(vm.agents[value].globalStatus)"
+            start-time="vm.agents[value].lastPauseAt"
+            interval="1000"
+            >{{ days > 0 ? days + 'd' : '' }}
+            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
+          >
+        </td>
+        <td class="bt bl">
+          <div layout="row">
+            <span
+              ng-if="!vm.agents[value].onhold"
+              class="text-boxed md-background-bg bl bt padding-5"
+              ng-class="{'idle':'lime-300-bg','talking':'indigo-100-bg','ringing':'orange-400-bg','pause':'amber-200-bg'}[vm.agents[value].voiceStatus]"
+              >{{ vm.agents[value].voiceStatus | uppercase }}</span
+            >
+            <span
+              ng-if="vm.agents[value].onhold"
+              class="text-boxed md-background-bg bl bt padding-5 orange-400-bg"
+              >ONHOLD</span
+            >
+          </div>
+        </td>
+        <td class="bt bl">
+          <div layout="column">
+            <span
+              ng-if="vm.agents[value].queue"
+              class="padding-5"
+              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
+              >{{ vm.agents[value].queue }}</span
+            >
+            <span
+              ng-if="vm.agents[value].destconnectedlinenum"
+              class="padding-5"
+              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
+              >{{ vm.agents[value].destconnectedlinenum }}</span
+            >
+            <span
+              class="padding-5"
+              ng-if="vm.agents[value].queue || vm.agents[value].destconnectedlinenum"
+            >
+              <timer
+                start-time="vm.agents[value].voiceStatusTime"
+                interval="1000"
+                ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
+              >
+                {{hhours}}:{{mminutes}}:{{sseconds}}</timer
+              >
+            </span>
+          </div>
+        </td>
+
+        <td class="bt bl" ng-if="vm.license.chat">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].chatStatus]"
+                >{{ vm.agents[value].chatStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          md-number
+          class="bt text-center font-size-20"
+          ng-if="vm.license.chat"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].chatStatus]"
+        >
+          {{ vm.agents[value].chatCurrentCapacity }}
+        </td>
+
+        <td class="bl bt" ng-if="vm.license.mail">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].mailStatus]"
+                >{{ vm.agents[value].mailStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.mail"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].mailStatus]"
+        >
+          {{ vm.agents[value].mailCurrentCapacity }}
+        </td>
+
+        <td class="bl bt" ng-if="vm.license.messaging">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].smsStatus]"
+                >{{ vm.agents[value].smsStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.messaging"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].smsStatus]"
+        >
+          {{ vm.agents[value].smsCurrentCapacity }}
+        </td>
+
+        <td class="bt bl" ng-if="vm.license.openchannel">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].openchannelStatus]"
+                >{{ vm.agents[value].openchannelStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.openchannel"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].openchannelStatus]"
+        >
+          {{ vm.agents[value].openchannelCurrentCapacity }}
+        </td>
+
+        <td class="bt bl" ng-if="vm.license.fax">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].faxStatus]"
+                >{{ vm.agents[value].faxStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.fax"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].faxStatus]"
+        >
+          {{ vm.agents[value].faxCurrentCapacity }}
+        </td>
+
+        <td class="bl bt" ng-if="vm.license.whatsapp">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].whatsappStatus]"
+                >{{ vm.agents[value].whatsappStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.whatsapp"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].whatsappStatus]"
+        >
+          {{ vm.agents[value].whatsappCurrentCapacity }}
+        </td>
+
+        <td
+          class="bl bt padding-5 text-center"
+          ng-if="vm.crudPermissions.canEdit"
+        >
+          <md-menu>
+            <md-button
+              class="md-icon-button"
+              aria-label="More"
+              translate
+              translate-attr-aria-label="STAFF.MORE"
+              ng-click="$mdMenu.open($event)"
+            >
+              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+            </md-button>
+
+            <md-menu-content width="4">
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.logout(vm.agents[value], $event)"
+                  translate="FAX.LOGOUT"
+                >
+                  Logout
+                </md-button>
+              </md-menu-item>
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.queueAdd(vm.agents[value], $event)"
+                  translate="FAX.AGENTADD_QUEUE"
+                >
+                  Add Agent In Queue
+                </md-button>
+              </md-menu-item>
+
+              <md-menu-item
+                ng-if="vm.license.screenrecording && vm.agents[value].phoneBarEnableScreenRecordingByAgent"
+              >
+                <md-menu>
+                  <md-button
+                    ng-click="$mdMenu.open()"
+                    class="text-capitalize"
+                    translate="FAX.SCREENRECORDING"
+                    >Screen Recording
+                  </md-button>
+                  <md-menu-content>
+                    <md-menu-item ng-if="!vm.agents[value].screenrecording">
+                      <md-button
+                        ng-click="vm.screenRecording(vm.agents[value], true)"
+                        ><em translate="FAX.START_SCREENRECORDING"
+                          >Start Screen Recording</em
+                        ></md-button
+                      >
+                    </md-menu-item>
+                    <md-menu-item ng-if="vm.agents[value].screenrecording">
+                      <md-button
+                        ng-click="vm.screenRecording(vm.agents[value], false)"
+                        ><em translate="FAX.STOP_SCREENRECORDING"
+                          >Stop Screen Recording</em
+                        ></md-button
+                      >
+                    </md-menu-item>
+                  </md-menu-content>
+                </md-menu>
+              </md-menu-item>
+
+              <md-menu-item>
+                <md-menu>
+                  <md-button
+                    ng-click="$mdMenu.open()"
+                    class="text-capitalize"
+                    translate="FAX.PAUSE"
+                    >Pause</md-button
+                  >
+                  <md-menu-content>
+                    <md-menu-item>
+                      <md-button
+                        ng-disabled=" vm.agents[value].voicePause && 'DEFAULT PAUSE' === vm.agents[value].pauseType"
+                        ng-click="vm.pause(vm.agents[value])"
+                        ><em translate="FAX.DEFAULT_PAUSE"
+                          >Default Pause</em
+                        ></md-button
+                      >
+                    </md-menu-item>
+                    <md-menu-item
+                      ng-if="vm.pauses.rows.length"
+                      ng-repeat="pause in vm.pauses.rows"
+                    >
+                      <md-button
+                        ng-disabled="vm.agents[value].voicePause && pause.name === vm.agents[value].pauseType"
+                        ng-click="vm.pause(vm.agents[value], pause.name)"
+                        >{{pause.name}}
+                      </md-button>
+                    </md-menu-item>
+                  </md-menu-content>
+                </md-menu>
+              </md-menu-item>
+              <md-menu-item ng-if="vm.isPause(vm.agents[value].globalStatus)">
+                <md-button
+                  ng-click="vm.unPause(vm.agents[value])"
+                  translate="FAX.UNPAUSE"
+                >
+                  Unpause
+                </md-button>
+              </md-menu-item>
+            </md-menu-content>
+          </md-menu>
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</md-table-container>
+
+<md-table-pagination
+  md-label="{page: '{{'FAX.PAGE' | translate}}:', rowsPerPage: '{{'FAX.ROWSPERPAGE' | translate}}:', of: '{{'FAX.OF' | translate}}'}"
+  md-limit="vm.query.limit"
+  md-limit-options="[10, 15, 20, 50, 100, 250]"
+  md-page="vm.query.page"
+  md-total="{{vm.filteredAgents.length}}"
+  md-on-paginate="vm.onInit"
+  md-page-select
+></md-table-pagination>
+<!-- / AGENT TABLE -->
+<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/fax/views/realtime/queues/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/fax/views/realtime/queues/view.html/view-[chunkhash].html
deleted file mode 100644
index 814e79a..0000000
--- a/public/src/js/modules/main/apps/fax/views/realtime/queues/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,110 +0,0 @@
-<!-- MAIN -->
-<md-toolbar class="md-table-toolbar md-default">
-  <div class="md-toolbar-tools">
-    <span class="md-subhead" translate="FAX.QUEUES">Queues</span>
-    <div flex></div>
-    <ms-search-bar
-      on-search="vm.query.filter = query;"
-      on-collapse="vm.query.filter = undefined;"
-      debounce="300"
-    ></ms-search-bar>
-  </div>
-</md-toolbar>
-
-<!-- QUEUE TABLE -->
-<md-table-container>
-  <table md-table multiple md-progress="vm.promise">
-    <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getQueues">
-      <tr md-row>
-        <th md-column md-order-by="name">{{ 'FAX.NAME' | translate }}</th>
-        <th md-column>{{ 'FAX.LOGGED_IN' | translate }}</th>
-        <th md-column>{{ 'FAX.PAUSED' | translate }}</th>
-        <th md-column>{{ 'FAX.READY' | translate }}</th>
-        <th md-column>{{ 'FAX.WAITING' | translate }}</th>
-        <th md-column width="10px"></th>
-      </tr>
-    </thead>
-    <tbody md-body>
-      <tr md-row ng-hide="vm.queues">
-        <td md-cell colspan="7">
-          <div layout="row" layout-align="center center">
-            <span translate="FAX.NO_AVAILABLE_INFO">No Available Info</span>
-          </div>
-        </td>
-      </tr>
-      <tr
-        md-row
-        md-select="vm.queues[value]"
-        md-select-id="id"
-        ng-repeat="(id, value) in vm.order"
-      >
-        <td md-cell>{{vm.queues[value].name}}</td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{vm.queues[value].loggedInDb || 0}} ({{vm.queues[value].loggedIn
-            || 0}})</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{vm.queues[value].paused || 0}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-16 grey-fg"
-            >{{vm.queues[value].available || 0}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{vm.queues[value].waiting || 0}}</span
-          >
-        </td>
-        <td md-cell class="actions" ng-if="vm.crudPermissions.canEdit">
-          <md-menu>
-            <md-button
-              class="md-icon-button"
-              aria-label="More"
-              translate
-              translate-attr-aria-label="FAX.MORE"
-              ng-click="$mdMenu.open($event)"
-            >
-              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-            </md-button>
-
-            <md-menu-content width="3">
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.createOrEditFaxQueue($event, vm.queues[value])"
-                  translate="FAX.EDIT_QUEUE"
-                >
-                  Edit Queue
-                </md-button>
-              </md-menu-item>
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.agentAdd($event, vm.queues[value])"
-                  translate="FAX.AGENTSADD_QUEUE"
-                >
-                  Add Agents to queue
-                </md-button>
-              </md-menu-item>
-            </md-menu-content>
-          </md-menu>
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</md-table-container>
-
-<md-table-pagination
-  md-label="{page: '{{'FAX.PAGE' | translate}}:', rowsPerPage: '{{'FAX.ROWSPERPAGE' | translate}}:', of: '{{'FAX.OF' | translate}}'}"
-  md-limit="vm.query.limit"
-  md-limit-options="[10, 15, 20, 50, 100, 250]"
-  md-page="vm.query.page"
-  md-total="{{vm.count}}"
-  md-on-paginate="vm.getQueues"
-  md-page-select
-></md-table-pagination>
-<!-- / QUEUE TABLE -->
-<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/fax/views/realtime/queues/view.html/view.html b/public/src/js/modules/main/apps/fax/views/realtime/queues/view.html/view.html
new file mode 100644
index 0000000..814e79a
--- /dev/null
+++ b/public/src/js/modules/main/apps/fax/views/realtime/queues/view.html/view.html
@@ -0,0 +1,110 @@
+<!-- MAIN -->
+<md-toolbar class="md-table-toolbar md-default">
+  <div class="md-toolbar-tools">
+    <span class="md-subhead" translate="FAX.QUEUES">Queues</span>
+    <div flex></div>
+    <ms-search-bar
+      on-search="vm.query.filter = query;"
+      on-collapse="vm.query.filter = undefined;"
+      debounce="300"
+    ></ms-search-bar>
+  </div>
+</md-toolbar>
+
+<!-- QUEUE TABLE -->
+<md-table-container>
+  <table md-table multiple md-progress="vm.promise">
+    <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getQueues">
+      <tr md-row>
+        <th md-column md-order-by="name">{{ 'FAX.NAME' | translate }}</th>
+        <th md-column>{{ 'FAX.LOGGED_IN' | translate }}</th>
+        <th md-column>{{ 'FAX.PAUSED' | translate }}</th>
+        <th md-column>{{ 'FAX.READY' | translate }}</th>
+        <th md-column>{{ 'FAX.WAITING' | translate }}</th>
+        <th md-column width="10px"></th>
+      </tr>
+    </thead>
+    <tbody md-body>
+      <tr md-row ng-hide="vm.queues">
+        <td md-cell colspan="7">
+          <div layout="row" layout-align="center center">
+            <span translate="FAX.NO_AVAILABLE_INFO">No Available Info</span>
+          </div>
+        </td>
+      </tr>
+      <tr
+        md-row
+        md-select="vm.queues[value]"
+        md-select-id="id"
+        ng-repeat="(id, value) in vm.order"
+      >
+        <td md-cell>{{vm.queues[value].name}}</td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{vm.queues[value].loggedInDb || 0}} ({{vm.queues[value].loggedIn
+            || 0}})</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{vm.queues[value].paused || 0}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-16 grey-fg"
+            >{{vm.queues[value].available || 0}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{vm.queues[value].waiting || 0}}</span
+          >
+        </td>
+        <td md-cell class="actions" ng-if="vm.crudPermissions.canEdit">
+          <md-menu>
+            <md-button
+              class="md-icon-button"
+              aria-label="More"
+              translate
+              translate-attr-aria-label="FAX.MORE"
+              ng-click="$mdMenu.open($event)"
+            >
+              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+            </md-button>
+
+            <md-menu-content width="3">
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.createOrEditFaxQueue($event, vm.queues[value])"
+                  translate="FAX.EDIT_QUEUE"
+                >
+                  Edit Queue
+                </md-button>
+              </md-menu-item>
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.agentAdd($event, vm.queues[value])"
+                  translate="FAX.AGENTSADD_QUEUE"
+                >
+                  Add Agents to queue
+                </md-button>
+              </md-menu-item>
+            </md-menu-content>
+          </md-menu>
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</md-table-container>
+
+<md-table-pagination
+  md-label="{page: '{{'FAX.PAGE' | translate}}:', rowsPerPage: '{{'FAX.ROWSPERPAGE' | translate}}:', of: '{{'FAX.OF' | translate}}'}"
+  md-limit="vm.query.limit"
+  md-limit-options="[10, 15, 20, 50, 100, 250]"
+  md-page="vm.query.page"
+  md-total="{{vm.count}}"
+  md-on-paginate="vm.getQueues"
+  md-page-select
+></md-table-pagination>
+<!-- / QUEUE TABLE -->
+<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/fax/views/realtime/realtime.html/realtime-[chunkhash].html b/public/src/js/modules/main/apps/fax/views/realtime/realtime.html/realtime-[chunkhash].html
deleted file mode 100644
index b07256f..0000000
--- a/public/src/js/modules/main/apps/fax/views/realtime/realtime.html/realtime-[chunkhash].html
+++ /dev/null
@@ -1,36 +0,0 @@
-<div id="realtime" class="page-layout simple tabbed" layout="column" ng-cloak>
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="FAX.AGENTS">Agents</span>
-        </md-tab-label>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="FAX.TRUNKS">Trunks</span>
-        </md-tab-label>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="FAX.QUEUES">Queues</span>
-        </md-tab-label>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="FAX.ACCOUNTS">Accounts</span>
-        </md-tab-label>
-      </md-tab>
-    </md-tabs>
-
-    <md-card ui-view></md-card>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/fax/views/realtime/realtime.html/realtime.html b/public/src/js/modules/main/apps/fax/views/realtime/realtime.html/realtime.html
new file mode 100644
index 0000000..b07256f
--- /dev/null
+++ b/public/src/js/modules/main/apps/fax/views/realtime/realtime.html/realtime.html
@@ -0,0 +1,36 @@
+<div id="realtime" class="page-layout simple tabbed" layout="column" ng-cloak>
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="FAX.AGENTS">Agents</span>
+        </md-tab-label>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="FAX.TRUNKS">Trunks</span>
+        </md-tab-label>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="FAX.QUEUES">Queues</span>
+        </md-tab-label>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="FAX.ACCOUNTS">Accounts</span>
+        </md-tab-label>
+      </md-tab>
+    </md-tabs>
+
+    <md-card ui-view></md-card>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/fax/views/realtime/trunks/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/fax/views/realtime/trunks/view.html/view-[chunkhash].html
deleted file mode 100644
index 70e193b..0000000
--- a/public/src/js/modules/main/apps/fax/views/realtime/trunks/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,111 +0,0 @@
-<!-- MAIN -->
-<md-toolbar class="md-table-toolbar md-default">
-  <div class="md-toolbar-tools">
-    <span class="md-subhead" translate="FAX.TRUNKS">Telephones</span>
-    <div flex></div>
-    <ms-search-bar
-      on-search="vm.query.filter = query;"
-      on-collapse="vm.query.filter = undefined;"
-      debounce="300"
-    ></ms-search-bar>
-    <!-- <md-button class="md-icon-button" ng-click="vm.showInfo($event)">
-      <i class="icon-information-outline grey-600-fg">
-        <md-tooltip>{{'FAX.INFO' | translate}}</md-tooltip>
-      </i>
-    </md-button> -->
-  </div>
-</md-toolbar>
-
-<!-- TRUNKS TABLE -->
-<md-table-container>
-  <table md-table multiple md-progress="vm.promise">
-    <thead md-head>
-      <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getTrunks">
-        <tr md-row>
-          <th md-column md-order-by="name">{{ 'FAX.NAME' | translate }}</th>
-          <th md-column>{{ 'FAX.TRUNK_STATUS' | translate }}</th>
-          <th md-column>{{ 'FAX.REGISTRY' | translate }}</th>
-          <th md-column width="10px"></th>
-        </tr>
-      </thead>
-    </thead>
-
-    <tbody md-body>
-      <tr md-row ng-hide="vm.trunks">
-        <td md-cell colspan="3">
-          <div layout="row" layout-align="center center">
-            <span translate="FAX.NO_AVAILABLE_INFO">No Available Info</span>
-          </div>
-        </td>
-      </tr>
-      <tr md-row ng-repeat="(id, trunk) in vm.trunks">
-        <td md-cell>{{trunk.name}}</td>
-        <td md-cell>
-          <i ng-class="vm.statusClass[trunk.status.toLowerCase()]">
-            <md-tooltip
-              >{{'FAX.' + trunk.status | uppercase | translate}}</md-tooltip
-            >
-          </i>
-          <span ng-if="trunk.status === 'registered'" class="text-boxed"
-            >{{trunk.address}}</span
-          >
-        </td>
-        <td md-cell>
-          <i
-            ng-if="trunk.registry"
-            ng-class="(trunk.stateRegistry.toLowerCase() === 'registered') ? 'green-300-fg icon-checkbox-marked-circle' : 'red-300-fg icon-close-circle'"
-          >
-            <md-tooltip
-              >{{'FAX.' + trunk.stateRegistry | uppercase |
-              translate}}</md-tooltip
-            >
-          </i>
-          <span
-            ng-if="trunk.registry && trunk.host && trunk.port"
-            class="text-boxed"
-            >{{trunk.host}}:{{trunk.port}}</span
-          >
-          <span ng-if="!trunk.registry" translate="FAX.NO_REGISTRY">
-            No Registry
-          </span>
-        </td>
-        <td md-cell class="actions" ng-if="vm.crudPermissions.canEdit">
-          <md-menu>
-            <md-button
-              class="md-icon-button"
-              aria-label="More"
-              translate
-              translate-attr-aria-label="STAFF.MORE"
-              ng-click="$mdMenu.open($event)"
-            >
-              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-            </md-button>
-
-            <md-menu-content width="4">
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.goToTrunk($event, trunk)"
-                  translate="FAX.EDIT_TRUNK"
-                >
-                  Edit Trunk
-                </md-button>
-              </md-menu-item>
-            </md-menu-content>
-          </md-menu>
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</md-table-container>
-
-<md-table-pagination
-  md-label="{page: '{{'FAX.PAGE' | translate}}:', rowsPerPage: '{{'FAX.ROWSPERPAGE' | translate}}:', of: '{{'FAX.OF' | translate}}'}"
-  md-limit="vm.query.limit"
-  md-limit-options="[10, 15, 20, 50, 100, 250]"
-  md-page="vm.query.page"
-  md-total="{{vm.count}}"
-  md-on-paginate="vm.getTrunks"
-  md-page-select
-></md-table-pagination>
-<!-- / TRUNKS TABLE -->
-<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/fax/views/realtime/trunks/view.html/view.html b/public/src/js/modules/main/apps/fax/views/realtime/trunks/view.html/view.html
new file mode 100644
index 0000000..70e193b
--- /dev/null
+++ b/public/src/js/modules/main/apps/fax/views/realtime/trunks/view.html/view.html
@@ -0,0 +1,111 @@
+<!-- MAIN -->
+<md-toolbar class="md-table-toolbar md-default">
+  <div class="md-toolbar-tools">
+    <span class="md-subhead" translate="FAX.TRUNKS">Telephones</span>
+    <div flex></div>
+    <ms-search-bar
+      on-search="vm.query.filter = query;"
+      on-collapse="vm.query.filter = undefined;"
+      debounce="300"
+    ></ms-search-bar>
+    <!-- <md-button class="md-icon-button" ng-click="vm.showInfo($event)">
+      <i class="icon-information-outline grey-600-fg">
+        <md-tooltip>{{'FAX.INFO' | translate}}</md-tooltip>
+      </i>
+    </md-button> -->
+  </div>
+</md-toolbar>
+
+<!-- TRUNKS TABLE -->
+<md-table-container>
+  <table md-table multiple md-progress="vm.promise">
+    <thead md-head>
+      <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getTrunks">
+        <tr md-row>
+          <th md-column md-order-by="name">{{ 'FAX.NAME' | translate }}</th>
+          <th md-column>{{ 'FAX.TRUNK_STATUS' | translate }}</th>
+          <th md-column>{{ 'FAX.REGISTRY' | translate }}</th>
+          <th md-column width="10px"></th>
+        </tr>
+      </thead>
+    </thead>
+
+    <tbody md-body>
+      <tr md-row ng-hide="vm.trunks">
+        <td md-cell colspan="3">
+          <div layout="row" layout-align="center center">
+            <span translate="FAX.NO_AVAILABLE_INFO">No Available Info</span>
+          </div>
+        </td>
+      </tr>
+      <tr md-row ng-repeat="(id, trunk) in vm.trunks">
+        <td md-cell>{{trunk.name}}</td>
+        <td md-cell>
+          <i ng-class="vm.statusClass[trunk.status.toLowerCase()]">
+            <md-tooltip
+              >{{'FAX.' + trunk.status | uppercase | translate}}</md-tooltip
+            >
+          </i>
+          <span ng-if="trunk.status === 'registered'" class="text-boxed"
+            >{{trunk.address}}</span
+          >
+        </td>
+        <td md-cell>
+          <i
+            ng-if="trunk.registry"
+            ng-class="(trunk.stateRegistry.toLowerCase() === 'registered') ? 'green-300-fg icon-checkbox-marked-circle' : 'red-300-fg icon-close-circle'"
+          >
+            <md-tooltip
+              >{{'FAX.' + trunk.stateRegistry | uppercase |
+              translate}}</md-tooltip
+            >
+          </i>
+          <span
+            ng-if="trunk.registry && trunk.host && trunk.port"
+            class="text-boxed"
+            >{{trunk.host}}:{{trunk.port}}</span
+          >
+          <span ng-if="!trunk.registry" translate="FAX.NO_REGISTRY">
+            No Registry
+          </span>
+        </td>
+        <td md-cell class="actions" ng-if="vm.crudPermissions.canEdit">
+          <md-menu>
+            <md-button
+              class="md-icon-button"
+              aria-label="More"
+              translate
+              translate-attr-aria-label="STAFF.MORE"
+              ng-click="$mdMenu.open($event)"
+            >
+              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+            </md-button>
+
+            <md-menu-content width="4">
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.goToTrunk($event, trunk)"
+                  translate="FAX.EDIT_TRUNK"
+                >
+                  Edit Trunk
+                </md-button>
+              </md-menu-item>
+            </md-menu-content>
+          </md-menu>
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</md-table-container>
+
+<md-table-pagination
+  md-label="{page: '{{'FAX.PAGE' | translate}}:', rowsPerPage: '{{'FAX.ROWSPERPAGE' | translate}}:', of: '{{'FAX.OF' | translate}}'}"
+  md-limit="vm.query.limit"
+  md-limit-options="[10, 15, 20, 50, 100, 250]"
+  md-page="vm.query.page"
+  md-total="{{vm.count}}"
+  md-on-paginate="vm.getTrunks"
+  md-page-select
+></md-table-pagination>
+<!-- / TRUNKS TABLE -->
+<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/help/views/about/about.html/about-[chunkhash].html b/public/src/js/modules/main/apps/help/views/about/about.html/about-[chunkhash].html
deleted file mode 100644
index 1c5367c..0000000
--- a/public/src/js/modules/main/apps/help/views/about/about.html/about-[chunkhash].html
+++ /dev/null
@@ -1,190 +0,0 @@
-<div id="maintenance" class="flex-scrollable" layout="column" ms-scroll>
-  <div
-    id="maintenance-form-wrapper"
-    layout="column"
-    layout-align="center center"
-  >
-    <div id="maintenance-form" class="md-whiteframe-8dp">
-      <div>
-        <img ng-src="{{vm.baseUrl}}settings/1/logo_login" alt="logo_login" />
-      </div>
-
-      <br />
-
-      <div>
-        <div class="info-line">
-          <div class="title">Useful pages</div>
-        </div>
-        <section
-          layout="row"
-          flex
-          layout-sm="column"
-          layout-align="flex-start center"
-          layout-wrap
-        >
-          <div layout="column" flex="25" layout-align="center center">
-            <a
-              class="md-fab md-mini md-button grey-bg"
-              href="https://wiki.xcallymotion.com/display/XMV"
-              target="_blank"
-            >
-              <md-icon md-font-icon="icon-wikipedia"></md-icon>
-            </a>
-            <div class="info">
-              <a
-                href="https://wiki.xcallymotion.com/display/XMV"
-                target="_blank"
-                >Wiki</a
-              >
-            </div>
-          </div>
-
-          <div layout="column" flex="25" layout-align="center center">
-            <a
-              class="md-fab md-mini md-button md-accent"
-              href="/apidoc"
-              target="_blank"
-            >
-              <md-icon md-font-icon="icon-apple-mobileme"></md-icon>
-            </a>
-            <div class="info">
-              <a href="/apidoc" target="_blank">Motion API</a>
-            </div>
-          </div>
-
-          <div layout="column" flex="25" layout-align="center center">
-            <a
-              class="md-fab md-mini md-button orange-bg"
-              href="http://www.xcally.com/bar/phonebar/Setup.msi"
-              target="_blank"
-            >
-              <md-icon md-font-icon="icon-headphones"></md-icon>
-            </a>
-            <div class="info">
-              <a
-                href="http://www.xcally.com/bar/phonebar/Setup.msi"
-                target="_blank"
-                >Phonebar Download</a
-              >
-            </div>
-          </div>
-
-          <div layout="column" flex="25" layout-align="center center">
-            <a
-              class="md-fab md-mini md-button green-bg"
-              href="/demo"
-              target="_blank"
-            >
-              <md-icon md-font-icon="icon-console"></md-icon>
-            </a>
-            <div class="info">
-              <a href="/demo" target="_blank">Playground</a>
-            </div>
-          </div>
-        </section>
-
-        <br />
-
-        <div class="info-line" ng-if="!vm.license.custom">
-          <div class="title">Follow us on</div>
-        </div>
-        <section
-          ng-if="!vm.license.custom"
-          layout="row"
-          layout-sm="column"
-          layout-align="center center"
-          layout-wrap
-        >
-          <a
-            class="md-fab md-mini md-button blue-900-bg"
-            href="https://www.facebook.com/xcallymotion"
-            target="_blank"
-          >
-            <md-icon md-font-icon="icon-facebook"></md-icon>
-          </a>
-
-          <a
-            class="md-fab md-mini md-button"
-            href="https://twitter.com/xcallymotion"
-            target="_blank"
-          >
-            <md-icon md-font-icon="icon-twitter"></md-icon>
-          </a>
-          <a
-            class="md-fab md-mini md-button md-warn"
-            href="https://plus.google.com/+Xcally"
-            target="_blank"
-          >
-            <md-icon md-font-icon="icon-google-plus"></md-icon>
-          </a>
-          <a
-            class="md-fab md-mini md-button light-blue-800-bg"
-            href="https://www.linkedin.com/company/xcally"
-            target="_blank"
-          >
-            <md-icon md-font-icon="icon-linkedin"></md-icon>
-          </a>
-        </section>
-
-        <br ng-if="!vm.license.custom" />
-
-        <div class="info-line" ng-if="!vm.license.custom">
-          <div class="title" translate="HELP.CONTACT_US">Contact Us</div>
-        </div>
-        <div class="info-line" ng-if="!vm.license.custom">
-          <div class="info">
-            <a href="mailto:[email-masked]" target="_top"
-              >[email-masked]</a
-            >
-          </div>
-        </div>
-
-        <br ng-if="!vm.license.custom" />
-
-        <div class="info">
-          xCALLY Motion <u>{{vm.info.current}}</u> |
-          <a
-            href="https://wiki.xcallymotion.com/display/XMV/Motion+GUI#MotionGUI-Version{{vm.info.current}}"
-            target="_blank"
-            >Changelog</a
-          >
-        </div>
-
-        <div class="info" style="margin-top: 1em">
-          <small>Build Date: {{vm.info.buildDate}}</small><br />
-          <small
-            >Server Build Info: branch {{vm.info.branch}}
-            ({{vm.info.shortHash}})</small
-          ><br />
-          <small
-            >Client Build Info: branch {{vm.info.client.branch}}
-            ({{vm.info.client.shortHash}})</small
-          >
-        </div>
-
-        <br />
-
-        <div class="info" ng-if="!vm.license.custom">
-          xCALLY© 2016 - 2018 | Powered by Xenialab |
-          <a
-            href="http://www.xcally.com/support/eula-xcally-license-en.pdf"
-            target="_blank"
-            >EULA</a
-          >
-        </div>
-
-        <br ng-if="!vm.license.custom" />
-
-        <div class="info" ng-if="!vm.license.custom">
-          <a href="https://www.xenialab.com/" target="_blank"
-            >www.xenialab.com</a
-          >
-          |
-          <a href="https://www.xcallymotion.com/" target="_blank"
-            >www.xcallymotion.com</a
-          >
-        </div>
-      </div>
-    </div>
-  </div>
-</div>
diff --git a/public/src/js/modules/main/apps/help/views/about/about.html/about.html b/public/src/js/modules/main/apps/help/views/about/about.html/about.html
new file mode 100644
index 0000000..1c5367c
--- /dev/null
+++ b/public/src/js/modules/main/apps/help/views/about/about.html/about.html
@@ -0,0 +1,190 @@
+<div id="maintenance" class="flex-scrollable" layout="column" ms-scroll>
+  <div
+    id="maintenance-form-wrapper"
+    layout="column"
+    layout-align="center center"
+  >
+    <div id="maintenance-form" class="md-whiteframe-8dp">
+      <div>
+        <img ng-src="{{vm.baseUrl}}settings/1/logo_login" alt="logo_login" />
+      </div>
+
+      <br />
+
+      <div>
+        <div class="info-line">
+          <div class="title">Useful pages</div>
+        </div>
+        <section
+          layout="row"
+          flex
+          layout-sm="column"
+          layout-align="flex-start center"
+          layout-wrap
+        >
+          <div layout="column" flex="25" layout-align="center center">
+            <a
+              class="md-fab md-mini md-button grey-bg"
+              href="https://wiki.xcallymotion.com/display/XMV"
+              target="_blank"
+            >
+              <md-icon md-font-icon="icon-wikipedia"></md-icon>
+            </a>
+            <div class="info">
+              <a
+                href="https://wiki.xcallymotion.com/display/XMV"
+                target="_blank"
+                >Wiki</a
+              >
+            </div>
+          </div>
+
+          <div layout="column" flex="25" layout-align="center center">
+            <a
+              class="md-fab md-mini md-button md-accent"
+              href="/apidoc"
+              target="_blank"
+            >
+              <md-icon md-font-icon="icon-apple-mobileme"></md-icon>
+            </a>
+            <div class="info">
+              <a href="/apidoc" target="_blank">Motion API</a>
+            </div>
+          </div>
+
+          <div layout="column" flex="25" layout-align="center center">
+            <a
+              class="md-fab md-mini md-button orange-bg"
+              href="http://www.xcally.com/bar/phonebar/Setup.msi"
+              target="_blank"
+            >
+              <md-icon md-font-icon="icon-headphones"></md-icon>
+            </a>
+            <div class="info">
+              <a
+                href="http://www.xcally.com/bar/phonebar/Setup.msi"
+                target="_blank"
+                >Phonebar Download</a
+              >
+            </div>
+          </div>
+
+          <div layout="column" flex="25" layout-align="center center">
+            <a
+              class="md-fab md-mini md-button green-bg"
+              href="/demo"
+              target="_blank"
+            >
+              <md-icon md-font-icon="icon-console"></md-icon>
+            </a>
+            <div class="info">
+              <a href="/demo" target="_blank">Playground</a>
+            </div>
+          </div>
+        </section>
+
+        <br />
+
+        <div class="info-line" ng-if="!vm.license.custom">
+          <div class="title">Follow us on</div>
+        </div>
+        <section
+          ng-if="!vm.license.custom"
+          layout="row"
+          layout-sm="column"
+          layout-align="center center"
+          layout-wrap
+        >
+          <a
+            class="md-fab md-mini md-button blue-900-bg"
+            href="https://www.facebook.com/xcallymotion"
+            target="_blank"
+          >
+            <md-icon md-font-icon="icon-facebook"></md-icon>
+          </a>
+
+          <a
+            class="md-fab md-mini md-button"
+            href="https://twitter.com/xcallymotion"
+            target="_blank"
+          >
+            <md-icon md-font-icon="icon-twitter"></md-icon>
+          </a>
+          <a
+            class="md-fab md-mini md-button md-warn"
+            href="https://plus.google.com/+Xcally"
+            target="_blank"
+          >
+            <md-icon md-font-icon="icon-google-plus"></md-icon>
+          </a>
+          <a
+            class="md-fab md-mini md-button light-blue-800-bg"
+            href="https://www.linkedin.com/company/xcally"
+            target="_blank"
+          >
+            <md-icon md-font-icon="icon-linkedin"></md-icon>
+          </a>
+        </section>
+
+        <br ng-if="!vm.license.custom" />
+
+        <div class="info-line" ng-if="!vm.license.custom">
+          <div class="title" translate="HELP.CONTACT_US">Contact Us</div>
+        </div>
+        <div class="info-line" ng-if="!vm.license.custom">
+          <div class="info">
+            <a href="mailto:[email-masked]" target="_top"
+              >[email-masked]</a
+            >
+          </div>
+        </div>
+
+        <br ng-if="!vm.license.custom" />
+
+        <div class="info">
+          xCALLY Motion <u>{{vm.info.current}}</u> |
+          <a
+            href="https://wiki.xcallymotion.com/display/XMV/Motion+GUI#MotionGUI-Version{{vm.info.current}}"
+            target="_blank"
+            >Changelog</a
+          >
+        </div>
+
+        <div class="info" style="margin-top: 1em">
+          <small>Build Date: {{vm.info.buildDate}}</small><br />
+          <small
+            >Server Build Info: branch {{vm.info.branch}}
+            ({{vm.info.shortHash}})</small
+          ><br />
+          <small
+            >Client Build Info: branch {{vm.info.client.branch}}
+            ({{vm.info.client.shortHash}})</small
+          >
+        </div>
+
+        <br />
+
+        <div class="info" ng-if="!vm.license.custom">
+          xCALLY© 2016 - 2018 | Powered by Xenialab |
+          <a
+            href="http://www.xcally.com/support/eula-xcally-license-en.pdf"
+            target="_blank"
+            >EULA</a
+          >
+        </div>
+
+        <br ng-if="!vm.license.custom" />
+
+        <div class="info" ng-if="!vm.license.custom">
+          <a href="https://www.xenialab.com/" target="_blank"
+            >www.xenialab.com</a
+          >
+          |
+          <a href="https://www.xcallymotion.com/" target="_blank"
+            >www.xcallymotion.com</a
+          >
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/deskAccounts/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/deskAccounts/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 9744947..0000000
--- a/public/src/js/modules/main/apps/integrations/views/deskAccounts/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,306 +0,0 @@
-<md-dialog class="deskAccount-dialog" aria-label="New DeskAccount">
-  <form name="deskAccountForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.deskAccount.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="deskAccountForm['name'].$error"
-          ng-show="deskAccountForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.TYPE">Type</label>
-        <md-select name="type" ng-model="vm.deskAccount.type" required>
-          <md-option ng-value="'integrationTab'">
-            {{ 'INTEGRATIONS.INTEGRATION_TAB' | translate }}
-          </md-option>
-
-          <md-option ng-value="'newTab'">
-            {{ 'INTEGRATIONS.NEW_TAB' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="deskAccountForm['type'].$error"
-          ng-show="deskAccountForm['type'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-              >Type field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.URI">Uri</label>
-        <input
-          type="url"
-          name="remoteUri"
-          ng-model="vm.deskAccount.remoteUri"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="deskAccountForm['remoteUri'].$error"
-          ng-show="deskAccountForm['remoteUri'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
-              >Uri field is required</span
-            >
-          </div>
-          <div ng-message="url">
-            <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
-              >Uri must be a valid url http://www.xcally.com</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.AUTHTYPE">AuthType</label>
-        <md-select name="authType" ng-model="vm.deskAccount.authType" required>
-          <md-option ng-value="'basic'">Basic</md-option>
-        </md-select>
-        <div
-          ng-messages="deskAccountForm['authType'].$error"
-          ng-show="deskAccountForm['authType'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.AUTHTYPE_REQUIRED"
-              >AuthType field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.deskAccount.authType == 'basic'"
-        class="md-block"
-      >
-        <label translate="INTEGRATIONS.USERNAME">Username</label>
-        <input
-          type="text"
-          name="username"
-          ng-model="vm.deskAccount.username"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="deskAccountForm['username'].$error"
-          ng-show="deskAccountForm['username'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
-              >Username field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        class="md-block"
-        ng-if="vm.deskAccount.authType == 'basic'"
-      >
-        <label translate="INTEGRATIONS.PASSWORD">Password</label>
-        <input
-          type="password"
-          name="password"
-          ng-model="vm.deskAccount.password"
-          placeholder="Password"
-          translate
-          translate-attr-placeholder="INTEGRATIONS.PASSWORD"
-          required
-        />
-        <div ng-messages="deskAccountForm['password'].$error" role="alert">
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.PASSWORD_REQUIRED"
-              >Password field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span translate="INTEGRATIONS.ERRORS.SECURE_PASSWORD_PATTERN"
-              >Must contain at least 8 characters, with a minimum of 1 lowercase
-              letter, 1 uppercase letter, 1 numeric character and 1 special
-              character ~!?*@#$%^&-_=+[{]}.</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
-          >MotionProxyAddress</label
-        >
-        <input
-          type="url"
-          name="serverUrl"
-          ng-model="vm.deskAccount.serverUrl"
-        />
-
-        <div class="hint">
-          <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
-        </div>
-        <div
-          ng-messages="deskAccountForm['serverUrl'].$error"
-          ng-show="deskAccountForm['serverUrl'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
-              >MotionProxyAddress field is required</span
-            >
-          </div>
-          <div ng-message="url">
-            <span
-              translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
-              >MotionProxyAddress must be a valid url
-              http://www.xcally.com</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.deskAccount.description"
-        />
-
-        <div
-          ng-messages="deskAccountForm['description'].$error"
-          ng-show="deskAccountForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newDeskAccount"
-          ng-click="vm.saveDeskAccount()"
-          class="send-button md-accent md-raised"
-          ng-disabled="deskAccountForm.$invalid || deskAccountForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newDeskAccount"
-          ng-click="vm.addNewDeskAccount()"
-          class="send-button md-accent md-raised"
-          ng-disabled="deskAccountForm.$invalid"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD_DESKACCOUNT"
-          translate-attr-aria-label="INTEGRATIONS.ADD_DESKACCOUNT"
-        >
-          ADD DESKACCOUNT
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newDeskAccount"
-          ng-click="vm.deleteDeskAccount($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/deskAccounts/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/deskAccounts/create/dialog.html/dialog.html
new file mode 100644
index 0000000..9744947
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/deskAccounts/create/dialog.html/dialog.html
@@ -0,0 +1,306 @@
+<md-dialog class="deskAccount-dialog" aria-label="New DeskAccount">
+  <form name="deskAccountForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.deskAccount.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="deskAccountForm['name'].$error"
+          ng-show="deskAccountForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.TYPE">Type</label>
+        <md-select name="type" ng-model="vm.deskAccount.type" required>
+          <md-option ng-value="'integrationTab'">
+            {{ 'INTEGRATIONS.INTEGRATION_TAB' | translate }}
+          </md-option>
+
+          <md-option ng-value="'newTab'">
+            {{ 'INTEGRATIONS.NEW_TAB' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="deskAccountForm['type'].$error"
+          ng-show="deskAccountForm['type'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+              >Type field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.URI">Uri</label>
+        <input
+          type="url"
+          name="remoteUri"
+          ng-model="vm.deskAccount.remoteUri"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="deskAccountForm['remoteUri'].$error"
+          ng-show="deskAccountForm['remoteUri'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
+              >Uri field is required</span
+            >
+          </div>
+          <div ng-message="url">
+            <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
+              >Uri must be a valid url http://www.xcally.com</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.AUTHTYPE">AuthType</label>
+        <md-select name="authType" ng-model="vm.deskAccount.authType" required>
+          <md-option ng-value="'basic'">Basic</md-option>
+        </md-select>
+        <div
+          ng-messages="deskAccountForm['authType'].$error"
+          ng-show="deskAccountForm['authType'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.AUTHTYPE_REQUIRED"
+              >AuthType field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.deskAccount.authType == 'basic'"
+        class="md-block"
+      >
+        <label translate="INTEGRATIONS.USERNAME">Username</label>
+        <input
+          type="text"
+          name="username"
+          ng-model="vm.deskAccount.username"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="deskAccountForm['username'].$error"
+          ng-show="deskAccountForm['username'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
+              >Username field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        class="md-block"
+        ng-if="vm.deskAccount.authType == 'basic'"
+      >
+        <label translate="INTEGRATIONS.PASSWORD">Password</label>
+        <input
+          type="password"
+          name="password"
+          ng-model="vm.deskAccount.password"
+          placeholder="Password"
+          translate
+          translate-attr-placeholder="INTEGRATIONS.PASSWORD"
+          required
+        />
+        <div ng-messages="deskAccountForm['password'].$error" role="alert">
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.PASSWORD_REQUIRED"
+              >Password field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span translate="INTEGRATIONS.ERRORS.SECURE_PASSWORD_PATTERN"
+              >Must contain at least 8 characters, with a minimum of 1 lowercase
+              letter, 1 uppercase letter, 1 numeric character and 1 special
+              character ~!?*@#$%^&-_=+[{]}.</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
+          >MotionProxyAddress</label
+        >
+        <input
+          type="url"
+          name="serverUrl"
+          ng-model="vm.deskAccount.serverUrl"
+        />
+
+        <div class="hint">
+          <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
+        </div>
+        <div
+          ng-messages="deskAccountForm['serverUrl'].$error"
+          ng-show="deskAccountForm['serverUrl'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
+              >MotionProxyAddress field is required</span
+            >
+          </div>
+          <div ng-message="url">
+            <span
+              translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
+              >MotionProxyAddress must be a valid url
+              http://www.xcally.com</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.deskAccount.description"
+        />
+
+        <div
+          ng-messages="deskAccountForm['description'].$error"
+          ng-show="deskAccountForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newDeskAccount"
+          ng-click="vm.saveDeskAccount()"
+          class="send-button md-accent md-raised"
+          ng-disabled="deskAccountForm.$invalid || deskAccountForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newDeskAccount"
+          ng-click="vm.addNewDeskAccount()"
+          class="send-button md-accent md-raised"
+          ng-disabled="deskAccountForm.$invalid"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD_DESKACCOUNT"
+          translate-attr-aria-label="INTEGRATIONS.ADD_DESKACCOUNT"
+        >
+          ADD DESKACCOUNT
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newDeskAccount"
+          ng-click="vm.deleteDeskAccount($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/deskAccounts/deskAccounts.html/deskAccounts-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/deskAccounts/deskAccounts.html/deskAccounts-[chunkhash].html
deleted file mode 100644
index cff5878..0000000
--- a/public/src/js/modules/main/apps/integrations/views/deskAccounts/deskAccounts.html/deskAccounts-[chunkhash].html
+++ /dev/null
@@ -1,320 +0,0 @@
-<div
-  id="deskAccounts"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-heart" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="INTEGRATIONS.DESKACCOUNTS"
-          >DeskAccounts</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="INTEGRATIONS.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedDeskAccounts.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedDeskAccounts =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="INTEGRATIONS.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-deskAccounts-count">
-          <span>{{vm.selectedDeskAccounts.length}}</span>
-          <span translate="INTEGRATIONS.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="INTEGRATIONS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllDeskAccounts()"
-                translate="INTEGRATIONS.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectDeskAccounts()"
-                translate="INTEGRATIONS.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedDeskAccounts"
-          csv-label="true"
-          filename="deskAccounts.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedDeskAccounts($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- DESKACCOUNT TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedDeskAccounts"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getDeskAccounts"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">
-                  {{ 'INTEGRATIONS.ID' | translate }}
-                </th>
-                <th md-column md-order-by="name">
-                  {{ 'INTEGRATIONS.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="remoteUri">
-                  {{ 'INTEGRATIONS.URI' | translate }}
-                </th>
-                <th md-column md-order-by="username">
-                  {{ 'INTEGRATIONS.USERNAME' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.deskAccounts.rows.length">
-                <td md-cell colspan="5">
-                  <div layout="row" layout-align="center center">
-                    <span translate="INTEGRATIONS.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="deskAccount"
-                md-select-id="id"
-                ng-repeat="deskAccount in vm.deskAccounts.rows"
-              >
-                <td md-cell ng-if="deskAccount.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{deskAccount.name}}"
-                    ng-src="api/users/{{deskAccount.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!deskAccount.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{deskAccount.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(deskAccount, ev) : vm.createOrEditDeskAccount($event, deskAccount)"
-                  md-cell
-                  class="id"
-                >
-                  {{deskAccount.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(deskAccount, ev) : vm.createOrEditDeskAccount($event, deskAccount)"
-                  md-cell
-                  class="name"
-                >
-                  {{deskAccount.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(deskAccount, ev) : vm.createOrEditDeskAccount($event, deskAccount)"
-                  md-cell
-                  class="remoteUri"
-                >
-                  {{deskAccount.remoteUri}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(deskAccount, ev) : vm.createOrEditDeskAccount($event, deskAccount)"
-                  md-cell
-                  class="username"
-                >
-                  {{deskAccount.username}}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="INTEGRATIONS.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(deskAccount, $event    )"
-                          translate="INTEGRATIONS.EDIT_DESKACCOUNT"
-                        >
-                          Edit DeskAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.testtestintegrationaccount(deskAccount, $event    )"
-                          translate="INTEGRATIONS.TEST_DESKACCOUNT"
-                        >
-                          Test DeskAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(deskAccount, $event    )"
-                          translate="INTEGRATIONS.DELETE_DESKACCOUNT"
-                        >
-                          Delete DeskAccount
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'INTEGRATIONS.PAGE' | translate}}:', rowsPerPage: '{{'INTEGRATIONS.ROWSPERPAGE' | translate}}:', of: '{{'INTEGRATIONS.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.deskAccounts.count}}"
-          md-on-paginate="vm.getDeskAccounts"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / DESKACCOUNT TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD DESKACCOUNT BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-deskAccount-button"
-    ng-click="vm.createOrEditDeskAccount($event)"
-    aria-label="add deskAccount"
-    translate
-    translate-attr-aria-label="INTEGRATIONS.ADD_DESKACCOUNT"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD DESKACCOUNT BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/deskAccounts/deskAccounts.html/deskAccounts.html b/public/src/js/modules/main/apps/integrations/views/deskAccounts/deskAccounts.html/deskAccounts.html
new file mode 100644
index 0000000..cff5878
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/deskAccounts/deskAccounts.html/deskAccounts.html
@@ -0,0 +1,320 @@
+<div
+  id="deskAccounts"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-heart" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="INTEGRATIONS.DESKACCOUNTS"
+          >DeskAccounts</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="INTEGRATIONS.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedDeskAccounts.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedDeskAccounts =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="INTEGRATIONS.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-deskAccounts-count">
+          <span>{{vm.selectedDeskAccounts.length}}</span>
+          <span translate="INTEGRATIONS.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="INTEGRATIONS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllDeskAccounts()"
+                translate="INTEGRATIONS.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectDeskAccounts()"
+                translate="INTEGRATIONS.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedDeskAccounts"
+          csv-label="true"
+          filename="deskAccounts.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedDeskAccounts($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- DESKACCOUNT TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedDeskAccounts"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getDeskAccounts"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">
+                  {{ 'INTEGRATIONS.ID' | translate }}
+                </th>
+                <th md-column md-order-by="name">
+                  {{ 'INTEGRATIONS.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="remoteUri">
+                  {{ 'INTEGRATIONS.URI' | translate }}
+                </th>
+                <th md-column md-order-by="username">
+                  {{ 'INTEGRATIONS.USERNAME' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.deskAccounts.rows.length">
+                <td md-cell colspan="5">
+                  <div layout="row" layout-align="center center">
+                    <span translate="INTEGRATIONS.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="deskAccount"
+                md-select-id="id"
+                ng-repeat="deskAccount in vm.deskAccounts.rows"
+              >
+                <td md-cell ng-if="deskAccount.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{deskAccount.name}}"
+                    ng-src="api/users/{{deskAccount.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!deskAccount.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{deskAccount.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(deskAccount, ev) : vm.createOrEditDeskAccount($event, deskAccount)"
+                  md-cell
+                  class="id"
+                >
+                  {{deskAccount.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(deskAccount, ev) : vm.createOrEditDeskAccount($event, deskAccount)"
+                  md-cell
+                  class="name"
+                >
+                  {{deskAccount.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(deskAccount, ev) : vm.createOrEditDeskAccount($event, deskAccount)"
+                  md-cell
+                  class="remoteUri"
+                >
+                  {{deskAccount.remoteUri}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(deskAccount, ev) : vm.createOrEditDeskAccount($event, deskAccount)"
+                  md-cell
+                  class="username"
+                >
+                  {{deskAccount.username}}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="INTEGRATIONS.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(deskAccount, $event    )"
+                          translate="INTEGRATIONS.EDIT_DESKACCOUNT"
+                        >
+                          Edit DeskAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.testtestintegrationaccount(deskAccount, $event    )"
+                          translate="INTEGRATIONS.TEST_DESKACCOUNT"
+                        >
+                          Test DeskAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(deskAccount, $event    )"
+                          translate="INTEGRATIONS.DELETE_DESKACCOUNT"
+                        >
+                          Delete DeskAccount
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'INTEGRATIONS.PAGE' | translate}}:', rowsPerPage: '{{'INTEGRATIONS.ROWSPERPAGE' | translate}}:', of: '{{'INTEGRATIONS.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.deskAccounts.count}}"
+          md-on-paginate="vm.getDeskAccounts"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / DESKACCOUNT TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD DESKACCOUNT BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-deskAccount-button"
+    ng-click="vm.createOrEditDeskAccount($event)"
+    aria-label="add deskAccount"
+    translate
+    translate-attr-aria-label="INTEGRATIONS.ADD_DESKACCOUNT"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD DESKACCOUNT BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/deskAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/deskAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index df50a96..0000000
--- a/public/src/js/modules/main/apps/integrations/views/deskAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,180 +0,0 @@
-<md-dialog class="deskConfiguration-dialog" aria-label="New DeskConfiguration">
-  <form name="deskConfigurationForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.NAME">Name</label>
-        <input
-          type=""
-          name="name"
-          ng-model="vm.deskConfiguration.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="deskConfigurationForm['name'].$error"
-          ng-show="deskConfigurationForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.CHANNEL">Channel</label>
-        <md-select
-          name="channel"
-          ng-model="vm.deskConfiguration.channel"
-          required
-        >
-          <md-option ng-value="'voice'">
-            {{ 'INTEGRATIONS.VOICE' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="deskConfigurationForm['channel'].$error"
-          ng-show="deskConfigurationForm['channel'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.CHANNEL_REQUIRED"
-              >Channel field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.TYPE">Type</label>
-        <md-select name="type" ng-model="vm.deskConfiguration.type" required>
-          <md-option ng-value="'inbound'">
-            {{ 'INTEGRATIONS.INBOUND_IN_QUEUE' | translate }}
-          </md-option>
-
-          <md-option ng-value="'outbound'">
-            {{ 'INTEGRATIONS.OUTBOUND_CALL' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="deskConfigurationForm['type'].$error"
-          ng-show="deskConfigurationForm['type'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-              >Type field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newDeskConfiguration"
-          ng-click="vm.saveDeskConfiguration()"
-          class="send-button md-accent md-raised"
-          ng-disabled="deskConfigurationForm.$invalid || deskConfigurationForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newDeskConfiguration"
-          ng-click="vm.addNewDeskConfiguration()"
-          class="send-button md-accent md-raised"
-          ng-disabled="deskConfigurationForm.$invalid"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD_DESKCONFIGURATION"
-          translate-attr-aria-label="INTEGRATIONS.ADD_DESKCONFIGURATION"
-        >
-          ADD DESKCONFIGURATION
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newDeskConfiguration"
-          ng-click="vm.deleteDeskConfiguration($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/deskAccounts/edit/configurations/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/deskAccounts/edit/configurations/dialog.html/dialog.html
new file mode 100644
index 0000000..df50a96
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/deskAccounts/edit/configurations/dialog.html/dialog.html
@@ -0,0 +1,180 @@
+<md-dialog class="deskConfiguration-dialog" aria-label="New DeskConfiguration">
+  <form name="deskConfigurationForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.NAME">Name</label>
+        <input
+          type=""
+          name="name"
+          ng-model="vm.deskConfiguration.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="deskConfigurationForm['name'].$error"
+          ng-show="deskConfigurationForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.CHANNEL">Channel</label>
+        <md-select
+          name="channel"
+          ng-model="vm.deskConfiguration.channel"
+          required
+        >
+          <md-option ng-value="'voice'">
+            {{ 'INTEGRATIONS.VOICE' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="deskConfigurationForm['channel'].$error"
+          ng-show="deskConfigurationForm['channel'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.CHANNEL_REQUIRED"
+              >Channel field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.TYPE">Type</label>
+        <md-select name="type" ng-model="vm.deskConfiguration.type" required>
+          <md-option ng-value="'inbound'">
+            {{ 'INTEGRATIONS.INBOUND_IN_QUEUE' | translate }}
+          </md-option>
+
+          <md-option ng-value="'outbound'">
+            {{ 'INTEGRATIONS.OUTBOUND_CALL' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="deskConfigurationForm['type'].$error"
+          ng-show="deskConfigurationForm['type'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+              >Type field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newDeskConfiguration"
+          ng-click="vm.saveDeskConfiguration()"
+          class="send-button md-accent md-raised"
+          ng-disabled="deskConfigurationForm.$invalid || deskConfigurationForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newDeskConfiguration"
+          ng-click="vm.addNewDeskConfiguration()"
+          class="send-button md-accent md-raised"
+          ng-disabled="deskConfigurationForm.$invalid"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD_DESKCONFIGURATION"
+          translate-attr-aria-label="INTEGRATIONS.ADD_DESKCONFIGURATION"
+        >
+          ADD DESKCONFIGURATION
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newDeskConfiguration"
+          ng-click="vm.deleteDeskConfiguration($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/deskAccounts/edit/item/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/deskAccounts/edit/item/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 7fa807d..0000000
--- a/public/src/js/modules/main/apps/integrations/views/deskAccounts/edit/item/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,478 +0,0 @@
-<md-dialog class="deskAccount-item-dialog" aria-label="New Item">
-  <form name="deskAccountItemForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <div ng-switch="vm.type">
-        <div ng-switch-when="subject">
-          <!-- SUBJECT SECTION -->
-          <div ng-include="'/subject.html'"></div>
-          <!-- / SUBJECT SECTION -->
-        </div>
-        <div ng-switch-when="description">
-          <!-- DESCRIPTION SECTION -->
-          <md-input-container class="md-block">
-            <label translate="INTEGRATIONS.TYPE">Type</label>
-            <md-select name="type" ng-model="vm.item.type" required>
-              <md-option value="string">String</md-option>
-              <md-option value="keyValue">Key Value</md-option>
-            </md-select>
-            <div
-              ng-messages="deskAccountItemForm.type.$error"
-              ng-show="deskAccountItemForm.type.$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-                  >Type field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
-            <label translate="INTEGRATIONS.CONTENT">Content</label>
-            <input
-              type="text"
-              name="content"
-              ng-model="vm.item.content"
-              required
-              md-autofocus
-            />
-            <div
-              ng-messages="deskAccountItemForm.content.$error"
-              ng-show="deskAccountItemForm.content.$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
-                  >Content field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <div ng-if="vm.item.type == 'keyValue'">
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.KEY">Key</label>
-              <input
-                type="text"
-                name="key"
-                ng-model="vm.item.key"
-                required
-                md-autofocus
-              />
-              <div
-                ng-messages="deskAccountItemForm.key.$error"
-                ng-show="deskAccountItemForm.key.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.KEY_REQUIRED"
-                    >Key field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.TYPE">Type</label>
-              <md-select name="keyType" ng-model="vm.item.keyType" required>
-                <md-option value="string">String</md-option>
-                <md-option value="variable">Variable</md-option>
-                <md-option value="customVariable">Custom Variable</md-option>
-              </md-select>
-              <div
-                ng-messages="deskAccountItemForm.keyType.$error"
-                ng-show="deskAccountItemForm.keyType.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-                    >Type field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'string'"
-            >
-              <label translate="INTEGRATIONS.CONTENT">Content</label>
-              <input
-                type="text"
-                name="keyContent"
-                ng-model="vm.item.keyContent"
-                required
-                md-autofocus
-              />
-              <div
-                ng-messages="deskAccountItemForm.keyContent.$error"
-                ng-show="deskAccountItemForm.keyContent.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
-                    >Content field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'variable'"
-            >
-              <label translate="INTEGRATIONS.VALUE">Value</label>
-              <md-select
-                name="variableName"
-                ng-model="vm.item.variableName"
-                md-selected-text="vm.getSelectedVariable()"
-                required
-              >
-                <md-optgroup label="Voice: Queue">
-                  <md-option
-                    ng-value="agentColumn"
-                    ng-repeat="agentColumn in vm.voiceAgentReportColumns"
-                    >{{agentColumn}}
-                  </md-option>
-                </md-optgroup>
-                <md-optgroup label="Voice: Outbound">
-                  <md-option
-                    ng-value="dialColumn"
-                    ng-repeat="dialColumn in vm.voiceDialReportColumns"
-                    >{{dialColumn}}</md-option
-                  >
-                </md-optgroup>
-              </md-select>
-              <div
-                ng-messages="deskAccountItemForm.variableName.$error"
-                ng-show="deskAccountItemForm.variableName.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED"
-                    >Variable name field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'customVariable'"
-            >
-              <label translate="INTEGRATIONS.VALUE">Value</label>
-              <md-select ng-model="vm.item.VariableId" required>
-                <md-option
-                  ng-value="variable.id"
-                  ng-repeat="variable in vm.variables"
-                  >{{variable.name}}
-                </md-option>
-              </md-select>
-            </md-input-container>
-          </div>
-          <!-- / DESCRIPTION SECTION -->
-        </div>
-        <div ng-switch-when="field">
-          <!-- FIELD SECTION -->
-          <div ng-if="vm.accountConnected">
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.FIELD">FIELD</label>
-              <!-- ITEM TYPE DEFAULT VALUE is STRING -->
-              <md-select
-                name="customField"
-                ng-model="vm.customField"
-                required
-                ng-change="vm.item.type = 'string'"
-              >
-                <md-optgroup label="Standard">
-                  <md-option
-                    ng-value="standard"
-                    ng-repeat="standard in vm.fields | filter: {custom: false} "
-                    >{{standard.name}}
-                  </md-option>
-                </md-optgroup>
-
-                <md-optgroup label="Custom">
-                  <md-option
-                    ng-value="custom"
-                    ng-repeat="custom in vm.fields | filter: {custom: true} "
-                    >{{custom.name}}
-                  </md-option>
-                </md-optgroup>
-              </md-select>
-              <div
-                ng-messages="deskAccountItemForm.customField.$error"
-                ng-show="deskAccountItemForm.customField.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.FIELD_REQUIRED"
-                    >Field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <!-- FIELDS -->
-            <div ng-if="vm.customField" ng-include="'/fields.html'"></div>
-            <!-- FIELDS -->
-          </div>
-          <div ng-if="!vm.accountConnected">
-            <p>Account is not connected. Please check your configurations!</p>
-          </div>
-          <!-- / FIELD SECTION -->
-        </div>
-        <div ng-switch-default>
-          <p>No Item</p>
-        </div>
-      </div>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newItem"
-          ng-click="vm.saveItem()"
-          class="send-button md-accent md-raised"
-          ng-disabled="deskAccountItemForm.$invalid || deskAccountItemForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newItem"
-          ng-click="vm.addNewItem()"
-          class="send-button md-accent md-raised"
-          ng-disabled="deskAccountItemForm.$invalid || deskAccountItemForm.$pristine"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD"
-          translate-attr-aria-label="INTEGRATIONS.ADD"
-        >
-          ADD
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newItem"
-          ng-click="vm.deleteItem($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
-
-<script type="text/ng-template" id="/fields.html">
-
-  <!-- type -->
-  <md-input-container class="md-block" ng-if="!vm.customField.options.length">
-
-      <label translate="INTEGRATIONS.TYPE">Type</label>
-      <md-select name="type" ng-model="vm.item.type" required>
-
-          <md-option value="string">String</md-option>
-          <md-option value="variable">Variable</md-option>
-          <md-option value="customVariable">Custom Variable</md-option>
-      </md-select>
-      <div ng-messages="deskAccountItemForm.type.$error" ng-show="deskAccountItemForm.type.$touched"
-          role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <!--/ type -->
-
-  <!-- value -->
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && vm.customField.options.length">
-      <!-- options -->
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-
-      <md-select name="option" ng-model="vm.item.content" required>
-          <md-option ng-value="option.value" ng-repeat="option in vm.customField.options">{{option.name}}</md-option>
-      </md-select>
-
-      <div ng-messages="deskAccountItemForm.option.$error"
-          ng-show="deskAccountItemForm.option.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VALUE_REQUIRED">Value field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && !vm.customField.options.length">
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-
-      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
-
-      <div ng-messages="deskAccountItemForm.content.$error"
-          ng-show="deskAccountItemForm.content.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
-          required>
-          <md-optgroup label="Voice: Queue">
-              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
-              </md-option>
-          </md-optgroup>
-          <md-optgroup label="Voice: Outbound">
-              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
-              </md-option>
-          </md-optgroup>
-      </md-select>
-      <div ng-messages="deskAccountItemForm.variableName.$error"
-          ng-show="deskAccountItemForm.variableName.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select ng-model="vm.item.VariableId" required>
-          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
-      </md-select>
-  </md-input-container>
-
-  <!--/ value -->
-</script>
-
-<script type="text/ng-template" id="/subject.html">
-    <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.TYPE">Type</label>
-            <md-select name="type" ng-model="vm.item.type" required>
-                <md-option value="string">String</md-option>
-                <md-option value="variable">Variable</md-option>
-                <md-option value="customVariable">Custom Variable</md-option>
-            </md-select>
-        <div ng-messages="deskAccountItemForm.type.$error" ng-show="deskAccountItemForm.type.$touched" role="alert">
-            <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
-             </div>
-        </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
-      <div ng-messages="deskAccountItemForm.content.$error"
-          ng-show="deskAccountItemForm.content.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
-          required>
-          <md-optgroup label="Voice: Queue">
-              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
-              </md-option>
-          </md-optgroup>
-          <md-optgroup label="Voice: Outbound">
-              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
-              </md-option>
-          </md-optgroup>
-      </md-select>
-      <div ng-messages="deskAccountItemForm.variableName.$error"
-          ng-show="deskAccountItemForm.variableName.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select ng-model="vm.item.VariableId" required>
-          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
-      </md-select>
-  </md-input-container>
-</script>
diff --git a/public/src/js/modules/main/apps/integrations/views/deskAccounts/edit/item/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/deskAccounts/edit/item/dialog.html/dialog.html
new file mode 100644
index 0000000..7fa807d
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/deskAccounts/edit/item/dialog.html/dialog.html
@@ -0,0 +1,478 @@
+<md-dialog class="deskAccount-item-dialog" aria-label="New Item">
+  <form name="deskAccountItemForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <div ng-switch="vm.type">
+        <div ng-switch-when="subject">
+          <!-- SUBJECT SECTION -->
+          <div ng-include="'/subject.html'"></div>
+          <!-- / SUBJECT SECTION -->
+        </div>
+        <div ng-switch-when="description">
+          <!-- DESCRIPTION SECTION -->
+          <md-input-container class="md-block">
+            <label translate="INTEGRATIONS.TYPE">Type</label>
+            <md-select name="type" ng-model="vm.item.type" required>
+              <md-option value="string">String</md-option>
+              <md-option value="keyValue">Key Value</md-option>
+            </md-select>
+            <div
+              ng-messages="deskAccountItemForm.type.$error"
+              ng-show="deskAccountItemForm.type.$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+                  >Type field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
+            <label translate="INTEGRATIONS.CONTENT">Content</label>
+            <input
+              type="text"
+              name="content"
+              ng-model="vm.item.content"
+              required
+              md-autofocus
+            />
+            <div
+              ng-messages="deskAccountItemForm.content.$error"
+              ng-show="deskAccountItemForm.content.$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
+                  >Content field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <div ng-if="vm.item.type == 'keyValue'">
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.KEY">Key</label>
+              <input
+                type="text"
+                name="key"
+                ng-model="vm.item.key"
+                required
+                md-autofocus
+              />
+              <div
+                ng-messages="deskAccountItemForm.key.$error"
+                ng-show="deskAccountItemForm.key.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.KEY_REQUIRED"
+                    >Key field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.TYPE">Type</label>
+              <md-select name="keyType" ng-model="vm.item.keyType" required>
+                <md-option value="string">String</md-option>
+                <md-option value="variable">Variable</md-option>
+                <md-option value="customVariable">Custom Variable</md-option>
+              </md-select>
+              <div
+                ng-messages="deskAccountItemForm.keyType.$error"
+                ng-show="deskAccountItemForm.keyType.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+                    >Type field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'string'"
+            >
+              <label translate="INTEGRATIONS.CONTENT">Content</label>
+              <input
+                type="text"
+                name="keyContent"
+                ng-model="vm.item.keyContent"
+                required
+                md-autofocus
+              />
+              <div
+                ng-messages="deskAccountItemForm.keyContent.$error"
+                ng-show="deskAccountItemForm.keyContent.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
+                    >Content field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'variable'"
+            >
+              <label translate="INTEGRATIONS.VALUE">Value</label>
+              <md-select
+                name="variableName"
+                ng-model="vm.item.variableName"
+                md-selected-text="vm.getSelectedVariable()"
+                required
+              >
+                <md-optgroup label="Voice: Queue">
+                  <md-option
+                    ng-value="agentColumn"
+                    ng-repeat="agentColumn in vm.voiceAgentReportColumns"
+                    >{{agentColumn}}
+                  </md-option>
+                </md-optgroup>
+                <md-optgroup label="Voice: Outbound">
+                  <md-option
+                    ng-value="dialColumn"
+                    ng-repeat="dialColumn in vm.voiceDialReportColumns"
+                    >{{dialColumn}}</md-option
+                  >
+                </md-optgroup>
+              </md-select>
+              <div
+                ng-messages="deskAccountItemForm.variableName.$error"
+                ng-show="deskAccountItemForm.variableName.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED"
+                    >Variable name field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'customVariable'"
+            >
+              <label translate="INTEGRATIONS.VALUE">Value</label>
+              <md-select ng-model="vm.item.VariableId" required>
+                <md-option
+                  ng-value="variable.id"
+                  ng-repeat="variable in vm.variables"
+                  >{{variable.name}}
+                </md-option>
+              </md-select>
+            </md-input-container>
+          </div>
+          <!-- / DESCRIPTION SECTION -->
+        </div>
+        <div ng-switch-when="field">
+          <!-- FIELD SECTION -->
+          <div ng-if="vm.accountConnected">
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.FIELD">FIELD</label>
+              <!-- ITEM TYPE DEFAULT VALUE is STRING -->
+              <md-select
+                name="customField"
+                ng-model="vm.customField"
+                required
+                ng-change="vm.item.type = 'string'"
+              >
+                <md-optgroup label="Standard">
+                  <md-option
+                    ng-value="standard"
+                    ng-repeat="standard in vm.fields | filter: {custom: false} "
+                    >{{standard.name}}
+                  </md-option>
+                </md-optgroup>
+
+                <md-optgroup label="Custom">
+                  <md-option
+                    ng-value="custom"
+                    ng-repeat="custom in vm.fields | filter: {custom: true} "
+                    >{{custom.name}}
+                  </md-option>
+                </md-optgroup>
+              </md-select>
+              <div
+                ng-messages="deskAccountItemForm.customField.$error"
+                ng-show="deskAccountItemForm.customField.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.FIELD_REQUIRED"
+                    >Field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <!-- FIELDS -->
+            <div ng-if="vm.customField" ng-include="'/fields.html'"></div>
+            <!-- FIELDS -->
+          </div>
+          <div ng-if="!vm.accountConnected">
+            <p>Account is not connected. Please check your configurations!</p>
+          </div>
+          <!-- / FIELD SECTION -->
+        </div>
+        <div ng-switch-default>
+          <p>No Item</p>
+        </div>
+      </div>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newItem"
+          ng-click="vm.saveItem()"
+          class="send-button md-accent md-raised"
+          ng-disabled="deskAccountItemForm.$invalid || deskAccountItemForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newItem"
+          ng-click="vm.addNewItem()"
+          class="send-button md-accent md-raised"
+          ng-disabled="deskAccountItemForm.$invalid || deskAccountItemForm.$pristine"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD"
+          translate-attr-aria-label="INTEGRATIONS.ADD"
+        >
+          ADD
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newItem"
+          ng-click="vm.deleteItem($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
+
+<script type="text/ng-template" id="/fields.html">
+
+  <!-- type -->
+  <md-input-container class="md-block" ng-if="!vm.customField.options.length">
+
+      <label translate="INTEGRATIONS.TYPE">Type</label>
+      <md-select name="type" ng-model="vm.item.type" required>
+
+          <md-option value="string">String</md-option>
+          <md-option value="variable">Variable</md-option>
+          <md-option value="customVariable">Custom Variable</md-option>
+      </md-select>
+      <div ng-messages="deskAccountItemForm.type.$error" ng-show="deskAccountItemForm.type.$touched"
+          role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <!--/ type -->
+
+  <!-- value -->
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && vm.customField.options.length">
+      <!-- options -->
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+
+      <md-select name="option" ng-model="vm.item.content" required>
+          <md-option ng-value="option.value" ng-repeat="option in vm.customField.options">{{option.name}}</md-option>
+      </md-select>
+
+      <div ng-messages="deskAccountItemForm.option.$error"
+          ng-show="deskAccountItemForm.option.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VALUE_REQUIRED">Value field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && !vm.customField.options.length">
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+
+      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
+
+      <div ng-messages="deskAccountItemForm.content.$error"
+          ng-show="deskAccountItemForm.content.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
+          required>
+          <md-optgroup label="Voice: Queue">
+              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
+              </md-option>
+          </md-optgroup>
+          <md-optgroup label="Voice: Outbound">
+              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
+              </md-option>
+          </md-optgroup>
+      </md-select>
+      <div ng-messages="deskAccountItemForm.variableName.$error"
+          ng-show="deskAccountItemForm.variableName.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select ng-model="vm.item.VariableId" required>
+          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
+      </md-select>
+  </md-input-container>
+
+  <!--/ value -->
+</script>
+
+<script type="text/ng-template" id="/subject.html">
+    <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.TYPE">Type</label>
+            <md-select name="type" ng-model="vm.item.type" required>
+                <md-option value="string">String</md-option>
+                <md-option value="variable">Variable</md-option>
+                <md-option value="customVariable">Custom Variable</md-option>
+            </md-select>
+        <div ng-messages="deskAccountItemForm.type.$error" ng-show="deskAccountItemForm.type.$touched" role="alert">
+            <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
+             </div>
+        </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
+      <div ng-messages="deskAccountItemForm.content.$error"
+          ng-show="deskAccountItemForm.content.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
+          required>
+          <md-optgroup label="Voice: Queue">
+              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
+              </md-option>
+          </md-optgroup>
+          <md-optgroup label="Voice: Outbound">
+              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
+              </md-option>
+          </md-optgroup>
+      </md-select>
+      <div ng-messages="deskAccountItemForm.variableName.$error"
+          ng-show="deskAccountItemForm.variableName.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select ng-model="vm.item.VariableId" required>
+          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
+      </md-select>
+  </md-input-container>
+</script>
diff --git a/public/src/js/modules/main/apps/integrations/views/deskAccounts/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/deskAccounts/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index b6ee137..0000000
--- a/public/src/js/modules/main/apps/integrations/views/deskAccounts/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,1003 +0,0 @@
-<div
-  id="integrations-deskAccount"
-  class="page-layout simple tabbed"
-  layout="column"
->
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-deskAccounts-button md-icon-button"
-        aria-label="Go to deskAccounts"
-        ng-click="vm.gotoDeskAccounts()"
-        translate
-        translate-attr-aria-label="INTEGRATIONS.GO_TO_DESKACCOUNTS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="deskAccount-image" hide-xs>
-          <img ng-src="assets/images/business/deskAccounts.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.deskAccount.id}}
-            <span ng-if="vm.deskAccount.name">{{vm.deskAccount.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="INTEGRATIONS.CREATED_AT"></span>
-            <span>{{vm.deskAccount.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveDeskAccount()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (configurationsForm.$invalid)"
-        translate="INTEGRATIONS.SAVE"
-        translate-attr-aria-label="INTEGRATIONS.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="INTEGRATIONS.ACCOUNT">ACCOUNT</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="deskAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="INTEGRATIONS.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.deskAccount.name"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.TYPE">Type</label>
-                <md-select
-                  name="type"
-                  ng-model="vm.deskAccount.type"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'integrationTab'">
-                    {{ 'INTEGRATIONS.INTEGRATION_TAB' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'newTab'">
-                    {{ 'INTEGRATIONS.NEW_TAB' | translate }}
-                  </md-option>
-                </md-select>
-                <div
-                  ng-messages="generalForm['type'].$error"
-                  ng-show="generalForm['type'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-                      >Type field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.URI">Uri</label>
-                <input
-                  type="url"
-                  name="remoteUri"
-                  ng-model="vm.deskAccount.remoteUri"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['remoteUri'].$error"
-                  ng-show="generalForm['remoteUri'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
-                      >Uri field is required</span
-                    >
-                  </div>
-                  <div ng-message="url">
-                    <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
-                      >Uri must be a valid url http://www.xcally.com</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.AUTHTYPE">AuthType</label>
-                <md-select
-                  name="authType"
-                  ng-model="vm.deskAccount.authType"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'basic'">Basic</md-option>
-                </md-select>
-                <div
-                  ng-messages="generalForm['authType'].$error"
-                  ng-show="generalForm['authType'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.AUTHTYPE_REQUIRED"
-                      >AuthType field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.deskAccount.authType == 'basic'"
-                class="md-block"
-              >
-                <label translate="INTEGRATIONS.USERNAME">Username</label>
-                <input
-                  type="text"
-                  name="username"
-                  ng-model="vm.deskAccount.username"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['username'].$error"
-                  ng-show="generalForm['username'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
-                      >Username field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                class="md-block"
-                ng-if="vm.deskAccount.authType == 'basic'"
-              >
-                <label translate="INTEGRATIONS.PASSWORD">Password</label>
-                <input
-                  type="password"
-                  name="password"
-                  ng-model="vm.deskAccount.password"
-                  placeholder="Password"
-                  translate
-                  translate-attr-placeholder="INTEGRATIONS.PASSWORD"
-                  required
-                />
-                <div ng-messages="generalForm['password'].$error" role="alert">
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.PASSWORD_REQUIRED"
-                      >Password field is required</span
-                    >
-                  </div>
-                  <div ng-message="pattern">
-                    <span
-                      translate="INTEGRATIONS.ERRORS.SECURE_PASSWORD_PATTERN"
-                      >Must contain at least 8 characters, with a minimum of 1
-                      lowercase letter, 1 uppercase letter, 1 numeric character
-                      and 1 special character ~!?*@#$%^&-_=+[{]}.</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
-                  >MotionProxyAddress</label
-                >
-                <input
-                  type="url"
-                  name="serverUrl"
-                  ng-model="vm.deskAccount.serverUrl"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['serverUrl'].$error"
-                  ng-show="generalForm['serverUrl'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
-                      >MotionProxyAddress field is required</span
-                    >
-                  </div>
-                  <div ng-message="url">
-                    <span
-                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
-                      >MotionProxyAddress must be a valid url
-                      http://www.xcally.com</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.deskAccount.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="INTEGRATIONS.CONFIGURATIONS">CONFIGURATIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="deskAccount-detail-form-container configurations md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div
-                class="h2 secondary-text"
-                translate="INTEGRATIONS.CONFIGURATIONS"
-              >
-                CONFIGURATIONS
-              </div>
-            </div>
-            <div
-              ng-controller="DeskAccountConfigurationsController as vm_cc"
-              ng-init="vm_cc.init(vm.deskAccount, vm.crudPermissions)"
-              layout="row"
-            >
-              <md-card class="md-whiteframe-1dp" flex="30">
-                <div layout="row" layout-align="center center">
-                  <md-subheader flex="75" class="md-no-sticky"
-                    >{{ 'INTEGRATIONS.CONFIGURATIONS' | translate
-                    }}</md-subheader
-                  >
-                  <md-button
-                    flex="25"
-                    ng-if="vm_cc.crudPermissions.canEdit"
-                    ng-click="vm_cc.createOrEditDeskConfiguration($event)"
-                    class="md-icon-button"
-                    aria-label="create deskConfiguration"
-                  >
-                    <md-icon md-font-icon="icon-plus"></md-icon>
-                  </md-button>
-                </div>
-                <md-list>
-                  <md-list-item
-                    layout="row"
-                    layout-align="center center"
-                    ng-repeat="deskConfiguration in vm_cc.configurations"
-                    class="border-top"
-                    md-colors="{background: (vm_cc.selectedDeskConfiguration == $index ? 'accent' : 'grey-A100')}"
-                    ng-click="vm_cc.getDeskConfiguration($index)"
-                  >
-                    <span class="text-truncate" flex="80"
-                      >{{ deskConfiguration.name }}</span
-                    >
-                    <md-menu ng-if="vm_cc.crudPermissions.canDelete">
-                      <md-button
-                        class="md-icon-button"
-                        aria-label="More"
-                        translate
-                        translate-attr-aria-label="INTEGRATIONS.MORE"
-                        ng-click="$mdOpenMenu($event)"
-                      >
-                        <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                      </md-button>
-                      <md-menu-content width="3">
-                        <md-menu-item ng-if="vm_cc.crudPermissions.canDelete">
-                          <md-button
-                            ng-click="vm_cc.deleteDeskConfiguration($event, deskConfiguration)"
-                            translate="INTEGRATIONS.DELETE_DESKCONFIGURATION"
-                          >
-                            Delete DeskConfiguration
-                          </md-button>
-                        </md-menu-item>
-                      </md-menu-content>
-                    </md-menu>
-                  </md-list-item>
-                </md-list>
-              </md-card>
-              <div flex></div>
-              <md-card class="md-whiteframe-1dp" flex="65">
-                <md-tabs ng-if="vm_cc.configurations.length" md-dynamic-height>
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.SUBJECTS">SUBJECTS</span>
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-toolbar
-                        class="md-table-toolbar md-default no-padding"
-                        ng-hide="vm_cc.selectedSubjects.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <div flex></div>
-                          <ms-search-bar
-                            on-search="vm_cc.query.subject = query"
-                            on-collapse="vm_cc.query.subject = undefined"
-                            debounce="300"
-                          ></ms-search-bar>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canEdit"
-                            class="md-icon-button"
-                            ng-click="vm_cc.createOrEditSubject($event)"
-                            aria-label="add subject"
-                            translate
-                            translate-attr-label="INTEGRATIONS.ADD_SUBJECT"
-                          >
-                            <md-icon md-font-icon="icon-plus"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-toolbar
-                        class="md-table-toolbar md-accent"
-                        ng-show="vm_cc.selectedSubjects.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <span class="md-subhead"
-                            >{{vm_cc.selectedSubjects.length}}
-                            {{vm_cc.selectedSubjects.length > 1 ? 'items' :
-                            'item'}} selected</span
-                          >
-                          <div flex></div>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canDelete"
-                            class="md-icon-button"
-                            ng-click="vm_cc.deleteSelectedSubjects($event)"
-                            aria-label="delete selected"
-                            translate
-                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-                          >
-                            <md-icon md-font-icon="icon-delete"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-table-container
-                        class="md-whiteframe-1dp padding-horizontal"
-                      >
-                        <table
-                          md-table
-                          md-row-select
-                          multiple
-                          ng-model="vm_cc.selectedSubjects"
-                        >
-                          <thead md-head>
-                            <tr md-row>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.ID' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.TYPE' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.CONTENT' | translate }}
-                              </th>
-                              <th md-column width="10px"></th>
-                            </tr>
-                          </thead>
-                          <tbody md-body>
-                            <tr
-                              md-row
-                              md-select="subject"
-                              md-select-id="id"
-                              ng-repeat="subject in vm_cc.subjects | filter: vm_cc.query.subject"
-                            >
-                              <td
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                                class="id"
-                              >
-                                {{subject.id}}
-                              </td>
-                              <td
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                                class="type"
-                              >
-                                <span ng-if="subject.FieldId"
-                                  >{{subject.nameField ||
-                                  subject.idField}}</span
-                                >
-                                <span ng-if="!subject.FieldId"
-                                  >{{subject.type}}</span
-                                >
-                              </td>
-                              <td
-                                ng-switch="subject.type"
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                              >
-                                <span ng-switch-when="string"
-                                  >{{subject.content}}</span
-                                >
-                                <span
-                                  ng-switch-when="variable"
-                                  class="text-boxed"
-                                  >{{subject.variableName}}</span
-                                >
-                                <span
-                                  ng-switch-when="customVariable"
-                                  class="text-boxed"
-                                  >{{
-                                  vm_cc.variablesById[subject.VariableId].name
-                                  }}</span
-                                >
-                                <span ng-switch-when="keyValue">
-                                  {{subject.key}}
-                                  <span ng-switch="description.keyType">
-                                    <span ng-switch-when="string"
-                                      >{{subject.keyContent}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="variable"
-                                      class="text-boxed"
-                                      >{{subject.variableName}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="customVariable"
-                                      class="text-boxed"
-                                      >{{
-                                      vm_cc.variablesById[subject.VariableId].name
-                                      }}</span
-                                    >
-                                  </span>
-                                </span>
-                                <span ng-switch-default
-                                  >{{subject.content}}</span
-                                >
-                              </td>
-                              <td
-                                md-cell
-                                class="actions"
-                                ng-if="!vm_cc.crudPermissions.readOnly"
-                              >
-                                <md-menu>
-                                  <md-button
-                                    class="md-icon-button"
-                                    aria-label="More"
-                                    translate
-                                    translate-attr-aria-label="INTEGRATIONS.MORE"
-                                    ng-click="$mdOpenMenu($event)"
-                                  >
-                                    <md-icon
-                                      md-font-icon="icon-dots-vertical"
-                                    ></md-icon>
-                                  </md-button>
-
-                                  <md-menu-content width="3">
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canEdit"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                        translate="INTEGRATIONS.EDIT_SUBJECT"
-                                      >
-                                        Edit Subject
-                                      </md-button>
-                                    </md-menu-item>
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canDelete"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.deleteSubjectConfirm($event, subject)"
-                                        translate="INTEGRATIONS.DELETE_SUBJECT"
-                                      >
-                                        Delete Subject
-                                      </md-button>
-                                    </md-menu-item>
-                                  </md-menu-content>
-                                </md-menu>
-                              </td>
-                            </tr>
-                          </tbody>
-                        </table>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.DESCRIPTIONS"
-                        >DESCRIPTIONS</span
-                      >
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-toolbar
-                        class="md-table-toolbar md-default no-padding"
-                        ng-hide="vm_cc.selectedDescriptions.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <div flex></div>
-                          <ms-search-bar
-                            on-search="vm_cc.query.description = query"
-                            on-collapse="vm_cc.query.description = undefined"
-                            debounce="300"
-                          ></ms-search-bar>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canEdit"
-                            class="md-icon-button"
-                            ng-click="vm_cc.createOrEditDescription($event)"
-                            aria-label="add description"
-                            translate
-                            translate-attr-label="INTEGRATIONS.ADD_DESCRIPTION"
-                          >
-                            <md-icon md-font-icon="icon-plus"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-toolbar
-                        class="md-table-toolbar md-accent"
-                        ng-show="vm_cc.selectedDescriptions.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <span class="md-subhead"
-                            >{{vm_cc.selectedDescriptions.length}}
-                            {{vm_cc.selectedDescriptions.length > 1 ? 'items' :
-                            'item'}} selected</span
-                          >
-                          <div flex></div>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canDelete"
-                            class="md-icon-button"
-                            ng-click="vm_cc.deleteSelectedDescriptions($event)"
-                            aria-label="delete selected"
-                            translate
-                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-                          >
-                            <md-icon md-font-icon="icon-delete"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-table-container
-                        class="md-whiteframe-1dp padding-horizontal"
-                      >
-                        <table
-                          md-table
-                          md-row-select
-                          multiple
-                          ng-model="vm_cc.selectedDescriptions"
-                        >
-                          <thead md-head>
-                            <tr md-row>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.ID' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.TYPE' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.CONTENT' | translate }}
-                              </th>
-                              <th md-column width="10px"></th>
-                            </tr>
-                          </thead>
-                          <tbody md-body>
-                            <tr
-                              md-row
-                              md-select="description"
-                              md-select-id="id"
-                              ng-repeat="description in vm_cc.descriptions | filter: vm_cc.query.description"
-                            >
-                              <td
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                                class="id"
-                              >
-                                {{description.id}}
-                              </td>
-                              <td
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                                class="type"
-                              >
-                                <span ng-if="description.FieldId"
-                                  >{{description.nameField ||
-                                  description.idField}}</span
-                                >
-                                <span ng-if="!description.FieldId"
-                                  >{{description.type}}</span
-                                >
-                              </td>
-                              <td
-                                ng-switch="description.type"
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                              >
-                                <span ng-switch-when="string"
-                                  >{{description.content}}</span
-                                >
-                                <span
-                                  ng-switch-when="variable"
-                                  class="text-boxed"
-                                  >{{description.variableName}}</span
-                                >
-                                <span
-                                  ng-switch-when="customVariable"
-                                  class="text-boxed"
-                                  >{{
-                                  vm_cc.variablesById[description.VariableId].name
-                                  }}</span
-                                >
-                                <span ng-switch-when="keyValue">
-                                  {{description.key}}
-                                  <span ng-switch="description.keyType">
-                                    <span ng-switch-when="string"
-                                      >{{description.keyContent}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="variable"
-                                      class="text-boxed"
-                                      >{{description.variableName}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="customVariable"
-                                      class="text-boxed"
-                                      >{{
-                                      vm_cc.variablesById[description.VariableId].name
-                                      }}</span
-                                    >
-                                  </span>
-                                </span>
-                                <span ng-switch-default
-                                  >{{description.content}}</span
-                                >
-                              </td>
-                              <td
-                                md-cell
-                                class="actions"
-                                ng-if="!vm_cc.crudPermissions.readOnly"
-                              >
-                                <md-menu>
-                                  <md-button
-                                    class="md-icon-button"
-                                    aria-label="More"
-                                    translate
-                                    translate-attr-aria-label="INTEGRATIONS.MORE"
-                                    ng-click="$mdOpenMenu($event)"
-                                  >
-                                    <md-icon
-                                      md-font-icon="icon-dots-vertical"
-                                    ></md-icon>
-                                  </md-button>
-
-                                  <md-menu-content width="3">
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canEdit"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.createOrEditDescription($event, description)"
-                                        translate="INTEGRATIONS.EDIT_DESCRIPTION"
-                                      >
-                                        Edit Description
-                                      </md-button>
-                                    </md-menu-item>
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canDelete"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.deleteDescriptionConfirm($event, description)"
-                                        translate="INTEGRATIONS.DELETE_DESCRIPTION"
-                                      >
-                                        Delete Description
-                                      </md-button>
-                                    </md-menu-item>
-                                  </md-menu-content>
-                                </md-menu>
-                              </td>
-                            </tr>
-                          </tbody>
-                        </table>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.FIELDS">FIELDS</span>
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-toolbar
-                        class="md-table-toolbar md-default no-padding"
-                        ng-hide="vm_cc.selectedFields.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <div flex></div>
-                          <ms-search-bar
-                            on-search="vm_cc.query.field = query"
-                            on-collapse="vm_cc.query.field = undefined"
-                            debounce="300"
-                          ></ms-search-bar>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canEdit"
-                            class="md-icon-button"
-                            ng-click="vm_cc.createOrEditField($event)"
-                            aria-label="add field"
-                            translate
-                            translate-attr-label="INTEGRATIONS.ADD_FIELD"
-                          >
-                            <md-icon md-font-icon="icon-plus"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-toolbar
-                        class="md-table-toolbar md-accent"
-                        ng-show="vm_cc.selectedFields.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <span class="md-subhead"
-                            >{{vm_cc.selectedFields.length}}
-                            {{vm_cc.selectedFields.length > 1 ? 'items' :
-                            'item'}} selected</span
-                          >
-                          <div flex></div>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canDelete"
-                            class="md-icon-button"
-                            ng-click="vm_cc.deleteSelectedFields($event)"
-                            aria-label="delete selected"
-                            translate
-                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-                          >
-                            <md-icon md-font-icon="icon-delete"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-table-container
-                        class="md-whiteframe-1dp padding-horizontal"
-                      >
-                        <table
-                          md-table
-                          md-row-select
-                          multiple
-                          ng-model="vm_cc.selectedFields"
-                        >
-                          <thead md-head>
-                            <tr md-row>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.ID' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.TYPE' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.CONTENT' | translate }}
-                              </th>
-                              <th md-column width="10px"></th>
-                            </tr>
-                          </thead>
-                          <tbody md-body>
-                            <tr
-                              md-row
-                              md-select="field"
-                              md-select-id="id"
-                              ng-repeat="field in vm_cc.fields | filter: vm_cc.query.field"
-                            >
-                              <td
-                                ng-click="vm_cc.createOrEditField($event, field)"
-                                md-cell
-                                class="id"
-                              >
-                                {{field.id}}
-                              </td>
-                              <td
-                                ng-click="vm_cc.createOrEditField($event, field)"
-                                md-cell
-                                class="type"
-                              >
-                                <span ng-if="field.FieldId"
-                                  >{{field.nameField || field.idField}}</span
-                                >
-                                <span ng-if="!field.FieldId"
-                                  >{{field.type}}</span
-                                >
-                              </td>
-                              <td
-                                ng-switch="field.type"
-                                ng-click="vm_cc.createOrEditField($event, field)"
-                                md-cell
-                              >
-                                <span ng-switch-when="string"
-                                  >{{field.content}}</span
-                                >
-                                <span
-                                  ng-switch-when="variable"
-                                  class="text-boxed"
-                                  >{{field.variableName}}</span
-                                >
-                                <span
-                                  ng-switch-when="customVariable"
-                                  class="text-boxed"
-                                  >{{ vm_cc.variablesById[field.VariableId].name
-                                  }}</span
-                                >
-                                <span ng-switch-when="keyValue">
-                                  {{field.key}}
-                                  <span ng-switch="description.keyType">
-                                    <span ng-switch-when="string"
-                                      >{{field.keyContent}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="variable"
-                                      class="text-boxed"
-                                      >{{field.variableName}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="customVariable"
-                                      class="text-boxed"
-                                      >{{
-                                      vm_cc.variablesById[field.VariableId].name
-                                      }}</span
-                                    >
-                                  </span>
-                                </span>
-                                <span ng-switch-default>{{field.content}}</span>
-                              </td>
-                              <td
-                                md-cell
-                                class="actions"
-                                ng-if="!vm_cc.crudPermissions.readOnly"
-                              >
-                                <md-menu>
-                                  <md-button
-                                    class="md-icon-button"
-                                    aria-label="More"
-                                    translate
-                                    translate-attr-aria-label="INTEGRATIONS.MORE"
-                                    ng-click="$mdOpenMenu($event)"
-                                  >
-                                    <md-icon
-                                      md-font-icon="icon-dots-vertical"
-                                    ></md-icon>
-                                  </md-button>
-
-                                  <md-menu-content width="3">
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canEdit"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.createOrEditField($event, field)"
-                                        translate="INTEGRATIONS.EDIT_FIELD"
-                                      >
-                                        Edit Field
-                                      </md-button>
-                                    </md-menu-item>
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canDelete"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.deleteFieldConfirm($event, field)"
-                                        translate="INTEGRATIONS.DELETE_FIELD"
-                                      >
-                                        Delete Field
-                                      </md-button>
-                                    </md-menu-item>
-                                  </md-menu-content>
-                                </md-menu>
-                              </td>
-                            </tr>
-                          </tbody>
-                        </table>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.TAGS">TAGS</span>
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-table-container class="md-whiteframe-1dp padding-20">
-                        <md-input-container class="md-block">
-                          <label translate="INTEGRATIONS.TAGS">Tags</label>
-                          <md-select
-                            ng-model="vm_cc.selectedTags"
-                            ng-change="vm_cc.selectTagsChanged($event)"
-                            multiple
-                          >
-                            <md-option
-                              ng-value="tag.id"
-                              ng-repeat="tag in vm_cc.tags"
-                              >{{ tag.name }}</md-option
-                            >
-                          </md-select>
-                        </md-input-container>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-                </md-tabs>
-                <div
-                  class="padding-20"
-                  ng-if="!vm_cc.configurations.length && vm_cc.crudPermissions.canEdit"
-                  ng-click="vm_cc.createOrEditDeskConfiguration($event)"
-                  layout="row"
-                  layout-sm="column"
-                  layout-align="center center"
-                  layout-wrap
-                >
-                  <div
-                    class="padding-20 md-whiteframe-3dp md-accent-bg"
-                    layout="column"
-                    layout-align="center center"
-                  >
-                    <md-button class="md-icon-button">
-                      <md-icon md-font-icon="icon-plus"></md-icon>
-                    </md-button>
-                    <span
-                      aria-label="add configuration"
-                      translate
-                      translate-attr-label="INTEGRATIONS.ADD_CONFIGURATION"
-                      >ADD CONFIGURATION</span
-                    >
-                  </div>
-                </div>
-              </md-card>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/deskAccounts/edit/view.html/view.html b/public/src/js/modules/main/apps/integrations/views/deskAccounts/edit/view.html/view.html
new file mode 100644
index 0000000..b6ee137
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/deskAccounts/edit/view.html/view.html
@@ -0,0 +1,1003 @@
+<div
+  id="integrations-deskAccount"
+  class="page-layout simple tabbed"
+  layout="column"
+>
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-deskAccounts-button md-icon-button"
+        aria-label="Go to deskAccounts"
+        ng-click="vm.gotoDeskAccounts()"
+        translate
+        translate-attr-aria-label="INTEGRATIONS.GO_TO_DESKACCOUNTS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="deskAccount-image" hide-xs>
+          <img ng-src="assets/images/business/deskAccounts.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.deskAccount.id}}
+            <span ng-if="vm.deskAccount.name">{{vm.deskAccount.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="INTEGRATIONS.CREATED_AT"></span>
+            <span>{{vm.deskAccount.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveDeskAccount()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (configurationsForm.$invalid)"
+        translate="INTEGRATIONS.SAVE"
+        translate-attr-aria-label="INTEGRATIONS.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="INTEGRATIONS.ACCOUNT">ACCOUNT</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="deskAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="INTEGRATIONS.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.deskAccount.name"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.TYPE">Type</label>
+                <md-select
+                  name="type"
+                  ng-model="vm.deskAccount.type"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'integrationTab'">
+                    {{ 'INTEGRATIONS.INTEGRATION_TAB' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'newTab'">
+                    {{ 'INTEGRATIONS.NEW_TAB' | translate }}
+                  </md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['type'].$error"
+                  ng-show="generalForm['type'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+                      >Type field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.URI">Uri</label>
+                <input
+                  type="url"
+                  name="remoteUri"
+                  ng-model="vm.deskAccount.remoteUri"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['remoteUri'].$error"
+                  ng-show="generalForm['remoteUri'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
+                      >Uri field is required</span
+                    >
+                  </div>
+                  <div ng-message="url">
+                    <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
+                      >Uri must be a valid url http://www.xcally.com</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.AUTHTYPE">AuthType</label>
+                <md-select
+                  name="authType"
+                  ng-model="vm.deskAccount.authType"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'basic'">Basic</md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['authType'].$error"
+                  ng-show="generalForm['authType'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.AUTHTYPE_REQUIRED"
+                      >AuthType field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.deskAccount.authType == 'basic'"
+                class="md-block"
+              >
+                <label translate="INTEGRATIONS.USERNAME">Username</label>
+                <input
+                  type="text"
+                  name="username"
+                  ng-model="vm.deskAccount.username"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['username'].$error"
+                  ng-show="generalForm['username'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
+                      >Username field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                class="md-block"
+                ng-if="vm.deskAccount.authType == 'basic'"
+              >
+                <label translate="INTEGRATIONS.PASSWORD">Password</label>
+                <input
+                  type="password"
+                  name="password"
+                  ng-model="vm.deskAccount.password"
+                  placeholder="Password"
+                  translate
+                  translate-attr-placeholder="INTEGRATIONS.PASSWORD"
+                  required
+                />
+                <div ng-messages="generalForm['password'].$error" role="alert">
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.PASSWORD_REQUIRED"
+                      >Password field is required</span
+                    >
+                  </div>
+                  <div ng-message="pattern">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.SECURE_PASSWORD_PATTERN"
+                      >Must contain at least 8 characters, with a minimum of 1
+                      lowercase letter, 1 uppercase letter, 1 numeric character
+                      and 1 special character ~!?*@#$%^&-_=+[{]}.</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
+                  >MotionProxyAddress</label
+                >
+                <input
+                  type="url"
+                  name="serverUrl"
+                  ng-model="vm.deskAccount.serverUrl"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['serverUrl'].$error"
+                  ng-show="generalForm['serverUrl'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
+                      >MotionProxyAddress field is required</span
+                    >
+                  </div>
+                  <div ng-message="url">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
+                      >MotionProxyAddress must be a valid url
+                      http://www.xcally.com</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.deskAccount.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="INTEGRATIONS.CONFIGURATIONS">CONFIGURATIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="deskAccount-detail-form-container configurations md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div
+                class="h2 secondary-text"
+                translate="INTEGRATIONS.CONFIGURATIONS"
+              >
+                CONFIGURATIONS
+              </div>
+            </div>
+            <div
+              ng-controller="DeskAccountConfigurationsController as vm_cc"
+              ng-init="vm_cc.init(vm.deskAccount, vm.crudPermissions)"
+              layout="row"
+            >
+              <md-card class="md-whiteframe-1dp" flex="30">
+                <div layout="row" layout-align="center center">
+                  <md-subheader flex="75" class="md-no-sticky"
+                    >{{ 'INTEGRATIONS.CONFIGURATIONS' | translate
+                    }}</md-subheader
+                  >
+                  <md-button
+                    flex="25"
+                    ng-if="vm_cc.crudPermissions.canEdit"
+                    ng-click="vm_cc.createOrEditDeskConfiguration($event)"
+                    class="md-icon-button"
+                    aria-label="create deskConfiguration"
+                  >
+                    <md-icon md-font-icon="icon-plus"></md-icon>
+                  </md-button>
+                </div>
+                <md-list>
+                  <md-list-item
+                    layout="row"
+                    layout-align="center center"
+                    ng-repeat="deskConfiguration in vm_cc.configurations"
+                    class="border-top"
+                    md-colors="{background: (vm_cc.selectedDeskConfiguration == $index ? 'accent' : 'grey-A100')}"
+                    ng-click="vm_cc.getDeskConfiguration($index)"
+                  >
+                    <span class="text-truncate" flex="80"
+                      >{{ deskConfiguration.name }}</span
+                    >
+                    <md-menu ng-if="vm_cc.crudPermissions.canDelete">
+                      <md-button
+                        class="md-icon-button"
+                        aria-label="More"
+                        translate
+                        translate-attr-aria-label="INTEGRATIONS.MORE"
+                        ng-click="$mdOpenMenu($event)"
+                      >
+                        <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                      </md-button>
+                      <md-menu-content width="3">
+                        <md-menu-item ng-if="vm_cc.crudPermissions.canDelete">
+                          <md-button
+                            ng-click="vm_cc.deleteDeskConfiguration($event, deskConfiguration)"
+                            translate="INTEGRATIONS.DELETE_DESKCONFIGURATION"
+                          >
+                            Delete DeskConfiguration
+                          </md-button>
+                        </md-menu-item>
+                      </md-menu-content>
+                    </md-menu>
+                  </md-list-item>
+                </md-list>
+              </md-card>
+              <div flex></div>
+              <md-card class="md-whiteframe-1dp" flex="65">
+                <md-tabs ng-if="vm_cc.configurations.length" md-dynamic-height>
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.SUBJECTS">SUBJECTS</span>
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedSubjects.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.subject = query"
+                            on-collapse="vm_cc.query.subject = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditSubject($event)"
+                            aria-label="add subject"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_SUBJECT"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedSubjects.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedSubjects.length}}
+                            {{vm_cc.selectedSubjects.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedSubjects($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedSubjects"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.ID' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.TYPE' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.CONTENT' | translate }}
+                              </th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="subject"
+                              md-select-id="id"
+                              ng-repeat="subject in vm_cc.subjects | filter: vm_cc.query.subject"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                                class="id"
+                              >
+                                {{subject.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="subject.FieldId"
+                                  >{{subject.nameField ||
+                                  subject.idField}}</span
+                                >
+                                <span ng-if="!subject.FieldId"
+                                  >{{subject.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="subject.type"
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{subject.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{subject.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{
+                                  vm_cc.variablesById[subject.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{subject.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{subject.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{subject.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[subject.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default
+                                  >{{subject.content}}</span
+                                >
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="INTEGRATIONS.MORE"
+                                    ng-click="$mdOpenMenu($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                        translate="INTEGRATIONS.EDIT_SUBJECT"
+                                      >
+                                        Edit Subject
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteSubjectConfirm($event, subject)"
+                                        translate="INTEGRATIONS.DELETE_SUBJECT"
+                                      >
+                                        Delete Subject
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.DESCRIPTIONS"
+                        >DESCRIPTIONS</span
+                      >
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedDescriptions.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.description = query"
+                            on-collapse="vm_cc.query.description = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditDescription($event)"
+                            aria-label="add description"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_DESCRIPTION"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedDescriptions.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedDescriptions.length}}
+                            {{vm_cc.selectedDescriptions.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedDescriptions($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedDescriptions"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.ID' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.TYPE' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.CONTENT' | translate }}
+                              </th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="description"
+                              md-select-id="id"
+                              ng-repeat="description in vm_cc.descriptions | filter: vm_cc.query.description"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                                class="id"
+                              >
+                                {{description.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="description.FieldId"
+                                  >{{description.nameField ||
+                                  description.idField}}</span
+                                >
+                                <span ng-if="!description.FieldId"
+                                  >{{description.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="description.type"
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{description.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{description.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{
+                                  vm_cc.variablesById[description.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{description.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{description.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{description.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[description.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default
+                                  >{{description.content}}</span
+                                >
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="INTEGRATIONS.MORE"
+                                    ng-click="$mdOpenMenu($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditDescription($event, description)"
+                                        translate="INTEGRATIONS.EDIT_DESCRIPTION"
+                                      >
+                                        Edit Description
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteDescriptionConfirm($event, description)"
+                                        translate="INTEGRATIONS.DELETE_DESCRIPTION"
+                                      >
+                                        Delete Description
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.FIELDS">FIELDS</span>
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedFields.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.field = query"
+                            on-collapse="vm_cc.query.field = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditField($event)"
+                            aria-label="add field"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_FIELD"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedFields.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedFields.length}}
+                            {{vm_cc.selectedFields.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedFields($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedFields"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.ID' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.TYPE' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.CONTENT' | translate }}
+                              </th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="field"
+                              md-select-id="id"
+                              ng-repeat="field in vm_cc.fields | filter: vm_cc.query.field"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditField($event, field)"
+                                md-cell
+                                class="id"
+                              >
+                                {{field.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditField($event, field)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="field.FieldId"
+                                  >{{field.nameField || field.idField}}</span
+                                >
+                                <span ng-if="!field.FieldId"
+                                  >{{field.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="field.type"
+                                ng-click="vm_cc.createOrEditField($event, field)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{field.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{field.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{ vm_cc.variablesById[field.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{field.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{field.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{field.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[field.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default>{{field.content}}</span>
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="INTEGRATIONS.MORE"
+                                    ng-click="$mdOpenMenu($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditField($event, field)"
+                                        translate="INTEGRATIONS.EDIT_FIELD"
+                                      >
+                                        Edit Field
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteFieldConfirm($event, field)"
+                                        translate="INTEGRATIONS.DELETE_FIELD"
+                                      >
+                                        Delete Field
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.TAGS">TAGS</span>
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-table-container class="md-whiteframe-1dp padding-20">
+                        <md-input-container class="md-block">
+                          <label translate="INTEGRATIONS.TAGS">Tags</label>
+                          <md-select
+                            ng-model="vm_cc.selectedTags"
+                            ng-change="vm_cc.selectTagsChanged($event)"
+                            multiple
+                          >
+                            <md-option
+                              ng-value="tag.id"
+                              ng-repeat="tag in vm_cc.tags"
+                              >{{ tag.name }}</md-option
+                            >
+                          </md-select>
+                        </md-input-container>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+                </md-tabs>
+                <div
+                  class="padding-20"
+                  ng-if="!vm_cc.configurations.length && vm_cc.crudPermissions.canEdit"
+                  ng-click="vm_cc.createOrEditDeskConfiguration($event)"
+                  layout="row"
+                  layout-sm="column"
+                  layout-align="center center"
+                  layout-wrap
+                >
+                  <div
+                    class="padding-20 md-whiteframe-3dp md-accent-bg"
+                    layout="column"
+                    layout-align="center center"
+                  >
+                    <md-button class="md-icon-button">
+                      <md-icon md-font-icon="icon-plus"></md-icon>
+                    </md-button>
+                    <span
+                      aria-label="add configuration"
+                      translate
+                      translate-attr-label="INTEGRATIONS.ADD_CONFIGURATION"
+                      >ADD CONFIGURATION</span
+                    >
+                  </div>
+                </div>
+              </md-card>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index a91cd3b..0000000
--- a/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,329 +0,0 @@
-<md-dialog
-  class="dynamics365Account-dialog"
-  aria-label="New Dynamics365Account"
->
-  <form name="dynamics365AccountForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.dynamics365Account.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="dynamics365AccountForm['name'].$error"
-          ng-show="dynamics365AccountForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.USERNAME">Username</label>
-        <input
-          type="text"
-          name="username"
-          ng-model="vm.dynamics365Account.username"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="dynamics365AccountForm['username'].$error"
-          ng-show="dynamics365AccountForm['username'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
-              >Username field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.PASSWORD">Password</label>
-        <input
-          type="password"
-          name="password"
-          ng-model="vm.dynamics365Account.password"
-          placeholder="Password"
-          translate
-          translate-attr-placeholder="INTEGRATIONS.PASSWORD"
-          required
-        />
-        <div
-          ng-messages="dynamics365AccountForm['password'].$error"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.PASSWORD_REQUIRED"
-              >Password field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span translate="INTEGRATIONS.ERRORS.SECURE_PASSWORD_PATTERN"
-              >Must contain at least 8 characters, with a minimum of 1 lowercase
-              letter, 1 uppercase letter, 1 numeric character and 1 special
-              character ~!?*@#$%^&-_=+[{]}.</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.URI">Uri</label>
-        <input
-          type="url"
-          name="remoteUri"
-          ng-model="vm.dynamics365Account.remoteUri"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="dynamics365AccountForm['remoteUri'].$error"
-          ng-show="dynamics365AccountForm['remoteUri'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
-              >Uri field is required</span
-            >
-          </div>
-          <div ng-message="url">
-            <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
-              >Uri must be a valid url http://www.xcally.com</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.TENANTID">TenantId</label>
-        <input
-          type="text"
-          name="tenantId"
-          ng-model="vm.dynamics365Account.tenantId"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="dynamics365AccountForm['tenantId'].$error"
-          ng-show="dynamics365AccountForm['tenantId'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.TENANTID_REQUIRED"
-              >TenantId field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.CLIENTID">ClientId</label>
-        <input
-          type="text"
-          name="clientId"
-          ng-model="vm.dynamics365Account.clientId"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="dynamics365AccountForm['clientId'].$error"
-          ng-show="dynamics365AccountForm['clientId'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.CLIENTID_REQUIRED"
-              >ClientId field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.CLIENTSECRET">ClientSecret</label>
-        <input
-          type="text"
-          name="clientSecret"
-          ng-model="vm.dynamics365Account.clientSecret"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="dynamics365AccountForm['clientSecret'].$error"
-          ng-show="dynamics365AccountForm['clientSecret'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.CLIENTSECRET_REQUIRED"
-              >ClientSecret field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
-          >MotionProxyAddress</label
-        >
-        <input
-          type="url"
-          name="serverUrl"
-          ng-model="vm.dynamics365Account.serverUrl"
-        />
-
-        <div class="hint">
-          <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
-        </div>
-        <div
-          ng-messages="dynamics365AccountForm['serverUrl'].$error"
-          ng-show="dynamics365AccountForm['serverUrl'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
-              >MotionProxyAddress field is required</span
-            >
-          </div>
-          <div ng-message="url">
-            <span
-              translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
-              >MotionProxyAddress must be a valid url
-              http://www.xcally.com</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.dynamics365Account.description"
-        />
-
-        <div
-          ng-messages="dynamics365AccountForm['description'].$error"
-          ng-show="dynamics365AccountForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newDynamics365Account"
-          ng-click="vm.saveDynamics365Account()"
-          class="send-button md-accent md-raised"
-          ng-disabled="dynamics365AccountForm.$invalid || dynamics365AccountForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newDynamics365Account"
-          ng-click="vm.addNewDynamics365Account()"
-          class="send-button md-accent md-raised"
-          ng-disabled="dynamics365AccountForm.$invalid"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD_DYNAMICS365ACCOUNT"
-          translate-attr-aria-label="INTEGRATIONS.ADD_DYNAMICS365ACCOUNT"
-        >
-          ADD DYNAMICS365ACCOUNT
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newDynamics365Account"
-          ng-click="vm.deleteDynamics365Account($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/create/dialog.html/dialog.html
new file mode 100644
index 0000000..a91cd3b
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/create/dialog.html/dialog.html
@@ -0,0 +1,329 @@
+<md-dialog
+  class="dynamics365Account-dialog"
+  aria-label="New Dynamics365Account"
+>
+  <form name="dynamics365AccountForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.dynamics365Account.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="dynamics365AccountForm['name'].$error"
+          ng-show="dynamics365AccountForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.USERNAME">Username</label>
+        <input
+          type="text"
+          name="username"
+          ng-model="vm.dynamics365Account.username"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="dynamics365AccountForm['username'].$error"
+          ng-show="dynamics365AccountForm['username'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
+              >Username field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.PASSWORD">Password</label>
+        <input
+          type="password"
+          name="password"
+          ng-model="vm.dynamics365Account.password"
+          placeholder="Password"
+          translate
+          translate-attr-placeholder="INTEGRATIONS.PASSWORD"
+          required
+        />
+        <div
+          ng-messages="dynamics365AccountForm['password'].$error"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.PASSWORD_REQUIRED"
+              >Password field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span translate="INTEGRATIONS.ERRORS.SECURE_PASSWORD_PATTERN"
+              >Must contain at least 8 characters, with a minimum of 1 lowercase
+              letter, 1 uppercase letter, 1 numeric character and 1 special
+              character ~!?*@#$%^&-_=+[{]}.</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.URI">Uri</label>
+        <input
+          type="url"
+          name="remoteUri"
+          ng-model="vm.dynamics365Account.remoteUri"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="dynamics365AccountForm['remoteUri'].$error"
+          ng-show="dynamics365AccountForm['remoteUri'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
+              >Uri field is required</span
+            >
+          </div>
+          <div ng-message="url">
+            <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
+              >Uri must be a valid url http://www.xcally.com</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.TENANTID">TenantId</label>
+        <input
+          type="text"
+          name="tenantId"
+          ng-model="vm.dynamics365Account.tenantId"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="dynamics365AccountForm['tenantId'].$error"
+          ng-show="dynamics365AccountForm['tenantId'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.TENANTID_REQUIRED"
+              >TenantId field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.CLIENTID">ClientId</label>
+        <input
+          type="text"
+          name="clientId"
+          ng-model="vm.dynamics365Account.clientId"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="dynamics365AccountForm['clientId'].$error"
+          ng-show="dynamics365AccountForm['clientId'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.CLIENTID_REQUIRED"
+              >ClientId field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.CLIENTSECRET">ClientSecret</label>
+        <input
+          type="text"
+          name="clientSecret"
+          ng-model="vm.dynamics365Account.clientSecret"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="dynamics365AccountForm['clientSecret'].$error"
+          ng-show="dynamics365AccountForm['clientSecret'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.CLIENTSECRET_REQUIRED"
+              >ClientSecret field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
+          >MotionProxyAddress</label
+        >
+        <input
+          type="url"
+          name="serverUrl"
+          ng-model="vm.dynamics365Account.serverUrl"
+        />
+
+        <div class="hint">
+          <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
+        </div>
+        <div
+          ng-messages="dynamics365AccountForm['serverUrl'].$error"
+          ng-show="dynamics365AccountForm['serverUrl'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
+              >MotionProxyAddress field is required</span
+            >
+          </div>
+          <div ng-message="url">
+            <span
+              translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
+              >MotionProxyAddress must be a valid url
+              http://www.xcally.com</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.dynamics365Account.description"
+        />
+
+        <div
+          ng-messages="dynamics365AccountForm['description'].$error"
+          ng-show="dynamics365AccountForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newDynamics365Account"
+          ng-click="vm.saveDynamics365Account()"
+          class="send-button md-accent md-raised"
+          ng-disabled="dynamics365AccountForm.$invalid || dynamics365AccountForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newDynamics365Account"
+          ng-click="vm.addNewDynamics365Account()"
+          class="send-button md-accent md-raised"
+          ng-disabled="dynamics365AccountForm.$invalid"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD_DYNAMICS365ACCOUNT"
+          translate-attr-aria-label="INTEGRATIONS.ADD_DYNAMICS365ACCOUNT"
+        >
+          ADD DYNAMICS365ACCOUNT
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newDynamics365Account"
+          ng-click="vm.deleteDynamics365Account($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/dynamics365Accounts.html/dynamics365Accounts-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/dynamics365Accounts.html/dynamics365Accounts-[chunkhash].html
deleted file mode 100644
index d9a2304..0000000
--- a/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/dynamics365Accounts.html/dynamics365Accounts-[chunkhash].html
+++ /dev/null
@@ -1,325 +0,0 @@
-<div
-  id="dynamics365Accounts"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-heart" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="INTEGRATIONS.DYNAMICS365ACCOUNTS"
-          >Dynamics365Accounts</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="INTEGRATIONS.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedDynamics365Accounts.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div
-      class="close-button-wrapper"
-      ng-click="vm.selectedDynamics365Accounts =[]"
-    >
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="INTEGRATIONS.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-dynamics365Accounts-count">
-          <span>{{vm.selectedDynamics365Accounts.length}}</span>
-          <span translate="INTEGRATIONS.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="INTEGRATIONS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllDynamics365Accounts()"
-                translate="INTEGRATIONS.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectDynamics365Accounts()"
-                translate="INTEGRATIONS.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedDynamics365Accounts"
-          csv-label="true"
-          filename="dynamics365Accounts.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedDynamics365Accounts($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- DYNAMICS365ACCOUNT TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedDynamics365Accounts"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getDynamics365Accounts"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">
-                  {{ 'INTEGRATIONS.ID' | translate }}
-                </th>
-                <th md-column md-order-by="name">
-                  {{ 'INTEGRATIONS.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="username">
-                  {{ 'INTEGRATIONS.USERNAME' | translate }}
-                </th>
-                <th md-column md-order-by="remoteUri">
-                  {{ 'INTEGRATIONS.URI' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.dynamics365Accounts.rows.length">
-                <td md-cell colspan="5">
-                  <div layout="row" layout-align="center center">
-                    <span translate="INTEGRATIONS.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="dynamics365Account"
-                md-select-id="id"
-                ng-repeat="dynamics365Account in vm.dynamics365Accounts.rows"
-              >
-                <td md-cell ng-if="dynamics365Account.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{dynamics365Account.name}}"
-                    ng-src="api/users/{{dynamics365Account.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!dynamics365Account.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{dynamics365Account.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(dynamics365Account, ev) : vm.createOrEditDynamics365Account($event, dynamics365Account)"
-                  md-cell
-                  class="id"
-                >
-                  {{dynamics365Account.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(dynamics365Account, ev) : vm.createOrEditDynamics365Account($event, dynamics365Account)"
-                  md-cell
-                  class="name"
-                >
-                  {{dynamics365Account.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(dynamics365Account, ev) : vm.createOrEditDynamics365Account($event, dynamics365Account)"
-                  md-cell
-                  class="username"
-                >
-                  {{dynamics365Account.username}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(dynamics365Account, ev) : vm.createOrEditDynamics365Account($event, dynamics365Account)"
-                  md-cell
-                  class="remoteUri"
-                >
-                  {{dynamics365Account.remoteUri}}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="INTEGRATIONS.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(dynamics365Account, $event    )"
-                          translate="INTEGRATIONS.EDIT_DYNAMICS365ACCOUNT"
-                        >
-                          Edit Dynamics365Account
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.testtestintegrationaccount(dynamics365Account, $event    )"
-                          translate="INTEGRATIONS.TEST_DYNAMICS365ACCOUNT"
-                        >
-                          Test Dynamics365Account
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item
-                        ng-if="vm.currentUser.crudPermissions === 0 || vm.currentUser.role === 'admin'"
-                      >
-                        <md-button
-                          ng-click="vm.deleteconfirm(dynamics365Account, $event    )"
-                          translate="INTEGRATIONS.DELETE_DYNAMICS365ACCOUNT"
-                        >
-                          Delete Dynamics365Account
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'INTEGRATIONS.PAGE' | translate}}:', rowsPerPage: '{{'INTEGRATIONS.ROWSPERPAGE' | translate}}:', of: '{{'INTEGRATIONS.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.dynamics365Accounts.count}}"
-          md-on-paginate="vm.getDynamics365Accounts"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / DYNAMICS365ACCOUNT TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD DYNAMICS365ACCOUNT BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-dynamics365Account-button"
-    ng-click="vm.createOrEditDynamics365Account($event)"
-    aria-label="add dynamics365Account"
-    translate
-    translate-attr-aria-label="INTEGRATIONS.ADD_DYNAMICS365ACCOUNT"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD DYNAMICS365ACCOUNT BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/dynamics365Accounts.html/dynamics365Accounts.html b/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/dynamics365Accounts.html/dynamics365Accounts.html
new file mode 100644
index 0000000..d9a2304
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/dynamics365Accounts.html/dynamics365Accounts.html
@@ -0,0 +1,325 @@
+<div
+  id="dynamics365Accounts"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-heart" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="INTEGRATIONS.DYNAMICS365ACCOUNTS"
+          >Dynamics365Accounts</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="INTEGRATIONS.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedDynamics365Accounts.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div
+      class="close-button-wrapper"
+      ng-click="vm.selectedDynamics365Accounts =[]"
+    >
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="INTEGRATIONS.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-dynamics365Accounts-count">
+          <span>{{vm.selectedDynamics365Accounts.length}}</span>
+          <span translate="INTEGRATIONS.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="INTEGRATIONS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllDynamics365Accounts()"
+                translate="INTEGRATIONS.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectDynamics365Accounts()"
+                translate="INTEGRATIONS.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedDynamics365Accounts"
+          csv-label="true"
+          filename="dynamics365Accounts.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedDynamics365Accounts($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- DYNAMICS365ACCOUNT TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedDynamics365Accounts"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getDynamics365Accounts"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">
+                  {{ 'INTEGRATIONS.ID' | translate }}
+                </th>
+                <th md-column md-order-by="name">
+                  {{ 'INTEGRATIONS.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="username">
+                  {{ 'INTEGRATIONS.USERNAME' | translate }}
+                </th>
+                <th md-column md-order-by="remoteUri">
+                  {{ 'INTEGRATIONS.URI' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.dynamics365Accounts.rows.length">
+                <td md-cell colspan="5">
+                  <div layout="row" layout-align="center center">
+                    <span translate="INTEGRATIONS.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="dynamics365Account"
+                md-select-id="id"
+                ng-repeat="dynamics365Account in vm.dynamics365Accounts.rows"
+              >
+                <td md-cell ng-if="dynamics365Account.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{dynamics365Account.name}}"
+                    ng-src="api/users/{{dynamics365Account.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!dynamics365Account.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{dynamics365Account.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(dynamics365Account, ev) : vm.createOrEditDynamics365Account($event, dynamics365Account)"
+                  md-cell
+                  class="id"
+                >
+                  {{dynamics365Account.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(dynamics365Account, ev) : vm.createOrEditDynamics365Account($event, dynamics365Account)"
+                  md-cell
+                  class="name"
+                >
+                  {{dynamics365Account.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(dynamics365Account, ev) : vm.createOrEditDynamics365Account($event, dynamics365Account)"
+                  md-cell
+                  class="username"
+                >
+                  {{dynamics365Account.username}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(dynamics365Account, ev) : vm.createOrEditDynamics365Account($event, dynamics365Account)"
+                  md-cell
+                  class="remoteUri"
+                >
+                  {{dynamics365Account.remoteUri}}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="INTEGRATIONS.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(dynamics365Account, $event    )"
+                          translate="INTEGRATIONS.EDIT_DYNAMICS365ACCOUNT"
+                        >
+                          Edit Dynamics365Account
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.testtestintegrationaccount(dynamics365Account, $event    )"
+                          translate="INTEGRATIONS.TEST_DYNAMICS365ACCOUNT"
+                        >
+                          Test Dynamics365Account
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item
+                        ng-if="vm.currentUser.crudPermissions === 0 || vm.currentUser.role === 'admin'"
+                      >
+                        <md-button
+                          ng-click="vm.deleteconfirm(dynamics365Account, $event    )"
+                          translate="INTEGRATIONS.DELETE_DYNAMICS365ACCOUNT"
+                        >
+                          Delete Dynamics365Account
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'INTEGRATIONS.PAGE' | translate}}:', rowsPerPage: '{{'INTEGRATIONS.ROWSPERPAGE' | translate}}:', of: '{{'INTEGRATIONS.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.dynamics365Accounts.count}}"
+          md-on-paginate="vm.getDynamics365Accounts"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / DYNAMICS365ACCOUNT TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD DYNAMICS365ACCOUNT BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-dynamics365Account-button"
+    ng-click="vm.createOrEditDynamics365Account($event)"
+    aria-label="add dynamics365Account"
+    translate
+    translate-attr-aria-label="INTEGRATIONS.ADD_DYNAMICS365ACCOUNT"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD DYNAMICS365ACCOUNT BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/edit/configurations/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/edit/configurations/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 1fe9ed7..0000000
--- a/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/edit/configurations/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,214 +0,0 @@
-<md-dialog
-  class="dynamics365Configuration-dialog"
-  aria-label="New Dynamics365Configuration"
->
-  <form name="dynamics365ConfigurationForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.NAME">Name</label>
-        <input
-          type=""
-          name="name"
-          ng-model="vm.dynamics365Configuration.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="dynamics365ConfigurationForm['name'].$error"
-          ng-show="dynamics365ConfigurationForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.CHANNEL">Channel</label>
-        <md-select
-          name="channel"
-          ng-model="vm.dynamics365Configuration.channel"
-          required
-        >
-          <md-option ng-value="'voice'">
-            {{ 'INTEGRATIONS.VOICE' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="dynamics365ConfigurationForm['channel'].$error"
-          ng-show="dynamics365ConfigurationForm['channel'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.CHANNEL_REQUIRED"
-              >Channel field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.TYPE">Type</label>
-        <md-select
-          name="type"
-          ng-model="vm.dynamics365Configuration.type"
-          required
-        >
-          <md-option ng-value="'inbound'">
-            {{ 'INTEGRATIONS.INBOUND_IN_QUEUE' | translate }}
-          </md-option>
-
-          <md-option ng-value="'outbound'">
-            {{ 'INTEGRATIONS.OUTBOUND_CALL' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="dynamics365ConfigurationForm['type'].$error"
-          ng-show="dynamics365ConfigurationForm['type'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-              >Type field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.TICKETTYPE">TicketType</label>
-        <md-select
-          name="ticketType"
-          ng-model="vm.dynamics365Configuration.ticketType"
-          required
-        >
-          <md-option ng-value="'incident'">
-            {{ 'INTEGRATIONS.CASE' | translate }}
-          </md-option>
-
-          <md-option ng-value="'phonecall'">
-            {{ 'INTEGRATIONS.PHONECALL' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="dynamics365ConfigurationForm['ticketType'].$error"
-          ng-show="dynamics365ConfigurationForm['ticketType'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.TICKETTYPE_REQUIRED"
-              >TicketType field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newDynamics365Configuration"
-          ng-click="vm.saveDynamics365Configuration()"
-          class="send-button md-accent md-raised"
-          ng-disabled="dynamics365ConfigurationForm.$invalid || dynamics365ConfigurationForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newDynamics365Configuration"
-          ng-click="vm.addNewDynamics365Configuration()"
-          class="send-button md-accent md-raised"
-          ng-disabled="dynamics365ConfigurationForm.$invalid"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD_DYNAMICS365CONFIGURATION"
-          translate-attr-aria-label="INTEGRATIONS.ADD_DYNAMICS365CONFIGURATION"
-        >
-          ADD DYNAMICS365CONFIGURATION
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newDynamics365Configuration"
-          ng-click="vm.deleteDynamics365Configuration($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/edit/configurations/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/edit/configurations/dialog.html/dialog.html
new file mode 100644
index 0000000..1fe9ed7
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/edit/configurations/dialog.html/dialog.html
@@ -0,0 +1,214 @@
+<md-dialog
+  class="dynamics365Configuration-dialog"
+  aria-label="New Dynamics365Configuration"
+>
+  <form name="dynamics365ConfigurationForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.NAME">Name</label>
+        <input
+          type=""
+          name="name"
+          ng-model="vm.dynamics365Configuration.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="dynamics365ConfigurationForm['name'].$error"
+          ng-show="dynamics365ConfigurationForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.CHANNEL">Channel</label>
+        <md-select
+          name="channel"
+          ng-model="vm.dynamics365Configuration.channel"
+          required
+        >
+          <md-option ng-value="'voice'">
+            {{ 'INTEGRATIONS.VOICE' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="dynamics365ConfigurationForm['channel'].$error"
+          ng-show="dynamics365ConfigurationForm['channel'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.CHANNEL_REQUIRED"
+              >Channel field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.TYPE">Type</label>
+        <md-select
+          name="type"
+          ng-model="vm.dynamics365Configuration.type"
+          required
+        >
+          <md-option ng-value="'inbound'">
+            {{ 'INTEGRATIONS.INBOUND_IN_QUEUE' | translate }}
+          </md-option>
+
+          <md-option ng-value="'outbound'">
+            {{ 'INTEGRATIONS.OUTBOUND_CALL' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="dynamics365ConfigurationForm['type'].$error"
+          ng-show="dynamics365ConfigurationForm['type'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+              >Type field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.TICKETTYPE">TicketType</label>
+        <md-select
+          name="ticketType"
+          ng-model="vm.dynamics365Configuration.ticketType"
+          required
+        >
+          <md-option ng-value="'incident'">
+            {{ 'INTEGRATIONS.CASE' | translate }}
+          </md-option>
+
+          <md-option ng-value="'phonecall'">
+            {{ 'INTEGRATIONS.PHONECALL' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="dynamics365ConfigurationForm['ticketType'].$error"
+          ng-show="dynamics365ConfigurationForm['ticketType'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.TICKETTYPE_REQUIRED"
+              >TicketType field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newDynamics365Configuration"
+          ng-click="vm.saveDynamics365Configuration()"
+          class="send-button md-accent md-raised"
+          ng-disabled="dynamics365ConfigurationForm.$invalid || dynamics365ConfigurationForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newDynamics365Configuration"
+          ng-click="vm.addNewDynamics365Configuration()"
+          class="send-button md-accent md-raised"
+          ng-disabled="dynamics365ConfigurationForm.$invalid"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD_DYNAMICS365CONFIGURATION"
+          translate-attr-aria-label="INTEGRATIONS.ADD_DYNAMICS365CONFIGURATION"
+        >
+          ADD DYNAMICS365CONFIGURATION
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newDynamics365Configuration"
+          ng-click="vm.deleteDynamics365Configuration($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/edit/item/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/edit/item/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index d6f6743..0000000
--- a/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/edit/item/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,478 +0,0 @@
-<md-dialog class="dynamics365Account-item-dialog" aria-label="New Item">
-  <form name="dynamics365AccountItemForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <div ng-switch="vm.type">
-        <div ng-switch-when="subject">
-          <!-- SUBJECT SECTION -->
-          <div ng-include="'/subject.html'"></div>
-          <!-- / SUBJECT SECTION -->
-        </div>
-        <div ng-switch-when="description">
-          <!-- DESCRIPTION SECTION -->
-          <md-input-container class="md-block">
-            <label translate="INTEGRATIONS.TYPE">Type</label>
-            <md-select name="type" ng-model="vm.item.type" required>
-              <md-option value="string">String</md-option>
-              <md-option value="keyValue">Key Value</md-option>
-            </md-select>
-            <div
-              ng-messages="dynamics365AccountItemForm.type.$error"
-              ng-show="dynamics365AccountItemForm.type.$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-                  >Type field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
-            <label translate="INTEGRATIONS.CONTENT">Content</label>
-            <input
-              type="text"
-              name="content"
-              ng-model="vm.item.content"
-              required
-              md-autofocus
-            />
-            <div
-              ng-messages="dynamics365AccountItemForm.content.$error"
-              ng-show="dynamics365AccountItemForm.content.$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
-                  >Content field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <div ng-if="vm.item.type == 'keyValue'">
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.KEY">Key</label>
-              <input
-                type="text"
-                name="key"
-                ng-model="vm.item.key"
-                required
-                md-autofocus
-              />
-              <div
-                ng-messages="dynamics365AccountItemForm.key.$error"
-                ng-show="dynamics365AccountItemForm.key.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.KEY_REQUIRED"
-                    >Key field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.TYPE">Type</label>
-              <md-select name="keyType" ng-model="vm.item.keyType" required>
-                <md-option value="string">String</md-option>
-                <md-option value="variable">Variable</md-option>
-                <md-option value="customVariable">Custom Variable</md-option>
-              </md-select>
-              <div
-                ng-messages="dynamics365AccountItemForm.keyType.$error"
-                ng-show="dynamics365AccountItemForm.keyType.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-                    >Type field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'string'"
-            >
-              <label translate="INTEGRATIONS.CONTENT">Content</label>
-              <input
-                type="text"
-                name="keyContent"
-                ng-model="vm.item.keyContent"
-                required
-                md-autofocus
-              />
-              <div
-                ng-messages="dynamics365AccountItemForm.keyContent.$error"
-                ng-show="dynamics365AccountItemForm.keyContent.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
-                    >Content field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'variable'"
-            >
-              <label translate="INTEGRATIONS.VALUE">Value</label>
-              <md-select
-                name="variableName"
-                ng-model="vm.item.variableName"
-                md-selected-text="vm.getSelectedVariable()"
-                required
-              >
-                <md-optgroup label="Voice: Queue">
-                  <md-option
-                    ng-value="agentColumn"
-                    ng-repeat="agentColumn in vm.voiceAgentReportColumns"
-                    >{{agentColumn}}
-                  </md-option>
-                </md-optgroup>
-                <md-optgroup label="Voice: Outbound">
-                  <md-option
-                    ng-value="dialColumn"
-                    ng-repeat="dialColumn in vm.voiceDialReportColumns"
-                    >{{dialColumn}}</md-option
-                  >
-                </md-optgroup>
-              </md-select>
-              <div
-                ng-messages="dynamics365AccountItemForm.variableName.$error"
-                ng-show="dynamics365AccountItemForm.variableName.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED"
-                    >Variable name field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'customVariable'"
-            >
-              <label translate="INTEGRATIONS.VALUE">Value</label>
-              <md-select ng-model="vm.item.VariableId" required>
-                <md-option
-                  ng-value="variable.id"
-                  ng-repeat="variable in vm.variables"
-                  >{{variable.name}}
-                </md-option>
-              </md-select>
-            </md-input-container>
-          </div>
-          <!-- / DESCRIPTION SECTION -->
-        </div>
-        <div ng-switch-when="field">
-          <!-- FIELD SECTION -->
-          <div ng-if="vm.accountConnected">
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.FIELD">FIELD</label>
-              <!-- ITEM TYPE DEFAULT VALUE is STRING -->
-              <md-select
-                name="customField"
-                ng-model="vm.customField"
-                required
-                ng-change="vm.item.type = 'string'"
-              >
-                <md-optgroup label="Standard">
-                  <md-option
-                    ng-value="standard"
-                    ng-repeat="standard in vm.fields | filter: {custom: false} "
-                    >{{standard.name}}
-                  </md-option>
-                </md-optgroup>
-
-                <md-optgroup label="Custom">
-                  <md-option
-                    ng-value="custom"
-                    ng-repeat="custom in vm.fields | filter: {custom: true} "
-                    >{{custom.name}}
-                  </md-option>
-                </md-optgroup>
-              </md-select>
-              <div
-                ng-messages="dynamics365AccountItemForm.customField.$error"
-                ng-show="dynamics365AccountItemForm.customField.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.FIELD_REQUIRED"
-                    >Field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <!-- FIELDS -->
-            <div ng-if="vm.customField" ng-include="'/fields.html'"></div>
-            <!-- FIELDS -->
-          </div>
-          <div ng-if="!vm.accountConnected">
-            <p>Account is not connected. Please check your configurations!</p>
-          </div>
-          <!-- / FIELD SECTION -->
-        </div>
-        <div ng-switch-default>
-          <p>No Item</p>
-        </div>
-      </div>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newItem"
-          ng-click="vm.saveItem()"
-          class="send-button md-accent md-raised"
-          ng-disabled="dynamics365AccountItemForm.$invalid || dynamics365AccountItemForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newItem"
-          ng-click="vm.addNewItem()"
-          class="send-button md-accent md-raised"
-          ng-disabled="dynamics365AccountItemForm.$invalid || dynamics365AccountItemForm.$pristine"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD"
-          translate-attr-aria-label="INTEGRATIONS.ADD"
-        >
-          ADD
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newItem"
-          ng-click="vm.deleteItem($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
-
-<script type="text/ng-template" id="/fields.html">
-
-  <!-- type -->
-  <md-input-container class="md-block" ng-if="!vm.customField.options.length">
-
-      <label translate="INTEGRATIONS.TYPE">Type</label>
-      <md-select name="type" ng-model="vm.item.type" required>
-
-          <md-option value="string">String</md-option>
-          <md-option value="variable">Variable</md-option>
-          <md-option value="customVariable">Custom Variable</md-option>
-      </md-select>
-      <div ng-messages="dynamics365AccountItemForm.type.$error" ng-show="dynamics365AccountItemForm.type.$touched"
-          role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <!--/ type -->
-
-  <!-- value -->
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && vm.customField.options.length">
-      <!-- options -->
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-
-      <md-select name="option" ng-model="vm.item.content" required>
-          <md-option ng-value="option.value" ng-repeat="option in vm.customField.options">{{option.name}}</md-option>
-      </md-select>
-
-      <div ng-messages="dynamics365AccountItemForm.option.$error"
-          ng-show="dynamics365AccountItemForm.option.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VALUE_REQUIRED">Value field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && !vm.customField.options.length">
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-
-      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
-
-      <div ng-messages="dynamics365AccountItemForm.content.$error"
-          ng-show="dynamics365AccountItemForm.content.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
-          required>
-          <md-optgroup label="Voice: Queue">
-              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
-              </md-option>
-          </md-optgroup>
-          <md-optgroup label="Voice: Outbound">
-              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
-              </md-option>
-          </md-optgroup>
-      </md-select>
-      <div ng-messages="dynamics365AccountItemForm.variableName.$error"
-          ng-show="dynamics365AccountItemForm.variableName.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select ng-model="vm.item.VariableId" required>
-          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
-      </md-select>
-  </md-input-container>
-
-  <!--/ value -->
-</script>
-
-<script type="text/ng-template" id="/subject.html">
-    <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.TYPE">Type</label>
-            <md-select name="type" ng-model="vm.item.type" required>
-                <md-option value="string">String</md-option>
-                <md-option value="variable">Variable</md-option>
-                <md-option value="customVariable">Custom Variable</md-option>
-            </md-select>
-        <div ng-messages="dynamics365AccountItemForm.type.$error" ng-show="dynamics365AccountItemForm.type.$touched" role="alert">
-            <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
-             </div>
-        </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
-      <div ng-messages="dynamics365AccountItemForm.content.$error"
-          ng-show="dynamics365AccountItemForm.content.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
-          required>
-          <md-optgroup label="Voice: Queue">
-              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
-              </md-option>
-          </md-optgroup>
-          <md-optgroup label="Voice: Outbound">
-              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
-              </md-option>
-          </md-optgroup>
-      </md-select>
-      <div ng-messages="dynamics365AccountItemForm.variableName.$error"
-          ng-show="dynamics365AccountItemForm.variableName.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select ng-model="vm.item.VariableId" required>
-          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
-      </md-select>
-  </md-input-container>
-</script>
diff --git a/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/edit/item/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/edit/item/dialog.html/dialog.html
new file mode 100644
index 0000000..d6f6743
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/edit/item/dialog.html/dialog.html
@@ -0,0 +1,478 @@
+<md-dialog class="dynamics365Account-item-dialog" aria-label="New Item">
+  <form name="dynamics365AccountItemForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <div ng-switch="vm.type">
+        <div ng-switch-when="subject">
+          <!-- SUBJECT SECTION -->
+          <div ng-include="'/subject.html'"></div>
+          <!-- / SUBJECT SECTION -->
+        </div>
+        <div ng-switch-when="description">
+          <!-- DESCRIPTION SECTION -->
+          <md-input-container class="md-block">
+            <label translate="INTEGRATIONS.TYPE">Type</label>
+            <md-select name="type" ng-model="vm.item.type" required>
+              <md-option value="string">String</md-option>
+              <md-option value="keyValue">Key Value</md-option>
+            </md-select>
+            <div
+              ng-messages="dynamics365AccountItemForm.type.$error"
+              ng-show="dynamics365AccountItemForm.type.$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+                  >Type field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
+            <label translate="INTEGRATIONS.CONTENT">Content</label>
+            <input
+              type="text"
+              name="content"
+              ng-model="vm.item.content"
+              required
+              md-autofocus
+            />
+            <div
+              ng-messages="dynamics365AccountItemForm.content.$error"
+              ng-show="dynamics365AccountItemForm.content.$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
+                  >Content field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <div ng-if="vm.item.type == 'keyValue'">
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.KEY">Key</label>
+              <input
+                type="text"
+                name="key"
+                ng-model="vm.item.key"
+                required
+                md-autofocus
+              />
+              <div
+                ng-messages="dynamics365AccountItemForm.key.$error"
+                ng-show="dynamics365AccountItemForm.key.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.KEY_REQUIRED"
+                    >Key field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.TYPE">Type</label>
+              <md-select name="keyType" ng-model="vm.item.keyType" required>
+                <md-option value="string">String</md-option>
+                <md-option value="variable">Variable</md-option>
+                <md-option value="customVariable">Custom Variable</md-option>
+              </md-select>
+              <div
+                ng-messages="dynamics365AccountItemForm.keyType.$error"
+                ng-show="dynamics365AccountItemForm.keyType.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+                    >Type field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'string'"
+            >
+              <label translate="INTEGRATIONS.CONTENT">Content</label>
+              <input
+                type="text"
+                name="keyContent"
+                ng-model="vm.item.keyContent"
+                required
+                md-autofocus
+              />
+              <div
+                ng-messages="dynamics365AccountItemForm.keyContent.$error"
+                ng-show="dynamics365AccountItemForm.keyContent.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
+                    >Content field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'variable'"
+            >
+              <label translate="INTEGRATIONS.VALUE">Value</label>
+              <md-select
+                name="variableName"
+                ng-model="vm.item.variableName"
+                md-selected-text="vm.getSelectedVariable()"
+                required
+              >
+                <md-optgroup label="Voice: Queue">
+                  <md-option
+                    ng-value="agentColumn"
+                    ng-repeat="agentColumn in vm.voiceAgentReportColumns"
+                    >{{agentColumn}}
+                  </md-option>
+                </md-optgroup>
+                <md-optgroup label="Voice: Outbound">
+                  <md-option
+                    ng-value="dialColumn"
+                    ng-repeat="dialColumn in vm.voiceDialReportColumns"
+                    >{{dialColumn}}</md-option
+                  >
+                </md-optgroup>
+              </md-select>
+              <div
+                ng-messages="dynamics365AccountItemForm.variableName.$error"
+                ng-show="dynamics365AccountItemForm.variableName.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED"
+                    >Variable name field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'customVariable'"
+            >
+              <label translate="INTEGRATIONS.VALUE">Value</label>
+              <md-select ng-model="vm.item.VariableId" required>
+                <md-option
+                  ng-value="variable.id"
+                  ng-repeat="variable in vm.variables"
+                  >{{variable.name}}
+                </md-option>
+              </md-select>
+            </md-input-container>
+          </div>
+          <!-- / DESCRIPTION SECTION -->
+        </div>
+        <div ng-switch-when="field">
+          <!-- FIELD SECTION -->
+          <div ng-if="vm.accountConnected">
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.FIELD">FIELD</label>
+              <!-- ITEM TYPE DEFAULT VALUE is STRING -->
+              <md-select
+                name="customField"
+                ng-model="vm.customField"
+                required
+                ng-change="vm.item.type = 'string'"
+              >
+                <md-optgroup label="Standard">
+                  <md-option
+                    ng-value="standard"
+                    ng-repeat="standard in vm.fields | filter: {custom: false} "
+                    >{{standard.name}}
+                  </md-option>
+                </md-optgroup>
+
+                <md-optgroup label="Custom">
+                  <md-option
+                    ng-value="custom"
+                    ng-repeat="custom in vm.fields | filter: {custom: true} "
+                    >{{custom.name}}
+                  </md-option>
+                </md-optgroup>
+              </md-select>
+              <div
+                ng-messages="dynamics365AccountItemForm.customField.$error"
+                ng-show="dynamics365AccountItemForm.customField.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.FIELD_REQUIRED"
+                    >Field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <!-- FIELDS -->
+            <div ng-if="vm.customField" ng-include="'/fields.html'"></div>
+            <!-- FIELDS -->
+          </div>
+          <div ng-if="!vm.accountConnected">
+            <p>Account is not connected. Please check your configurations!</p>
+          </div>
+          <!-- / FIELD SECTION -->
+        </div>
+        <div ng-switch-default>
+          <p>No Item</p>
+        </div>
+      </div>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newItem"
+          ng-click="vm.saveItem()"
+          class="send-button md-accent md-raised"
+          ng-disabled="dynamics365AccountItemForm.$invalid || dynamics365AccountItemForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newItem"
+          ng-click="vm.addNewItem()"
+          class="send-button md-accent md-raised"
+          ng-disabled="dynamics365AccountItemForm.$invalid || dynamics365AccountItemForm.$pristine"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD"
+          translate-attr-aria-label="INTEGRATIONS.ADD"
+        >
+          ADD
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newItem"
+          ng-click="vm.deleteItem($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
+
+<script type="text/ng-template" id="/fields.html">
+
+  <!-- type -->
+  <md-input-container class="md-block" ng-if="!vm.customField.options.length">
+
+      <label translate="INTEGRATIONS.TYPE">Type</label>
+      <md-select name="type" ng-model="vm.item.type" required>
+
+          <md-option value="string">String</md-option>
+          <md-option value="variable">Variable</md-option>
+          <md-option value="customVariable">Custom Variable</md-option>
+      </md-select>
+      <div ng-messages="dynamics365AccountItemForm.type.$error" ng-show="dynamics365AccountItemForm.type.$touched"
+          role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <!--/ type -->
+
+  <!-- value -->
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && vm.customField.options.length">
+      <!-- options -->
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+
+      <md-select name="option" ng-model="vm.item.content" required>
+          <md-option ng-value="option.value" ng-repeat="option in vm.customField.options">{{option.name}}</md-option>
+      </md-select>
+
+      <div ng-messages="dynamics365AccountItemForm.option.$error"
+          ng-show="dynamics365AccountItemForm.option.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VALUE_REQUIRED">Value field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && !vm.customField.options.length">
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+
+      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
+
+      <div ng-messages="dynamics365AccountItemForm.content.$error"
+          ng-show="dynamics365AccountItemForm.content.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
+          required>
+          <md-optgroup label="Voice: Queue">
+              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
+              </md-option>
+          </md-optgroup>
+          <md-optgroup label="Voice: Outbound">
+              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
+              </md-option>
+          </md-optgroup>
+      </md-select>
+      <div ng-messages="dynamics365AccountItemForm.variableName.$error"
+          ng-show="dynamics365AccountItemForm.variableName.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select ng-model="vm.item.VariableId" required>
+          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
+      </md-select>
+  </md-input-container>
+
+  <!--/ value -->
+</script>
+
+<script type="text/ng-template" id="/subject.html">
+    <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.TYPE">Type</label>
+            <md-select name="type" ng-model="vm.item.type" required>
+                <md-option value="string">String</md-option>
+                <md-option value="variable">Variable</md-option>
+                <md-option value="customVariable">Custom Variable</md-option>
+            </md-select>
+        <div ng-messages="dynamics365AccountItemForm.type.$error" ng-show="dynamics365AccountItemForm.type.$touched" role="alert">
+            <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
+             </div>
+        </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
+      <div ng-messages="dynamics365AccountItemForm.content.$error"
+          ng-show="dynamics365AccountItemForm.content.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
+          required>
+          <md-optgroup label="Voice: Queue">
+              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
+              </md-option>
+          </md-optgroup>
+          <md-optgroup label="Voice: Outbound">
+              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
+              </md-option>
+          </md-optgroup>
+      </md-select>
+      <div ng-messages="dynamics365AccountItemForm.variableName.$error"
+          ng-show="dynamics365AccountItemForm.variableName.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select ng-model="vm.item.VariableId" required>
+          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
+      </md-select>
+  </md-input-container>
+</script>
diff --git a/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index fc89a41..0000000
--- a/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,993 +0,0 @@
-<div
-  id="integrations-dynamics365Account"
-  class="page-layout simple tabbed"
-  layout="column"
->
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-dynamics365Accounts-button md-icon-button"
-        aria-label="Go to dynamics365Accounts"
-        ng-click="vm.gotoDynamics365Accounts()"
-        translate
-        translate-attr-aria-label="INTEGRATIONS.GO_TO_DYNAMICS365ACCOUNTS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="dynamics365Account-image" hide-xs>
-          <img ng-src="assets/images/business/dynamics365Accounts.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.dynamics365Account.id}}
-            <span ng-if="vm.dynamics365Account.name"
-              >{{vm.dynamics365Account.name}}</span
-            >
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="INTEGRATIONS.CREATED_AT"></span>
-            <span>{{vm.dynamics365Account.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveDynamics365Account()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (configurationsForm.$invalid)"
-        translate="INTEGRATIONS.SAVE"
-        translate-attr-aria-label="INTEGRATIONS.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="INTEGRATIONS.ACCOUNT">ACCOUNT</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="dynamics365Account-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="INTEGRATIONS.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.dynamics365Account.name"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.USERNAME">Username</label>
-                <input
-                  type="text"
-                  name="username"
-                  ng-model="vm.dynamics365Account.username"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['username'].$error"
-                  ng-show="generalForm['username'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
-                      >Username field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.PASSWORD">Password</label>
-                <input
-                  type="password"
-                  name="password"
-                  ng-model="vm.dynamics365Account.password"
-                  placeholder="Password"
-                  translate
-                  translate-attr-placeholder="INTEGRATIONS.PASSWORD"
-                  required
-                />
-                <div ng-messages="generalForm['password'].$error" role="alert">
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.PASSWORD_REQUIRED"
-                      >Password field is required</span
-                    >
-                  </div>
-                  <div ng-message="pattern">
-                    <span
-                      translate="INTEGRATIONS.ERRORS.SECURE_PASSWORD_PATTERN"
-                      >Must contain at least 8 characters, with a minimum of 1
-                      lowercase letter, 1 uppercase letter, 1 numeric character
-                      and 1 special character ~!?*@#$%^&-_=+[{]}.</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.URI">Uri</label>
-                <input
-                  type="url"
-                  name="remoteUri"
-                  ng-model="vm.dynamics365Account.remoteUri"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['remoteUri'].$error"
-                  ng-show="generalForm['remoteUri'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
-                      >Uri field is required</span
-                    >
-                  </div>
-                  <div ng-message="url">
-                    <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
-                      >Uri must be a valid url http://www.xcally.com</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.TENANTID">TenantId</label>
-                <input
-                  type="text"
-                  name="tenantId"
-                  ng-model="vm.dynamics365Account.tenantId"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['tenantId'].$error"
-                  ng-show="generalForm['tenantId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.TENANTID_REQUIRED"
-                      >TenantId field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.CLIENTID">ClientId</label>
-                <input
-                  type="text"
-                  name="clientId"
-                  ng-model="vm.dynamics365Account.clientId"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['clientId'].$error"
-                  ng-show="generalForm['clientId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.CLIENTID_REQUIRED"
-                      >ClientId field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.CLIENTSECRET"
-                  >ClientSecret</label
-                >
-                <input
-                  type="text"
-                  name="clientSecret"
-                  ng-model="vm.dynamics365Account.clientSecret"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['clientSecret'].$error"
-                  ng-show="generalForm['clientSecret'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.CLIENTSECRET_REQUIRED"
-                      >ClientSecret field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
-                  >MotionProxyAddress</label
-                >
-                <input
-                  type="url"
-                  name="serverUrl"
-                  ng-model="vm.dynamics365Account.serverUrl"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['serverUrl'].$error"
-                  ng-show="generalForm['serverUrl'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
-                      >MotionProxyAddress field is required</span
-                    >
-                  </div>
-                  <div ng-message="url">
-                    <span
-                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
-                      >MotionProxyAddress must be a valid url
-                      http://www.xcally.com</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.dynamics365Account.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="INTEGRATIONS.CONFIGURATIONS">CONFIGURATIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="dynamics365Account-detail-form-container configurations md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div
-                class="h2 secondary-text"
-                translate="INTEGRATIONS.CONFIGURATIONS"
-              >
-                CONFIGURATIONS
-              </div>
-            </div>
-            <div
-              ng-controller="Dynamics365AccountConfigurationsController as vm_cc"
-              ng-init="vm_cc.init(vm.dynamics365Account, vm.crudPermissions)"
-              layout="row"
-            >
-              <md-card class="md-whiteframe-1dp" flex="30">
-                <div layout="row" layout-align="center center">
-                  <md-subheader flex="75" class="md-no-sticky"
-                    >{{ 'INTEGRATIONS.CONFIGURATIONS' | translate
-                    }}</md-subheader
-                  >
-                  <md-button
-                    flex="25"
-                    ng-if="vm_cc.crudPermissions.canEdit"
-                    ng-click="vm_cc.createOrEditDynamics365Configuration($event)"
-                    class="md-icon-button"
-                    aria-label="create dynamics365Configuration"
-                  >
-                    <md-icon md-font-icon="icon-plus"></md-icon>
-                  </md-button>
-                </div>
-                <md-list>
-                  <md-list-item
-                    layout="row"
-                    layout-align="center center"
-                    ng-repeat="dynamics365Configuration in vm_cc.configurations"
-                    class="border-top"
-                    md-colors="{background: (vm_cc.selectedDynamics365Configuration == $index ? 'accent' : 'grey-A100')}"
-                    ng-click="vm_cc.getDynamics365Configuration($index)"
-                  >
-                    <span class="text-truncate" flex="80"
-                      >{{ dynamics365Configuration.name }}</span
-                    >
-                    <md-menu ng-if="vm_cc.crudPermissions.canDelete">
-                      <md-button
-                        class="md-icon-button"
-                        aria-label="More"
-                        translate
-                        translate-attr-aria-label="INTEGRATIONS.MORE"
-                        ng-click="$mdOpenMenu($event)"
-                      >
-                        <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                      </md-button>
-                      <md-menu-content width="3">
-                        <md-menu-item ng-if="vm_cc.crudPermissions.canDelete">
-                          <md-button
-                            ng-click="vm_cc.deleteDynamics365Configuration($event, dynamics365Configuration)"
-                            translate="INTEGRATIONS.DELETE_DYNAMICS365CONFIGURATION"
-                          >
-                            Delete Dynamics365Configuration
-                          </md-button>
-                        </md-menu-item>
-                      </md-menu-content>
-                    </md-menu>
-                  </md-list-item>
-                </md-list>
-              </md-card>
-              <div flex></div>
-              <md-card class="md-whiteframe-1dp" flex="65">
-                <md-tabs ng-if="vm_cc.configurations.length" md-dynamic-height>
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.SUBJECTS">SUBJECTS</span>
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-toolbar
-                        class="md-table-toolbar md-default no-padding"
-                        ng-hide="vm_cc.selectedSubjects.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <div flex></div>
-                          <ms-search-bar
-                            on-search="vm_cc.query.subject = query"
-                            on-collapse="vm_cc.query.subject = undefined"
-                            debounce="300"
-                          ></ms-search-bar>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canEdit"
-                            class="md-icon-button"
-                            ng-click="vm_cc.createOrEditSubject($event)"
-                            aria-label="add subject"
-                            translate
-                            translate-attr-label="INTEGRATIONS.ADD_SUBJECT"
-                          >
-                            <md-icon md-font-icon="icon-plus"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-toolbar
-                        class="md-table-toolbar md-accent"
-                        ng-show="vm_cc.selectedSubjects.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <span class="md-subhead"
-                            >{{vm_cc.selectedSubjects.length}}
-                            {{vm_cc.selectedSubjects.length > 1 ? 'items' :
-                            'item'}} selected</span
-                          >
-                          <div flex></div>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canDelete"
-                            class="md-icon-button"
-                            ng-click="vm_cc.deleteSelectedSubjects($event)"
-                            aria-label="delete selected"
-                            translate
-                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-                          >
-                            <md-icon md-font-icon="icon-delete"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-table-container
-                        class="md-whiteframe-1dp padding-horizontal"
-                      >
-                        <table
-                          md-table
-                          md-row-select
-                          multiple
-                          ng-model="vm_cc.selectedSubjects"
-                        >
-                          <thead md-head>
-                            <tr md-row>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.ID' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.TYPE' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.CONTENT' | translate }}
-                              </th>
-                              <th md-column width="10px"></th>
-                            </tr>
-                          </thead>
-                          <tbody md-body>
-                            <tr
-                              md-row
-                              md-select="subject"
-                              md-select-id="id"
-                              ng-repeat="subject in vm_cc.subjects | filter: vm_cc.query.subject"
-                            >
-                              <td
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                                class="id"
-                              >
-                                {{subject.id}}
-                              </td>
-                              <td
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                                class="type"
-                              >
-                                <span ng-if="subject.FieldId"
-                                  >{{subject.nameField ||
-                                  subject.idField}}</span
-                                >
-                                <span ng-if="!subject.FieldId"
-                                  >{{subject.type}}</span
-                                >
-                              </td>
-                              <td
-                                ng-switch="subject.type"
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                              >
-                                <span ng-switch-when="string"
-                                  >{{subject.content}}</span
-                                >
-                                <span
-                                  ng-switch-when="variable"
-                                  class="text-boxed"
-                                  >{{subject.variableName}}</span
-                                >
-                                <span
-                                  ng-switch-when="customVariable"
-                                  class="text-boxed"
-                                  >{{
-                                  vm_cc.variablesById[subject.VariableId].name
-                                  }}</span
-                                >
-                                <span ng-switch-when="keyValue">
-                                  {{subject.key}}
-                                  <span ng-switch="description.keyType">
-                                    <span ng-switch-when="string"
-                                      >{{subject.keyContent}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="variable"
-                                      class="text-boxed"
-                                      >{{subject.variableName}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="customVariable"
-                                      class="text-boxed"
-                                      >{{
-                                      vm_cc.variablesById[subject.VariableId].name
-                                      }}</span
-                                    >
-                                  </span>
-                                </span>
-                                <span ng-switch-default
-                                  >{{subject.content}}</span
-                                >
-                              </td>
-                              <td
-                                md-cell
-                                class="actions"
-                                ng-if="!vm_cc.crudPermissions.readOnly"
-                              >
-                                <md-menu>
-                                  <md-button
-                                    class="md-icon-button"
-                                    aria-label="More"
-                                    translate
-                                    translate-attr-aria-label="INTEGRATIONS.MORE"
-                                    ng-click="$mdOpenMenu($event)"
-                                  >
-                                    <md-icon
-                                      md-font-icon="icon-dots-vertical"
-                                    ></md-icon>
-                                  </md-button>
-
-                                  <md-menu-content width="3">
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canEdit"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                        translate="INTEGRATIONS.EDIT_SUBJECT"
-                                      >
-                                        Edit Subject
-                                      </md-button>
-                                    </md-menu-item>
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canDelete"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.deleteSubjectConfirm($event, subject)"
-                                        translate="INTEGRATIONS.DELETE_SUBJECT"
-                                      >
-                                        Delete Subject
-                                      </md-button>
-                                    </md-menu-item>
-                                  </md-menu-content>
-                                </md-menu>
-                              </td>
-                            </tr>
-                          </tbody>
-                        </table>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.DESCRIPTIONS"
-                        >DESCRIPTIONS</span
-                      >
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-toolbar
-                        class="md-table-toolbar md-default no-padding"
-                        ng-hide="vm_cc.selectedDescriptions.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <div flex></div>
-                          <ms-search-bar
-                            on-search="vm_cc.query.description = query"
-                            on-collapse="vm_cc.query.description = undefined"
-                            debounce="300"
-                          ></ms-search-bar>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canEdit"
-                            class="md-icon-button"
-                            ng-click="vm_cc.createOrEditDescription($event)"
-                            aria-label="add description"
-                            translate
-                            translate-attr-label="INTEGRATIONS.ADD_DESCRIPTION"
-                          >
-                            <md-icon md-font-icon="icon-plus"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-toolbar
-                        class="md-table-toolbar md-accent"
-                        ng-show="vm_cc.selectedDescriptions.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <span class="md-subhead"
-                            >{{vm_cc.selectedDescriptions.length}}
-                            {{vm_cc.selectedDescriptions.length > 1 ? 'items' :
-                            'item'}} selected</span
-                          >
-                          <div flex></div>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canDelete"
-                            class="md-icon-button"
-                            ng-click="vm_cc.deleteSelectedDescriptions($event)"
-                            aria-label="delete selected"
-                            translate
-                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-                          >
-                            <md-icon md-font-icon="icon-delete"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-table-container
-                        class="md-whiteframe-1dp padding-horizontal"
-                      >
-                        <table
-                          md-table
-                          md-row-select
-                          multiple
-                          ng-model="vm_cc.selectedDescriptions"
-                        >
-                          <thead md-head>
-                            <tr md-row>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.ID' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.TYPE' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.CONTENT' | translate }}
-                              </th>
-                              <th md-column width="10px"></th>
-                            </tr>
-                          </thead>
-                          <tbody md-body>
-                            <tr
-                              md-row
-                              md-select="description"
-                              md-select-id="id"
-                              ng-repeat="description in vm_cc.descriptions | filter: vm_cc.query.description"
-                            >
-                              <td
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                                class="id"
-                              >
-                                {{description.id}}
-                              </td>
-                              <td
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                                class="type"
-                              >
-                                <span ng-if="description.FieldId"
-                                  >{{description.nameField ||
-                                  description.idField}}</span
-                                >
-                                <span ng-if="!description.FieldId"
-                                  >{{description.type}}</span
-                                >
-                              </td>
-                              <td
-                                ng-switch="description.type"
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                              >
-                                <span ng-switch-when="string"
-                                  >{{description.content}}</span
-                                >
-                                <span
-                                  ng-switch-when="variable"
-                                  class="text-boxed"
-                                  >{{description.variableName}}</span
-                                >
-                                <span
-                                  ng-switch-when="customVariable"
-                                  class="text-boxed"
-                                  >{{
-                                  vm_cc.variablesById[description.VariableId].name
-                                  }}</span
-                                >
-                                <span ng-switch-when="keyValue">
-                                  {{description.key}}
-                                  <span ng-switch="description.keyType">
-                                    <span ng-switch-when="string"
-                                      >{{description.keyContent}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="variable"
-                                      class="text-boxed"
-                                      >{{description.variableName}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="customVariable"
-                                      class="text-boxed"
-                                      >{{
-                                      vm_cc.variablesById[description.VariableId].name
-                                      }}</span
-                                    >
-                                  </span>
-                                </span>
-                                <span ng-switch-default
-                                  >{{description.content}}</span
-                                >
-                              </td>
-                              <td
-                                md-cell
-                                class="actions"
-                                ng-if="!vm_cc.crudPermissions.readOnly"
-                              >
-                                <md-menu>
-                                  <md-button
-                                    class="md-icon-button"
-                                    aria-label="More"
-                                    translate
-                                    translate-attr-aria-label="INTEGRATIONS.MORE"
-                                    ng-click="$mdOpenMenu($event)"
-                                  >
-                                    <md-icon
-                                      md-font-icon="icon-dots-vertical"
-                                    ></md-icon>
-                                  </md-button>
-
-                                  <md-menu-content width="3">
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canEdit"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.createOrEditDescription($event, description)"
-                                        translate="INTEGRATIONS.EDIT_DESCRIPTION"
-                                      >
-                                        Edit Description
-                                      </md-button>
-                                    </md-menu-item>
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canDelete"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.deleteDescriptionConfirm($event, description)"
-                                        translate="INTEGRATIONS.DELETE_DESCRIPTION"
-                                      >
-                                        Delete Description
-                                      </md-button>
-                                    </md-menu-item>
-                                  </md-menu-content>
-                                </md-menu>
-                              </td>
-                            </tr>
-                          </tbody>
-                        </table>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.FIELDS">FIELDS</span>
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-toolbar
-                        class="md-table-toolbar md-default no-padding"
-                        ng-hide="vm_cc.selectedFields.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <div flex></div>
-                          <ms-search-bar
-                            on-search="vm_cc.query.field = query"
-                            on-collapse="vm_cc.query.field = undefined"
-                            debounce="300"
-                          ></ms-search-bar>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canEdit"
-                            class="md-icon-button"
-                            ng-click="vm_cc.createOrEditField($event)"
-                            aria-label="add field"
-                            translate
-                            translate-attr-label="INTEGRATIONS.ADD_FIELD"
-                          >
-                            <md-icon md-font-icon="icon-plus"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-toolbar
-                        class="md-table-toolbar md-accent"
-                        ng-show="vm_cc.selectedFields.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <span class="md-subhead"
-                            >{{vm_cc.selectedFields.length}}
-                            {{vm_cc.selectedFields.length > 1 ? 'items' :
-                            'item'}} selected</span
-                          >
-                          <div flex></div>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canDelete"
-                            class="md-icon-button"
-                            ng-click="vm_cc.deleteSelectedFields($event)"
-                            aria-label="delete selected"
-                            translate
-                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-                          >
-                            <md-icon md-font-icon="icon-delete"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-table-container
-                        class="md-whiteframe-1dp padding-horizontal"
-                      >
-                        <table
-                          md-table
-                          md-row-select
-                          multiple
-                          ng-model="vm_cc.selectedFields"
-                        >
-                          <thead md-head>
-                            <tr md-row>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.ID' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.TYPE' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.CONTENT' | translate }}
-                              </th>
-                              <th md-column width="10px"></th>
-                            </tr>
-                          </thead>
-                          <tbody md-body>
-                            <tr
-                              md-row
-                              md-select="field"
-                              md-select-id="id"
-                              ng-repeat="field in vm_cc.fields | filter: vm_cc.query.field"
-                            >
-                              <td
-                                ng-click="vm_cc.createOrEditField($event, field)"
-                                md-cell
-                                class="id"
-                              >
-                                {{field.id}}
-                              </td>
-                              <td
-                                ng-click="vm_cc.createOrEditField($event, field)"
-                                md-cell
-                                class="type"
-                              >
-                                <span ng-if="field.FieldId"
-                                  >{{field.nameField || field.idField}}</span
-                                >
-                                <span ng-if="!field.FieldId"
-                                  >{{field.type}}</span
-                                >
-                              </td>
-                              <td
-                                ng-switch="field.type"
-                                ng-click="vm_cc.createOrEditField($event, field)"
-                                md-cell
-                              >
-                                <span ng-switch-when="string"
-                                  >{{field.content}}</span
-                                >
-                                <span
-                                  ng-switch-when="variable"
-                                  class="text-boxed"
-                                  >{{field.variableName}}</span
-                                >
-                                <span
-                                  ng-switch-when="customVariable"
-                                  class="text-boxed"
-                                  >{{ vm_cc.variablesById[field.VariableId].name
-                                  }}</span
-                                >
-                                <span ng-switch-when="keyValue">
-                                  {{field.key}}
-                                  <span ng-switch="description.keyType">
-                                    <span ng-switch-when="string"
-                                      >{{field.keyContent}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="variable"
-                                      class="text-boxed"
-                                      >{{field.variableName}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="customVariable"
-                                      class="text-boxed"
-                                      >{{
-                                      vm_cc.variablesById[field.VariableId].name
-                                      }}</span
-                                    >
-                                  </span>
-                                </span>
-                                <span ng-switch-default>{{field.content}}</span>
-                              </td>
-                              <td
-                                md-cell
-                                class="actions"
-                                ng-if="!vm_cc.crudPermissions.readOnly"
-                              >
-                                <md-menu>
-                                  <md-button
-                                    class="md-icon-button"
-                                    aria-label="More"
-                                    translate
-                                    translate-attr-aria-label="INTEGRATIONS.MORE"
-                                    ng-click="$mdOpenMenu($event)"
-                                  >
-                                    <md-icon
-                                      md-font-icon="icon-dots-vertical"
-                                    ></md-icon>
-                                  </md-button>
-
-                                  <md-menu-content width="3">
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canEdit"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.createOrEditField($event, field)"
-                                        translate="INTEGRATIONS.EDIT_FIELD"
-                                      >
-                                        Edit Field
-                                      </md-button>
-                                    </md-menu-item>
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canDelete"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.deleteFieldConfirm($event, field)"
-                                        translate="INTEGRATIONS.DELETE_FIELD"
-                                      >
-                                        Delete Field
-                                      </md-button>
-                                    </md-menu-item>
-                                  </md-menu-content>
-                                </md-menu>
-                              </td>
-                            </tr>
-                          </tbody>
-                        </table>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-                </md-tabs>
-                <div
-                  class="padding-20"
-                  ng-if="!vm_cc.configurations.length && vm_cc.crudPermissions.canEdit"
-                  ng-click="vm_cc.createOrEditDynamics365Configuration($event)"
-                  layout="row"
-                  layout-sm="column"
-                  layout-align="center center"
-                  layout-wrap
-                >
-                  <div
-                    class="padding-20 md-whiteframe-3dp md-accent-bg"
-                    layout="column"
-                    layout-align="center center"
-                  >
-                    <md-button class="md-icon-button">
-                      <md-icon md-font-icon="icon-plus"></md-icon>
-                    </md-button>
-                    <span
-                      aria-label="add configuration"
-                      translate
-                      translate-attr-label="INTEGRATIONS.ADD_CONFIGURATION"
-                      >ADD CONFIGURATION</span
-                    >
-                  </div>
-                </div>
-              </md-card>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/edit/view.html/view.html b/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/edit/view.html/view.html
new file mode 100644
index 0000000..fc89a41
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/dynamics365Accounts/edit/view.html/view.html
@@ -0,0 +1,993 @@
+<div
+  id="integrations-dynamics365Account"
+  class="page-layout simple tabbed"
+  layout="column"
+>
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-dynamics365Accounts-button md-icon-button"
+        aria-label="Go to dynamics365Accounts"
+        ng-click="vm.gotoDynamics365Accounts()"
+        translate
+        translate-attr-aria-label="INTEGRATIONS.GO_TO_DYNAMICS365ACCOUNTS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="dynamics365Account-image" hide-xs>
+          <img ng-src="assets/images/business/dynamics365Accounts.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.dynamics365Account.id}}
+            <span ng-if="vm.dynamics365Account.name"
+              >{{vm.dynamics365Account.name}}</span
+            >
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="INTEGRATIONS.CREATED_AT"></span>
+            <span>{{vm.dynamics365Account.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveDynamics365Account()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (configurationsForm.$invalid)"
+        translate="INTEGRATIONS.SAVE"
+        translate-attr-aria-label="INTEGRATIONS.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="INTEGRATIONS.ACCOUNT">ACCOUNT</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="dynamics365Account-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="INTEGRATIONS.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.dynamics365Account.name"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.USERNAME">Username</label>
+                <input
+                  type="text"
+                  name="username"
+                  ng-model="vm.dynamics365Account.username"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['username'].$error"
+                  ng-show="generalForm['username'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
+                      >Username field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.PASSWORD">Password</label>
+                <input
+                  type="password"
+                  name="password"
+                  ng-model="vm.dynamics365Account.password"
+                  placeholder="Password"
+                  translate
+                  translate-attr-placeholder="INTEGRATIONS.PASSWORD"
+                  required
+                />
+                <div ng-messages="generalForm['password'].$error" role="alert">
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.PASSWORD_REQUIRED"
+                      >Password field is required</span
+                    >
+                  </div>
+                  <div ng-message="pattern">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.SECURE_PASSWORD_PATTERN"
+                      >Must contain at least 8 characters, with a minimum of 1
+                      lowercase letter, 1 uppercase letter, 1 numeric character
+                      and 1 special character ~!?*@#$%^&-_=+[{]}.</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.URI">Uri</label>
+                <input
+                  type="url"
+                  name="remoteUri"
+                  ng-model="vm.dynamics365Account.remoteUri"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['remoteUri'].$error"
+                  ng-show="generalForm['remoteUri'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
+                      >Uri field is required</span
+                    >
+                  </div>
+                  <div ng-message="url">
+                    <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
+                      >Uri must be a valid url http://www.xcally.com</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.TENANTID">TenantId</label>
+                <input
+                  type="text"
+                  name="tenantId"
+                  ng-model="vm.dynamics365Account.tenantId"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['tenantId'].$error"
+                  ng-show="generalForm['tenantId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.TENANTID_REQUIRED"
+                      >TenantId field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.CLIENTID">ClientId</label>
+                <input
+                  type="text"
+                  name="clientId"
+                  ng-model="vm.dynamics365Account.clientId"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['clientId'].$error"
+                  ng-show="generalForm['clientId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.CLIENTID_REQUIRED"
+                      >ClientId field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.CLIENTSECRET"
+                  >ClientSecret</label
+                >
+                <input
+                  type="text"
+                  name="clientSecret"
+                  ng-model="vm.dynamics365Account.clientSecret"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['clientSecret'].$error"
+                  ng-show="generalForm['clientSecret'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.CLIENTSECRET_REQUIRED"
+                      >ClientSecret field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
+                  >MotionProxyAddress</label
+                >
+                <input
+                  type="url"
+                  name="serverUrl"
+                  ng-model="vm.dynamics365Account.serverUrl"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['serverUrl'].$error"
+                  ng-show="generalForm['serverUrl'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
+                      >MotionProxyAddress field is required</span
+                    >
+                  </div>
+                  <div ng-message="url">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
+                      >MotionProxyAddress must be a valid url
+                      http://www.xcally.com</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.dynamics365Account.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="INTEGRATIONS.CONFIGURATIONS">CONFIGURATIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="dynamics365Account-detail-form-container configurations md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div
+                class="h2 secondary-text"
+                translate="INTEGRATIONS.CONFIGURATIONS"
+              >
+                CONFIGURATIONS
+              </div>
+            </div>
+            <div
+              ng-controller="Dynamics365AccountConfigurationsController as vm_cc"
+              ng-init="vm_cc.init(vm.dynamics365Account, vm.crudPermissions)"
+              layout="row"
+            >
+              <md-card class="md-whiteframe-1dp" flex="30">
+                <div layout="row" layout-align="center center">
+                  <md-subheader flex="75" class="md-no-sticky"
+                    >{{ 'INTEGRATIONS.CONFIGURATIONS' | translate
+                    }}</md-subheader
+                  >
+                  <md-button
+                    flex="25"
+                    ng-if="vm_cc.crudPermissions.canEdit"
+                    ng-click="vm_cc.createOrEditDynamics365Configuration($event)"
+                    class="md-icon-button"
+                    aria-label="create dynamics365Configuration"
+                  >
+                    <md-icon md-font-icon="icon-plus"></md-icon>
+                  </md-button>
+                </div>
+                <md-list>
+                  <md-list-item
+                    layout="row"
+                    layout-align="center center"
+                    ng-repeat="dynamics365Configuration in vm_cc.configurations"
+                    class="border-top"
+                    md-colors="{background: (vm_cc.selectedDynamics365Configuration == $index ? 'accent' : 'grey-A100')}"
+                    ng-click="vm_cc.getDynamics365Configuration($index)"
+                  >
+                    <span class="text-truncate" flex="80"
+                      >{{ dynamics365Configuration.name }}</span
+                    >
+                    <md-menu ng-if="vm_cc.crudPermissions.canDelete">
+                      <md-button
+                        class="md-icon-button"
+                        aria-label="More"
+                        translate
+                        translate-attr-aria-label="INTEGRATIONS.MORE"
+                        ng-click="$mdOpenMenu($event)"
+                      >
+                        <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                      </md-button>
+                      <md-menu-content width="3">
+                        <md-menu-item ng-if="vm_cc.crudPermissions.canDelete">
+                          <md-button
+                            ng-click="vm_cc.deleteDynamics365Configuration($event, dynamics365Configuration)"
+                            translate="INTEGRATIONS.DELETE_DYNAMICS365CONFIGURATION"
+                          >
+                            Delete Dynamics365Configuration
+                          </md-button>
+                        </md-menu-item>
+                      </md-menu-content>
+                    </md-menu>
+                  </md-list-item>
+                </md-list>
+              </md-card>
+              <div flex></div>
+              <md-card class="md-whiteframe-1dp" flex="65">
+                <md-tabs ng-if="vm_cc.configurations.length" md-dynamic-height>
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.SUBJECTS">SUBJECTS</span>
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedSubjects.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.subject = query"
+                            on-collapse="vm_cc.query.subject = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditSubject($event)"
+                            aria-label="add subject"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_SUBJECT"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedSubjects.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedSubjects.length}}
+                            {{vm_cc.selectedSubjects.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedSubjects($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedSubjects"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.ID' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.TYPE' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.CONTENT' | translate }}
+                              </th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="subject"
+                              md-select-id="id"
+                              ng-repeat="subject in vm_cc.subjects | filter: vm_cc.query.subject"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                                class="id"
+                              >
+                                {{subject.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="subject.FieldId"
+                                  >{{subject.nameField ||
+                                  subject.idField}}</span
+                                >
+                                <span ng-if="!subject.FieldId"
+                                  >{{subject.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="subject.type"
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{subject.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{subject.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{
+                                  vm_cc.variablesById[subject.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{subject.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{subject.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{subject.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[subject.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default
+                                  >{{subject.content}}</span
+                                >
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="INTEGRATIONS.MORE"
+                                    ng-click="$mdOpenMenu($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                        translate="INTEGRATIONS.EDIT_SUBJECT"
+                                      >
+                                        Edit Subject
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteSubjectConfirm($event, subject)"
+                                        translate="INTEGRATIONS.DELETE_SUBJECT"
+                                      >
+                                        Delete Subject
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.DESCRIPTIONS"
+                        >DESCRIPTIONS</span
+                      >
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedDescriptions.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.description = query"
+                            on-collapse="vm_cc.query.description = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditDescription($event)"
+                            aria-label="add description"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_DESCRIPTION"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedDescriptions.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedDescriptions.length}}
+                            {{vm_cc.selectedDescriptions.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedDescriptions($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedDescriptions"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.ID' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.TYPE' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.CONTENT' | translate }}
+                              </th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="description"
+                              md-select-id="id"
+                              ng-repeat="description in vm_cc.descriptions | filter: vm_cc.query.description"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                                class="id"
+                              >
+                                {{description.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="description.FieldId"
+                                  >{{description.nameField ||
+                                  description.idField}}</span
+                                >
+                                <span ng-if="!description.FieldId"
+                                  >{{description.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="description.type"
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{description.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{description.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{
+                                  vm_cc.variablesById[description.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{description.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{description.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{description.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[description.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default
+                                  >{{description.content}}</span
+                                >
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="INTEGRATIONS.MORE"
+                                    ng-click="$mdOpenMenu($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditDescription($event, description)"
+                                        translate="INTEGRATIONS.EDIT_DESCRIPTION"
+                                      >
+                                        Edit Description
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteDescriptionConfirm($event, description)"
+                                        translate="INTEGRATIONS.DELETE_DESCRIPTION"
+                                      >
+                                        Delete Description
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.FIELDS">FIELDS</span>
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedFields.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.field = query"
+                            on-collapse="vm_cc.query.field = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditField($event)"
+                            aria-label="add field"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_FIELD"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedFields.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedFields.length}}
+                            {{vm_cc.selectedFields.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedFields($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedFields"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.ID' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.TYPE' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.CONTENT' | translate }}
+                              </th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="field"
+                              md-select-id="id"
+                              ng-repeat="field in vm_cc.fields | filter: vm_cc.query.field"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditField($event, field)"
+                                md-cell
+                                class="id"
+                              >
+                                {{field.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditField($event, field)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="field.FieldId"
+                                  >{{field.nameField || field.idField}}</span
+                                >
+                                <span ng-if="!field.FieldId"
+                                  >{{field.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="field.type"
+                                ng-click="vm_cc.createOrEditField($event, field)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{field.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{field.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{ vm_cc.variablesById[field.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{field.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{field.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{field.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[field.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default>{{field.content}}</span>
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="INTEGRATIONS.MORE"
+                                    ng-click="$mdOpenMenu($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditField($event, field)"
+                                        translate="INTEGRATIONS.EDIT_FIELD"
+                                      >
+                                        Edit Field
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteFieldConfirm($event, field)"
+                                        translate="INTEGRATIONS.DELETE_FIELD"
+                                      >
+                                        Delete Field
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+                </md-tabs>
+                <div
+                  class="padding-20"
+                  ng-if="!vm_cc.configurations.length && vm_cc.crudPermissions.canEdit"
+                  ng-click="vm_cc.createOrEditDynamics365Configuration($event)"
+                  layout="row"
+                  layout-sm="column"
+                  layout-align="center center"
+                  layout-wrap
+                >
+                  <div
+                    class="padding-20 md-whiteframe-3dp md-accent-bg"
+                    layout="column"
+                    layout-align="center center"
+                  >
+                    <md-button class="md-icon-button">
+                      <md-icon md-font-icon="icon-plus"></md-icon>
+                    </md-button>
+                    <span
+                      aria-label="add configuration"
+                      translate
+                      translate-attr-label="INTEGRATIONS.ADD_CONFIGURATION"
+                      >ADD CONFIGURATION</span
+                    >
+                  </div>
+                </div>
+              </md-card>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 76ff297..0000000
--- a/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,254 +0,0 @@
-<md-dialog class="freshdeskAccount-dialog" aria-label="New FreshdeskAccount">
-  <form name="freshdeskAccountForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.freshdeskAccount.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="freshdeskAccountForm['name'].$error"
-          ng-show="freshdeskAccountForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.USERNAME">Username</label>
-        <input
-          type="text"
-          name="username"
-          ng-model="vm.freshdeskAccount.username"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="freshdeskAccountForm['username'].$error"
-          ng-show="freshdeskAccountForm['username'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
-              >Username field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.URI">Uri</label>
-        <input
-          type="url"
-          name="remoteUri"
-          ng-model="vm.freshdeskAccount.remoteUri"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="freshdeskAccountForm['remoteUri'].$error"
-          ng-show="freshdeskAccountForm['remoteUri'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
-              >Uri field is required</span
-            >
-          </div>
-          <div ng-message="url">
-            <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
-              >Uri must be a valid url http://www.xcally.com</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.APIKEY">ApiKey</label>
-        <input
-          type="text"
-          name="apiKey"
-          ng-model="vm.freshdeskAccount.apiKey"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="freshdeskAccountForm['apiKey'].$error"
-          ng-show="freshdeskAccountForm['apiKey'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.APIKEY_REQUIRED"
-              >ApiKey field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
-          >MotionProxyAddress</label
-        >
-        <input
-          type="url"
-          name="serverUrl"
-          ng-model="vm.freshdeskAccount.serverUrl"
-        />
-
-        <div class="hint">
-          <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
-        </div>
-        <div
-          ng-messages="freshdeskAccountForm['serverUrl'].$error"
-          ng-show="freshdeskAccountForm['serverUrl'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
-              >MotionProxyAddress field is required</span
-            >
-          </div>
-          <div ng-message="url">
-            <span
-              translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
-              >MotionProxyAddress must be a valid url
-              http://www.xcally.com</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.freshdeskAccount.description"
-        />
-
-        <div
-          ng-messages="freshdeskAccountForm['description'].$error"
-          ng-show="freshdeskAccountForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newFreshdeskAccount"
-          ng-click="vm.saveFreshdeskAccount()"
-          class="send-button md-accent md-raised"
-          ng-disabled="freshdeskAccountForm.$invalid || freshdeskAccountForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newFreshdeskAccount"
-          ng-click="vm.addNewFreshdeskAccount()"
-          class="send-button md-accent md-raised"
-          ng-disabled="freshdeskAccountForm.$invalid"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD_FRESHDESKACCOUNT"
-          translate-attr-aria-label="INTEGRATIONS.ADD_FRESHDESKACCOUNT"
-        >
-          ADD FRESHDESKACCOUNT
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newFreshdeskAccount"
-          ng-click="vm.deleteFreshdeskAccount($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/create/dialog.html/dialog.html
new file mode 100644
index 0000000..76ff297
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/create/dialog.html/dialog.html
@@ -0,0 +1,254 @@
+<md-dialog class="freshdeskAccount-dialog" aria-label="New FreshdeskAccount">
+  <form name="freshdeskAccountForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.freshdeskAccount.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="freshdeskAccountForm['name'].$error"
+          ng-show="freshdeskAccountForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.USERNAME">Username</label>
+        <input
+          type="text"
+          name="username"
+          ng-model="vm.freshdeskAccount.username"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="freshdeskAccountForm['username'].$error"
+          ng-show="freshdeskAccountForm['username'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
+              >Username field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.URI">Uri</label>
+        <input
+          type="url"
+          name="remoteUri"
+          ng-model="vm.freshdeskAccount.remoteUri"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="freshdeskAccountForm['remoteUri'].$error"
+          ng-show="freshdeskAccountForm['remoteUri'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
+              >Uri field is required</span
+            >
+          </div>
+          <div ng-message="url">
+            <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
+              >Uri must be a valid url http://www.xcally.com</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.APIKEY">ApiKey</label>
+        <input
+          type="text"
+          name="apiKey"
+          ng-model="vm.freshdeskAccount.apiKey"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="freshdeskAccountForm['apiKey'].$error"
+          ng-show="freshdeskAccountForm['apiKey'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.APIKEY_REQUIRED"
+              >ApiKey field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
+          >MotionProxyAddress</label
+        >
+        <input
+          type="url"
+          name="serverUrl"
+          ng-model="vm.freshdeskAccount.serverUrl"
+        />
+
+        <div class="hint">
+          <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
+        </div>
+        <div
+          ng-messages="freshdeskAccountForm['serverUrl'].$error"
+          ng-show="freshdeskAccountForm['serverUrl'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
+              >MotionProxyAddress field is required</span
+            >
+          </div>
+          <div ng-message="url">
+            <span
+              translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
+              >MotionProxyAddress must be a valid url
+              http://www.xcally.com</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.freshdeskAccount.description"
+        />
+
+        <div
+          ng-messages="freshdeskAccountForm['description'].$error"
+          ng-show="freshdeskAccountForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newFreshdeskAccount"
+          ng-click="vm.saveFreshdeskAccount()"
+          class="send-button md-accent md-raised"
+          ng-disabled="freshdeskAccountForm.$invalid || freshdeskAccountForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newFreshdeskAccount"
+          ng-click="vm.addNewFreshdeskAccount()"
+          class="send-button md-accent md-raised"
+          ng-disabled="freshdeskAccountForm.$invalid"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD_FRESHDESKACCOUNT"
+          translate-attr-aria-label="INTEGRATIONS.ADD_FRESHDESKACCOUNT"
+        >
+          ADD FRESHDESKACCOUNT
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newFreshdeskAccount"
+          ng-click="vm.deleteFreshdeskAccount($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 3f2856a..0000000
--- a/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,187 +0,0 @@
-<md-dialog
-  class="freshdeskConfiguration-dialog"
-  aria-label="New FreshdeskConfiguration"
->
-  <form name="freshdeskConfigurationForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.NAME">Name</label>
-        <input
-          type=""
-          name="name"
-          ng-model="vm.freshdeskConfiguration.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="freshdeskConfigurationForm['name'].$error"
-          ng-show="freshdeskConfigurationForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.CHANNEL">Channel</label>
-        <md-select
-          name="channel"
-          ng-model="vm.freshdeskConfiguration.channel"
-          required
-        >
-          <md-option ng-value="'voice'">
-            {{ 'INTEGRATIONS.VOICE' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="freshdeskConfigurationForm['channel'].$error"
-          ng-show="freshdeskConfigurationForm['channel'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.CHANNEL_REQUIRED"
-              >Channel field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.TYPE">Type</label>
-        <md-select
-          name="type"
-          ng-model="vm.freshdeskConfiguration.type"
-          required
-        >
-          <md-option ng-value="'inbound'">
-            {{ 'INTEGRATIONS.INBOUND_IN_QUEUE' | translate }}
-          </md-option>
-
-          <md-option ng-value="'outbound'">
-            {{ 'INTEGRATIONS.OUTBOUND_CALL' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="freshdeskConfigurationForm['type'].$error"
-          ng-show="freshdeskConfigurationForm['type'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-              >Type field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newFreshdeskConfiguration"
-          ng-click="vm.saveFreshdeskConfiguration()"
-          class="send-button md-accent md-raised"
-          ng-disabled="freshdeskConfigurationForm.$invalid || freshdeskConfigurationForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newFreshdeskConfiguration"
-          ng-click="vm.addNewFreshdeskConfiguration()"
-          class="send-button md-accent md-raised"
-          ng-disabled="freshdeskConfigurationForm.$invalid"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD_FRESHDESKCONFIGURATION"
-          translate-attr-aria-label="INTEGRATIONS.ADD_FRESHDESKCONFIGURATION"
-        >
-          ADD FRESHDESKCONFIGURATION
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newFreshdeskConfiguration"
-          ng-click="vm.deleteFreshdeskConfiguration($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/edit/configurations/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/edit/configurations/dialog.html/dialog.html
new file mode 100644
index 0000000..3f2856a
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/edit/configurations/dialog.html/dialog.html
@@ -0,0 +1,187 @@
+<md-dialog
+  class="freshdeskConfiguration-dialog"
+  aria-label="New FreshdeskConfiguration"
+>
+  <form name="freshdeskConfigurationForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.NAME">Name</label>
+        <input
+          type=""
+          name="name"
+          ng-model="vm.freshdeskConfiguration.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="freshdeskConfigurationForm['name'].$error"
+          ng-show="freshdeskConfigurationForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.CHANNEL">Channel</label>
+        <md-select
+          name="channel"
+          ng-model="vm.freshdeskConfiguration.channel"
+          required
+        >
+          <md-option ng-value="'voice'">
+            {{ 'INTEGRATIONS.VOICE' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="freshdeskConfigurationForm['channel'].$error"
+          ng-show="freshdeskConfigurationForm['channel'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.CHANNEL_REQUIRED"
+              >Channel field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.TYPE">Type</label>
+        <md-select
+          name="type"
+          ng-model="vm.freshdeskConfiguration.type"
+          required
+        >
+          <md-option ng-value="'inbound'">
+            {{ 'INTEGRATIONS.INBOUND_IN_QUEUE' | translate }}
+          </md-option>
+
+          <md-option ng-value="'outbound'">
+            {{ 'INTEGRATIONS.OUTBOUND_CALL' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="freshdeskConfigurationForm['type'].$error"
+          ng-show="freshdeskConfigurationForm['type'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+              >Type field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newFreshdeskConfiguration"
+          ng-click="vm.saveFreshdeskConfiguration()"
+          class="send-button md-accent md-raised"
+          ng-disabled="freshdeskConfigurationForm.$invalid || freshdeskConfigurationForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newFreshdeskConfiguration"
+          ng-click="vm.addNewFreshdeskConfiguration()"
+          class="send-button md-accent md-raised"
+          ng-disabled="freshdeskConfigurationForm.$invalid"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD_FRESHDESKCONFIGURATION"
+          translate-attr-aria-label="INTEGRATIONS.ADD_FRESHDESKCONFIGURATION"
+        >
+          ADD FRESHDESKCONFIGURATION
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newFreshdeskConfiguration"
+          ng-click="vm.deleteFreshdeskConfiguration($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/edit/item/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/edit/item/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index ac0ce85..0000000
--- a/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/edit/item/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,478 +0,0 @@
-<md-dialog class="freshdeskAccount-item-dialog" aria-label="New Item">
-  <form name="freshdeskAccountItemForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <div ng-switch="vm.type">
-        <div ng-switch-when="subject">
-          <!-- SUBJECT SECTION -->
-          <div ng-include="'/subject.html'"></div>
-          <!-- / SUBJECT SECTION -->
-        </div>
-        <div ng-switch-when="description">
-          <!-- DESCRIPTION SECTION -->
-          <md-input-container class="md-block">
-            <label translate="INTEGRATIONS.TYPE">Type</label>
-            <md-select name="type" ng-model="vm.item.type" required>
-              <md-option value="string">String</md-option>
-              <md-option value="keyValue">Key Value</md-option>
-            </md-select>
-            <div
-              ng-messages="freshdeskAccountItemForm.type.$error"
-              ng-show="freshdeskAccountItemForm.type.$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-                  >Type field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
-            <label translate="INTEGRATIONS.CONTENT">Content</label>
-            <input
-              type="text"
-              name="content"
-              ng-model="vm.item.content"
-              required
-              md-autofocus
-            />
-            <div
-              ng-messages="freshdeskAccountItemForm.content.$error"
-              ng-show="freshdeskAccountItemForm.content.$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
-                  >Content field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <div ng-if="vm.item.type == 'keyValue'">
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.KEY">Key</label>
-              <input
-                type="text"
-                name="key"
-                ng-model="vm.item.key"
-                required
-                md-autofocus
-              />
-              <div
-                ng-messages="freshdeskAccountItemForm.key.$error"
-                ng-show="freshdeskAccountItemForm.key.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.KEY_REQUIRED"
-                    >Key field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.TYPE">Type</label>
-              <md-select name="keyType" ng-model="vm.item.keyType" required>
-                <md-option value="string">String</md-option>
-                <md-option value="variable">Variable</md-option>
-                <md-option value="customVariable">Custom Variable</md-option>
-              </md-select>
-              <div
-                ng-messages="freshdeskAccountItemForm.keyType.$error"
-                ng-show="freshdeskAccountItemForm.keyType.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-                    >Type field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'string'"
-            >
-              <label translate="INTEGRATIONS.CONTENT">Content</label>
-              <input
-                type="text"
-                name="keyContent"
-                ng-model="vm.item.keyContent"
-                required
-                md-autofocus
-              />
-              <div
-                ng-messages="freshdeskAccountItemForm.keyContent.$error"
-                ng-show="freshdeskAccountItemForm.keyContent.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
-                    >Content field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'variable'"
-            >
-              <label translate="INTEGRATIONS.VALUE">Value</label>
-              <md-select
-                name="variableName"
-                ng-model="vm.item.variableName"
-                md-selected-text="vm.getSelectedVariable()"
-                required
-              >
-                <md-optgroup label="Voice: Queue">
-                  <md-option
-                    ng-value="agentColumn"
-                    ng-repeat="agentColumn in vm.voiceAgentReportColumns"
-                    >{{agentColumn}}
-                  </md-option>
-                </md-optgroup>
-                <md-optgroup label="Voice: Outbound">
-                  <md-option
-                    ng-value="dialColumn"
-                    ng-repeat="dialColumn in vm.voiceDialReportColumns"
-                    >{{dialColumn}}</md-option
-                  >
-                </md-optgroup>
-              </md-select>
-              <div
-                ng-messages="freshdeskAccountItemForm.variableName.$error"
-                ng-show="freshdeskAccountItemForm.variableName.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED"
-                    >Variable name field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'customVariable'"
-            >
-              <label translate="INTEGRATIONS.VALUE">Value</label>
-              <md-select ng-model="vm.item.VariableId" required>
-                <md-option
-                  ng-value="variable.id"
-                  ng-repeat="variable in vm.variables"
-                  >{{variable.name}}
-                </md-option>
-              </md-select>
-            </md-input-container>
-          </div>
-          <!-- / DESCRIPTION SECTION -->
-        </div>
-        <div ng-switch-when="field">
-          <!-- FIELD SECTION -->
-          <div ng-if="vm.accountConnected">
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.FIELD">FIELD</label>
-              <!-- ITEM TYPE DEFAULT VALUE is STRING -->
-              <md-select
-                name="customField"
-                ng-model="vm.customField"
-                required
-                ng-change="vm.item.type = 'string'"
-              >
-                <md-optgroup label="Standard">
-                  <md-option
-                    ng-value="standard"
-                    ng-repeat="standard in vm.fields | filter: {custom: false} "
-                    >{{standard.name}}
-                  </md-option>
-                </md-optgroup>
-
-                <md-optgroup label="Custom">
-                  <md-option
-                    ng-value="custom"
-                    ng-repeat="custom in vm.fields | filter: {custom: true} "
-                    >{{custom.name}}
-                  </md-option>
-                </md-optgroup>
-              </md-select>
-              <div
-                ng-messages="freshdeskAccountItemForm.customField.$error"
-                ng-show="freshdeskAccountItemForm.customField.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.FIELD_REQUIRED"
-                    >Field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <!-- FIELDS -->
-            <div ng-if="vm.customField" ng-include="'/fields.html'"></div>
-            <!-- FIELDS -->
-          </div>
-          <div ng-if="!vm.accountConnected">
-            <p>Account is not connected. Please check your configurations!</p>
-          </div>
-          <!-- / FIELD SECTION -->
-        </div>
-        <div ng-switch-default>
-          <p>No Item</p>
-        </div>
-      </div>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newItem"
-          ng-click="vm.saveItem()"
-          class="send-button md-accent md-raised"
-          ng-disabled="freshdeskAccountItemForm.$invalid || freshdeskAccountItemForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newItem"
-          ng-click="vm.addNewItem()"
-          class="send-button md-accent md-raised"
-          ng-disabled="freshdeskAccountItemForm.$invalid || freshdeskAccountItemForm.$pristine"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD"
-          translate-attr-aria-label="INTEGRATIONS.ADD"
-        >
-          ADD
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newItem"
-          ng-click="vm.deleteItem($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
-
-<script type="text/ng-template" id="/fields.html">
-
-  <!-- type -->
-  <md-input-container class="md-block" ng-if="!vm.customField.options.length">
-
-      <label translate="INTEGRATIONS.TYPE">Type</label>
-      <md-select name="type" ng-model="vm.item.type" required>
-
-          <md-option value="string">String</md-option>
-          <md-option value="variable">Variable</md-option>
-          <md-option value="customVariable">Custom Variable</md-option>
-      </md-select>
-      <div ng-messages="freshdeskAccountItemForm.type.$error" ng-show="freshdeskAccountItemForm.type.$touched"
-          role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <!--/ type -->
-
-  <!-- value -->
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && vm.customField.options.length">
-      <!-- options -->
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-
-      <md-select name="option" ng-model="vm.item.content" required>
-          <md-option ng-value="option.value" ng-repeat="option in vm.customField.options">{{option.name}}</md-option>
-      </md-select>
-
-      <div ng-messages="freshdeskAccountItemForm.option.$error"
-          ng-show="freshdeskAccountItemForm.option.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VALUE_REQUIRED">Value field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && !vm.customField.options.length">
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-
-      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
-
-      <div ng-messages="freshdeskAccountItemForm.content.$error"
-          ng-show="freshdeskAccountItemForm.content.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
-          required>
-          <md-optgroup label="Voice: Queue">
-              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
-              </md-option>
-          </md-optgroup>
-          <md-optgroup label="Voice: Outbound">
-              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
-              </md-option>
-          </md-optgroup>
-      </md-select>
-      <div ng-messages="freshdeskAccountItemForm.variableName.$error"
-          ng-show="freshdeskAccountItemForm.variableName.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select ng-model="vm.item.VariableId" required>
-          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
-      </md-select>
-  </md-input-container>
-
-  <!--/ value -->
-</script>
-
-<script type="text/ng-template" id="/subject.html">
-    <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.TYPE">Type</label>
-            <md-select name="type" ng-model="vm.item.type" required>
-                <md-option value="string">String</md-option>
-                <md-option value="variable">Variable</md-option>
-                <md-option value="customVariable">Custom Variable</md-option>
-            </md-select>
-        <div ng-messages="freshdeskAccountItemForm.type.$error" ng-show="freshdeskAccountItemForm.type.$touched" role="alert">
-            <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
-             </div>
-        </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
-      <div ng-messages="freshdeskAccountItemForm.content.$error"
-          ng-show="freshdeskAccountItemForm.content.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
-          required>
-          <md-optgroup label="Voice: Queue">
-              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
-              </md-option>
-          </md-optgroup>
-          <md-optgroup label="Voice: Outbound">
-              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
-              </md-option>
-          </md-optgroup>
-      </md-select>
-      <div ng-messages="freshdeskAccountItemForm.variableName.$error"
-          ng-show="freshdeskAccountItemForm.variableName.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select ng-model="vm.item.VariableId" required>
-          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
-      </md-select>
-  </md-input-container>
-</script>
diff --git a/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/edit/item/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/edit/item/dialog.html/dialog.html
new file mode 100644
index 0000000..ac0ce85
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/edit/item/dialog.html/dialog.html
@@ -0,0 +1,478 @@
+<md-dialog class="freshdeskAccount-item-dialog" aria-label="New Item">
+  <form name="freshdeskAccountItemForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <div ng-switch="vm.type">
+        <div ng-switch-when="subject">
+          <!-- SUBJECT SECTION -->
+          <div ng-include="'/subject.html'"></div>
+          <!-- / SUBJECT SECTION -->
+        </div>
+        <div ng-switch-when="description">
+          <!-- DESCRIPTION SECTION -->
+          <md-input-container class="md-block">
+            <label translate="INTEGRATIONS.TYPE">Type</label>
+            <md-select name="type" ng-model="vm.item.type" required>
+              <md-option value="string">String</md-option>
+              <md-option value="keyValue">Key Value</md-option>
+            </md-select>
+            <div
+              ng-messages="freshdeskAccountItemForm.type.$error"
+              ng-show="freshdeskAccountItemForm.type.$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+                  >Type field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
+            <label translate="INTEGRATIONS.CONTENT">Content</label>
+            <input
+              type="text"
+              name="content"
+              ng-model="vm.item.content"
+              required
+              md-autofocus
+            />
+            <div
+              ng-messages="freshdeskAccountItemForm.content.$error"
+              ng-show="freshdeskAccountItemForm.content.$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
+                  >Content field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <div ng-if="vm.item.type == 'keyValue'">
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.KEY">Key</label>
+              <input
+                type="text"
+                name="key"
+                ng-model="vm.item.key"
+                required
+                md-autofocus
+              />
+              <div
+                ng-messages="freshdeskAccountItemForm.key.$error"
+                ng-show="freshdeskAccountItemForm.key.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.KEY_REQUIRED"
+                    >Key field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.TYPE">Type</label>
+              <md-select name="keyType" ng-model="vm.item.keyType" required>
+                <md-option value="string">String</md-option>
+                <md-option value="variable">Variable</md-option>
+                <md-option value="customVariable">Custom Variable</md-option>
+              </md-select>
+              <div
+                ng-messages="freshdeskAccountItemForm.keyType.$error"
+                ng-show="freshdeskAccountItemForm.keyType.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+                    >Type field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'string'"
+            >
+              <label translate="INTEGRATIONS.CONTENT">Content</label>
+              <input
+                type="text"
+                name="keyContent"
+                ng-model="vm.item.keyContent"
+                required
+                md-autofocus
+              />
+              <div
+                ng-messages="freshdeskAccountItemForm.keyContent.$error"
+                ng-show="freshdeskAccountItemForm.keyContent.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
+                    >Content field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'variable'"
+            >
+              <label translate="INTEGRATIONS.VALUE">Value</label>
+              <md-select
+                name="variableName"
+                ng-model="vm.item.variableName"
+                md-selected-text="vm.getSelectedVariable()"
+                required
+              >
+                <md-optgroup label="Voice: Queue">
+                  <md-option
+                    ng-value="agentColumn"
+                    ng-repeat="agentColumn in vm.voiceAgentReportColumns"
+                    >{{agentColumn}}
+                  </md-option>
+                </md-optgroup>
+                <md-optgroup label="Voice: Outbound">
+                  <md-option
+                    ng-value="dialColumn"
+                    ng-repeat="dialColumn in vm.voiceDialReportColumns"
+                    >{{dialColumn}}</md-option
+                  >
+                </md-optgroup>
+              </md-select>
+              <div
+                ng-messages="freshdeskAccountItemForm.variableName.$error"
+                ng-show="freshdeskAccountItemForm.variableName.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED"
+                    >Variable name field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'customVariable'"
+            >
+              <label translate="INTEGRATIONS.VALUE">Value</label>
+              <md-select ng-model="vm.item.VariableId" required>
+                <md-option
+                  ng-value="variable.id"
+                  ng-repeat="variable in vm.variables"
+                  >{{variable.name}}
+                </md-option>
+              </md-select>
+            </md-input-container>
+          </div>
+          <!-- / DESCRIPTION SECTION -->
+        </div>
+        <div ng-switch-when="field">
+          <!-- FIELD SECTION -->
+          <div ng-if="vm.accountConnected">
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.FIELD">FIELD</label>
+              <!-- ITEM TYPE DEFAULT VALUE is STRING -->
+              <md-select
+                name="customField"
+                ng-model="vm.customField"
+                required
+                ng-change="vm.item.type = 'string'"
+              >
+                <md-optgroup label="Standard">
+                  <md-option
+                    ng-value="standard"
+                    ng-repeat="standard in vm.fields | filter: {custom: false} "
+                    >{{standard.name}}
+                  </md-option>
+                </md-optgroup>
+
+                <md-optgroup label="Custom">
+                  <md-option
+                    ng-value="custom"
+                    ng-repeat="custom in vm.fields | filter: {custom: true} "
+                    >{{custom.name}}
+                  </md-option>
+                </md-optgroup>
+              </md-select>
+              <div
+                ng-messages="freshdeskAccountItemForm.customField.$error"
+                ng-show="freshdeskAccountItemForm.customField.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.FIELD_REQUIRED"
+                    >Field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <!-- FIELDS -->
+            <div ng-if="vm.customField" ng-include="'/fields.html'"></div>
+            <!-- FIELDS -->
+          </div>
+          <div ng-if="!vm.accountConnected">
+            <p>Account is not connected. Please check your configurations!</p>
+          </div>
+          <!-- / FIELD SECTION -->
+        </div>
+        <div ng-switch-default>
+          <p>No Item</p>
+        </div>
+      </div>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newItem"
+          ng-click="vm.saveItem()"
+          class="send-button md-accent md-raised"
+          ng-disabled="freshdeskAccountItemForm.$invalid || freshdeskAccountItemForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newItem"
+          ng-click="vm.addNewItem()"
+          class="send-button md-accent md-raised"
+          ng-disabled="freshdeskAccountItemForm.$invalid || freshdeskAccountItemForm.$pristine"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD"
+          translate-attr-aria-label="INTEGRATIONS.ADD"
+        >
+          ADD
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newItem"
+          ng-click="vm.deleteItem($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
+
+<script type="text/ng-template" id="/fields.html">
+
+  <!-- type -->
+  <md-input-container class="md-block" ng-if="!vm.customField.options.length">
+
+      <label translate="INTEGRATIONS.TYPE">Type</label>
+      <md-select name="type" ng-model="vm.item.type" required>
+
+          <md-option value="string">String</md-option>
+          <md-option value="variable">Variable</md-option>
+          <md-option value="customVariable">Custom Variable</md-option>
+      </md-select>
+      <div ng-messages="freshdeskAccountItemForm.type.$error" ng-show="freshdeskAccountItemForm.type.$touched"
+          role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <!--/ type -->
+
+  <!-- value -->
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && vm.customField.options.length">
+      <!-- options -->
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+
+      <md-select name="option" ng-model="vm.item.content" required>
+          <md-option ng-value="option.value" ng-repeat="option in vm.customField.options">{{option.name}}</md-option>
+      </md-select>
+
+      <div ng-messages="freshdeskAccountItemForm.option.$error"
+          ng-show="freshdeskAccountItemForm.option.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VALUE_REQUIRED">Value field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && !vm.customField.options.length">
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+
+      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
+
+      <div ng-messages="freshdeskAccountItemForm.content.$error"
+          ng-show="freshdeskAccountItemForm.content.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
+          required>
+          <md-optgroup label="Voice: Queue">
+              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
+              </md-option>
+          </md-optgroup>
+          <md-optgroup label="Voice: Outbound">
+              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
+              </md-option>
+          </md-optgroup>
+      </md-select>
+      <div ng-messages="freshdeskAccountItemForm.variableName.$error"
+          ng-show="freshdeskAccountItemForm.variableName.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select ng-model="vm.item.VariableId" required>
+          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
+      </md-select>
+  </md-input-container>
+
+  <!--/ value -->
+</script>
+
+<script type="text/ng-template" id="/subject.html">
+    <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.TYPE">Type</label>
+            <md-select name="type" ng-model="vm.item.type" required>
+                <md-option value="string">String</md-option>
+                <md-option value="variable">Variable</md-option>
+                <md-option value="customVariable">Custom Variable</md-option>
+            </md-select>
+        <div ng-messages="freshdeskAccountItemForm.type.$error" ng-show="freshdeskAccountItemForm.type.$touched" role="alert">
+            <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
+             </div>
+        </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
+      <div ng-messages="freshdeskAccountItemForm.content.$error"
+          ng-show="freshdeskAccountItemForm.content.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
+          required>
+          <md-optgroup label="Voice: Queue">
+              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
+              </md-option>
+          </md-optgroup>
+          <md-optgroup label="Voice: Outbound">
+              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
+              </md-option>
+          </md-optgroup>
+      </md-select>
+      <div ng-messages="freshdeskAccountItemForm.variableName.$error"
+          ng-show="freshdeskAccountItemForm.variableName.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select ng-model="vm.item.VariableId" required>
+          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
+      </md-select>
+  </md-input-container>
+</script>
diff --git a/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index 35238a9..0000000
--- a/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,943 +0,0 @@
-<div
-  id="integrations-freshdeskAccount"
-  class="page-layout simple tabbed"
-  layout="column"
->
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-freshdeskAccounts-button md-icon-button"
-        aria-label="Go to freshdeskAccounts"
-        ng-click="vm.gotoFreshdeskAccounts()"
-        translate
-        translate-attr-aria-label="INTEGRATIONS.GO_TO_FRESHDESKACCOUNTS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="freshdeskAccount-image" hide-xs>
-          <img ng-src="assets/images/business/freshdeskAccounts.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.freshdeskAccount.id}}
-            <span ng-if="vm.freshdeskAccount.name"
-              >{{vm.freshdeskAccount.name}}</span
-            >
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="INTEGRATIONS.CREATED_AT"></span>
-            <span>{{vm.freshdeskAccount.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveFreshdeskAccount()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (configurationsForm.$invalid)"
-        translate="INTEGRATIONS.SAVE"
-        translate-attr-aria-label="INTEGRATIONS.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="INTEGRATIONS.ACCOUNT">ACCOUNT</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="freshdeskAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="INTEGRATIONS.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.freshdeskAccount.name"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.USERNAME">Username</label>
-                <input
-                  type="text"
-                  name="username"
-                  ng-model="vm.freshdeskAccount.username"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['username'].$error"
-                  ng-show="generalForm['username'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
-                      >Username field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.URI">Uri</label>
-                <input
-                  type="url"
-                  name="remoteUri"
-                  ng-model="vm.freshdeskAccount.remoteUri"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['remoteUri'].$error"
-                  ng-show="generalForm['remoteUri'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
-                      >Uri field is required</span
-                    >
-                  </div>
-                  <div ng-message="url">
-                    <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
-                      >Uri must be a valid url http://www.xcally.com</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.APIKEY">ApiKey</label>
-                <input
-                  type="text"
-                  name="apiKey"
-                  ng-model="vm.freshdeskAccount.apiKey"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['apiKey'].$error"
-                  ng-show="generalForm['apiKey'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.APIKEY_REQUIRED"
-                      >ApiKey field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
-                  >MotionProxyAddress</label
-                >
-                <input
-                  type="url"
-                  name="serverUrl"
-                  ng-model="vm.freshdeskAccount.serverUrl"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['serverUrl'].$error"
-                  ng-show="generalForm['serverUrl'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
-                      >MotionProxyAddress field is required</span
-                    >
-                  </div>
-                  <div ng-message="url">
-                    <span
-                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
-                      >MotionProxyAddress must be a valid url
-                      http://www.xcally.com</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.freshdeskAccount.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="INTEGRATIONS.CONFIGURATIONS">CONFIGURATIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="freshdeskAccount-detail-form-container configurations md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div
-                class="h2 secondary-text"
-                translate="INTEGRATIONS.CONFIGURATIONS"
-              >
-                CONFIGURATIONS
-              </div>
-            </div>
-            <div
-              ng-controller="FreshdeskAccountConfigurationsController as vm_cc"
-              ng-init="vm_cc.init(vm.freshdeskAccount, vm.crudPermissions)"
-              layout="row"
-            >
-              <md-card class="md-whiteframe-1dp" flex="30">
-                <div layout="row" layout-align="center center">
-                  <md-subheader flex="75" class="md-no-sticky"
-                    >{{ 'INTEGRATIONS.CONFIGURATIONS' | translate
-                    }}</md-subheader
-                  >
-                  <md-button
-                    flex="25"
-                    ng-if="vm_cc.crudPermissions.canEdit"
-                    ng-click="vm_cc.createOrEditFreshdeskConfiguration($event)"
-                    class="md-icon-button"
-                    aria-label="create freshdeskConfiguration"
-                  >
-                    <md-icon md-font-icon="icon-plus"></md-icon>
-                  </md-button>
-                </div>
-                <md-list>
-                  <md-list-item
-                    layout="row"
-                    layout-align="center center"
-                    ng-repeat="freshdeskConfiguration in vm_cc.configurations"
-                    class="border-top"
-                    md-colors="{background: (vm_cc.selectedFreshdeskConfiguration == $index ? 'accent' : 'grey-A100')}"
-                    ng-click="vm_cc.getFreshdeskConfiguration($index)"
-                  >
-                    <span class="text-truncate" flex="80"
-                      >{{ freshdeskConfiguration.name }}</span
-                    >
-                    <md-menu ng-if="vm_cc.crudPermissions.canDelete">
-                      <md-button
-                        class="md-icon-button"
-                        aria-label="More"
-                        translate
-                        translate-attr-aria-label="INTEGRATIONS.MORE"
-                        ng-click="$mdOpenMenu($event)"
-                      >
-                        <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                      </md-button>
-                      <md-menu-content width="3">
-                        <md-menu-item ng-if="vm_cc.crudPermissions.canDelete">
-                          <md-button
-                            ng-click="vm_cc.deleteFreshdeskConfiguration($event, freshdeskConfiguration)"
-                            translate="INTEGRATIONS.DELETE_FRESHDESKCONFIGURATION"
-                          >
-                            Delete FreshdeskConfiguration
-                          </md-button>
-                        </md-menu-item>
-                      </md-menu-content>
-                    </md-menu>
-                  </md-list-item>
-                </md-list>
-              </md-card>
-              <div flex></div>
-              <md-card class="md-whiteframe-1dp" flex="65">
-                <md-tabs ng-if="vm_cc.configurations.length" md-dynamic-height>
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.SUBJECTS">SUBJECTS</span>
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-toolbar
-                        class="md-table-toolbar md-default no-padding"
-                        ng-hide="vm_cc.selectedSubjects.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <div flex></div>
-                          <ms-search-bar
-                            on-search="vm_cc.query.subject = query"
-                            on-collapse="vm_cc.query.subject = undefined"
-                            debounce="300"
-                          ></ms-search-bar>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canEdit"
-                            class="md-icon-button"
-                            ng-click="vm_cc.createOrEditSubject($event)"
-                            aria-label="add subject"
-                            translate
-                            translate-attr-label="INTEGRATIONS.ADD_SUBJECT"
-                          >
-                            <md-icon md-font-icon="icon-plus"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-toolbar
-                        class="md-table-toolbar md-accent"
-                        ng-show="vm_cc.selectedSubjects.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <span class="md-subhead"
-                            >{{vm_cc.selectedSubjects.length}}
-                            {{vm_cc.selectedSubjects.length > 1 ? 'items' :
-                            'item'}} selected</span
-                          >
-                          <div flex></div>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canDelete"
-                            class="md-icon-button"
-                            ng-click="vm_cc.deleteSelectedSubjects($event)"
-                            aria-label="delete selected"
-                            translate
-                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-                          >
-                            <md-icon md-font-icon="icon-delete"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-table-container
-                        class="md-whiteframe-1dp padding-horizontal"
-                      >
-                        <table
-                          md-table
-                          md-row-select
-                          multiple
-                          ng-model="vm_cc.selectedSubjects"
-                        >
-                          <thead md-head>
-                            <tr md-row>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.ID' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.TYPE' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.CONTENT' | translate }}
-                              </th>
-                              <th md-column width="10px"></th>
-                            </tr>
-                          </thead>
-                          <tbody md-body>
-                            <tr
-                              md-row
-                              md-select="subject"
-                              md-select-id="id"
-                              ng-repeat="subject in vm_cc.subjects | filter: vm_cc.query.subject"
-                            >
-                              <td
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                                class="id"
-                              >
-                                {{subject.id}}
-                              </td>
-                              <td
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                                class="type"
-                              >
-                                <span ng-if="subject.FieldId"
-                                  >{{subject.nameField ||
-                                  subject.idField}}</span
-                                >
-                                <span ng-if="!subject.FieldId"
-                                  >{{subject.type}}</span
-                                >
-                              </td>
-                              <td
-                                ng-switch="subject.type"
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                              >
-                                <span ng-switch-when="string"
-                                  >{{subject.content}}</span
-                                >
-                                <span
-                                  ng-switch-when="variable"
-                                  class="text-boxed"
-                                  >{{subject.variableName}}</span
-                                >
-                                <span
-                                  ng-switch-when="customVariable"
-                                  class="text-boxed"
-                                  >{{
-                                  vm_cc.variablesById[subject.VariableId].name
-                                  }}</span
-                                >
-                                <span ng-switch-when="keyValue">
-                                  {{subject.key}}
-                                  <span ng-switch="description.keyType">
-                                    <span ng-switch-when="string"
-                                      >{{subject.keyContent}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="variable"
-                                      class="text-boxed"
-                                      >{{subject.variableName}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="customVariable"
-                                      class="text-boxed"
-                                      >{{
-                                      vm_cc.variablesById[subject.VariableId].name
-                                      }}</span
-                                    >
-                                  </span>
-                                </span>
-                                <span ng-switch-default
-                                  >{{subject.content}}</span
-                                >
-                              </td>
-                              <td
-                                md-cell
-                                class="actions"
-                                ng-if="!vm_cc.crudPermissions.readOnly"
-                              >
-                                <md-menu>
-                                  <md-button
-                                    class="md-icon-button"
-                                    aria-label="More"
-                                    translate
-                                    translate-attr-aria-label="INTEGRATIONS.MORE"
-                                    ng-click="$mdOpenMenu($event)"
-                                  >
-                                    <md-icon
-                                      md-font-icon="icon-dots-vertical"
-                                    ></md-icon>
-                                  </md-button>
-
-                                  <md-menu-content width="3">
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canEdit"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                        translate="INTEGRATIONS.EDIT_SUBJECT"
-                                      >
-                                        Edit Subject
-                                      </md-button>
-                                    </md-menu-item>
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canDelete"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.deleteSubjectConfirm($event, subject)"
-                                        translate="INTEGRATIONS.DELETE_SUBJECT"
-                                      >
-                                        Delete Subject
-                                      </md-button>
-                                    </md-menu-item>
-                                  </md-menu-content>
-                                </md-menu>
-                              </td>
-                            </tr>
-                          </tbody>
-                        </table>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.DESCRIPTIONS"
-                        >DESCRIPTIONS</span
-                      >
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-toolbar
-                        class="md-table-toolbar md-default no-padding"
-                        ng-hide="vm_cc.selectedDescriptions.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <div flex></div>
-                          <ms-search-bar
-                            on-search="vm_cc.query.description = query"
-                            on-collapse="vm_cc.query.description = undefined"
-                            debounce="300"
-                          ></ms-search-bar>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canEdit"
-                            class="md-icon-button"
-                            ng-click="vm_cc.createOrEditDescription($event)"
-                            aria-label="add description"
-                            translate
-                            translate-attr-label="INTEGRATIONS.ADD_DESCRIPTION"
-                          >
-                            <md-icon md-font-icon="icon-plus"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-toolbar
-                        class="md-table-toolbar md-accent"
-                        ng-show="vm_cc.selectedDescriptions.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <span class="md-subhead"
-                            >{{vm_cc.selectedDescriptions.length}}
-                            {{vm_cc.selectedDescriptions.length > 1 ? 'items' :
-                            'item'}} selected</span
-                          >
-                          <div flex></div>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canDelete"
-                            class="md-icon-button"
-                            ng-click="vm_cc.deleteSelectedDescriptions($event)"
-                            aria-label="delete selected"
-                            translate
-                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-                          >
-                            <md-icon md-font-icon="icon-delete"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-table-container
-                        class="md-whiteframe-1dp padding-horizontal"
-                      >
-                        <table
-                          md-table
-                          md-row-select
-                          multiple
-                          ng-model="vm_cc.selectedDescriptions"
-                        >
-                          <thead md-head>
-                            <tr md-row>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.ID' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.TYPE' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.CONTENT' | translate }}
-                              </th>
-                              <th md-column width="10px"></th>
-                            </tr>
-                          </thead>
-                          <tbody md-body>
-                            <tr
-                              md-row
-                              md-select="description"
-                              md-select-id="id"
-                              ng-repeat="description in vm_cc.descriptions | filter: vm_cc.query.description"
-                            >
-                              <td
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                                class="id"
-                              >
-                                {{description.id}}
-                              </td>
-                              <td
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                                class="type"
-                              >
-                                <span ng-if="description.FieldId"
-                                  >{{description.nameField ||
-                                  description.idField}}</span
-                                >
-                                <span ng-if="!description.FieldId"
-                                  >{{description.type}}</span
-                                >
-                              </td>
-                              <td
-                                ng-switch="description.type"
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                              >
-                                <span ng-switch-when="string"
-                                  >{{description.content}}</span
-                                >
-                                <span
-                                  ng-switch-when="variable"
-                                  class="text-boxed"
-                                  >{{description.variableName}}</span
-                                >
-                                <span
-                                  ng-switch-when="customVariable"
-                                  class="text-boxed"
-                                  >{{
-                                  vm_cc.variablesById[description.VariableId].name
-                                  }}</span
-                                >
-                                <span ng-switch-when="keyValue">
-                                  {{description.key}}
-                                  <span ng-switch="description.keyType">
-                                    <span ng-switch-when="string"
-                                      >{{description.keyContent}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="variable"
-                                      class="text-boxed"
-                                      >{{description.variableName}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="customVariable"
-                                      class="text-boxed"
-                                      >{{
-                                      vm_cc.variablesById[description.VariableId].name
-                                      }}</span
-                                    >
-                                  </span>
-                                </span>
-                                <span ng-switch-default
-                                  >{{description.content}}</span
-                                >
-                              </td>
-                              <td
-                                md-cell
-                                class="actions"
-                                ng-if="!vm_cc.crudPermissions.readOnly"
-                              >
-                                <md-menu>
-                                  <md-button
-                                    class="md-icon-button"
-                                    aria-label="More"
-                                    translate
-                                    translate-attr-aria-label="INTEGRATIONS.MORE"
-                                    ng-click="$mdOpenMenu($event)"
-                                  >
-                                    <md-icon
-                                      md-font-icon="icon-dots-vertical"
-                                    ></md-icon>
-                                  </md-button>
-
-                                  <md-menu-content width="3">
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canEdit"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.createOrEditDescription($event, description)"
-                                        translate="INTEGRATIONS.EDIT_DESCRIPTION"
-                                      >
-                                        Edit Description
-                                      </md-button>
-                                    </md-menu-item>
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canDelete"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.deleteDescriptionConfirm($event, description)"
-                                        translate="INTEGRATIONS.DELETE_DESCRIPTION"
-                                      >
-                                        Delete Description
-                                      </md-button>
-                                    </md-menu-item>
-                                  </md-menu-content>
-                                </md-menu>
-                              </td>
-                            </tr>
-                          </tbody>
-                        </table>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.FIELDS">FIELDS</span>
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-toolbar
-                        class="md-table-toolbar md-default no-padding"
-                        ng-hide="vm_cc.selectedFields.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <div flex></div>
-                          <ms-search-bar
-                            on-search="vm_cc.query.field = query"
-                            on-collapse="vm_cc.query.field = undefined"
-                            debounce="300"
-                          ></ms-search-bar>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canEdit"
-                            class="md-icon-button"
-                            ng-click="vm_cc.createOrEditField($event)"
-                            aria-label="add field"
-                            translate
-                            translate-attr-label="INTEGRATIONS.ADD_FIELD"
-                          >
-                            <md-icon md-font-icon="icon-plus"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-toolbar
-                        class="md-table-toolbar md-accent"
-                        ng-show="vm_cc.selectedFields.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <span class="md-subhead"
-                            >{{vm_cc.selectedFields.length}}
-                            {{vm_cc.selectedFields.length > 1 ? 'items' :
-                            'item'}} selected</span
-                          >
-                          <div flex></div>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canDelete"
-                            class="md-icon-button"
-                            ng-click="vm_cc.deleteSelectedFields($event)"
-                            aria-label="delete selected"
-                            translate
-                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-                          >
-                            <md-icon md-font-icon="icon-delete"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-table-container
-                        class="md-whiteframe-1dp padding-horizontal"
-                      >
-                        <table
-                          md-table
-                          md-row-select
-                          multiple
-                          ng-model="vm_cc.selectedFields"
-                        >
-                          <thead md-head>
-                            <tr md-row>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.ID' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.TYPE' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.CONTENT' | translate }}
-                              </th>
-                              <th md-column width="10px"></th>
-                            </tr>
-                          </thead>
-                          <tbody md-body>
-                            <tr
-                              md-row
-                              md-select="field"
-                              md-select-id="id"
-                              ng-repeat="field in vm_cc.fields | filter: vm_cc.query.field"
-                            >
-                              <td
-                                ng-click="vm_cc.createOrEditField($event, field)"
-                                md-cell
-                                class="id"
-                              >
-                                {{field.id}}
-                              </td>
-                              <td
-                                ng-click="vm_cc.createOrEditField($event, field)"
-                                md-cell
-                                class="type"
-                              >
-                                <span ng-if="field.FieldId"
-                                  >{{field.nameField || field.idField}}</span
-                                >
-                                <span ng-if="!field.FieldId"
-                                  >{{field.type}}</span
-                                >
-                              </td>
-                              <td
-                                ng-switch="field.type"
-                                ng-click="vm_cc.createOrEditField($event, field)"
-                                md-cell
-                              >
-                                <span ng-switch-when="string"
-                                  >{{field.content}}</span
-                                >
-                                <span
-                                  ng-switch-when="variable"
-                                  class="text-boxed"
-                                  >{{field.variableName}}</span
-                                >
-                                <span
-                                  ng-switch-when="customVariable"
-                                  class="text-boxed"
-                                  >{{ vm_cc.variablesById[field.VariableId].name
-                                  }}</span
-                                >
-                                <span ng-switch-when="keyValue">
-                                  {{field.key}}
-                                  <span ng-switch="description.keyType">
-                                    <span ng-switch-when="string"
-                                      >{{field.keyContent}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="variable"
-                                      class="text-boxed"
-                                      >{{field.variableName}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="customVariable"
-                                      class="text-boxed"
-                                      >{{
-                                      vm_cc.variablesById[field.VariableId].name
-                                      }}</span
-                                    >
-                                  </span>
-                                </span>
-                                <span ng-switch-default>{{field.content}}</span>
-                              </td>
-                              <td
-                                md-cell
-                                class="actions"
-                                ng-if="!vm_cc.crudPermissions.readOnly"
-                              >
-                                <md-menu>
-                                  <md-button
-                                    class="md-icon-button"
-                                    aria-label="More"
-                                    translate
-                                    translate-attr-aria-label="INTEGRATIONS.MORE"
-                                    ng-click="$mdOpenMenu($event)"
-                                  >
-                                    <md-icon
-                                      md-font-icon="icon-dots-vertical"
-                                    ></md-icon>
-                                  </md-button>
-
-                                  <md-menu-content width="3">
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canEdit"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.createOrEditField($event, field)"
-                                        translate="INTEGRATIONS.EDIT_FIELD"
-                                      >
-                                        Edit Field
-                                      </md-button>
-                                    </md-menu-item>
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canDelete"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.deleteFieldConfirm($event, field)"
-                                        translate="INTEGRATIONS.DELETE_FIELD"
-                                      >
-                                        Delete Field
-                                      </md-button>
-                                    </md-menu-item>
-                                  </md-menu-content>
-                                </md-menu>
-                              </td>
-                            </tr>
-                          </tbody>
-                        </table>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.TAGS">TAGS</span>
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-table-container class="md-whiteframe-1dp padding-20">
-                        <md-input-container class="md-block">
-                          <label translate="INTEGRATIONS.TAGS">Tags</label>
-                          <md-select
-                            ng-model="vm_cc.selectedTags"
-                            ng-change="vm_cc.selectTagsChanged($event)"
-                            multiple
-                          >
-                            <md-option
-                              ng-value="tag.id"
-                              ng-repeat="tag in vm_cc.tags"
-                              >{{ tag.name }}</md-option
-                            >
-                          </md-select>
-                        </md-input-container>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-                </md-tabs>
-                <div
-                  class="padding-20"
-                  ng-if="!vm_cc.configurations.length && vm_cc.crudPermissions.canEdit"
-                  ng-click="vm_cc.createOrEditFreshdeskConfiguration($event)"
-                  layout="row"
-                  layout-sm="column"
-                  layout-align="center center"
-                  layout-wrap
-                >
-                  <div
-                    class="padding-20 md-whiteframe-3dp md-accent-bg"
-                    layout="column"
-                    layout-align="center center"
-                  >
-                    <md-button class="md-icon-button">
-                      <md-icon md-font-icon="icon-plus"></md-icon>
-                    </md-button>
-                    <span
-                      aria-label="add configuration"
-                      translate
-                      translate-attr-label="INTEGRATIONS.ADD_CONFIGURATION"
-                      >ADD CONFIGURATION</span
-                    >
-                  </div>
-                </div>
-              </md-card>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/edit/view.html/view.html b/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/edit/view.html/view.html
new file mode 100644
index 0000000..35238a9
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/edit/view.html/view.html
@@ -0,0 +1,943 @@
+<div
+  id="integrations-freshdeskAccount"
+  class="page-layout simple tabbed"
+  layout="column"
+>
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-freshdeskAccounts-button md-icon-button"
+        aria-label="Go to freshdeskAccounts"
+        ng-click="vm.gotoFreshdeskAccounts()"
+        translate
+        translate-attr-aria-label="INTEGRATIONS.GO_TO_FRESHDESKACCOUNTS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="freshdeskAccount-image" hide-xs>
+          <img ng-src="assets/images/business/freshdeskAccounts.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.freshdeskAccount.id}}
+            <span ng-if="vm.freshdeskAccount.name"
+              >{{vm.freshdeskAccount.name}}</span
+            >
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="INTEGRATIONS.CREATED_AT"></span>
+            <span>{{vm.freshdeskAccount.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveFreshdeskAccount()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (configurationsForm.$invalid)"
+        translate="INTEGRATIONS.SAVE"
+        translate-attr-aria-label="INTEGRATIONS.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="INTEGRATIONS.ACCOUNT">ACCOUNT</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="freshdeskAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="INTEGRATIONS.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.freshdeskAccount.name"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.USERNAME">Username</label>
+                <input
+                  type="text"
+                  name="username"
+                  ng-model="vm.freshdeskAccount.username"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['username'].$error"
+                  ng-show="generalForm['username'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
+                      >Username field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.URI">Uri</label>
+                <input
+                  type="url"
+                  name="remoteUri"
+                  ng-model="vm.freshdeskAccount.remoteUri"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['remoteUri'].$error"
+                  ng-show="generalForm['remoteUri'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
+                      >Uri field is required</span
+                    >
+                  </div>
+                  <div ng-message="url">
+                    <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
+                      >Uri must be a valid url http://www.xcally.com</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.APIKEY">ApiKey</label>
+                <input
+                  type="text"
+                  name="apiKey"
+                  ng-model="vm.freshdeskAccount.apiKey"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['apiKey'].$error"
+                  ng-show="generalForm['apiKey'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.APIKEY_REQUIRED"
+                      >ApiKey field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
+                  >MotionProxyAddress</label
+                >
+                <input
+                  type="url"
+                  name="serverUrl"
+                  ng-model="vm.freshdeskAccount.serverUrl"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['serverUrl'].$error"
+                  ng-show="generalForm['serverUrl'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
+                      >MotionProxyAddress field is required</span
+                    >
+                  </div>
+                  <div ng-message="url">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
+                      >MotionProxyAddress must be a valid url
+                      http://www.xcally.com</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.freshdeskAccount.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="INTEGRATIONS.CONFIGURATIONS">CONFIGURATIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="freshdeskAccount-detail-form-container configurations md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div
+                class="h2 secondary-text"
+                translate="INTEGRATIONS.CONFIGURATIONS"
+              >
+                CONFIGURATIONS
+              </div>
+            </div>
+            <div
+              ng-controller="FreshdeskAccountConfigurationsController as vm_cc"
+              ng-init="vm_cc.init(vm.freshdeskAccount, vm.crudPermissions)"
+              layout="row"
+            >
+              <md-card class="md-whiteframe-1dp" flex="30">
+                <div layout="row" layout-align="center center">
+                  <md-subheader flex="75" class="md-no-sticky"
+                    >{{ 'INTEGRATIONS.CONFIGURATIONS' | translate
+                    }}</md-subheader
+                  >
+                  <md-button
+                    flex="25"
+                    ng-if="vm_cc.crudPermissions.canEdit"
+                    ng-click="vm_cc.createOrEditFreshdeskConfiguration($event)"
+                    class="md-icon-button"
+                    aria-label="create freshdeskConfiguration"
+                  >
+                    <md-icon md-font-icon="icon-plus"></md-icon>
+                  </md-button>
+                </div>
+                <md-list>
+                  <md-list-item
+                    layout="row"
+                    layout-align="center center"
+                    ng-repeat="freshdeskConfiguration in vm_cc.configurations"
+                    class="border-top"
+                    md-colors="{background: (vm_cc.selectedFreshdeskConfiguration == $index ? 'accent' : 'grey-A100')}"
+                    ng-click="vm_cc.getFreshdeskConfiguration($index)"
+                  >
+                    <span class="text-truncate" flex="80"
+                      >{{ freshdeskConfiguration.name }}</span
+                    >
+                    <md-menu ng-if="vm_cc.crudPermissions.canDelete">
+                      <md-button
+                        class="md-icon-button"
+                        aria-label="More"
+                        translate
+                        translate-attr-aria-label="INTEGRATIONS.MORE"
+                        ng-click="$mdOpenMenu($event)"
+                      >
+                        <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                      </md-button>
+                      <md-menu-content width="3">
+                        <md-menu-item ng-if="vm_cc.crudPermissions.canDelete">
+                          <md-button
+                            ng-click="vm_cc.deleteFreshdeskConfiguration($event, freshdeskConfiguration)"
+                            translate="INTEGRATIONS.DELETE_FRESHDESKCONFIGURATION"
+                          >
+                            Delete FreshdeskConfiguration
+                          </md-button>
+                        </md-menu-item>
+                      </md-menu-content>
+                    </md-menu>
+                  </md-list-item>
+                </md-list>
+              </md-card>
+              <div flex></div>
+              <md-card class="md-whiteframe-1dp" flex="65">
+                <md-tabs ng-if="vm_cc.configurations.length" md-dynamic-height>
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.SUBJECTS">SUBJECTS</span>
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedSubjects.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.subject = query"
+                            on-collapse="vm_cc.query.subject = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditSubject($event)"
+                            aria-label="add subject"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_SUBJECT"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedSubjects.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedSubjects.length}}
+                            {{vm_cc.selectedSubjects.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedSubjects($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedSubjects"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.ID' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.TYPE' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.CONTENT' | translate }}
+                              </th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="subject"
+                              md-select-id="id"
+                              ng-repeat="subject in vm_cc.subjects | filter: vm_cc.query.subject"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                                class="id"
+                              >
+                                {{subject.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="subject.FieldId"
+                                  >{{subject.nameField ||
+                                  subject.idField}}</span
+                                >
+                                <span ng-if="!subject.FieldId"
+                                  >{{subject.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="subject.type"
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{subject.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{subject.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{
+                                  vm_cc.variablesById[subject.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{subject.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{subject.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{subject.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[subject.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default
+                                  >{{subject.content}}</span
+                                >
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="INTEGRATIONS.MORE"
+                                    ng-click="$mdOpenMenu($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                        translate="INTEGRATIONS.EDIT_SUBJECT"
+                                      >
+                                        Edit Subject
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteSubjectConfirm($event, subject)"
+                                        translate="INTEGRATIONS.DELETE_SUBJECT"
+                                      >
+                                        Delete Subject
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.DESCRIPTIONS"
+                        >DESCRIPTIONS</span
+                      >
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedDescriptions.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.description = query"
+                            on-collapse="vm_cc.query.description = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditDescription($event)"
+                            aria-label="add description"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_DESCRIPTION"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedDescriptions.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedDescriptions.length}}
+                            {{vm_cc.selectedDescriptions.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedDescriptions($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedDescriptions"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.ID' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.TYPE' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.CONTENT' | translate }}
+                              </th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="description"
+                              md-select-id="id"
+                              ng-repeat="description in vm_cc.descriptions | filter: vm_cc.query.description"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                                class="id"
+                              >
+                                {{description.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="description.FieldId"
+                                  >{{description.nameField ||
+                                  description.idField}}</span
+                                >
+                                <span ng-if="!description.FieldId"
+                                  >{{description.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="description.type"
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{description.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{description.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{
+                                  vm_cc.variablesById[description.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{description.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{description.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{description.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[description.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default
+                                  >{{description.content}}</span
+                                >
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="INTEGRATIONS.MORE"
+                                    ng-click="$mdOpenMenu($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditDescription($event, description)"
+                                        translate="INTEGRATIONS.EDIT_DESCRIPTION"
+                                      >
+                                        Edit Description
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteDescriptionConfirm($event, description)"
+                                        translate="INTEGRATIONS.DELETE_DESCRIPTION"
+                                      >
+                                        Delete Description
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.FIELDS">FIELDS</span>
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedFields.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.field = query"
+                            on-collapse="vm_cc.query.field = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditField($event)"
+                            aria-label="add field"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_FIELD"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedFields.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedFields.length}}
+                            {{vm_cc.selectedFields.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedFields($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedFields"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.ID' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.TYPE' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.CONTENT' | translate }}
+                              </th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="field"
+                              md-select-id="id"
+                              ng-repeat="field in vm_cc.fields | filter: vm_cc.query.field"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditField($event, field)"
+                                md-cell
+                                class="id"
+                              >
+                                {{field.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditField($event, field)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="field.FieldId"
+                                  >{{field.nameField || field.idField}}</span
+                                >
+                                <span ng-if="!field.FieldId"
+                                  >{{field.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="field.type"
+                                ng-click="vm_cc.createOrEditField($event, field)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{field.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{field.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{ vm_cc.variablesById[field.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{field.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{field.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{field.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[field.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default>{{field.content}}</span>
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="INTEGRATIONS.MORE"
+                                    ng-click="$mdOpenMenu($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditField($event, field)"
+                                        translate="INTEGRATIONS.EDIT_FIELD"
+                                      >
+                                        Edit Field
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteFieldConfirm($event, field)"
+                                        translate="INTEGRATIONS.DELETE_FIELD"
+                                      >
+                                        Delete Field
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.TAGS">TAGS</span>
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-table-container class="md-whiteframe-1dp padding-20">
+                        <md-input-container class="md-block">
+                          <label translate="INTEGRATIONS.TAGS">Tags</label>
+                          <md-select
+                            ng-model="vm_cc.selectedTags"
+                            ng-change="vm_cc.selectTagsChanged($event)"
+                            multiple
+                          >
+                            <md-option
+                              ng-value="tag.id"
+                              ng-repeat="tag in vm_cc.tags"
+                              >{{ tag.name }}</md-option
+                            >
+                          </md-select>
+                        </md-input-container>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+                </md-tabs>
+                <div
+                  class="padding-20"
+                  ng-if="!vm_cc.configurations.length && vm_cc.crudPermissions.canEdit"
+                  ng-click="vm_cc.createOrEditFreshdeskConfiguration($event)"
+                  layout="row"
+                  layout-sm="column"
+                  layout-align="center center"
+                  layout-wrap
+                >
+                  <div
+                    class="padding-20 md-whiteframe-3dp md-accent-bg"
+                    layout="column"
+                    layout-align="center center"
+                  >
+                    <md-button class="md-icon-button">
+                      <md-icon md-font-icon="icon-plus"></md-icon>
+                    </md-button>
+                    <span
+                      aria-label="add configuration"
+                      translate
+                      translate-attr-label="INTEGRATIONS.ADD_CONFIGURATION"
+                      >ADD CONFIGURATION</span
+                    >
+                  </div>
+                </div>
+              </md-card>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/freshdeskAccounts.html/freshdeskAccounts-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/freshdeskAccounts.html/freshdeskAccounts-[chunkhash].html
deleted file mode 100644
index ea89cbb..0000000
--- a/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/freshdeskAccounts.html/freshdeskAccounts-[chunkhash].html
+++ /dev/null
@@ -1,323 +0,0 @@
-<div
-  id="freshdeskAccounts"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-heart" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="INTEGRATIONS.FRESHDESKACCOUNTS"
-          >FreshdeskAccounts</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="INTEGRATIONS.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedFreshdeskAccounts.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div
-      class="close-button-wrapper"
-      ng-click="vm.selectedFreshdeskAccounts =[]"
-    >
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="INTEGRATIONS.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-freshdeskAccounts-count">
-          <span>{{vm.selectedFreshdeskAccounts.length}}</span>
-          <span translate="INTEGRATIONS.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="INTEGRATIONS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllFreshdeskAccounts()"
-                translate="INTEGRATIONS.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectFreshdeskAccounts()"
-                translate="INTEGRATIONS.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedFreshdeskAccounts"
-          csv-label="true"
-          filename="freshdeskAccounts.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedFreshdeskAccounts($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- FRESHDESKACCOUNT TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedFreshdeskAccounts"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getFreshdeskAccounts"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">
-                  {{ 'INTEGRATIONS.ID' | translate }}
-                </th>
-                <th md-column md-order-by="name">
-                  {{ 'INTEGRATIONS.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="username">
-                  {{ 'INTEGRATIONS.USERNAME' | translate }}
-                </th>
-                <th md-column md-order-by="remoteUri">
-                  {{ 'INTEGRATIONS.URI' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.freshdeskAccounts.rows.length">
-                <td md-cell colspan="5">
-                  <div layout="row" layout-align="center center">
-                    <span translate="INTEGRATIONS.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="freshdeskAccount"
-                md-select-id="id"
-                ng-repeat="freshdeskAccount in vm.freshdeskAccounts.rows"
-              >
-                <td md-cell ng-if="freshdeskAccount.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{freshdeskAccount.name}}"
-                    ng-src="api/users/{{freshdeskAccount.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!freshdeskAccount.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{freshdeskAccount.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(freshdeskAccount, ev) : vm.createOrEditFreshdeskAccount($event, freshdeskAccount)"
-                  md-cell
-                  class="id"
-                >
-                  {{freshdeskAccount.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(freshdeskAccount, ev) : vm.createOrEditFreshdeskAccount($event, freshdeskAccount)"
-                  md-cell
-                  class="name"
-                >
-                  {{freshdeskAccount.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(freshdeskAccount, ev) : vm.createOrEditFreshdeskAccount($event, freshdeskAccount)"
-                  md-cell
-                  class="username"
-                >
-                  {{freshdeskAccount.username}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(freshdeskAccount, ev) : vm.createOrEditFreshdeskAccount($event, freshdeskAccount)"
-                  md-cell
-                  class="remoteUri"
-                >
-                  {{freshdeskAccount.remoteUri}}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="INTEGRATIONS.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(freshdeskAccount, $event    )"
-                          translate="INTEGRATIONS.EDIT_FRESHDESKACCOUNT"
-                        >
-                          Edit FreshdeskAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.testtestintegrationaccount(freshdeskAccount, $event    )"
-                          translate="INTEGRATIONS.TEST_FRESHDESKACCOUNT"
-                        >
-                          Test FreshdeskAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(freshdeskAccount, $event    )"
-                          translate="INTEGRATIONS.DELETE_FRESHDESKACCOUNT"
-                        >
-                          Delete FreshdeskAccount
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'INTEGRATIONS.PAGE' | translate}}:', rowsPerPage: '{{'INTEGRATIONS.ROWSPERPAGE' | translate}}:', of: '{{'INTEGRATIONS.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.freshdeskAccounts.count}}"
-          md-on-paginate="vm.getFreshdeskAccounts"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / FRESHDESKACCOUNT TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD FRESHDESKACCOUNT BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-freshdeskAccount-button"
-    ng-click="vm.createOrEditFreshdeskAccount($event)"
-    aria-label="add freshdeskAccount"
-    translate
-    translate-attr-aria-label="INTEGRATIONS.ADD_FRESHDESKACCOUNT"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD FRESHDESKACCOUNT BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/freshdeskAccounts.html/freshdeskAccounts.html b/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/freshdeskAccounts.html/freshdeskAccounts.html
new file mode 100644
index 0000000..ea89cbb
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/freshdeskAccounts/freshdeskAccounts.html/freshdeskAccounts.html
@@ -0,0 +1,323 @@
+<div
+  id="freshdeskAccounts"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-heart" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="INTEGRATIONS.FRESHDESKACCOUNTS"
+          >FreshdeskAccounts</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="INTEGRATIONS.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedFreshdeskAccounts.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div
+      class="close-button-wrapper"
+      ng-click="vm.selectedFreshdeskAccounts =[]"
+    >
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="INTEGRATIONS.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-freshdeskAccounts-count">
+          <span>{{vm.selectedFreshdeskAccounts.length}}</span>
+          <span translate="INTEGRATIONS.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="INTEGRATIONS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllFreshdeskAccounts()"
+                translate="INTEGRATIONS.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectFreshdeskAccounts()"
+                translate="INTEGRATIONS.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedFreshdeskAccounts"
+          csv-label="true"
+          filename="freshdeskAccounts.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedFreshdeskAccounts($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- FRESHDESKACCOUNT TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedFreshdeskAccounts"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getFreshdeskAccounts"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">
+                  {{ 'INTEGRATIONS.ID' | translate }}
+                </th>
+                <th md-column md-order-by="name">
+                  {{ 'INTEGRATIONS.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="username">
+                  {{ 'INTEGRATIONS.USERNAME' | translate }}
+                </th>
+                <th md-column md-order-by="remoteUri">
+                  {{ 'INTEGRATIONS.URI' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.freshdeskAccounts.rows.length">
+                <td md-cell colspan="5">
+                  <div layout="row" layout-align="center center">
+                    <span translate="INTEGRATIONS.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="freshdeskAccount"
+                md-select-id="id"
+                ng-repeat="freshdeskAccount in vm.freshdeskAccounts.rows"
+              >
+                <td md-cell ng-if="freshdeskAccount.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{freshdeskAccount.name}}"
+                    ng-src="api/users/{{freshdeskAccount.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!freshdeskAccount.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{freshdeskAccount.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(freshdeskAccount, ev) : vm.createOrEditFreshdeskAccount($event, freshdeskAccount)"
+                  md-cell
+                  class="id"
+                >
+                  {{freshdeskAccount.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(freshdeskAccount, ev) : vm.createOrEditFreshdeskAccount($event, freshdeskAccount)"
+                  md-cell
+                  class="name"
+                >
+                  {{freshdeskAccount.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(freshdeskAccount, ev) : vm.createOrEditFreshdeskAccount($event, freshdeskAccount)"
+                  md-cell
+                  class="username"
+                >
+                  {{freshdeskAccount.username}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(freshdeskAccount, ev) : vm.createOrEditFreshdeskAccount($event, freshdeskAccount)"
+                  md-cell
+                  class="remoteUri"
+                >
+                  {{freshdeskAccount.remoteUri}}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="INTEGRATIONS.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(freshdeskAccount, $event    )"
+                          translate="INTEGRATIONS.EDIT_FRESHDESKACCOUNT"
+                        >
+                          Edit FreshdeskAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.testtestintegrationaccount(freshdeskAccount, $event    )"
+                          translate="INTEGRATIONS.TEST_FRESHDESKACCOUNT"
+                        >
+                          Test FreshdeskAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(freshdeskAccount, $event    )"
+                          translate="INTEGRATIONS.DELETE_FRESHDESKACCOUNT"
+                        >
+                          Delete FreshdeskAccount
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'INTEGRATIONS.PAGE' | translate}}:', rowsPerPage: '{{'INTEGRATIONS.ROWSPERPAGE' | translate}}:', of: '{{'INTEGRATIONS.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.freshdeskAccounts.count}}"
+          md-on-paginate="vm.getFreshdeskAccounts"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / FRESHDESKACCOUNT TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD FRESHDESKACCOUNT BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-freshdeskAccount-button"
+    ng-click="vm.createOrEditFreshdeskAccount($event)"
+    aria-label="add freshdeskAccount"
+    translate
+    translate-attr-aria-label="INTEGRATIONS.ADD_FRESHDESKACCOUNT"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD FRESHDESKACCOUNT BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 8b58cdc..0000000
--- a/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,254 +0,0 @@
-<md-dialog class="freshsalesAccount-dialog" aria-label="New FreshsalesAccount">
-  <form name="freshsalesAccountForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.freshsalesAccount.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="freshsalesAccountForm['name'].$error"
-          ng-show="freshsalesAccountForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.USERNAME">Username</label>
-        <input
-          type="text"
-          name="username"
-          ng-model="vm.freshsalesAccount.username"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="freshsalesAccountForm['username'].$error"
-          ng-show="freshsalesAccountForm['username'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
-              >Username field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.URI">Uri</label>
-        <input
-          type="url"
-          name="remoteUri"
-          ng-model="vm.freshsalesAccount.remoteUri"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="freshsalesAccountForm['remoteUri'].$error"
-          ng-show="freshsalesAccountForm['remoteUri'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
-              >Uri field is required</span
-            >
-          </div>
-          <div ng-message="url">
-            <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
-              >Uri must be a valid url http://www.xcally.com</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.APIKEY">ApiKey</label>
-        <input
-          type="text"
-          name="apiKey"
-          ng-model="vm.freshsalesAccount.apiKey"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="freshsalesAccountForm['apiKey'].$error"
-          ng-show="freshsalesAccountForm['apiKey'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.APIKEY_REQUIRED"
-              >ApiKey field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
-          >MotionProxyAddress</label
-        >
-        <input
-          type="url"
-          name="serverUrl"
-          ng-model="vm.freshsalesAccount.serverUrl"
-        />
-
-        <div class="hint">
-          <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
-        </div>
-        <div
-          ng-messages="freshsalesAccountForm['serverUrl'].$error"
-          ng-show="freshsalesAccountForm['serverUrl'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
-              >MotionProxyAddress field is required</span
-            >
-          </div>
-          <div ng-message="url">
-            <span
-              translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
-              >MotionProxyAddress must be a valid url
-              http://www.xcally.com</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.freshsalesAccount.description"
-        />
-
-        <div
-          ng-messages="freshsalesAccountForm['description'].$error"
-          ng-show="freshsalesAccountForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newFreshsalesAccount"
-          ng-click="vm.saveFreshsalesAccount()"
-          class="send-button md-accent md-raised"
-          ng-disabled="freshsalesAccountForm.$invalid || freshsalesAccountForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newFreshsalesAccount"
-          ng-click="vm.addNewFreshsalesAccount()"
-          class="send-button md-accent md-raised"
-          ng-disabled="freshsalesAccountForm.$invalid"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD_FRESHSALESACCOUNT"
-          translate-attr-aria-label="INTEGRATIONS.ADD_FRESHSALESACCOUNT"
-        >
-          ADD FRESHSALESACCOUNT
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newFreshsalesAccount"
-          ng-click="vm.deleteFreshsalesAccount($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/create/dialog.html/dialog.html
new file mode 100644
index 0000000..8b58cdc
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/create/dialog.html/dialog.html
@@ -0,0 +1,254 @@
+<md-dialog class="freshsalesAccount-dialog" aria-label="New FreshsalesAccount">
+  <form name="freshsalesAccountForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.freshsalesAccount.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="freshsalesAccountForm['name'].$error"
+          ng-show="freshsalesAccountForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.USERNAME">Username</label>
+        <input
+          type="text"
+          name="username"
+          ng-model="vm.freshsalesAccount.username"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="freshsalesAccountForm['username'].$error"
+          ng-show="freshsalesAccountForm['username'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
+              >Username field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.URI">Uri</label>
+        <input
+          type="url"
+          name="remoteUri"
+          ng-model="vm.freshsalesAccount.remoteUri"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="freshsalesAccountForm['remoteUri'].$error"
+          ng-show="freshsalesAccountForm['remoteUri'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
+              >Uri field is required</span
+            >
+          </div>
+          <div ng-message="url">
+            <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
+              >Uri must be a valid url http://www.xcally.com</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.APIKEY">ApiKey</label>
+        <input
+          type="text"
+          name="apiKey"
+          ng-model="vm.freshsalesAccount.apiKey"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="freshsalesAccountForm['apiKey'].$error"
+          ng-show="freshsalesAccountForm['apiKey'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.APIKEY_REQUIRED"
+              >ApiKey field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
+          >MotionProxyAddress</label
+        >
+        <input
+          type="url"
+          name="serverUrl"
+          ng-model="vm.freshsalesAccount.serverUrl"
+        />
+
+        <div class="hint">
+          <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
+        </div>
+        <div
+          ng-messages="freshsalesAccountForm['serverUrl'].$error"
+          ng-show="freshsalesAccountForm['serverUrl'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
+              >MotionProxyAddress field is required</span
+            >
+          </div>
+          <div ng-message="url">
+            <span
+              translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
+              >MotionProxyAddress must be a valid url
+              http://www.xcally.com</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.freshsalesAccount.description"
+        />
+
+        <div
+          ng-messages="freshsalesAccountForm['description'].$error"
+          ng-show="freshsalesAccountForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newFreshsalesAccount"
+          ng-click="vm.saveFreshsalesAccount()"
+          class="send-button md-accent md-raised"
+          ng-disabled="freshsalesAccountForm.$invalid || freshsalesAccountForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newFreshsalesAccount"
+          ng-click="vm.addNewFreshsalesAccount()"
+          class="send-button md-accent md-raised"
+          ng-disabled="freshsalesAccountForm.$invalid"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD_FRESHSALESACCOUNT"
+          translate-attr-aria-label="INTEGRATIONS.ADD_FRESHSALESACCOUNT"
+        >
+          ADD FRESHSALESACCOUNT
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newFreshsalesAccount"
+          ng-click="vm.deleteFreshsalesAccount($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 4b2954d..0000000
--- a/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,187 +0,0 @@
-<md-dialog
-  class="freshsalesConfiguration-dialog"
-  aria-label="New FreshsalesConfiguration"
->
-  <form name="freshsalesConfigurationForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.NAME">Name</label>
-        <input
-          type=""
-          name="name"
-          ng-model="vm.freshsalesConfiguration.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="freshsalesConfigurationForm['name'].$error"
-          ng-show="freshsalesConfigurationForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.CHANNEL">Channel</label>
-        <md-select
-          name="channel"
-          ng-model="vm.freshsalesConfiguration.channel"
-          required
-        >
-          <md-option ng-value="'voice'">
-            {{ 'INTEGRATIONS.VOICE' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="freshsalesConfigurationForm['channel'].$error"
-          ng-show="freshsalesConfigurationForm['channel'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.CHANNEL_REQUIRED"
-              >Channel field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.TYPE">Type</label>
-        <md-select
-          name="type"
-          ng-model="vm.freshsalesConfiguration.type"
-          required
-        >
-          <md-option ng-value="'inbound'">
-            {{ 'INTEGRATIONS.INBOUND_IN_QUEUE' | translate }}
-          </md-option>
-
-          <md-option ng-value="'outbound'">
-            {{ 'INTEGRATIONS.OUTBOUND_CALL' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="freshsalesConfigurationForm['type'].$error"
-          ng-show="freshsalesConfigurationForm['type'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-              >Type field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newFreshsalesConfiguration"
-          ng-click="vm.saveFreshsalesConfiguration()"
-          class="send-button md-accent md-raised"
-          ng-disabled="freshsalesConfigurationForm.$invalid || freshsalesConfigurationForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newFreshsalesConfiguration"
-          ng-click="vm.addNewFreshsalesConfiguration()"
-          class="send-button md-accent md-raised"
-          ng-disabled="freshsalesConfigurationForm.$invalid"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD_FRESHSALESCONFIGURATION"
-          translate-attr-aria-label="INTEGRATIONS.ADD_FRESHSALESCONFIGURATION"
-        >
-          ADD FRESHSALESCONFIGURATION
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newFreshsalesConfiguration"
-          ng-click="vm.deleteFreshsalesConfiguration($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/edit/configurations/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/edit/configurations/dialog.html/dialog.html
new file mode 100644
index 0000000..4b2954d
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/edit/configurations/dialog.html/dialog.html
@@ -0,0 +1,187 @@
+<md-dialog
+  class="freshsalesConfiguration-dialog"
+  aria-label="New FreshsalesConfiguration"
+>
+  <form name="freshsalesConfigurationForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.NAME">Name</label>
+        <input
+          type=""
+          name="name"
+          ng-model="vm.freshsalesConfiguration.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="freshsalesConfigurationForm['name'].$error"
+          ng-show="freshsalesConfigurationForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.CHANNEL">Channel</label>
+        <md-select
+          name="channel"
+          ng-model="vm.freshsalesConfiguration.channel"
+          required
+        >
+          <md-option ng-value="'voice'">
+            {{ 'INTEGRATIONS.VOICE' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="freshsalesConfigurationForm['channel'].$error"
+          ng-show="freshsalesConfigurationForm['channel'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.CHANNEL_REQUIRED"
+              >Channel field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.TYPE">Type</label>
+        <md-select
+          name="type"
+          ng-model="vm.freshsalesConfiguration.type"
+          required
+        >
+          <md-option ng-value="'inbound'">
+            {{ 'INTEGRATIONS.INBOUND_IN_QUEUE' | translate }}
+          </md-option>
+
+          <md-option ng-value="'outbound'">
+            {{ 'INTEGRATIONS.OUTBOUND_CALL' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="freshsalesConfigurationForm['type'].$error"
+          ng-show="freshsalesConfigurationForm['type'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+              >Type field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newFreshsalesConfiguration"
+          ng-click="vm.saveFreshsalesConfiguration()"
+          class="send-button md-accent md-raised"
+          ng-disabled="freshsalesConfigurationForm.$invalid || freshsalesConfigurationForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newFreshsalesConfiguration"
+          ng-click="vm.addNewFreshsalesConfiguration()"
+          class="send-button md-accent md-raised"
+          ng-disabled="freshsalesConfigurationForm.$invalid"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD_FRESHSALESCONFIGURATION"
+          translate-attr-aria-label="INTEGRATIONS.ADD_FRESHSALESCONFIGURATION"
+        >
+          ADD FRESHSALESCONFIGURATION
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newFreshsalesConfiguration"
+          ng-click="vm.deleteFreshsalesConfiguration($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/edit/item/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/edit/item/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index a665e2b..0000000
--- a/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/edit/item/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,478 +0,0 @@
-<md-dialog class="freshsalesAccount-item-dialog" aria-label="New Item">
-  <form name="freshsalesAccountItemForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <div ng-switch="vm.type">
-        <div ng-switch-when="subject">
-          <!-- SUBJECT SECTION -->
-          <div ng-include="'/subject.html'"></div>
-          <!-- / SUBJECT SECTION -->
-        </div>
-        <div ng-switch-when="description">
-          <!-- DESCRIPTION SECTION -->
-          <md-input-container class="md-block">
-            <label translate="INTEGRATIONS.TYPE">Type</label>
-            <md-select name="type" ng-model="vm.item.type" required>
-              <md-option value="string">String</md-option>
-              <md-option value="keyValue">Key Value</md-option>
-            </md-select>
-            <div
-              ng-messages="freshsalesAccountItemForm.type.$error"
-              ng-show="freshsalesAccountItemForm.type.$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-                  >Type field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
-            <label translate="INTEGRATIONS.CONTENT">Content</label>
-            <input
-              type="text"
-              name="content"
-              ng-model="vm.item.content"
-              required
-              md-autofocus
-            />
-            <div
-              ng-messages="freshsalesAccountItemForm.content.$error"
-              ng-show="freshsalesAccountItemForm.content.$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
-                  >Content field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <div ng-if="vm.item.type == 'keyValue'">
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.KEY">Key</label>
-              <input
-                type="text"
-                name="key"
-                ng-model="vm.item.key"
-                required
-                md-autofocus
-              />
-              <div
-                ng-messages="freshsalesAccountItemForm.key.$error"
-                ng-show="freshsalesAccountItemForm.key.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.KEY_REQUIRED"
-                    >Key field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.TYPE">Type</label>
-              <md-select name="keyType" ng-model="vm.item.keyType" required>
-                <md-option value="string">String</md-option>
-                <md-option value="variable">Variable</md-option>
-                <md-option value="customVariable">Custom Variable</md-option>
-              </md-select>
-              <div
-                ng-messages="freshsalesAccountItemForm.keyType.$error"
-                ng-show="freshsalesAccountItemForm.keyType.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-                    >Type field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'string'"
-            >
-              <label translate="INTEGRATIONS.CONTENT">Content</label>
-              <input
-                type="text"
-                name="keyContent"
-                ng-model="vm.item.keyContent"
-                required
-                md-autofocus
-              />
-              <div
-                ng-messages="freshsalesAccountItemForm.keyContent.$error"
-                ng-show="freshsalesAccountItemForm.keyContent.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
-                    >Content field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'variable'"
-            >
-              <label translate="INTEGRATIONS.VALUE">Value</label>
-              <md-select
-                name="variableName"
-                ng-model="vm.item.variableName"
-                md-selected-text="vm.getSelectedVariable()"
-                required
-              >
-                <md-optgroup label="Voice: Queue">
-                  <md-option
-                    ng-value="agentColumn"
-                    ng-repeat="agentColumn in vm.voiceAgentReportColumns"
-                    >{{agentColumn}}
-                  </md-option>
-                </md-optgroup>
-                <md-optgroup label="Voice: Outbound">
-                  <md-option
-                    ng-value="dialColumn"
-                    ng-repeat="dialColumn in vm.voiceDialReportColumns"
-                    >{{dialColumn}}</md-option
-                  >
-                </md-optgroup>
-              </md-select>
-              <div
-                ng-messages="freshsalesAccountItemForm.variableName.$error"
-                ng-show="freshsalesAccountItemForm.variableName.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED"
-                    >Variable name field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'customVariable'"
-            >
-              <label translate="INTEGRATIONS.VALUE">Value</label>
-              <md-select ng-model="vm.item.VariableId" required>
-                <md-option
-                  ng-value="variable.id"
-                  ng-repeat="variable in vm.variables"
-                  >{{variable.name}}
-                </md-option>
-              </md-select>
-            </md-input-container>
-          </div>
-          <!-- / DESCRIPTION SECTION -->
-        </div>
-        <div ng-switch-when="field">
-          <!-- FIELD SECTION -->
-          <div ng-if="vm.accountConnected">
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.FIELD">FIELD</label>
-              <!-- ITEM TYPE DEFAULT VALUE is STRING -->
-              <md-select
-                name="customField"
-                ng-model="vm.customField"
-                required
-                ng-change="vm.item.type = 'string'"
-              >
-                <md-optgroup label="Standard">
-                  <md-option
-                    ng-value="standard"
-                    ng-repeat="standard in vm.fields | filter: {custom: false} "
-                    >{{standard.name}}
-                  </md-option>
-                </md-optgroup>
-
-                <md-optgroup label="Custom">
-                  <md-option
-                    ng-value="custom"
-                    ng-repeat="custom in vm.fields | filter: {custom: true} "
-                    >{{custom.name}}
-                  </md-option>
-                </md-optgroup>
-              </md-select>
-              <div
-                ng-messages="freshsalesAccountItemForm.customField.$error"
-                ng-show="freshsalesAccountItemForm.customField.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.FIELD_REQUIRED"
-                    >Field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <!-- FIELDS -->
-            <div ng-if="vm.customField" ng-include="'/fields.html'"></div>
-            <!-- FIELDS -->
-          </div>
-          <div ng-if="!vm.accountConnected">
-            <p>Account is not connected. Please check your configurations!</p>
-          </div>
-          <!-- / FIELD SECTION -->
-        </div>
-        <div ng-switch-default>
-          <p>No Item</p>
-        </div>
-      </div>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newItem"
-          ng-click="vm.saveItem()"
-          class="send-button md-accent md-raised"
-          ng-disabled="freshsalesAccountItemForm.$invalid || freshsalesAccountItemForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newItem"
-          ng-click="vm.addNewItem()"
-          class="send-button md-accent md-raised"
-          ng-disabled="freshsalesAccountItemForm.$invalid || freshsalesAccountItemForm.$pristine"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD"
-          translate-attr-aria-label="INTEGRATIONS.ADD"
-        >
-          ADD
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newItem"
-          ng-click="vm.deleteItem($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
-
-<script type="text/ng-template" id="/fields.html">
-
-  <!-- type -->
-  <md-input-container class="md-block" ng-if="!vm.customField.options.length">
-
-      <label translate="INTEGRATIONS.TYPE">Type</label>
-      <md-select name="type" ng-model="vm.item.type" required>
-
-          <md-option value="string">String</md-option>
-          <md-option value="variable">Variable</md-option>
-          <md-option value="customVariable">Custom Variable</md-option>
-      </md-select>
-      <div ng-messages="freshsalesAccountItemForm.type.$error" ng-show="freshsalesAccountItemForm.type.$touched"
-          role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <!--/ type -->
-
-  <!-- value -->
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && vm.customField.options.length">
-      <!-- options -->
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-
-      <md-select name="option" ng-model="vm.item.content" required>
-          <md-option ng-value="option.value" ng-repeat="option in vm.customField.options">{{option.name}}</md-option>
-      </md-select>
-
-      <div ng-messages="freshsalesAccountItemForm.option.$error"
-          ng-show="freshsalesAccountItemForm.option.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VALUE_REQUIRED">Value field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && !vm.customField.options.length">
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-
-      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
-
-      <div ng-messages="freshsalesAccountItemForm.content.$error"
-          ng-show="freshsalesAccountItemForm.content.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
-          required>
-          <md-optgroup label="Voice: Queue">
-              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
-              </md-option>
-          </md-optgroup>
-          <md-optgroup label="Voice: Outbound">
-              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
-              </md-option>
-          </md-optgroup>
-      </md-select>
-      <div ng-messages="freshsalesAccountItemForm.variableName.$error"
-          ng-show="freshsalesAccountItemForm.variableName.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select ng-model="vm.item.VariableId" required>
-          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
-      </md-select>
-  </md-input-container>
-
-  <!--/ value -->
-</script>
-
-<script type="text/ng-template" id="/subject.html">
-    <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.TYPE">Type</label>
-            <md-select name="type" ng-model="vm.item.type" required>
-                <md-option value="string">String</md-option>
-                <md-option value="variable">Variable</md-option>
-                <md-option value="customVariable">Custom Variable</md-option>
-            </md-select>
-        <div ng-messages="freshsalesAccountItemForm.type.$error" ng-show="freshsalesAccountItemForm.type.$touched" role="alert">
-            <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
-             </div>
-        </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
-      <div ng-messages="freshsalesAccountItemForm.content.$error"
-          ng-show="freshsalesAccountItemForm.content.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
-          required>
-          <md-optgroup label="Voice: Queue">
-              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
-              </md-option>
-          </md-optgroup>
-          <md-optgroup label="Voice: Outbound">
-              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
-              </md-option>
-          </md-optgroup>
-      </md-select>
-      <div ng-messages="freshsalesAccountItemForm.variableName.$error"
-          ng-show="freshsalesAccountItemForm.variableName.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select ng-model="vm.item.VariableId" required>
-          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
-      </md-select>
-  </md-input-container>
-</script>
diff --git a/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/edit/item/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/edit/item/dialog.html/dialog.html
new file mode 100644
index 0000000..a665e2b
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/edit/item/dialog.html/dialog.html
@@ -0,0 +1,478 @@
+<md-dialog class="freshsalesAccount-item-dialog" aria-label="New Item">
+  <form name="freshsalesAccountItemForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <div ng-switch="vm.type">
+        <div ng-switch-when="subject">
+          <!-- SUBJECT SECTION -->
+          <div ng-include="'/subject.html'"></div>
+          <!-- / SUBJECT SECTION -->
+        </div>
+        <div ng-switch-when="description">
+          <!-- DESCRIPTION SECTION -->
+          <md-input-container class="md-block">
+            <label translate="INTEGRATIONS.TYPE">Type</label>
+            <md-select name="type" ng-model="vm.item.type" required>
+              <md-option value="string">String</md-option>
+              <md-option value="keyValue">Key Value</md-option>
+            </md-select>
+            <div
+              ng-messages="freshsalesAccountItemForm.type.$error"
+              ng-show="freshsalesAccountItemForm.type.$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+                  >Type field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
+            <label translate="INTEGRATIONS.CONTENT">Content</label>
+            <input
+              type="text"
+              name="content"
+              ng-model="vm.item.content"
+              required
+              md-autofocus
+            />
+            <div
+              ng-messages="freshsalesAccountItemForm.content.$error"
+              ng-show="freshsalesAccountItemForm.content.$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
+                  >Content field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <div ng-if="vm.item.type == 'keyValue'">
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.KEY">Key</label>
+              <input
+                type="text"
+                name="key"
+                ng-model="vm.item.key"
+                required
+                md-autofocus
+              />
+              <div
+                ng-messages="freshsalesAccountItemForm.key.$error"
+                ng-show="freshsalesAccountItemForm.key.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.KEY_REQUIRED"
+                    >Key field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.TYPE">Type</label>
+              <md-select name="keyType" ng-model="vm.item.keyType" required>
+                <md-option value="string">String</md-option>
+                <md-option value="variable">Variable</md-option>
+                <md-option value="customVariable">Custom Variable</md-option>
+              </md-select>
+              <div
+                ng-messages="freshsalesAccountItemForm.keyType.$error"
+                ng-show="freshsalesAccountItemForm.keyType.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+                    >Type field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'string'"
+            >
+              <label translate="INTEGRATIONS.CONTENT">Content</label>
+              <input
+                type="text"
+                name="keyContent"
+                ng-model="vm.item.keyContent"
+                required
+                md-autofocus
+              />
+              <div
+                ng-messages="freshsalesAccountItemForm.keyContent.$error"
+                ng-show="freshsalesAccountItemForm.keyContent.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
+                    >Content field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'variable'"
+            >
+              <label translate="INTEGRATIONS.VALUE">Value</label>
+              <md-select
+                name="variableName"
+                ng-model="vm.item.variableName"
+                md-selected-text="vm.getSelectedVariable()"
+                required
+              >
+                <md-optgroup label="Voice: Queue">
+                  <md-option
+                    ng-value="agentColumn"
+                    ng-repeat="agentColumn in vm.voiceAgentReportColumns"
+                    >{{agentColumn}}
+                  </md-option>
+                </md-optgroup>
+                <md-optgroup label="Voice: Outbound">
+                  <md-option
+                    ng-value="dialColumn"
+                    ng-repeat="dialColumn in vm.voiceDialReportColumns"
+                    >{{dialColumn}}</md-option
+                  >
+                </md-optgroup>
+              </md-select>
+              <div
+                ng-messages="freshsalesAccountItemForm.variableName.$error"
+                ng-show="freshsalesAccountItemForm.variableName.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED"
+                    >Variable name field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'customVariable'"
+            >
+              <label translate="INTEGRATIONS.VALUE">Value</label>
+              <md-select ng-model="vm.item.VariableId" required>
+                <md-option
+                  ng-value="variable.id"
+                  ng-repeat="variable in vm.variables"
+                  >{{variable.name}}
+                </md-option>
+              </md-select>
+            </md-input-container>
+          </div>
+          <!-- / DESCRIPTION SECTION -->
+        </div>
+        <div ng-switch-when="field">
+          <!-- FIELD SECTION -->
+          <div ng-if="vm.accountConnected">
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.FIELD">FIELD</label>
+              <!-- ITEM TYPE DEFAULT VALUE is STRING -->
+              <md-select
+                name="customField"
+                ng-model="vm.customField"
+                required
+                ng-change="vm.item.type = 'string'"
+              >
+                <md-optgroup label="Standard">
+                  <md-option
+                    ng-value="standard"
+                    ng-repeat="standard in vm.fields | filter: {custom: false} "
+                    >{{standard.name}}
+                  </md-option>
+                </md-optgroup>
+
+                <md-optgroup label="Custom">
+                  <md-option
+                    ng-value="custom"
+                    ng-repeat="custom in vm.fields | filter: {custom: true} "
+                    >{{custom.name}}
+                  </md-option>
+                </md-optgroup>
+              </md-select>
+              <div
+                ng-messages="freshsalesAccountItemForm.customField.$error"
+                ng-show="freshsalesAccountItemForm.customField.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.FIELD_REQUIRED"
+                    >Field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <!-- FIELDS -->
+            <div ng-if="vm.customField" ng-include="'/fields.html'"></div>
+            <!-- FIELDS -->
+          </div>
+          <div ng-if="!vm.accountConnected">
+            <p>Account is not connected. Please check your configurations!</p>
+          </div>
+          <!-- / FIELD SECTION -->
+        </div>
+        <div ng-switch-default>
+          <p>No Item</p>
+        </div>
+      </div>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newItem"
+          ng-click="vm.saveItem()"
+          class="send-button md-accent md-raised"
+          ng-disabled="freshsalesAccountItemForm.$invalid || freshsalesAccountItemForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newItem"
+          ng-click="vm.addNewItem()"
+          class="send-button md-accent md-raised"
+          ng-disabled="freshsalesAccountItemForm.$invalid || freshsalesAccountItemForm.$pristine"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD"
+          translate-attr-aria-label="INTEGRATIONS.ADD"
+        >
+          ADD
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newItem"
+          ng-click="vm.deleteItem($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
+
+<script type="text/ng-template" id="/fields.html">
+
+  <!-- type -->
+  <md-input-container class="md-block" ng-if="!vm.customField.options.length">
+
+      <label translate="INTEGRATIONS.TYPE">Type</label>
+      <md-select name="type" ng-model="vm.item.type" required>
+
+          <md-option value="string">String</md-option>
+          <md-option value="variable">Variable</md-option>
+          <md-option value="customVariable">Custom Variable</md-option>
+      </md-select>
+      <div ng-messages="freshsalesAccountItemForm.type.$error" ng-show="freshsalesAccountItemForm.type.$touched"
+          role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <!--/ type -->
+
+  <!-- value -->
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && vm.customField.options.length">
+      <!-- options -->
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+
+      <md-select name="option" ng-model="vm.item.content" required>
+          <md-option ng-value="option.value" ng-repeat="option in vm.customField.options">{{option.name}}</md-option>
+      </md-select>
+
+      <div ng-messages="freshsalesAccountItemForm.option.$error"
+          ng-show="freshsalesAccountItemForm.option.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VALUE_REQUIRED">Value field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && !vm.customField.options.length">
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+
+      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
+
+      <div ng-messages="freshsalesAccountItemForm.content.$error"
+          ng-show="freshsalesAccountItemForm.content.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
+          required>
+          <md-optgroup label="Voice: Queue">
+              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
+              </md-option>
+          </md-optgroup>
+          <md-optgroup label="Voice: Outbound">
+              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
+              </md-option>
+          </md-optgroup>
+      </md-select>
+      <div ng-messages="freshsalesAccountItemForm.variableName.$error"
+          ng-show="freshsalesAccountItemForm.variableName.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select ng-model="vm.item.VariableId" required>
+          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
+      </md-select>
+  </md-input-container>
+
+  <!--/ value -->
+</script>
+
+<script type="text/ng-template" id="/subject.html">
+    <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.TYPE">Type</label>
+            <md-select name="type" ng-model="vm.item.type" required>
+                <md-option value="string">String</md-option>
+                <md-option value="variable">Variable</md-option>
+                <md-option value="customVariable">Custom Variable</md-option>
+            </md-select>
+        <div ng-messages="freshsalesAccountItemForm.type.$error" ng-show="freshsalesAccountItemForm.type.$touched" role="alert">
+            <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
+             </div>
+        </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
+      <div ng-messages="freshsalesAccountItemForm.content.$error"
+          ng-show="freshsalesAccountItemForm.content.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
+          required>
+          <md-optgroup label="Voice: Queue">
+              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
+              </md-option>
+          </md-optgroup>
+          <md-optgroup label="Voice: Outbound">
+              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
+              </md-option>
+          </md-optgroup>
+      </md-select>
+      <div ng-messages="freshsalesAccountItemForm.variableName.$error"
+          ng-show="freshsalesAccountItemForm.variableName.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select ng-model="vm.item.VariableId" required>
+          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
+      </md-select>
+  </md-input-container>
+</script>
diff --git a/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index 82b7baf..0000000
--- a/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,729 +0,0 @@
-<div
-  id="integrations-freshsalesAccount"
-  class="page-layout simple tabbed"
-  layout="column"
->
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-freshsalesAccounts-button md-icon-button"
-        aria-label="Go to freshsalesAccounts"
-        ng-click="vm.gotoFreshsalesAccounts()"
-        translate
-        translate-attr-aria-label="INTEGRATIONS.GO_TO_FRESHSALESACCOUNTS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="freshsalesAccount-image" hide-xs>
-          <img ng-src="assets/images/business/freshsalesAccounts.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.freshsalesAccount.id}}
-            <span ng-if="vm.freshsalesAccount.name"
-              >{{vm.freshsalesAccount.name}}</span
-            >
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="INTEGRATIONS.CREATED_AT"></span>
-            <span>{{vm.freshsalesAccount.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveFreshsalesAccount()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (configurationsForm.$invalid)"
-        translate="INTEGRATIONS.SAVE"
-        translate-attr-aria-label="INTEGRATIONS.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="INTEGRATIONS.ACCOUNT">ACCOUNT</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="freshsalesAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="INTEGRATIONS.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.freshsalesAccount.name"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.USERNAME">Username</label>
-                <input
-                  type="text"
-                  name="username"
-                  ng-model="vm.freshsalesAccount.username"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['username'].$error"
-                  ng-show="generalForm['username'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
-                      >Username field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.URI">Uri</label>
-                <input
-                  type="url"
-                  name="remoteUri"
-                  ng-model="vm.freshsalesAccount.remoteUri"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['remoteUri'].$error"
-                  ng-show="generalForm['remoteUri'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
-                      >Uri field is required</span
-                    >
-                  </div>
-                  <div ng-message="url">
-                    <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
-                      >Uri must be a valid url http://www.xcally.com</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.APIKEY">ApiKey</label>
-                <input
-                  type="text"
-                  name="apiKey"
-                  ng-model="vm.freshsalesAccount.apiKey"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['apiKey'].$error"
-                  ng-show="generalForm['apiKey'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.APIKEY_REQUIRED"
-                      >ApiKey field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
-                  >MotionProxyAddress</label
-                >
-                <input
-                  type="url"
-                  name="serverUrl"
-                  ng-model="vm.freshsalesAccount.serverUrl"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['serverUrl'].$error"
-                  ng-show="generalForm['serverUrl'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
-                      >MotionProxyAddress field is required</span
-                    >
-                  </div>
-                  <div ng-message="url">
-                    <span
-                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
-                      >MotionProxyAddress must be a valid url
-                      http://www.xcally.com</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.freshsalesAccount.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="INTEGRATIONS.CONFIGURATIONS">CONFIGURATIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="freshsalesAccount-detail-form-container configurations md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div
-                class="h2 secondary-text"
-                translate="INTEGRATIONS.CONFIGURATIONS"
-              >
-                CONFIGURATIONS
-              </div>
-            </div>
-            <div
-              ng-controller="FreshsalesAccountConfigurationsController as vm_cc"
-              ng-init="vm_cc.init(vm.freshsalesAccount, vm.crudPermissions)"
-              layout="row"
-            >
-              <md-card class="md-whiteframe-1dp" flex="30">
-                <div layout="row" layout-align="center center">
-                  <md-subheader flex="75" class="md-no-sticky"
-                    >{{ 'INTEGRATIONS.CONFIGURATIONS' | translate
-                    }}</md-subheader
-                  >
-                  <md-button
-                    flex="25"
-                    ng-if="vm_cc.crudPermissions.canEdit"
-                    ng-click="vm_cc.createOrEditFreshsalesConfiguration($event)"
-                    class="md-icon-button"
-                    aria-label="create freshsalesConfiguration"
-                  >
-                    <md-icon md-font-icon="icon-plus"></md-icon>
-                  </md-button>
-                </div>
-                <md-list>
-                  <md-list-item
-                    layout="row"
-                    layout-align="center center"
-                    ng-repeat="freshsalesConfiguration in vm_cc.configurations"
-                    class="border-top"
-                    md-colors="{background: (vm_cc.selectedFreshsalesConfiguration == $index ? 'accent' : 'grey-A100')}"
-                    ng-click="vm_cc.getFreshsalesConfiguration($index)"
-                  >
-                    <span class="text-truncate" flex="80"
-                      >{{ freshsalesConfiguration.name }}</span
-                    >
-                    <md-menu ng-if="vm_cc.crudPermissions.canDelete">
-                      <md-button
-                        class="md-icon-button"
-                        aria-label="More"
-                        translate
-                        translate-attr-aria-label="INTEGRATIONS.MORE"
-                        ng-click="$mdOpenMenu($event)"
-                      >
-                        <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                      </md-button>
-                      <md-menu-content width="3">
-                        <md-menu-item ng-if="vm_cc.crudPermissions.canDelete">
-                          <md-button
-                            ng-click="vm_cc.deleteFreshsalesConfiguration($event, freshsalesConfiguration)"
-                            translate="INTEGRATIONS.DELETE_FRESHSALESCONFIGURATION"
-                          >
-                            Delete FreshsalesConfiguration
-                          </md-button>
-                        </md-menu-item>
-                      </md-menu-content>
-                    </md-menu>
-                  </md-list-item>
-                </md-list>
-              </md-card>
-              <div flex></div>
-              <md-card class="md-whiteframe-1dp" flex="65">
-                <md-tabs ng-if="vm_cc.configurations.length" md-dynamic-height>
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.SUBJECTS">SUBJECTS</span>
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-toolbar
-                        class="md-table-toolbar md-default no-padding"
-                        ng-hide="vm_cc.selectedSubjects.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <div flex></div>
-                          <ms-search-bar
-                            on-search="vm_cc.query.subject = query"
-                            on-collapse="vm_cc.query.subject = undefined"
-                            debounce="300"
-                          ></ms-search-bar>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canEdit"
-                            class="md-icon-button"
-                            ng-click="vm_cc.createOrEditSubject($event)"
-                            aria-label="add subject"
-                            translate
-                            translate-attr-label="INTEGRATIONS.ADD_SUBJECT"
-                          >
-                            <md-icon md-font-icon="icon-plus"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-toolbar
-                        class="md-table-toolbar md-accent"
-                        ng-show="vm_cc.selectedSubjects.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <span class="md-subhead"
-                            >{{vm_cc.selectedSubjects.length}}
-                            {{vm_cc.selectedSubjects.length > 1 ? 'items' :
-                            'item'}} selected</span
-                          >
-                          <div flex></div>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canDelete"
-                            class="md-icon-button"
-                            ng-click="vm_cc.deleteSelectedSubjects($event)"
-                            aria-label="delete selected"
-                            translate
-                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-                          >
-                            <md-icon md-font-icon="icon-delete"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-table-container
-                        class="md-whiteframe-1dp padding-horizontal"
-                      >
-                        <table
-                          md-table
-                          md-row-select
-                          multiple
-                          ng-model="vm_cc.selectedSubjects"
-                        >
-                          <thead md-head>
-                            <tr md-row>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.ID' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.TYPE' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.CONTENT' | translate }}
-                              </th>
-                              <th md-column width="10px"></th>
-                            </tr>
-                          </thead>
-                          <tbody md-body>
-                            <tr
-                              md-row
-                              md-select="subject"
-                              md-select-id="id"
-                              ng-repeat="subject in vm_cc.subjects | filter: vm_cc.query.subject"
-                            >
-                              <td
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                                class="id"
-                              >
-                                {{subject.id}}
-                              </td>
-                              <td
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                                class="type"
-                              >
-                                <span ng-if="subject.FieldId"
-                                  >{{subject.nameField ||
-                                  subject.idField}}</span
-                                >
-                                <span ng-if="!subject.FieldId"
-                                  >{{subject.type}}</span
-                                >
-                              </td>
-                              <td
-                                ng-switch="subject.type"
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                              >
-                                <span ng-switch-when="string"
-                                  >{{subject.content}}</span
-                                >
-                                <span
-                                  ng-switch-when="variable"
-                                  class="text-boxed"
-                                  >{{subject.variableName}}</span
-                                >
-                                <span
-                                  ng-switch-when="customVariable"
-                                  class="text-boxed"
-                                  >{{
-                                  vm_cc.variablesById[subject.VariableId].name
-                                  }}</span
-                                >
-                                <span ng-switch-when="keyValue">
-                                  {{subject.key}}
-                                  <span ng-switch="description.keyType">
-                                    <span ng-switch-when="string"
-                                      >{{subject.keyContent}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="variable"
-                                      class="text-boxed"
-                                      >{{subject.variableName}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="customVariable"
-                                      class="text-boxed"
-                                      >{{
-                                      vm_cc.variablesById[subject.VariableId].name
-                                      }}</span
-                                    >
-                                  </span>
-                                </span>
-                                <span ng-switch-default
-                                  >{{subject.content}}</span
-                                >
-                              </td>
-                              <td
-                                md-cell
-                                class="actions"
-                                ng-if="!vm_cc.crudPermissions.readOnly"
-                              >
-                                <md-menu>
-                                  <md-button
-                                    class="md-icon-button"
-                                    aria-label="More"
-                                    translate
-                                    translate-attr-aria-label="INTEGRATIONS.MORE"
-                                    ng-click="$mdOpenMenu($event)"
-                                  >
-                                    <md-icon
-                                      md-font-icon="icon-dots-vertical"
-                                    ></md-icon>
-                                  </md-button>
-
-                                  <md-menu-content width="3">
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canEdit"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                        translate="INTEGRATIONS.EDIT_SUBJECT"
-                                      >
-                                        Edit Subject
-                                      </md-button>
-                                    </md-menu-item>
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canDelete"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.deleteSubjectConfirm($event, subject)"
-                                        translate="INTEGRATIONS.DELETE_SUBJECT"
-                                      >
-                                        Delete Subject
-                                      </md-button>
-                                    </md-menu-item>
-                                  </md-menu-content>
-                                </md-menu>
-                              </td>
-                            </tr>
-                          </tbody>
-                        </table>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.DESCRIPTIONS"
-                        >DESCRIPTIONS</span
-                      >
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-toolbar
-                        class="md-table-toolbar md-default no-padding"
-                        ng-hide="vm_cc.selectedDescriptions.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <div flex></div>
-                          <ms-search-bar
-                            on-search="vm_cc.query.description = query"
-                            on-collapse="vm_cc.query.description = undefined"
-                            debounce="300"
-                          ></ms-search-bar>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canEdit"
-                            class="md-icon-button"
-                            ng-click="vm_cc.createOrEditDescription($event)"
-                            aria-label="add description"
-                            translate
-                            translate-attr-label="INTEGRATIONS.ADD_DESCRIPTION"
-                          >
-                            <md-icon md-font-icon="icon-plus"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-toolbar
-                        class="md-table-toolbar md-accent"
-                        ng-show="vm_cc.selectedDescriptions.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <span class="md-subhead"
-                            >{{vm_cc.selectedDescriptions.length}}
-                            {{vm_cc.selectedDescriptions.length > 1 ? 'items' :
-                            'item'}} selected</span
-                          >
-                          <div flex></div>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canDelete"
-                            class="md-icon-button"
-                            ng-click="vm_cc.deleteSelectedDescriptions($event)"
-                            aria-label="delete selected"
-                            translate
-                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-                          >
-                            <md-icon md-font-icon="icon-delete"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-table-container
-                        class="md-whiteframe-1dp padding-horizontal"
-                      >
-                        <table
-                          md-table
-                          md-row-select
-                          multiple
-                          ng-model="vm_cc.selectedDescriptions"
-                        >
-                          <thead md-head>
-                            <tr md-row>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.ID' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.TYPE' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.CONTENT' | translate }}
-                              </th>
-                              <th md-column width="10px"></th>
-                            </tr>
-                          </thead>
-                          <tbody md-body>
-                            <tr
-                              md-row
-                              md-select="description"
-                              md-select-id="id"
-                              ng-repeat="description in vm_cc.descriptions | filter: vm_cc.query.description"
-                            >
-                              <td
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                                class="id"
-                              >
-                                {{description.id}}
-                              </td>
-                              <td
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                                class="type"
-                              >
-                                <span ng-if="description.FieldId"
-                                  >{{description.nameField ||
-                                  description.idField}}</span
-                                >
-                                <span ng-if="!description.FieldId"
-                                  >{{description.type}}</span
-                                >
-                              </td>
-                              <td
-                                ng-switch="description.type"
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                              >
-                                <span ng-switch-when="string"
-                                  >{{description.content}}</span
-                                >
-                                <span
-                                  ng-switch-when="variable"
-                                  class="text-boxed"
-                                  >{{description.variableName}}</span
-                                >
-                                <span
-                                  ng-switch-when="customVariable"
-                                  class="text-boxed"
-                                  >{{
-                                  vm_cc.variablesById[description.VariableId].name
-                                  }}</span
-                                >
-                                <span ng-switch-when="keyValue">
-                                  {{description.key}}
-                                  <span ng-switch="description.keyType">
-                                    <span ng-switch-when="string"
-                                      >{{description.keyContent}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="variable"
-                                      class="text-boxed"
-                                      >{{description.variableName}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="customVariable"
-                                      class="text-boxed"
-                                      >{{
-                                      vm_cc.variablesById[description.VariableId].name
-                                      }}</span
-                                    >
-                                  </span>
-                                </span>
-                                <span ng-switch-default
-                                  >{{description.content}}</span
-                                >
-                              </td>
-                              <td
-                                md-cell
-                                class="actions"
-                                ng-if="!vm_cc.crudPermissions.readOnly"
-                              >
-                                <md-menu>
-                                  <md-button
-                                    class="md-icon-button"
-                                    aria-label="More"
-                                    translate
-                                    translate-attr-aria-label="INTEGRATIONS.MORE"
-                                    ng-click="$mdOpenMenu($event)"
-                                  >
-                                    <md-icon
-                                      md-font-icon="icon-dots-vertical"
-                                    ></md-icon>
-                                  </md-button>
-
-                                  <md-menu-content width="3">
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canEdit"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.createOrEditDescription($event, description)"
-                                        translate="INTEGRATIONS.EDIT_DESCRIPTION"
-                                      >
-                                        Edit Description
-                                      </md-button>
-                                    </md-menu-item>
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canDelete"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.deleteDescriptionConfirm($event, description)"
-                                        translate="INTEGRATIONS.DELETE_DESCRIPTION"
-                                      >
-                                        Delete Description
-                                      </md-button>
-                                    </md-menu-item>
-                                  </md-menu-content>
-                                </md-menu>
-                              </td>
-                            </tr>
-                          </tbody>
-                        </table>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-                </md-tabs>
-                <div
-                  class="padding-20"
-                  ng-if="!vm_cc.configurations.length && vm_cc.crudPermissions.canEdit"
-                  ng-click="vm_cc.createOrEditFreshsalesConfiguration($event)"
-                  layout="row"
-                  layout-sm="column"
-                  layout-align="center center"
-                  layout-wrap
-                >
-                  <div
-                    class="padding-20 md-whiteframe-3dp md-accent-bg"
-                    layout="column"
-                    layout-align="center center"
-                  >
-                    <md-button class="md-icon-button">
-                      <md-icon md-font-icon="icon-plus"></md-icon>
-                    </md-button>
-                    <span
-                      aria-label="add configuration"
-                      translate
-                      translate-attr-label="INTEGRATIONS.ADD_CONFIGURATION"
-                      >ADD CONFIGURATION</span
-                    >
-                  </div>
-                </div>
-              </md-card>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/edit/view.html/view.html b/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/edit/view.html/view.html
new file mode 100644
index 0000000..82b7baf
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/edit/view.html/view.html
@@ -0,0 +1,729 @@
+<div
+  id="integrations-freshsalesAccount"
+  class="page-layout simple tabbed"
+  layout="column"
+>
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-freshsalesAccounts-button md-icon-button"
+        aria-label="Go to freshsalesAccounts"
+        ng-click="vm.gotoFreshsalesAccounts()"
+        translate
+        translate-attr-aria-label="INTEGRATIONS.GO_TO_FRESHSALESACCOUNTS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="freshsalesAccount-image" hide-xs>
+          <img ng-src="assets/images/business/freshsalesAccounts.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.freshsalesAccount.id}}
+            <span ng-if="vm.freshsalesAccount.name"
+              >{{vm.freshsalesAccount.name}}</span
+            >
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="INTEGRATIONS.CREATED_AT"></span>
+            <span>{{vm.freshsalesAccount.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveFreshsalesAccount()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (configurationsForm.$invalid)"
+        translate="INTEGRATIONS.SAVE"
+        translate-attr-aria-label="INTEGRATIONS.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="INTEGRATIONS.ACCOUNT">ACCOUNT</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="freshsalesAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="INTEGRATIONS.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.freshsalesAccount.name"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.USERNAME">Username</label>
+                <input
+                  type="text"
+                  name="username"
+                  ng-model="vm.freshsalesAccount.username"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['username'].$error"
+                  ng-show="generalForm['username'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
+                      >Username field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.URI">Uri</label>
+                <input
+                  type="url"
+                  name="remoteUri"
+                  ng-model="vm.freshsalesAccount.remoteUri"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['remoteUri'].$error"
+                  ng-show="generalForm['remoteUri'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
+                      >Uri field is required</span
+                    >
+                  </div>
+                  <div ng-message="url">
+                    <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
+                      >Uri must be a valid url http://www.xcally.com</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.APIKEY">ApiKey</label>
+                <input
+                  type="text"
+                  name="apiKey"
+                  ng-model="vm.freshsalesAccount.apiKey"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['apiKey'].$error"
+                  ng-show="generalForm['apiKey'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.APIKEY_REQUIRED"
+                      >ApiKey field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
+                  >MotionProxyAddress</label
+                >
+                <input
+                  type="url"
+                  name="serverUrl"
+                  ng-model="vm.freshsalesAccount.serverUrl"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['serverUrl'].$error"
+                  ng-show="generalForm['serverUrl'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
+                      >MotionProxyAddress field is required</span
+                    >
+                  </div>
+                  <div ng-message="url">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
+                      >MotionProxyAddress must be a valid url
+                      http://www.xcally.com</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.freshsalesAccount.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="INTEGRATIONS.CONFIGURATIONS">CONFIGURATIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="freshsalesAccount-detail-form-container configurations md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div
+                class="h2 secondary-text"
+                translate="INTEGRATIONS.CONFIGURATIONS"
+              >
+                CONFIGURATIONS
+              </div>
+            </div>
+            <div
+              ng-controller="FreshsalesAccountConfigurationsController as vm_cc"
+              ng-init="vm_cc.init(vm.freshsalesAccount, vm.crudPermissions)"
+              layout="row"
+            >
+              <md-card class="md-whiteframe-1dp" flex="30">
+                <div layout="row" layout-align="center center">
+                  <md-subheader flex="75" class="md-no-sticky"
+                    >{{ 'INTEGRATIONS.CONFIGURATIONS' | translate
+                    }}</md-subheader
+                  >
+                  <md-button
+                    flex="25"
+                    ng-if="vm_cc.crudPermissions.canEdit"
+                    ng-click="vm_cc.createOrEditFreshsalesConfiguration($event)"
+                    class="md-icon-button"
+                    aria-label="create freshsalesConfiguration"
+                  >
+                    <md-icon md-font-icon="icon-plus"></md-icon>
+                  </md-button>
+                </div>
+                <md-list>
+                  <md-list-item
+                    layout="row"
+                    layout-align="center center"
+                    ng-repeat="freshsalesConfiguration in vm_cc.configurations"
+                    class="border-top"
+                    md-colors="{background: (vm_cc.selectedFreshsalesConfiguration == $index ? 'accent' : 'grey-A100')}"
+                    ng-click="vm_cc.getFreshsalesConfiguration($index)"
+                  >
+                    <span class="text-truncate" flex="80"
+                      >{{ freshsalesConfiguration.name }}</span
+                    >
+                    <md-menu ng-if="vm_cc.crudPermissions.canDelete">
+                      <md-button
+                        class="md-icon-button"
+                        aria-label="More"
+                        translate
+                        translate-attr-aria-label="INTEGRATIONS.MORE"
+                        ng-click="$mdOpenMenu($event)"
+                      >
+                        <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                      </md-button>
+                      <md-menu-content width="3">
+                        <md-menu-item ng-if="vm_cc.crudPermissions.canDelete">
+                          <md-button
+                            ng-click="vm_cc.deleteFreshsalesConfiguration($event, freshsalesConfiguration)"
+                            translate="INTEGRATIONS.DELETE_FRESHSALESCONFIGURATION"
+                          >
+                            Delete FreshsalesConfiguration
+                          </md-button>
+                        </md-menu-item>
+                      </md-menu-content>
+                    </md-menu>
+                  </md-list-item>
+                </md-list>
+              </md-card>
+              <div flex></div>
+              <md-card class="md-whiteframe-1dp" flex="65">
+                <md-tabs ng-if="vm_cc.configurations.length" md-dynamic-height>
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.SUBJECTS">SUBJECTS</span>
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedSubjects.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.subject = query"
+                            on-collapse="vm_cc.query.subject = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditSubject($event)"
+                            aria-label="add subject"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_SUBJECT"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedSubjects.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedSubjects.length}}
+                            {{vm_cc.selectedSubjects.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedSubjects($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedSubjects"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.ID' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.TYPE' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.CONTENT' | translate }}
+                              </th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="subject"
+                              md-select-id="id"
+                              ng-repeat="subject in vm_cc.subjects | filter: vm_cc.query.subject"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                                class="id"
+                              >
+                                {{subject.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="subject.FieldId"
+                                  >{{subject.nameField ||
+                                  subject.idField}}</span
+                                >
+                                <span ng-if="!subject.FieldId"
+                                  >{{subject.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="subject.type"
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{subject.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{subject.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{
+                                  vm_cc.variablesById[subject.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{subject.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{subject.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{subject.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[subject.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default
+                                  >{{subject.content}}</span
+                                >
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="INTEGRATIONS.MORE"
+                                    ng-click="$mdOpenMenu($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                        translate="INTEGRATIONS.EDIT_SUBJECT"
+                                      >
+                                        Edit Subject
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteSubjectConfirm($event, subject)"
+                                        translate="INTEGRATIONS.DELETE_SUBJECT"
+                                      >
+                                        Delete Subject
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.DESCRIPTIONS"
+                        >DESCRIPTIONS</span
+                      >
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedDescriptions.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.description = query"
+                            on-collapse="vm_cc.query.description = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditDescription($event)"
+                            aria-label="add description"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_DESCRIPTION"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedDescriptions.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedDescriptions.length}}
+                            {{vm_cc.selectedDescriptions.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedDescriptions($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedDescriptions"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.ID' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.TYPE' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.CONTENT' | translate }}
+                              </th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="description"
+                              md-select-id="id"
+                              ng-repeat="description in vm_cc.descriptions | filter: vm_cc.query.description"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                                class="id"
+                              >
+                                {{description.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="description.FieldId"
+                                  >{{description.nameField ||
+                                  description.idField}}</span
+                                >
+                                <span ng-if="!description.FieldId"
+                                  >{{description.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="description.type"
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{description.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{description.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{
+                                  vm_cc.variablesById[description.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{description.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{description.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{description.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[description.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default
+                                  >{{description.content}}</span
+                                >
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="INTEGRATIONS.MORE"
+                                    ng-click="$mdOpenMenu($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditDescription($event, description)"
+                                        translate="INTEGRATIONS.EDIT_DESCRIPTION"
+                                      >
+                                        Edit Description
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteDescriptionConfirm($event, description)"
+                                        translate="INTEGRATIONS.DELETE_DESCRIPTION"
+                                      >
+                                        Delete Description
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+                </md-tabs>
+                <div
+                  class="padding-20"
+                  ng-if="!vm_cc.configurations.length && vm_cc.crudPermissions.canEdit"
+                  ng-click="vm_cc.createOrEditFreshsalesConfiguration($event)"
+                  layout="row"
+                  layout-sm="column"
+                  layout-align="center center"
+                  layout-wrap
+                >
+                  <div
+                    class="padding-20 md-whiteframe-3dp md-accent-bg"
+                    layout="column"
+                    layout-align="center center"
+                  >
+                    <md-button class="md-icon-button">
+                      <md-icon md-font-icon="icon-plus"></md-icon>
+                    </md-button>
+                    <span
+                      aria-label="add configuration"
+                      translate
+                      translate-attr-label="INTEGRATIONS.ADD_CONFIGURATION"
+                      >ADD CONFIGURATION</span
+                    >
+                  </div>
+                </div>
+              </md-card>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/freshsalesAccounts.html/freshsalesAccounts-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/freshsalesAccounts.html/freshsalesAccounts-[chunkhash].html
deleted file mode 100644
index 00e6189..0000000
--- a/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/freshsalesAccounts.html/freshsalesAccounts-[chunkhash].html
+++ /dev/null
@@ -1,323 +0,0 @@
-<div
-  id="freshsalesAccounts"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-heart" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="INTEGRATIONS.FRESHSALESACCOUNTS"
-          >FreshsalesAccounts</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="INTEGRATIONS.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedFreshsalesAccounts.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div
-      class="close-button-wrapper"
-      ng-click="vm.selectedFreshsalesAccounts =[]"
-    >
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="INTEGRATIONS.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-freshsalesAccounts-count">
-          <span>{{vm.selectedFreshsalesAccounts.length}}</span>
-          <span translate="INTEGRATIONS.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="INTEGRATIONS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllFreshsalesAccounts()"
-                translate="INTEGRATIONS.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectFreshsalesAccounts()"
-                translate="INTEGRATIONS.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedFreshsalesAccounts"
-          csv-label="true"
-          filename="freshsalesAccounts.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedFreshsalesAccounts($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- FRESHSALESACCOUNT TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedFreshsalesAccounts"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getFreshsalesAccounts"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">
-                  {{ 'INTEGRATIONS.ID' | translate }}
-                </th>
-                <th md-column md-order-by="name">
-                  {{ 'INTEGRATIONS.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="username">
-                  {{ 'INTEGRATIONS.USERNAME' | translate }}
-                </th>
-                <th md-column md-order-by="remoteUri">
-                  {{ 'INTEGRATIONS.URI' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.freshsalesAccounts.rows.length">
-                <td md-cell colspan="5">
-                  <div layout="row" layout-align="center center">
-                    <span translate="INTEGRATIONS.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="freshsalesAccount"
-                md-select-id="id"
-                ng-repeat="freshsalesAccount in vm.freshsalesAccounts.rows"
-              >
-                <td md-cell ng-if="freshsalesAccount.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{freshsalesAccount.name}}"
-                    ng-src="api/users/{{freshsalesAccount.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!freshsalesAccount.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{freshsalesAccount.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(freshsalesAccount, ev) : vm.createOrEditFreshsalesAccount($event, freshsalesAccount)"
-                  md-cell
-                  class="id"
-                >
-                  {{freshsalesAccount.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(freshsalesAccount, ev) : vm.createOrEditFreshsalesAccount($event, freshsalesAccount)"
-                  md-cell
-                  class="name"
-                >
-                  {{freshsalesAccount.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(freshsalesAccount, ev) : vm.createOrEditFreshsalesAccount($event, freshsalesAccount)"
-                  md-cell
-                  class="username"
-                >
-                  {{freshsalesAccount.username}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(freshsalesAccount, ev) : vm.createOrEditFreshsalesAccount($event, freshsalesAccount)"
-                  md-cell
-                  class="remoteUri"
-                >
-                  {{freshsalesAccount.remoteUri}}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="INTEGRATIONS.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(freshsalesAccount, $event    )"
-                          translate="INTEGRATIONS.EDIT_FRESHSALESACCOUNT"
-                        >
-                          Edit FreshsalesAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.testtestintegrationaccount(freshsalesAccount, $event    )"
-                          translate="INTEGRATIONS.TEST_FRESHSALESACCOUNT"
-                        >
-                          Test FreshsalesAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(freshsalesAccount, $event    )"
-                          translate="INTEGRATIONS.DELETE_FRESHSALESACCOUNT"
-                        >
-                          Delete FreshsalesAccount
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'INTEGRATIONS.PAGE' | translate}}:', rowsPerPage: '{{'INTEGRATIONS.ROWSPERPAGE' | translate}}:', of: '{{'INTEGRATIONS.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.freshsalesAccounts.count}}"
-          md-on-paginate="vm.getFreshsalesAccounts"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / FRESHSALESACCOUNT TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD FRESHSALESACCOUNT BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-freshsalesAccount-button"
-    ng-click="vm.createOrEditFreshsalesAccount($event)"
-    aria-label="add freshsalesAccount"
-    translate
-    translate-attr-aria-label="INTEGRATIONS.ADD_FRESHSALESACCOUNT"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD FRESHSALESACCOUNT BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/freshsalesAccounts.html/freshsalesAccounts.html b/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/freshsalesAccounts.html/freshsalesAccounts.html
new file mode 100644
index 0000000..00e6189
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/freshsalesAccounts/freshsalesAccounts.html/freshsalesAccounts.html
@@ -0,0 +1,323 @@
+<div
+  id="freshsalesAccounts"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-heart" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="INTEGRATIONS.FRESHSALESACCOUNTS"
+          >FreshsalesAccounts</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="INTEGRATIONS.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedFreshsalesAccounts.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div
+      class="close-button-wrapper"
+      ng-click="vm.selectedFreshsalesAccounts =[]"
+    >
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="INTEGRATIONS.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-freshsalesAccounts-count">
+          <span>{{vm.selectedFreshsalesAccounts.length}}</span>
+          <span translate="INTEGRATIONS.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="INTEGRATIONS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllFreshsalesAccounts()"
+                translate="INTEGRATIONS.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectFreshsalesAccounts()"
+                translate="INTEGRATIONS.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedFreshsalesAccounts"
+          csv-label="true"
+          filename="freshsalesAccounts.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedFreshsalesAccounts($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- FRESHSALESACCOUNT TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedFreshsalesAccounts"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getFreshsalesAccounts"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">
+                  {{ 'INTEGRATIONS.ID' | translate }}
+                </th>
+                <th md-column md-order-by="name">
+                  {{ 'INTEGRATIONS.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="username">
+                  {{ 'INTEGRATIONS.USERNAME' | translate }}
+                </th>
+                <th md-column md-order-by="remoteUri">
+                  {{ 'INTEGRATIONS.URI' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.freshsalesAccounts.rows.length">
+                <td md-cell colspan="5">
+                  <div layout="row" layout-align="center center">
+                    <span translate="INTEGRATIONS.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="freshsalesAccount"
+                md-select-id="id"
+                ng-repeat="freshsalesAccount in vm.freshsalesAccounts.rows"
+              >
+                <td md-cell ng-if="freshsalesAccount.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{freshsalesAccount.name}}"
+                    ng-src="api/users/{{freshsalesAccount.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!freshsalesAccount.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{freshsalesAccount.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(freshsalesAccount, ev) : vm.createOrEditFreshsalesAccount($event, freshsalesAccount)"
+                  md-cell
+                  class="id"
+                >
+                  {{freshsalesAccount.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(freshsalesAccount, ev) : vm.createOrEditFreshsalesAccount($event, freshsalesAccount)"
+                  md-cell
+                  class="name"
+                >
+                  {{freshsalesAccount.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(freshsalesAccount, ev) : vm.createOrEditFreshsalesAccount($event, freshsalesAccount)"
+                  md-cell
+                  class="username"
+                >
+                  {{freshsalesAccount.username}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(freshsalesAccount, ev) : vm.createOrEditFreshsalesAccount($event, freshsalesAccount)"
+                  md-cell
+                  class="remoteUri"
+                >
+                  {{freshsalesAccount.remoteUri}}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="INTEGRATIONS.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(freshsalesAccount, $event    )"
+                          translate="INTEGRATIONS.EDIT_FRESHSALESACCOUNT"
+                        >
+                          Edit FreshsalesAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.testtestintegrationaccount(freshsalesAccount, $event    )"
+                          translate="INTEGRATIONS.TEST_FRESHSALESACCOUNT"
+                        >
+                          Test FreshsalesAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(freshsalesAccount, $event    )"
+                          translate="INTEGRATIONS.DELETE_FRESHSALESACCOUNT"
+                        >
+                          Delete FreshsalesAccount
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'INTEGRATIONS.PAGE' | translate}}:', rowsPerPage: '{{'INTEGRATIONS.ROWSPERPAGE' | translate}}:', of: '{{'INTEGRATIONS.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.freshsalesAccounts.count}}"
+          md-on-paginate="vm.getFreshsalesAccounts"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / FRESHSALESACCOUNT TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD FRESHSALESACCOUNT BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-freshsalesAccount-button"
+    ng-click="vm.createOrEditFreshsalesAccount($event)"
+    aria-label="add freshsalesAccount"
+    translate
+    translate-attr-aria-label="INTEGRATIONS.ADD_FRESHSALESACCOUNT"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD FRESHSALESACCOUNT BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index ee6dd87..0000000
--- a/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,349 +0,0 @@
-<md-dialog class="salesforceAccount-dialog" aria-label="New SalesforceAccount">
-  <form name="salesforceAccountForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.salesforceAccount.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="salesforceAccountForm['name'].$error"
-          ng-show="salesforceAccountForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.TYPE">Type</label>
-        <md-select name="type" ng-model="vm.salesforceAccount.type" required>
-          <md-option ng-value="'integrationTab'">
-            {{ 'INTEGRATIONS.INTEGRATION_TAB' | translate }}
-          </md-option>
-
-          <md-option ng-value="'newTab'">
-            {{ 'INTEGRATIONS.NEW_TAB' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="salesforceAccountForm['type'].$error"
-          ng-show="salesforceAccountForm['type'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-              >Type field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.USERNAME">Username</label>
-        <input
-          type="text"
-          name="username"
-          ng-model="vm.salesforceAccount.username"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="salesforceAccountForm['username'].$error"
-          ng-show="salesforceAccountForm['username'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
-              >Username field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.URI">Uri</label>
-        <input
-          type="url"
-          name="remoteUri"
-          ng-model="vm.salesforceAccount.remoteUri"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="salesforceAccountForm['remoteUri'].$error"
-          ng-show="salesforceAccountForm['remoteUri'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
-              >Uri field is required</span
-            >
-          </div>
-          <div ng-message="url">
-            <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
-              >Uri must be a valid url http://www.xcally.com</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.PASSWORD">Password</label>
-        <input
-          type="password"
-          name="password"
-          ng-model="vm.salesforceAccount.password"
-          placeholder="Password"
-          translate
-          translate-attr-placeholder="INTEGRATIONS.PASSWORD"
-          required
-        />
-        <div
-          ng-messages="salesforceAccountForm['password'].$error"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.PASSWORD_REQUIRED"
-              >Password field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span translate="INTEGRATIONS.ERRORS.SECURE_PASSWORD_PATTERN"
-              >Must contain at least 8 characters, with a minimum of 1 lowercase
-              letter, 1 uppercase letter, 1 numeric character and 1 special
-              character ~!?*@#$%^&-_=+[{]}.</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.CLIENTID">ClientId</label>
-        <input
-          type="text"
-          name="clientId"
-          ng-model="vm.salesforceAccount.clientId"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="salesforceAccountForm['clientId'].$error"
-          ng-show="salesforceAccountForm['clientId'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.CLIENTID_REQUIRED"
-              >ClientId field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.CLIENTSECRET">ClientSecret</label>
-        <input
-          type="text"
-          name="clientSecret"
-          ng-model="vm.salesforceAccount.clientSecret"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="salesforceAccountForm['clientSecret'].$error"
-          ng-show="salesforceAccountForm['clientSecret'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.CLIENTSECRET_REQUIRED"
-              >ClientSecret field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.SECURITYTOKEN">SecurityToken</label>
-        <input
-          type="text"
-          name="securityToken"
-          ng-model="vm.salesforceAccount.securityToken"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="salesforceAccountForm['securityToken'].$error"
-          ng-show="salesforceAccountForm['securityToken'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.SECURITYTOKEN_REQUIRED"
-              >SecurityToken field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
-          >MotionProxyAddress</label
-        >
-        <input
-          type="url"
-          name="serverUrl"
-          ng-model="vm.salesforceAccount.serverUrl"
-        />
-
-        <div class="hint">
-          <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
-        </div>
-        <div
-          ng-messages="salesforceAccountForm['serverUrl'].$error"
-          ng-show="salesforceAccountForm['serverUrl'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
-              >MotionProxyAddress field is required</span
-            >
-          </div>
-          <div ng-message="url">
-            <span
-              translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
-              >MotionProxyAddress must be a valid url
-              http://www.xcally.com</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.salesforceAccount.description"
-        />
-
-        <div
-          ng-messages="salesforceAccountForm['description'].$error"
-          ng-show="salesforceAccountForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newSalesforceAccount"
-          ng-click="vm.saveSalesforceAccount()"
-          class="send-button md-accent md-raised"
-          ng-disabled="salesforceAccountForm.$invalid || salesforceAccountForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newSalesforceAccount"
-          ng-click="vm.addNewSalesforceAccount()"
-          class="send-button md-accent md-raised"
-          ng-disabled="salesforceAccountForm.$invalid"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD_SALESFORCEACCOUNT"
-          translate-attr-aria-label="INTEGRATIONS.ADD_SALESFORCEACCOUNT"
-        >
-          ADD SALESFORCEACCOUNT
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newSalesforceAccount"
-          ng-click="vm.deleteSalesforceAccount($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/create/dialog.html/dialog.html
new file mode 100644
index 0000000..ee6dd87
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/create/dialog.html/dialog.html
@@ -0,0 +1,349 @@
+<md-dialog class="salesforceAccount-dialog" aria-label="New SalesforceAccount">
+  <form name="salesforceAccountForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.salesforceAccount.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="salesforceAccountForm['name'].$error"
+          ng-show="salesforceAccountForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.TYPE">Type</label>
+        <md-select name="type" ng-model="vm.salesforceAccount.type" required>
+          <md-option ng-value="'integrationTab'">
+            {{ 'INTEGRATIONS.INTEGRATION_TAB' | translate }}
+          </md-option>
+
+          <md-option ng-value="'newTab'">
+            {{ 'INTEGRATIONS.NEW_TAB' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="salesforceAccountForm['type'].$error"
+          ng-show="salesforceAccountForm['type'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+              >Type field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.USERNAME">Username</label>
+        <input
+          type="text"
+          name="username"
+          ng-model="vm.salesforceAccount.username"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="salesforceAccountForm['username'].$error"
+          ng-show="salesforceAccountForm['username'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
+              >Username field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.URI">Uri</label>
+        <input
+          type="url"
+          name="remoteUri"
+          ng-model="vm.salesforceAccount.remoteUri"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="salesforceAccountForm['remoteUri'].$error"
+          ng-show="salesforceAccountForm['remoteUri'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
+              >Uri field is required</span
+            >
+          </div>
+          <div ng-message="url">
+            <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
+              >Uri must be a valid url http://www.xcally.com</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.PASSWORD">Password</label>
+        <input
+          type="password"
+          name="password"
+          ng-model="vm.salesforceAccount.password"
+          placeholder="Password"
+          translate
+          translate-attr-placeholder="INTEGRATIONS.PASSWORD"
+          required
+        />
+        <div
+          ng-messages="salesforceAccountForm['password'].$error"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.PASSWORD_REQUIRED"
+              >Password field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span translate="INTEGRATIONS.ERRORS.SECURE_PASSWORD_PATTERN"
+              >Must contain at least 8 characters, with a minimum of 1 lowercase
+              letter, 1 uppercase letter, 1 numeric character and 1 special
+              character ~!?*@#$%^&-_=+[{]}.</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.CLIENTID">ClientId</label>
+        <input
+          type="text"
+          name="clientId"
+          ng-model="vm.salesforceAccount.clientId"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="salesforceAccountForm['clientId'].$error"
+          ng-show="salesforceAccountForm['clientId'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.CLIENTID_REQUIRED"
+              >ClientId field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.CLIENTSECRET">ClientSecret</label>
+        <input
+          type="text"
+          name="clientSecret"
+          ng-model="vm.salesforceAccount.clientSecret"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="salesforceAccountForm['clientSecret'].$error"
+          ng-show="salesforceAccountForm['clientSecret'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.CLIENTSECRET_REQUIRED"
+              >ClientSecret field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.SECURITYTOKEN">SecurityToken</label>
+        <input
+          type="text"
+          name="securityToken"
+          ng-model="vm.salesforceAccount.securityToken"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="salesforceAccountForm['securityToken'].$error"
+          ng-show="salesforceAccountForm['securityToken'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.SECURITYTOKEN_REQUIRED"
+              >SecurityToken field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
+          >MotionProxyAddress</label
+        >
+        <input
+          type="url"
+          name="serverUrl"
+          ng-model="vm.salesforceAccount.serverUrl"
+        />
+
+        <div class="hint">
+          <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
+        </div>
+        <div
+          ng-messages="salesforceAccountForm['serverUrl'].$error"
+          ng-show="salesforceAccountForm['serverUrl'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
+              >MotionProxyAddress field is required</span
+            >
+          </div>
+          <div ng-message="url">
+            <span
+              translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
+              >MotionProxyAddress must be a valid url
+              http://www.xcally.com</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.salesforceAccount.description"
+        />
+
+        <div
+          ng-messages="salesforceAccountForm['description'].$error"
+          ng-show="salesforceAccountForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newSalesforceAccount"
+          ng-click="vm.saveSalesforceAccount()"
+          class="send-button md-accent md-raised"
+          ng-disabled="salesforceAccountForm.$invalid || salesforceAccountForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newSalesforceAccount"
+          ng-click="vm.addNewSalesforceAccount()"
+          class="send-button md-accent md-raised"
+          ng-disabled="salesforceAccountForm.$invalid"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD_SALESFORCEACCOUNT"
+          translate-attr-aria-label="INTEGRATIONS.ADD_SALESFORCEACCOUNT"
+        >
+          ADD SALESFORCEACCOUNT
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newSalesforceAccount"
+          ng-click="vm.deleteSalesforceAccount($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index c0ce800..0000000
--- a/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,214 +0,0 @@
-<md-dialog
-  class="salesforceConfiguration-dialog"
-  aria-label="New SalesforceConfiguration"
->
-  <form name="salesforceConfigurationForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.NAME">Name</label>
-        <input
-          type=""
-          name="name"
-          ng-model="vm.salesforceConfiguration.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="salesforceConfigurationForm['name'].$error"
-          ng-show="salesforceConfigurationForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.CHANNEL">Channel</label>
-        <md-select
-          name="channel"
-          ng-model="vm.salesforceConfiguration.channel"
-          required
-        >
-          <md-option ng-value="'voice'">
-            {{ 'INTEGRATIONS.VOICE' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="salesforceConfigurationForm['channel'].$error"
-          ng-show="salesforceConfigurationForm['channel'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.CHANNEL_REQUIRED"
-              >Channel field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.TYPE">Type</label>
-        <md-select
-          name="type"
-          ng-model="vm.salesforceConfiguration.type"
-          required
-        >
-          <md-option ng-value="'inbound'">
-            {{ 'INTEGRATIONS.INBOUND_IN_QUEUE' | translate }}
-          </md-option>
-
-          <md-option ng-value="'outbound'">
-            {{ 'INTEGRATIONS.OUTBOUND_CALL' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="salesforceConfigurationForm['type'].$error"
-          ng-show="salesforceConfigurationForm['type'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-              >Type field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.TICKETTYPE">TicketType</label>
-        <md-select
-          name="ticketType"
-          ng-model="vm.salesforceConfiguration.ticketType"
-          required
-        >
-          <md-option ng-value="'Task'">
-            {{ 'INTEGRATIONS.TASK' | translate }}
-          </md-option>
-
-          <md-option ng-value="'Case'">
-            {{ 'INTEGRATIONS.CASE' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="salesforceConfigurationForm['ticketType'].$error"
-          ng-show="salesforceConfigurationForm['ticketType'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.TICKETTYPE_REQUIRED"
-              >TicketType field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newSalesforceConfiguration"
-          ng-click="vm.saveSalesforceConfiguration()"
-          class="send-button md-accent md-raised"
-          ng-disabled="salesforceConfigurationForm.$invalid || salesforceConfigurationForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newSalesforceConfiguration"
-          ng-click="vm.addNewSalesforceConfiguration()"
-          class="send-button md-accent md-raised"
-          ng-disabled="salesforceConfigurationForm.$invalid"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD_SALESFORCECONFIGURATION"
-          translate-attr-aria-label="INTEGRATIONS.ADD_SALESFORCECONFIGURATION"
-        >
-          ADD SALESFORCECONFIGURATION
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newSalesforceConfiguration"
-          ng-click="vm.deleteSalesforceConfiguration($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/edit/configurations/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/edit/configurations/dialog.html/dialog.html
new file mode 100644
index 0000000..c0ce800
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/edit/configurations/dialog.html/dialog.html
@@ -0,0 +1,214 @@
+<md-dialog
+  class="salesforceConfiguration-dialog"
+  aria-label="New SalesforceConfiguration"
+>
+  <form name="salesforceConfigurationForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.NAME">Name</label>
+        <input
+          type=""
+          name="name"
+          ng-model="vm.salesforceConfiguration.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="salesforceConfigurationForm['name'].$error"
+          ng-show="salesforceConfigurationForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.CHANNEL">Channel</label>
+        <md-select
+          name="channel"
+          ng-model="vm.salesforceConfiguration.channel"
+          required
+        >
+          <md-option ng-value="'voice'">
+            {{ 'INTEGRATIONS.VOICE' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="salesforceConfigurationForm['channel'].$error"
+          ng-show="salesforceConfigurationForm['channel'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.CHANNEL_REQUIRED"
+              >Channel field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.TYPE">Type</label>
+        <md-select
+          name="type"
+          ng-model="vm.salesforceConfiguration.type"
+          required
+        >
+          <md-option ng-value="'inbound'">
+            {{ 'INTEGRATIONS.INBOUND_IN_QUEUE' | translate }}
+          </md-option>
+
+          <md-option ng-value="'outbound'">
+            {{ 'INTEGRATIONS.OUTBOUND_CALL' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="salesforceConfigurationForm['type'].$error"
+          ng-show="salesforceConfigurationForm['type'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+              >Type field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.TICKETTYPE">TicketType</label>
+        <md-select
+          name="ticketType"
+          ng-model="vm.salesforceConfiguration.ticketType"
+          required
+        >
+          <md-option ng-value="'Task'">
+            {{ 'INTEGRATIONS.TASK' | translate }}
+          </md-option>
+
+          <md-option ng-value="'Case'">
+            {{ 'INTEGRATIONS.CASE' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="salesforceConfigurationForm['ticketType'].$error"
+          ng-show="salesforceConfigurationForm['ticketType'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.TICKETTYPE_REQUIRED"
+              >TicketType field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newSalesforceConfiguration"
+          ng-click="vm.saveSalesforceConfiguration()"
+          class="send-button md-accent md-raised"
+          ng-disabled="salesforceConfigurationForm.$invalid || salesforceConfigurationForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newSalesforceConfiguration"
+          ng-click="vm.addNewSalesforceConfiguration()"
+          class="send-button md-accent md-raised"
+          ng-disabled="salesforceConfigurationForm.$invalid"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD_SALESFORCECONFIGURATION"
+          translate-attr-aria-label="INTEGRATIONS.ADD_SALESFORCECONFIGURATION"
+        >
+          ADD SALESFORCECONFIGURATION
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newSalesforceConfiguration"
+          ng-click="vm.deleteSalesforceConfiguration($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/edit/item/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/edit/item/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index b58414d..0000000
--- a/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/edit/item/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,478 +0,0 @@
-<md-dialog class="salesforceAccount-item-dialog" aria-label="New Item">
-  <form name="salesforceAccountItemForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <div ng-switch="vm.type">
-        <div ng-switch-when="subject">
-          <!-- SUBJECT SECTION -->
-          <div ng-include="'/subject.html'"></div>
-          <!-- / SUBJECT SECTION -->
-        </div>
-        <div ng-switch-when="description">
-          <!-- DESCRIPTION SECTION -->
-          <md-input-container class="md-block">
-            <label translate="INTEGRATIONS.TYPE">Type</label>
-            <md-select name="type" ng-model="vm.item.type" required>
-              <md-option value="string">String</md-option>
-              <md-option value="keyValue">Key Value</md-option>
-            </md-select>
-            <div
-              ng-messages="salesforceAccountItemForm.type.$error"
-              ng-show="salesforceAccountItemForm.type.$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-                  >Type field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
-            <label translate="INTEGRATIONS.CONTENT">Content</label>
-            <input
-              type="text"
-              name="content"
-              ng-model="vm.item.content"
-              required
-              md-autofocus
-            />
-            <div
-              ng-messages="salesforceAccountItemForm.content.$error"
-              ng-show="salesforceAccountItemForm.content.$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
-                  >Content field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <div ng-if="vm.item.type == 'keyValue'">
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.KEY">Key</label>
-              <input
-                type="text"
-                name="key"
-                ng-model="vm.item.key"
-                required
-                md-autofocus
-              />
-              <div
-                ng-messages="salesforceAccountItemForm.key.$error"
-                ng-show="salesforceAccountItemForm.key.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.KEY_REQUIRED"
-                    >Key field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.TYPE">Type</label>
-              <md-select name="keyType" ng-model="vm.item.keyType" required>
-                <md-option value="string">String</md-option>
-                <md-option value="variable">Variable</md-option>
-                <md-option value="customVariable">Custom Variable</md-option>
-              </md-select>
-              <div
-                ng-messages="salesforceAccountItemForm.keyType.$error"
-                ng-show="salesforceAccountItemForm.keyType.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-                    >Type field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'string'"
-            >
-              <label translate="INTEGRATIONS.CONTENT">Content</label>
-              <input
-                type="text"
-                name="keyContent"
-                ng-model="vm.item.keyContent"
-                required
-                md-autofocus
-              />
-              <div
-                ng-messages="salesforceAccountItemForm.keyContent.$error"
-                ng-show="salesforceAccountItemForm.keyContent.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
-                    >Content field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'variable'"
-            >
-              <label translate="INTEGRATIONS.VALUE">Value</label>
-              <md-select
-                name="variableName"
-                ng-model="vm.item.variableName"
-                md-selected-text="vm.getSelectedVariable()"
-                required
-              >
-                <md-optgroup label="Voice: Queue">
-                  <md-option
-                    ng-value="agentColumn"
-                    ng-repeat="agentColumn in vm.voiceAgentReportColumns"
-                    >{{agentColumn}}
-                  </md-option>
-                </md-optgroup>
-                <md-optgroup label="Voice: Outbound">
-                  <md-option
-                    ng-value="dialColumn"
-                    ng-repeat="dialColumn in vm.voiceDialReportColumns"
-                    >{{dialColumn}}</md-option
-                  >
-                </md-optgroup>
-              </md-select>
-              <div
-                ng-messages="salesforceAccountItemForm.variableName.$error"
-                ng-show="salesforceAccountItemForm.variableName.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED"
-                    >Variable name field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'customVariable'"
-            >
-              <label translate="INTEGRATIONS.VALUE">Value</label>
-              <md-select ng-model="vm.item.VariableId" required>
-                <md-option
-                  ng-value="variable.id"
-                  ng-repeat="variable in vm.variables"
-                  >{{variable.name}}
-                </md-option>
-              </md-select>
-            </md-input-container>
-          </div>
-          <!-- / DESCRIPTION SECTION -->
-        </div>
-        <div ng-switch-when="field">
-          <!-- FIELD SECTION -->
-          <div ng-if="vm.accountConnected">
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.FIELD">FIELD</label>
-              <!-- ITEM TYPE DEFAULT VALUE is STRING -->
-              <md-select
-                name="customField"
-                ng-model="vm.customField"
-                required
-                ng-change="vm.item.type = 'string'"
-              >
-                <md-optgroup label="Standard">
-                  <md-option
-                    ng-value="standard"
-                    ng-repeat="standard in vm.fields | filter: {custom: false} "
-                    >{{standard.name}}
-                  </md-option>
-                </md-optgroup>
-
-                <md-optgroup label="Custom">
-                  <md-option
-                    ng-value="custom"
-                    ng-repeat="custom in vm.fields | filter: {custom: true} "
-                    >{{custom.name}}
-                  </md-option>
-                </md-optgroup>
-              </md-select>
-              <div
-                ng-messages="salesforceAccountItemForm.customField.$error"
-                ng-show="salesforceAccountItemForm.customField.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.FIELD_REQUIRED"
-                    >Field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <!-- FIELDS -->
-            <div ng-if="vm.customField" ng-include="'/fields.html'"></div>
-            <!-- FIELDS -->
-          </div>
-          <div ng-if="!vm.accountConnected">
-            <p>Account is not connected. Please check your configurations!</p>
-          </div>
-          <!-- / FIELD SECTION -->
-        </div>
-        <div ng-switch-default>
-          <p>No Item</p>
-        </div>
-      </div>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newItem"
-          ng-click="vm.saveItem()"
-          class="send-button md-accent md-raised"
-          ng-disabled="salesforceAccountItemForm.$invalid || salesforceAccountItemForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newItem"
-          ng-click="vm.addNewItem()"
-          class="send-button md-accent md-raised"
-          ng-disabled="salesforceAccountItemForm.$invalid || salesforceAccountItemForm.$pristine"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD"
-          translate-attr-aria-label="INTEGRATIONS.ADD"
-        >
-          ADD
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newItem"
-          ng-click="vm.deleteItem($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
-
-<script type="text/ng-template" id="/fields.html">
-
-  <!-- type -->
-  <md-input-container class="md-block" ng-if="!vm.customField.options.length">
-
-      <label translate="INTEGRATIONS.TYPE">Type</label>
-      <md-select name="type" ng-model="vm.item.type" required>
-
-          <md-option value="string">String</md-option>
-          <md-option value="variable">Variable</md-option>
-          <md-option value="customVariable">Custom Variable</md-option>
-      </md-select>
-      <div ng-messages="salesforceAccountItemForm.type.$error" ng-show="salesforceAccountItemForm.type.$touched"
-          role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <!--/ type -->
-
-  <!-- value -->
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && vm.customField.options.length">
-      <!-- options -->
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-
-      <md-select name="option" ng-model="vm.item.content" required>
-          <md-option ng-value="option.value" ng-repeat="option in vm.customField.options">{{option.name}}</md-option>
-      </md-select>
-
-      <div ng-messages="salesforceAccountItemForm.option.$error"
-          ng-show="salesforceAccountItemForm.option.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VALUE_REQUIRED">Value field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && !vm.customField.options.length">
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-
-      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
-
-      <div ng-messages="salesforceAccountItemForm.content.$error"
-          ng-show="salesforceAccountItemForm.content.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
-          required>
-          <md-optgroup label="Voice: Queue">
-              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
-              </md-option>
-          </md-optgroup>
-          <md-optgroup label="Voice: Outbound">
-              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
-              </md-option>
-          </md-optgroup>
-      </md-select>
-      <div ng-messages="salesforceAccountItemForm.variableName.$error"
-          ng-show="salesforceAccountItemForm.variableName.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select ng-model="vm.item.VariableId" required>
-          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
-      </md-select>
-  </md-input-container>
-
-  <!--/ value -->
-</script>
-
-<script type="text/ng-template" id="/subject.html">
-    <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.TYPE">Type</label>
-            <md-select name="type" ng-model="vm.item.type" required>
-                <md-option value="string">String</md-option>
-                <md-option value="variable">Variable</md-option>
-                <md-option value="customVariable">Custom Variable</md-option>
-            </md-select>
-        <div ng-messages="salesforceAccountItemForm.type.$error" ng-show="salesforceAccountItemForm.type.$touched" role="alert">
-            <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
-             </div>
-        </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
-      <div ng-messages="salesforceAccountItemForm.content.$error"
-          ng-show="salesforceAccountItemForm.content.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
-          required>
-          <md-optgroup label="Voice: Queue">
-              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
-              </md-option>
-          </md-optgroup>
-          <md-optgroup label="Voice: Outbound">
-              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
-              </md-option>
-          </md-optgroup>
-      </md-select>
-      <div ng-messages="salesforceAccountItemForm.variableName.$error"
-          ng-show="salesforceAccountItemForm.variableName.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select ng-model="vm.item.VariableId" required>
-          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
-      </md-select>
-  </md-input-container>
-</script>
diff --git a/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/edit/item/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/edit/item/dialog.html/dialog.html
new file mode 100644
index 0000000..b58414d
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/edit/item/dialog.html/dialog.html
@@ -0,0 +1,478 @@
+<md-dialog class="salesforceAccount-item-dialog" aria-label="New Item">
+  <form name="salesforceAccountItemForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <div ng-switch="vm.type">
+        <div ng-switch-when="subject">
+          <!-- SUBJECT SECTION -->
+          <div ng-include="'/subject.html'"></div>
+          <!-- / SUBJECT SECTION -->
+        </div>
+        <div ng-switch-when="description">
+          <!-- DESCRIPTION SECTION -->
+          <md-input-container class="md-block">
+            <label translate="INTEGRATIONS.TYPE">Type</label>
+            <md-select name="type" ng-model="vm.item.type" required>
+              <md-option value="string">String</md-option>
+              <md-option value="keyValue">Key Value</md-option>
+            </md-select>
+            <div
+              ng-messages="salesforceAccountItemForm.type.$error"
+              ng-show="salesforceAccountItemForm.type.$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+                  >Type field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
+            <label translate="INTEGRATIONS.CONTENT">Content</label>
+            <input
+              type="text"
+              name="content"
+              ng-model="vm.item.content"
+              required
+              md-autofocus
+            />
+            <div
+              ng-messages="salesforceAccountItemForm.content.$error"
+              ng-show="salesforceAccountItemForm.content.$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
+                  >Content field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <div ng-if="vm.item.type == 'keyValue'">
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.KEY">Key</label>
+              <input
+                type="text"
+                name="key"
+                ng-model="vm.item.key"
+                required
+                md-autofocus
+              />
+              <div
+                ng-messages="salesforceAccountItemForm.key.$error"
+                ng-show="salesforceAccountItemForm.key.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.KEY_REQUIRED"
+                    >Key field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.TYPE">Type</label>
+              <md-select name="keyType" ng-model="vm.item.keyType" required>
+                <md-option value="string">String</md-option>
+                <md-option value="variable">Variable</md-option>
+                <md-option value="customVariable">Custom Variable</md-option>
+              </md-select>
+              <div
+                ng-messages="salesforceAccountItemForm.keyType.$error"
+                ng-show="salesforceAccountItemForm.keyType.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+                    >Type field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'string'"
+            >
+              <label translate="INTEGRATIONS.CONTENT">Content</label>
+              <input
+                type="text"
+                name="keyContent"
+                ng-model="vm.item.keyContent"
+                required
+                md-autofocus
+              />
+              <div
+                ng-messages="salesforceAccountItemForm.keyContent.$error"
+                ng-show="salesforceAccountItemForm.keyContent.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
+                    >Content field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'variable'"
+            >
+              <label translate="INTEGRATIONS.VALUE">Value</label>
+              <md-select
+                name="variableName"
+                ng-model="vm.item.variableName"
+                md-selected-text="vm.getSelectedVariable()"
+                required
+              >
+                <md-optgroup label="Voice: Queue">
+                  <md-option
+                    ng-value="agentColumn"
+                    ng-repeat="agentColumn in vm.voiceAgentReportColumns"
+                    >{{agentColumn}}
+                  </md-option>
+                </md-optgroup>
+                <md-optgroup label="Voice: Outbound">
+                  <md-option
+                    ng-value="dialColumn"
+                    ng-repeat="dialColumn in vm.voiceDialReportColumns"
+                    >{{dialColumn}}</md-option
+                  >
+                </md-optgroup>
+              </md-select>
+              <div
+                ng-messages="salesforceAccountItemForm.variableName.$error"
+                ng-show="salesforceAccountItemForm.variableName.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED"
+                    >Variable name field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'customVariable'"
+            >
+              <label translate="INTEGRATIONS.VALUE">Value</label>
+              <md-select ng-model="vm.item.VariableId" required>
+                <md-option
+                  ng-value="variable.id"
+                  ng-repeat="variable in vm.variables"
+                  >{{variable.name}}
+                </md-option>
+              </md-select>
+            </md-input-container>
+          </div>
+          <!-- / DESCRIPTION SECTION -->
+        </div>
+        <div ng-switch-when="field">
+          <!-- FIELD SECTION -->
+          <div ng-if="vm.accountConnected">
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.FIELD">FIELD</label>
+              <!-- ITEM TYPE DEFAULT VALUE is STRING -->
+              <md-select
+                name="customField"
+                ng-model="vm.customField"
+                required
+                ng-change="vm.item.type = 'string'"
+              >
+                <md-optgroup label="Standard">
+                  <md-option
+                    ng-value="standard"
+                    ng-repeat="standard in vm.fields | filter: {custom: false} "
+                    >{{standard.name}}
+                  </md-option>
+                </md-optgroup>
+
+                <md-optgroup label="Custom">
+                  <md-option
+                    ng-value="custom"
+                    ng-repeat="custom in vm.fields | filter: {custom: true} "
+                    >{{custom.name}}
+                  </md-option>
+                </md-optgroup>
+              </md-select>
+              <div
+                ng-messages="salesforceAccountItemForm.customField.$error"
+                ng-show="salesforceAccountItemForm.customField.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.FIELD_REQUIRED"
+                    >Field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <!-- FIELDS -->
+            <div ng-if="vm.customField" ng-include="'/fields.html'"></div>
+            <!-- FIELDS -->
+          </div>
+          <div ng-if="!vm.accountConnected">
+            <p>Account is not connected. Please check your configurations!</p>
+          </div>
+          <!-- / FIELD SECTION -->
+        </div>
+        <div ng-switch-default>
+          <p>No Item</p>
+        </div>
+      </div>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newItem"
+          ng-click="vm.saveItem()"
+          class="send-button md-accent md-raised"
+          ng-disabled="salesforceAccountItemForm.$invalid || salesforceAccountItemForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newItem"
+          ng-click="vm.addNewItem()"
+          class="send-button md-accent md-raised"
+          ng-disabled="salesforceAccountItemForm.$invalid || salesforceAccountItemForm.$pristine"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD"
+          translate-attr-aria-label="INTEGRATIONS.ADD"
+        >
+          ADD
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newItem"
+          ng-click="vm.deleteItem($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
+
+<script type="text/ng-template" id="/fields.html">
+
+  <!-- type -->
+  <md-input-container class="md-block" ng-if="!vm.customField.options.length">
+
+      <label translate="INTEGRATIONS.TYPE">Type</label>
+      <md-select name="type" ng-model="vm.item.type" required>
+
+          <md-option value="string">String</md-option>
+          <md-option value="variable">Variable</md-option>
+          <md-option value="customVariable">Custom Variable</md-option>
+      </md-select>
+      <div ng-messages="salesforceAccountItemForm.type.$error" ng-show="salesforceAccountItemForm.type.$touched"
+          role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <!--/ type -->
+
+  <!-- value -->
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && vm.customField.options.length">
+      <!-- options -->
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+
+      <md-select name="option" ng-model="vm.item.content" required>
+          <md-option ng-value="option.value" ng-repeat="option in vm.customField.options">{{option.name}}</md-option>
+      </md-select>
+
+      <div ng-messages="salesforceAccountItemForm.option.$error"
+          ng-show="salesforceAccountItemForm.option.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VALUE_REQUIRED">Value field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && !vm.customField.options.length">
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+
+      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
+
+      <div ng-messages="salesforceAccountItemForm.content.$error"
+          ng-show="salesforceAccountItemForm.content.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
+          required>
+          <md-optgroup label="Voice: Queue">
+              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
+              </md-option>
+          </md-optgroup>
+          <md-optgroup label="Voice: Outbound">
+              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
+              </md-option>
+          </md-optgroup>
+      </md-select>
+      <div ng-messages="salesforceAccountItemForm.variableName.$error"
+          ng-show="salesforceAccountItemForm.variableName.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select ng-model="vm.item.VariableId" required>
+          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
+      </md-select>
+  </md-input-container>
+
+  <!--/ value -->
+</script>
+
+<script type="text/ng-template" id="/subject.html">
+    <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.TYPE">Type</label>
+            <md-select name="type" ng-model="vm.item.type" required>
+                <md-option value="string">String</md-option>
+                <md-option value="variable">Variable</md-option>
+                <md-option value="customVariable">Custom Variable</md-option>
+            </md-select>
+        <div ng-messages="salesforceAccountItemForm.type.$error" ng-show="salesforceAccountItemForm.type.$touched" role="alert">
+            <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
+             </div>
+        </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
+      <div ng-messages="salesforceAccountItemForm.content.$error"
+          ng-show="salesforceAccountItemForm.content.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
+          required>
+          <md-optgroup label="Voice: Queue">
+              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
+              </md-option>
+          </md-optgroup>
+          <md-optgroup label="Voice: Outbound">
+              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
+              </md-option>
+          </md-optgroup>
+      </md-select>
+      <div ng-messages="salesforceAccountItemForm.variableName.$error"
+          ng-show="salesforceAccountItemForm.variableName.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select ng-model="vm.item.VariableId" required>
+          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
+      </md-select>
+  </md-input-container>
+</script>
diff --git a/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index d47f7ff..0000000
--- a/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,1059 +0,0 @@
-<div
-  id="integrations-salesforceAccount"
-  class="page-layout simple tabbed"
-  layout="column"
->
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-salesforceAccounts-button md-icon-button"
-        aria-label="Go to salesforceAccounts"
-        ng-click="vm.gotoSalesforceAccounts()"
-        translate
-        translate-attr-aria-label="INTEGRATIONS.GO_TO_SALESFORCEACCOUNTS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="salesforceAccount-image" hide-xs>
-          <img ng-src="assets/images/business/salesforceAccounts.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.salesforceAccount.id}}
-            <span ng-if="vm.salesforceAccount.name"
-              >{{vm.salesforceAccount.name}}</span
-            >
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="INTEGRATIONS.CREATED_AT"></span>
-            <span>{{vm.salesforceAccount.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveSalesforceAccount()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (configurationsForm.$invalid)"
-        translate="INTEGRATIONS.SAVE"
-        translate-attr-aria-label="INTEGRATIONS.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="INTEGRATIONS.ACCOUNT">ACCOUNT</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="salesforceAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="INTEGRATIONS.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.salesforceAccount.name"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.TYPE">Type</label>
-                <md-select
-                  name="type"
-                  ng-model="vm.salesforceAccount.type"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'integrationTab'">
-                    {{ 'INTEGRATIONS.INTEGRATION_TAB' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'newTab'">
-                    {{ 'INTEGRATIONS.NEW_TAB' | translate }}
-                  </md-option>
-                </md-select>
-                <div
-                  ng-messages="generalForm['type'].$error"
-                  ng-show="generalForm['type'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-                      >Type field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.USERNAME">Username</label>
-                <input
-                  type="text"
-                  name="username"
-                  ng-model="vm.salesforceAccount.username"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['username'].$error"
-                  ng-show="generalForm['username'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
-                      >Username field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.URI">Uri</label>
-                <input
-                  type="url"
-                  name="remoteUri"
-                  ng-model="vm.salesforceAccount.remoteUri"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['remoteUri'].$error"
-                  ng-show="generalForm['remoteUri'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
-                      >Uri field is required</span
-                    >
-                  </div>
-                  <div ng-message="url">
-                    <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
-                      >Uri must be a valid url http://www.xcally.com</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.PASSWORD">Password</label>
-                <input
-                  type="password"
-                  name="password"
-                  ng-model="vm.salesforceAccount.password"
-                  placeholder="Password"
-                  translate
-                  translate-attr-placeholder="INTEGRATIONS.PASSWORD"
-                  required
-                />
-                <div ng-messages="generalForm['password'].$error" role="alert">
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.PASSWORD_REQUIRED"
-                      >Password field is required</span
-                    >
-                  </div>
-                  <div ng-message="pattern">
-                    <span
-                      translate="INTEGRATIONS.ERRORS.SECURE_PASSWORD_PATTERN"
-                      >Must contain at least 8 characters, with a minimum of 1
-                      lowercase letter, 1 uppercase letter, 1 numeric character
-                      and 1 special character ~!?*@#$%^&-_=+[{]}.</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.CLIENTID">ClientId</label>
-                <input
-                  type="text"
-                  name="clientId"
-                  ng-model="vm.salesforceAccount.clientId"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['clientId'].$error"
-                  ng-show="generalForm['clientId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.CLIENTID_REQUIRED"
-                      >ClientId field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.CLIENTSECRET"
-                  >ClientSecret</label
-                >
-                <input
-                  type="text"
-                  name="clientSecret"
-                  ng-model="vm.salesforceAccount.clientSecret"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['clientSecret'].$error"
-                  ng-show="generalForm['clientSecret'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.CLIENTSECRET_REQUIRED"
-                      >ClientSecret field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.SECURITYTOKEN"
-                  >SecurityToken</label
-                >
-                <input
-                  type="text"
-                  name="securityToken"
-                  ng-model="vm.salesforceAccount.securityToken"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['securityToken'].$error"
-                  ng-show="generalForm['securityToken'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.SECURITYTOKEN_REQUIRED"
-                      >SecurityToken field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
-                  >MotionProxyAddress</label
-                >
-                <input
-                  type="url"
-                  name="serverUrl"
-                  ng-model="vm.salesforceAccount.serverUrl"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['serverUrl'].$error"
-                  ng-show="generalForm['serverUrl'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
-                      >MotionProxyAddress field is required</span
-                    >
-                  </div>
-                  <div ng-message="url">
-                    <span
-                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
-                      >MotionProxyAddress must be a valid url
-                      http://www.xcally.com</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.salesforceAccount.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="INTEGRATIONS.CONFIGURATIONS">CONFIGURATIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="salesforceAccount-detail-form-container configurations md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div
-                class="h2 secondary-text"
-                translate="INTEGRATIONS.CONFIGURATIONS"
-              >
-                CONFIGURATIONS
-              </div>
-            </div>
-            <div
-              ng-controller="SalesforceAccountConfigurationsController as vm_cc"
-              ng-init="vm_cc.init(vm.salesforceAccount, vm.crudPermissions)"
-              layout="row"
-            >
-              <md-card class="md-whiteframe-1dp" flex="30">
-                <div layout="row" layout-align="center center">
-                  <md-subheader flex="75" class="md-no-sticky"
-                    >{{ 'INTEGRATIONS.CONFIGURATIONS' | translate
-                    }}</md-subheader
-                  >
-                  <md-button
-                    flex="25"
-                    ng-if="vm_cc.crudPermissions.canEdit"
-                    ng-click="vm_cc.createOrEditSalesforceConfiguration($event)"
-                    class="md-icon-button"
-                    aria-label="create salesforceConfiguration"
-                  >
-                    <md-icon md-font-icon="icon-plus"></md-icon>
-                  </md-button>
-                </div>
-                <md-list>
-                  <md-list-item
-                    layout="row"
-                    layout-align="center center"
-                    ng-repeat="salesforceConfiguration in vm_cc.configurations"
-                    class="border-top"
-                    md-colors="{background: (vm_cc.selectedSalesforceConfiguration == $index ? 'accent' : 'grey-A100')}"
-                    ng-click="vm_cc.getSalesforceConfiguration($index)"
-                  >
-                    <span class="text-truncate" flex="80"
-                      >{{ salesforceConfiguration.name }}</span
-                    >
-                    <md-menu ng-if="vm_cc.crudPermissions.canDelete">
-                      <md-button
-                        class="md-icon-button"
-                        aria-label="More"
-                        translate
-                        translate-attr-aria-label="INTEGRATIONS.MORE"
-                        ng-click="$mdOpenMenu($event)"
-                      >
-                        <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                      </md-button>
-                      <md-menu-content width="3">
-                        <md-menu-item ng-if="vm_cc.crudPermissions.canDelete">
-                          <md-button
-                            ng-click="vm_cc.deleteSalesforceConfiguration($event, salesforceConfiguration)"
-                            translate="INTEGRATIONS.DELETE_SALESFORCECONFIGURATION"
-                          >
-                            Delete SalesforceConfiguration
-                          </md-button>
-                        </md-menu-item>
-                      </md-menu-content>
-                    </md-menu>
-                  </md-list-item>
-                </md-list>
-              </md-card>
-              <div flex></div>
-              <md-card class="md-whiteframe-1dp" flex="65">
-                <md-tabs ng-if="vm_cc.configurations.length" md-dynamic-height>
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.SUBJECTS">SUBJECTS</span>
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-toolbar
-                        class="md-table-toolbar md-default no-padding"
-                        ng-hide="vm_cc.selectedSubjects.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <div flex></div>
-                          <ms-search-bar
-                            on-search="vm_cc.query.subject = query"
-                            on-collapse="vm_cc.query.subject = undefined"
-                            debounce="300"
-                          ></ms-search-bar>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canEdit"
-                            class="md-icon-button"
-                            ng-click="vm_cc.createOrEditSubject($event)"
-                            aria-label="add subject"
-                            translate
-                            translate-attr-label="INTEGRATIONS.ADD_SUBJECT"
-                          >
-                            <md-icon md-font-icon="icon-plus"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-toolbar
-                        class="md-table-toolbar md-accent"
-                        ng-show="vm_cc.selectedSubjects.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <span class="md-subhead"
-                            >{{vm_cc.selectedSubjects.length}}
-                            {{vm_cc.selectedSubjects.length > 1 ? 'items' :
-                            'item'}} selected</span
-                          >
-                          <div flex></div>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canDelete"
-                            class="md-icon-button"
-                            ng-click="vm_cc.deleteSelectedSubjects($event)"
-                            aria-label="delete selected"
-                            translate
-                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-                          >
-                            <md-icon md-font-icon="icon-delete"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-table-container
-                        class="md-whiteframe-1dp padding-horizontal"
-                      >
-                        <table
-                          md-table
-                          md-row-select
-                          multiple
-                          ng-model="vm_cc.selectedSubjects"
-                        >
-                          <thead md-head>
-                            <tr md-row>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.ID' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.TYPE' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.CONTENT' | translate }}
-                              </th>
-                              <th md-column width="10px"></th>
-                            </tr>
-                          </thead>
-                          <tbody md-body>
-                            <tr
-                              md-row
-                              md-select="subject"
-                              md-select-id="id"
-                              ng-repeat="subject in vm_cc.subjects | filter: vm_cc.query.subject"
-                            >
-                              <td
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                                class="id"
-                              >
-                                {{subject.id}}
-                              </td>
-                              <td
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                                class="type"
-                              >
-                                <span ng-if="subject.FieldId"
-                                  >{{subject.nameField ||
-                                  subject.idField}}</span
-                                >
-                                <span ng-if="!subject.FieldId"
-                                  >{{subject.type}}</span
-                                >
-                              </td>
-                              <td
-                                ng-switch="subject.type"
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                              >
-                                <span ng-switch-when="string"
-                                  >{{subject.content}}</span
-                                >
-                                <span
-                                  ng-switch-when="variable"
-                                  class="text-boxed"
-                                  >{{subject.variableName}}</span
-                                >
-                                <span
-                                  ng-switch-when="customVariable"
-                                  class="text-boxed"
-                                  >{{
-                                  vm_cc.variablesById[subject.VariableId].name
-                                  }}</span
-                                >
-                                <span ng-switch-when="keyValue">
-                                  {{subject.key}}
-                                  <span ng-switch="description.keyType">
-                                    <span ng-switch-when="string"
-                                      >{{subject.keyContent}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="variable"
-                                      class="text-boxed"
-                                      >{{subject.variableName}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="customVariable"
-                                      class="text-boxed"
-                                      >{{
-                                      vm_cc.variablesById[subject.VariableId].name
-                                      }}</span
-                                    >
-                                  </span>
-                                </span>
-                                <span ng-switch-default
-                                  >{{subject.content}}</span
-                                >
-                              </td>
-                              <td
-                                md-cell
-                                class="actions"
-                                ng-if="!vm_cc.crudPermissions.readOnly"
-                              >
-                                <md-menu>
-                                  <md-button
-                                    class="md-icon-button"
-                                    aria-label="More"
-                                    translate
-                                    translate-attr-aria-label="INTEGRATIONS.MORE"
-                                    ng-click="$mdOpenMenu($event)"
-                                  >
-                                    <md-icon
-                                      md-font-icon="icon-dots-vertical"
-                                    ></md-icon>
-                                  </md-button>
-
-                                  <md-menu-content width="3">
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canEdit"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                        translate="INTEGRATIONS.EDIT_SUBJECT"
-                                      >
-                                        Edit Subject
-                                      </md-button>
-                                    </md-menu-item>
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canDelete"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.deleteSubjectConfirm($event, subject)"
-                                        translate="INTEGRATIONS.DELETE_SUBJECT"
-                                      >
-                                        Delete Subject
-                                      </md-button>
-                                    </md-menu-item>
-                                  </md-menu-content>
-                                </md-menu>
-                              </td>
-                            </tr>
-                          </tbody>
-                        </table>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.DESCRIPTIONS"
-                        >DESCRIPTIONS</span
-                      >
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-toolbar
-                        class="md-table-toolbar md-default no-padding"
-                        ng-hide="vm_cc.selectedDescriptions.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <div flex></div>
-                          <ms-search-bar
-                            on-search="vm_cc.query.description = query"
-                            on-collapse="vm_cc.query.description = undefined"
-                            debounce="300"
-                          ></ms-search-bar>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canEdit"
-                            class="md-icon-button"
-                            ng-click="vm_cc.createOrEditDescription($event)"
-                            aria-label="add description"
-                            translate
-                            translate-attr-label="INTEGRATIONS.ADD_DESCRIPTION"
-                          >
-                            <md-icon md-font-icon="icon-plus"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-toolbar
-                        class="md-table-toolbar md-accent"
-                        ng-show="vm_cc.selectedDescriptions.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <span class="md-subhead"
-                            >{{vm_cc.selectedDescriptions.length}}
-                            {{vm_cc.selectedDescriptions.length > 1 ? 'items' :
-                            'item'}} selected</span
-                          >
-                          <div flex></div>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canDelete"
-                            class="md-icon-button"
-                            ng-click="vm_cc.deleteSelectedDescriptions($event)"
-                            aria-label="delete selected"
-                            translate
-                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-                          >
-                            <md-icon md-font-icon="icon-delete"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-table-container
-                        class="md-whiteframe-1dp padding-horizontal"
-                      >
-                        <table
-                          md-table
-                          md-row-select
-                          multiple
-                          ng-model="vm_cc.selectedDescriptions"
-                        >
-                          <thead md-head>
-                            <tr md-row>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.ID' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.TYPE' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.CONTENT' | translate }}
-                              </th>
-                              <th md-column width="10px"></th>
-                            </tr>
-                          </thead>
-                          <tbody md-body>
-                            <tr
-                              md-row
-                              md-select="description"
-                              md-select-id="id"
-                              ng-repeat="description in vm_cc.descriptions | filter: vm_cc.query.description"
-                            >
-                              <td
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                                class="id"
-                              >
-                                {{description.id}}
-                              </td>
-                              <td
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                                class="type"
-                              >
-                                <span ng-if="description.FieldId"
-                                  >{{description.nameField ||
-                                  description.idField}}</span
-                                >
-                                <span ng-if="!description.FieldId"
-                                  >{{description.type}}</span
-                                >
-                              </td>
-                              <td
-                                ng-switch="description.type"
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                              >
-                                <span ng-switch-when="string"
-                                  >{{description.content}}</span
-                                >
-                                <span
-                                  ng-switch-when="variable"
-                                  class="text-boxed"
-                                  >{{description.variableName}}</span
-                                >
-                                <span
-                                  ng-switch-when="customVariable"
-                                  class="text-boxed"
-                                  >{{
-                                  vm_cc.variablesById[description.VariableId].name
-                                  }}</span
-                                >
-                                <span ng-switch-when="keyValue">
-                                  {{description.key}}
-                                  <span ng-switch="description.keyType">
-                                    <span ng-switch-when="string"
-                                      >{{description.keyContent}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="variable"
-                                      class="text-boxed"
-                                      >{{description.variableName}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="customVariable"
-                                      class="text-boxed"
-                                      >{{
-                                      vm_cc.variablesById[description.VariableId].name
-                                      }}</span
-                                    >
-                                  </span>
-                                </span>
-                                <span ng-switch-default
-                                  >{{description.content}}</span
-                                >
-                              </td>
-                              <td
-                                md-cell
-                                class="actions"
-                                ng-if="!vm_cc.crudPermissions.readOnly"
-                              >
-                                <md-menu>
-                                  <md-button
-                                    class="md-icon-button"
-                                    aria-label="More"
-                                    translate
-                                    translate-attr-aria-label="INTEGRATIONS.MORE"
-                                    ng-click="$mdOpenMenu($event)"
-                                  >
-                                    <md-icon
-                                      md-font-icon="icon-dots-vertical"
-                                    ></md-icon>
-                                  </md-button>
-
-                                  <md-menu-content width="3">
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canEdit"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.createOrEditDescription($event, description)"
-                                        translate="INTEGRATIONS.EDIT_DESCRIPTION"
-                                      >
-                                        Edit Description
-                                      </md-button>
-                                    </md-menu-item>
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canDelete"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.deleteDescriptionConfirm($event, description)"
-                                        translate="INTEGRATIONS.DELETE_DESCRIPTION"
-                                      >
-                                        Delete Description
-                                      </md-button>
-                                    </md-menu-item>
-                                  </md-menu-content>
-                                </md-menu>
-                              </td>
-                            </tr>
-                          </tbody>
-                        </table>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.FIELDS">FIELDS</span>
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-toolbar
-                        class="md-table-toolbar md-default no-padding"
-                        ng-hide="vm_cc.selectedFields.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <div flex></div>
-                          <ms-search-bar
-                            on-search="vm_cc.query.field = query"
-                            on-collapse="vm_cc.query.field = undefined"
-                            debounce="300"
-                          ></ms-search-bar>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canEdit"
-                            class="md-icon-button"
-                            ng-click="vm_cc.createOrEditField($event)"
-                            aria-label="add field"
-                            translate
-                            translate-attr-label="INTEGRATIONS.ADD_FIELD"
-                          >
-                            <md-icon md-font-icon="icon-plus"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-toolbar
-                        class="md-table-toolbar md-accent"
-                        ng-show="vm_cc.selectedFields.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <span class="md-subhead"
-                            >{{vm_cc.selectedFields.length}}
-                            {{vm_cc.selectedFields.length > 1 ? 'items' :
-                            'item'}} selected</span
-                          >
-                          <div flex></div>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canDelete"
-                            class="md-icon-button"
-                            ng-click="vm_cc.deleteSelectedFields($event)"
-                            aria-label="delete selected"
-                            translate
-                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-                          >
-                            <md-icon md-font-icon="icon-delete"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-table-container
-                        class="md-whiteframe-1dp padding-horizontal"
-                      >
-                        <table
-                          md-table
-                          md-row-select
-                          multiple
-                          ng-model="vm_cc.selectedFields"
-                        >
-                          <thead md-head>
-                            <tr md-row>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.ID' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.TYPE' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.CONTENT' | translate }}
-                              </th>
-                              <th md-column width="10px"></th>
-                            </tr>
-                          </thead>
-                          <tbody md-body>
-                            <tr
-                              md-row
-                              md-select="field"
-                              md-select-id="id"
-                              ng-repeat="field in vm_cc.fields | filter: vm_cc.query.field"
-                            >
-                              <td
-                                ng-click="vm_cc.createOrEditField($event, field)"
-                                md-cell
-                                class="id"
-                              >
-                                {{field.id}}
-                              </td>
-                              <td
-                                ng-click="vm_cc.createOrEditField($event, field)"
-                                md-cell
-                                class="type"
-                              >
-                                <span ng-if="field.FieldId"
-                                  >{{field.nameField || field.idField}}</span
-                                >
-                                <span ng-if="!field.FieldId"
-                                  >{{field.type}}</span
-                                >
-                              </td>
-                              <td
-                                ng-switch="field.type"
-                                ng-click="vm_cc.createOrEditField($event, field)"
-                                md-cell
-                              >
-                                <span ng-switch-when="string"
-                                  >{{field.content}}</span
-                                >
-                                <span
-                                  ng-switch-when="variable"
-                                  class="text-boxed"
-                                  >{{field.variableName}}</span
-                                >
-                                <span
-                                  ng-switch-when="customVariable"
-                                  class="text-boxed"
-                                  >{{ vm_cc.variablesById[field.VariableId].name
-                                  }}</span
-                                >
-                                <span ng-switch-when="keyValue">
-                                  {{field.key}}
-                                  <span ng-switch="description.keyType">
-                                    <span ng-switch-when="string"
-                                      >{{field.keyContent}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="variable"
-                                      class="text-boxed"
-                                      >{{field.variableName}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="customVariable"
-                                      class="text-boxed"
-                                      >{{
-                                      vm_cc.variablesById[field.VariableId].name
-                                      }}</span
-                                    >
-                                  </span>
-                                </span>
-                                <span ng-switch-default>{{field.content}}</span>
-                              </td>
-                              <td
-                                md-cell
-                                class="actions"
-                                ng-if="!vm_cc.crudPermissions.readOnly"
-                              >
-                                <md-menu>
-                                  <md-button
-                                    class="md-icon-button"
-                                    aria-label="More"
-                                    translate
-                                    translate-attr-aria-label="INTEGRATIONS.MORE"
-                                    ng-click="$mdOpenMenu($event)"
-                                  >
-                                    <md-icon
-                                      md-font-icon="icon-dots-vertical"
-                                    ></md-icon>
-                                  </md-button>
-
-                                  <md-menu-content width="3">
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canEdit"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.createOrEditField($event, field)"
-                                        translate="INTEGRATIONS.EDIT_FIELD"
-                                      >
-                                        Edit Field
-                                      </md-button>
-                                    </md-menu-item>
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canDelete"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.deleteFieldConfirm($event, field)"
-                                        translate="INTEGRATIONS.DELETE_FIELD"
-                                      >
-                                        Delete Field
-                                      </md-button>
-                                    </md-menu-item>
-                                  </md-menu-content>
-                                </md-menu>
-                              </td>
-                            </tr>
-                          </tbody>
-                        </table>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.ADVANCED">ADVANCED</span>
-                    </md-tab-label>
-                    <md-tab-body>
-                      <div layout-margin>
-                        <label translate="INTEGRATIONS.MODULE_SEARCH"></label>
-                        <md-select
-                          ng-model="vm_cc.salesforceConfiguration.moduleSearch"
-                          ng-change="vm_cc.selectChangedAdvanced()"
-                          ng-disabled="!vm_cc.crudPermissions.canEdit"
-                        >
-                          <md-option
-                            ng-value="option.key"
-                            ng-repeat="option in [{key: 'contact_lead', value: 'Contact & Lead'}, {key: 'contact', value: 'Contact'}, {key: 'lead', value: 'Lead'}]"
-                            >{{ option.value }}</md-option
-                          >
-                        </md-select>
-                      </div>
-                      <div layout-margin>
-                        <label translate="INTEGRATIONS.MODULE_CREATE"></label>
-                        <md-select
-                          ng-model="vm_cc.salesforceConfiguration.moduleCreate"
-                          ng-change="vm_cc.selectChangedAdvanced()"
-                          ng-disabled="!vm_cc.crudPermissions.canEdit"
-                        >
-                          <md-option
-                            ng-value="option.key"
-                            ng-repeat="option in [{key: 'nothing', value: 'Nothing'}, {key: 'contact', value: 'Contact'}, {key: 'lead', value: 'Lead'}]"
-                            >{{ option.value }}</md-option
-                          >
-                        </md-select>
-                      </div>
-                    </md-tab-body>
-                  </md-tab>
-                </md-tabs>
-                <div
-                  class="padding-20"
-                  ng-if="!vm_cc.configurations.length && vm_cc.crudPermissions.canEdit"
-                  ng-click="vm_cc.createOrEditSalesforceConfiguration($event)"
-                  layout="row"
-                  layout-sm="column"
-                  layout-align="center center"
-                  layout-wrap
-                >
-                  <div
-                    class="padding-20 md-whiteframe-3dp md-accent-bg"
-                    layout="column"
-                    layout-align="center center"
-                  >
-                    <md-button class="md-icon-button">
-                      <md-icon md-font-icon="icon-plus"></md-icon>
-                    </md-button>
-                    <span
-                      aria-label="add configuration"
-                      translate
-                      translate-attr-label="INTEGRATIONS.ADD_CONFIGURATION"
-                      >ADD CONFIGURATION</span
-                    >
-                  </div>
-                </div>
-              </md-card>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/edit/view.html/view.html b/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/edit/view.html/view.html
new file mode 100644
index 0000000..d47f7ff
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/edit/view.html/view.html
@@ -0,0 +1,1059 @@
+<div
+  id="integrations-salesforceAccount"
+  class="page-layout simple tabbed"
+  layout="column"
+>
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-salesforceAccounts-button md-icon-button"
+        aria-label="Go to salesforceAccounts"
+        ng-click="vm.gotoSalesforceAccounts()"
+        translate
+        translate-attr-aria-label="INTEGRATIONS.GO_TO_SALESFORCEACCOUNTS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="salesforceAccount-image" hide-xs>
+          <img ng-src="assets/images/business/salesforceAccounts.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.salesforceAccount.id}}
+            <span ng-if="vm.salesforceAccount.name"
+              >{{vm.salesforceAccount.name}}</span
+            >
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="INTEGRATIONS.CREATED_AT"></span>
+            <span>{{vm.salesforceAccount.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveSalesforceAccount()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (configurationsForm.$invalid)"
+        translate="INTEGRATIONS.SAVE"
+        translate-attr-aria-label="INTEGRATIONS.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="INTEGRATIONS.ACCOUNT">ACCOUNT</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="salesforceAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="INTEGRATIONS.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.salesforceAccount.name"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.TYPE">Type</label>
+                <md-select
+                  name="type"
+                  ng-model="vm.salesforceAccount.type"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'integrationTab'">
+                    {{ 'INTEGRATIONS.INTEGRATION_TAB' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'newTab'">
+                    {{ 'INTEGRATIONS.NEW_TAB' | translate }}
+                  </md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['type'].$error"
+                  ng-show="generalForm['type'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+                      >Type field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.USERNAME">Username</label>
+                <input
+                  type="text"
+                  name="username"
+                  ng-model="vm.salesforceAccount.username"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['username'].$error"
+                  ng-show="generalForm['username'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
+                      >Username field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.URI">Uri</label>
+                <input
+                  type="url"
+                  name="remoteUri"
+                  ng-model="vm.salesforceAccount.remoteUri"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['remoteUri'].$error"
+                  ng-show="generalForm['remoteUri'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
+                      >Uri field is required</span
+                    >
+                  </div>
+                  <div ng-message="url">
+                    <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
+                      >Uri must be a valid url http://www.xcally.com</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.PASSWORD">Password</label>
+                <input
+                  type="password"
+                  name="password"
+                  ng-model="vm.salesforceAccount.password"
+                  placeholder="Password"
+                  translate
+                  translate-attr-placeholder="INTEGRATIONS.PASSWORD"
+                  required
+                />
+                <div ng-messages="generalForm['password'].$error" role="alert">
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.PASSWORD_REQUIRED"
+                      >Password field is required</span
+                    >
+                  </div>
+                  <div ng-message="pattern">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.SECURE_PASSWORD_PATTERN"
+                      >Must contain at least 8 characters, with a minimum of 1
+                      lowercase letter, 1 uppercase letter, 1 numeric character
+                      and 1 special character ~!?*@#$%^&-_=+[{]}.</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.CLIENTID">ClientId</label>
+                <input
+                  type="text"
+                  name="clientId"
+                  ng-model="vm.salesforceAccount.clientId"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['clientId'].$error"
+                  ng-show="generalForm['clientId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.CLIENTID_REQUIRED"
+                      >ClientId field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.CLIENTSECRET"
+                  >ClientSecret</label
+                >
+                <input
+                  type="text"
+                  name="clientSecret"
+                  ng-model="vm.salesforceAccount.clientSecret"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['clientSecret'].$error"
+                  ng-show="generalForm['clientSecret'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.CLIENTSECRET_REQUIRED"
+                      >ClientSecret field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.SECURITYTOKEN"
+                  >SecurityToken</label
+                >
+                <input
+                  type="text"
+                  name="securityToken"
+                  ng-model="vm.salesforceAccount.securityToken"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['securityToken'].$error"
+                  ng-show="generalForm['securityToken'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.SECURITYTOKEN_REQUIRED"
+                      >SecurityToken field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
+                  >MotionProxyAddress</label
+                >
+                <input
+                  type="url"
+                  name="serverUrl"
+                  ng-model="vm.salesforceAccount.serverUrl"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['serverUrl'].$error"
+                  ng-show="generalForm['serverUrl'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
+                      >MotionProxyAddress field is required</span
+                    >
+                  </div>
+                  <div ng-message="url">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
+                      >MotionProxyAddress must be a valid url
+                      http://www.xcally.com</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.salesforceAccount.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="INTEGRATIONS.CONFIGURATIONS">CONFIGURATIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="salesforceAccount-detail-form-container configurations md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div
+                class="h2 secondary-text"
+                translate="INTEGRATIONS.CONFIGURATIONS"
+              >
+                CONFIGURATIONS
+              </div>
+            </div>
+            <div
+              ng-controller="SalesforceAccountConfigurationsController as vm_cc"
+              ng-init="vm_cc.init(vm.salesforceAccount, vm.crudPermissions)"
+              layout="row"
+            >
+              <md-card class="md-whiteframe-1dp" flex="30">
+                <div layout="row" layout-align="center center">
+                  <md-subheader flex="75" class="md-no-sticky"
+                    >{{ 'INTEGRATIONS.CONFIGURATIONS' | translate
+                    }}</md-subheader
+                  >
+                  <md-button
+                    flex="25"
+                    ng-if="vm_cc.crudPermissions.canEdit"
+                    ng-click="vm_cc.createOrEditSalesforceConfiguration($event)"
+                    class="md-icon-button"
+                    aria-label="create salesforceConfiguration"
+                  >
+                    <md-icon md-font-icon="icon-plus"></md-icon>
+                  </md-button>
+                </div>
+                <md-list>
+                  <md-list-item
+                    layout="row"
+                    layout-align="center center"
+                    ng-repeat="salesforceConfiguration in vm_cc.configurations"
+                    class="border-top"
+                    md-colors="{background: (vm_cc.selectedSalesforceConfiguration == $index ? 'accent' : 'grey-A100')}"
+                    ng-click="vm_cc.getSalesforceConfiguration($index)"
+                  >
+                    <span class="text-truncate" flex="80"
+                      >{{ salesforceConfiguration.name }}</span
+                    >
+                    <md-menu ng-if="vm_cc.crudPermissions.canDelete">
+                      <md-button
+                        class="md-icon-button"
+                        aria-label="More"
+                        translate
+                        translate-attr-aria-label="INTEGRATIONS.MORE"
+                        ng-click="$mdOpenMenu($event)"
+                      >
+                        <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                      </md-button>
+                      <md-menu-content width="3">
+                        <md-menu-item ng-if="vm_cc.crudPermissions.canDelete">
+                          <md-button
+                            ng-click="vm_cc.deleteSalesforceConfiguration($event, salesforceConfiguration)"
+                            translate="INTEGRATIONS.DELETE_SALESFORCECONFIGURATION"
+                          >
+                            Delete SalesforceConfiguration
+                          </md-button>
+                        </md-menu-item>
+                      </md-menu-content>
+                    </md-menu>
+                  </md-list-item>
+                </md-list>
+              </md-card>
+              <div flex></div>
+              <md-card class="md-whiteframe-1dp" flex="65">
+                <md-tabs ng-if="vm_cc.configurations.length" md-dynamic-height>
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.SUBJECTS">SUBJECTS</span>
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedSubjects.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.subject = query"
+                            on-collapse="vm_cc.query.subject = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditSubject($event)"
+                            aria-label="add subject"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_SUBJECT"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedSubjects.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedSubjects.length}}
+                            {{vm_cc.selectedSubjects.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedSubjects($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedSubjects"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.ID' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.TYPE' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.CONTENT' | translate }}
+                              </th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="subject"
+                              md-select-id="id"
+                              ng-repeat="subject in vm_cc.subjects | filter: vm_cc.query.subject"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                                class="id"
+                              >
+                                {{subject.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="subject.FieldId"
+                                  >{{subject.nameField ||
+                                  subject.idField}}</span
+                                >
+                                <span ng-if="!subject.FieldId"
+                                  >{{subject.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="subject.type"
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{subject.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{subject.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{
+                                  vm_cc.variablesById[subject.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{subject.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{subject.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{subject.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[subject.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default
+                                  >{{subject.content}}</span
+                                >
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="INTEGRATIONS.MORE"
+                                    ng-click="$mdOpenMenu($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                        translate="INTEGRATIONS.EDIT_SUBJECT"
+                                      >
+                                        Edit Subject
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteSubjectConfirm($event, subject)"
+                                        translate="INTEGRATIONS.DELETE_SUBJECT"
+                                      >
+                                        Delete Subject
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.DESCRIPTIONS"
+                        >DESCRIPTIONS</span
+                      >
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedDescriptions.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.description = query"
+                            on-collapse="vm_cc.query.description = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditDescription($event)"
+                            aria-label="add description"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_DESCRIPTION"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedDescriptions.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedDescriptions.length}}
+                            {{vm_cc.selectedDescriptions.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedDescriptions($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedDescriptions"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.ID' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.TYPE' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.CONTENT' | translate }}
+                              </th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="description"
+                              md-select-id="id"
+                              ng-repeat="description in vm_cc.descriptions | filter: vm_cc.query.description"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                                class="id"
+                              >
+                                {{description.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="description.FieldId"
+                                  >{{description.nameField ||
+                                  description.idField}}</span
+                                >
+                                <span ng-if="!description.FieldId"
+                                  >{{description.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="description.type"
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{description.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{description.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{
+                                  vm_cc.variablesById[description.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{description.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{description.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{description.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[description.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default
+                                  >{{description.content}}</span
+                                >
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="INTEGRATIONS.MORE"
+                                    ng-click="$mdOpenMenu($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditDescription($event, description)"
+                                        translate="INTEGRATIONS.EDIT_DESCRIPTION"
+                                      >
+                                        Edit Description
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteDescriptionConfirm($event, description)"
+                                        translate="INTEGRATIONS.DELETE_DESCRIPTION"
+                                      >
+                                        Delete Description
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.FIELDS">FIELDS</span>
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedFields.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.field = query"
+                            on-collapse="vm_cc.query.field = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditField($event)"
+                            aria-label="add field"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_FIELD"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedFields.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedFields.length}}
+                            {{vm_cc.selectedFields.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedFields($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedFields"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.ID' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.TYPE' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.CONTENT' | translate }}
+                              </th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="field"
+                              md-select-id="id"
+                              ng-repeat="field in vm_cc.fields | filter: vm_cc.query.field"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditField($event, field)"
+                                md-cell
+                                class="id"
+                              >
+                                {{field.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditField($event, field)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="field.FieldId"
+                                  >{{field.nameField || field.idField}}</span
+                                >
+                                <span ng-if="!field.FieldId"
+                                  >{{field.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="field.type"
+                                ng-click="vm_cc.createOrEditField($event, field)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{field.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{field.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{ vm_cc.variablesById[field.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{field.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{field.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{field.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[field.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default>{{field.content}}</span>
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="INTEGRATIONS.MORE"
+                                    ng-click="$mdOpenMenu($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditField($event, field)"
+                                        translate="INTEGRATIONS.EDIT_FIELD"
+                                      >
+                                        Edit Field
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteFieldConfirm($event, field)"
+                                        translate="INTEGRATIONS.DELETE_FIELD"
+                                      >
+                                        Delete Field
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.ADVANCED">ADVANCED</span>
+                    </md-tab-label>
+                    <md-tab-body>
+                      <div layout-margin>
+                        <label translate="INTEGRATIONS.MODULE_SEARCH"></label>
+                        <md-select
+                          ng-model="vm_cc.salesforceConfiguration.moduleSearch"
+                          ng-change="vm_cc.selectChangedAdvanced()"
+                          ng-disabled="!vm_cc.crudPermissions.canEdit"
+                        >
+                          <md-option
+                            ng-value="option.key"
+                            ng-repeat="option in [{key: 'contact_lead', value: 'Contact & Lead'}, {key: 'contact', value: 'Contact'}, {key: 'lead', value: 'Lead'}]"
+                            >{{ option.value }}</md-option
+                          >
+                        </md-select>
+                      </div>
+                      <div layout-margin>
+                        <label translate="INTEGRATIONS.MODULE_CREATE"></label>
+                        <md-select
+                          ng-model="vm_cc.salesforceConfiguration.moduleCreate"
+                          ng-change="vm_cc.selectChangedAdvanced()"
+                          ng-disabled="!vm_cc.crudPermissions.canEdit"
+                        >
+                          <md-option
+                            ng-value="option.key"
+                            ng-repeat="option in [{key: 'nothing', value: 'Nothing'}, {key: 'contact', value: 'Contact'}, {key: 'lead', value: 'Lead'}]"
+                            >{{ option.value }}</md-option
+                          >
+                        </md-select>
+                      </div>
+                    </md-tab-body>
+                  </md-tab>
+                </md-tabs>
+                <div
+                  class="padding-20"
+                  ng-if="!vm_cc.configurations.length && vm_cc.crudPermissions.canEdit"
+                  ng-click="vm_cc.createOrEditSalesforceConfiguration($event)"
+                  layout="row"
+                  layout-sm="column"
+                  layout-align="center center"
+                  layout-wrap
+                >
+                  <div
+                    class="padding-20 md-whiteframe-3dp md-accent-bg"
+                    layout="column"
+                    layout-align="center center"
+                  >
+                    <md-button class="md-icon-button">
+                      <md-icon md-font-icon="icon-plus"></md-icon>
+                    </md-button>
+                    <span
+                      aria-label="add configuration"
+                      translate
+                      translate-attr-label="INTEGRATIONS.ADD_CONFIGURATION"
+                      >ADD CONFIGURATION</span
+                    >
+                  </div>
+                </div>
+              </md-card>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/salesforceAccounts.html/salesforceAccounts-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/salesforceAccounts.html/salesforceAccounts-[chunkhash].html
deleted file mode 100644
index d634a0a..0000000
--- a/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/salesforceAccounts.html/salesforceAccounts-[chunkhash].html
+++ /dev/null
@@ -1,323 +0,0 @@
-<div
-  id="salesforceAccounts"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-heart" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="INTEGRATIONS.SALESFORCEACCOUNTS"
-          >SalesforceAccounts</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="INTEGRATIONS.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedSalesforceAccounts.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div
-      class="close-button-wrapper"
-      ng-click="vm.selectedSalesforceAccounts =[]"
-    >
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="INTEGRATIONS.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-salesforceAccounts-count">
-          <span>{{vm.selectedSalesforceAccounts.length}}</span>
-          <span translate="INTEGRATIONS.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="INTEGRATIONS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllSalesforceAccounts()"
-                translate="INTEGRATIONS.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectSalesforceAccounts()"
-                translate="INTEGRATIONS.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedSalesforceAccounts"
-          csv-label="true"
-          filename="salesforceAccounts.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedSalesforceAccounts($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- SALESFORCEACCOUNT TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedSalesforceAccounts"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getSalesforceAccounts"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">
-                  {{ 'INTEGRATIONS.ID' | translate }}
-                </th>
-                <th md-column md-order-by="name">
-                  {{ 'INTEGRATIONS.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="username">
-                  {{ 'INTEGRATIONS.USERNAME' | translate }}
-                </th>
-                <th md-column md-order-by="remoteUri">
-                  {{ 'INTEGRATIONS.URI' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.salesforceAccounts.rows.length">
-                <td md-cell colspan="5">
-                  <div layout="row" layout-align="center center">
-                    <span translate="INTEGRATIONS.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="salesforceAccount"
-                md-select-id="id"
-                ng-repeat="salesforceAccount in vm.salesforceAccounts.rows"
-              >
-                <td md-cell ng-if="salesforceAccount.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{salesforceAccount.name}}"
-                    ng-src="api/users/{{salesforceAccount.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!salesforceAccount.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{salesforceAccount.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(salesforceAccount, ev) : vm.createOrEditSalesforceAccount($event, salesforceAccount)"
-                  md-cell
-                  class="id"
-                >
-                  {{salesforceAccount.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(salesforceAccount, ev) : vm.createOrEditSalesforceAccount($event, salesforceAccount)"
-                  md-cell
-                  class="name"
-                >
-                  {{salesforceAccount.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(salesforceAccount, ev) : vm.createOrEditSalesforceAccount($event, salesforceAccount)"
-                  md-cell
-                  class="username"
-                >
-                  {{salesforceAccount.username}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(salesforceAccount, ev) : vm.createOrEditSalesforceAccount($event, salesforceAccount)"
-                  md-cell
-                  class="remoteUri"
-                >
-                  {{salesforceAccount.remoteUri}}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="INTEGRATIONS.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(salesforceAccount, $event    )"
-                          translate="INTEGRATIONS.EDIT_SALESFORCEACCOUNT"
-                        >
-                          Edit SalesforceAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.testtestintegrationaccount(salesforceAccount, $event    )"
-                          translate="INTEGRATIONS.TEST_SALESFORCEACCOUNT"
-                        >
-                          Test SalesforceAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(salesforceAccount, $event    )"
-                          translate="INTEGRATIONS.DELETE_SALESFORCEACCOUNT"
-                        >
-                          Delete SalesforceAccount
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'INTEGRATIONS.PAGE' | translate}}:', rowsPerPage: '{{'INTEGRATIONS.ROWSPERPAGE' | translate}}:', of: '{{'INTEGRATIONS.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.salesforceAccounts.count}}"
-          md-on-paginate="vm.getSalesforceAccounts"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / SALESFORCEACCOUNT TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD SALESFORCEACCOUNT BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-salesforceAccount-button"
-    ng-click="vm.createOrEditSalesforceAccount($event)"
-    aria-label="add salesforceAccount"
-    translate
-    translate-attr-aria-label="INTEGRATIONS.ADD_SALESFORCEACCOUNT"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD SALESFORCEACCOUNT BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/salesforceAccounts.html/salesforceAccounts.html b/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/salesforceAccounts.html/salesforceAccounts.html
new file mode 100644
index 0000000..d634a0a
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/salesforceAccounts/salesforceAccounts.html/salesforceAccounts.html
@@ -0,0 +1,323 @@
+<div
+  id="salesforceAccounts"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-heart" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="INTEGRATIONS.SALESFORCEACCOUNTS"
+          >SalesforceAccounts</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="INTEGRATIONS.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedSalesforceAccounts.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div
+      class="close-button-wrapper"
+      ng-click="vm.selectedSalesforceAccounts =[]"
+    >
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="INTEGRATIONS.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-salesforceAccounts-count">
+          <span>{{vm.selectedSalesforceAccounts.length}}</span>
+          <span translate="INTEGRATIONS.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="INTEGRATIONS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllSalesforceAccounts()"
+                translate="INTEGRATIONS.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectSalesforceAccounts()"
+                translate="INTEGRATIONS.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedSalesforceAccounts"
+          csv-label="true"
+          filename="salesforceAccounts.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedSalesforceAccounts($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- SALESFORCEACCOUNT TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedSalesforceAccounts"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getSalesforceAccounts"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">
+                  {{ 'INTEGRATIONS.ID' | translate }}
+                </th>
+                <th md-column md-order-by="name">
+                  {{ 'INTEGRATIONS.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="username">
+                  {{ 'INTEGRATIONS.USERNAME' | translate }}
+                </th>
+                <th md-column md-order-by="remoteUri">
+                  {{ 'INTEGRATIONS.URI' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.salesforceAccounts.rows.length">
+                <td md-cell colspan="5">
+                  <div layout="row" layout-align="center center">
+                    <span translate="INTEGRATIONS.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="salesforceAccount"
+                md-select-id="id"
+                ng-repeat="salesforceAccount in vm.salesforceAccounts.rows"
+              >
+                <td md-cell ng-if="salesforceAccount.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{salesforceAccount.name}}"
+                    ng-src="api/users/{{salesforceAccount.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!salesforceAccount.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{salesforceAccount.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(salesforceAccount, ev) : vm.createOrEditSalesforceAccount($event, salesforceAccount)"
+                  md-cell
+                  class="id"
+                >
+                  {{salesforceAccount.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(salesforceAccount, ev) : vm.createOrEditSalesforceAccount($event, salesforceAccount)"
+                  md-cell
+                  class="name"
+                >
+                  {{salesforceAccount.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(salesforceAccount, ev) : vm.createOrEditSalesforceAccount($event, salesforceAccount)"
+                  md-cell
+                  class="username"
+                >
+                  {{salesforceAccount.username}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(salesforceAccount, ev) : vm.createOrEditSalesforceAccount($event, salesforceAccount)"
+                  md-cell
+                  class="remoteUri"
+                >
+                  {{salesforceAccount.remoteUri}}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="INTEGRATIONS.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(salesforceAccount, $event    )"
+                          translate="INTEGRATIONS.EDIT_SALESFORCEACCOUNT"
+                        >
+                          Edit SalesforceAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.testtestintegrationaccount(salesforceAccount, $event    )"
+                          translate="INTEGRATIONS.TEST_SALESFORCEACCOUNT"
+                        >
+                          Test SalesforceAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(salesforceAccount, $event    )"
+                          translate="INTEGRATIONS.DELETE_SALESFORCEACCOUNT"
+                        >
+                          Delete SalesforceAccount
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'INTEGRATIONS.PAGE' | translate}}:', rowsPerPage: '{{'INTEGRATIONS.ROWSPERPAGE' | translate}}:', of: '{{'INTEGRATIONS.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.salesforceAccounts.count}}"
+          md-on-paginate="vm.getSalesforceAccounts"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / SALESFORCEACCOUNT TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD SALESFORCEACCOUNT BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-salesforceAccount-button"
+    ng-click="vm.createOrEditSalesforceAccount($event)"
+    aria-label="add salesforceAccount"
+    translate
+    translate-attr-aria-label="INTEGRATIONS.ADD_SALESFORCEACCOUNT"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD SALESFORCEACCOUNT BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 69ed457..0000000
--- a/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,289 +0,0 @@
-<md-dialog class="servicenowAccount-dialog" aria-label="New ServicenowAccount">
-  <form name="servicenowAccountForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.servicenowAccount.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="servicenowAccountForm['name'].$error"
-          ng-show="servicenowAccountForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.USERNAME">Username</label>
-        <input
-          type="text"
-          name="username"
-          ng-model="vm.servicenowAccount.username"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="servicenowAccountForm['username'].$error"
-          ng-show="servicenowAccountForm['username'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
-              >Username field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.PASSWORD">Password</label>
-        <input
-          type="password"
-          name="password"
-          ng-model="vm.servicenowAccount.password"
-          placeholder="Password"
-          translate
-          translate-attr-placeholder="INTEGRATIONS.PASSWORD"
-          required
-        />
-        <div
-          ng-messages="servicenowAccountForm['password'].$error"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.PASSWORD_REQUIRED"
-              >Password field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span translate="INTEGRATIONS.ERRORS.SECURE_PASSWORD_PATTERN"
-              >Must contain at least 8 characters, with a minimum of 1 lowercase
-              letter, 1 uppercase letter, 1 numeric character and 1 special
-              character ~!?*@#$%^&-_=+[{]}.</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.EMAIL">Email</label>
-        <input
-          type="email"
-          name="email"
-          ng-model="vm.servicenowAccount.email"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="servicenowAccountForm['email'].$error"
-          ng-show="servicenowAccountForm['email'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.EMAIL_REQUIRED"
-              >Email field is required</span
-            >
-          </div>
-          <div ng-message="email">
-            <span translate="INTEGRATIONS.ERRORS.EMAIL_MUST_VALID"
-              >Email must be a valid e-mail address</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.HOST">Host</label>
-        <input
-          type="url"
-          name="remoteUri"
-          ng-model="vm.servicenowAccount.remoteUri"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="servicenowAccountForm['remoteUri'].$error"
-          ng-show="servicenowAccountForm['remoteUri'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.HOST_REQUIRED"
-              >Host field is required</span
-            >
-          </div>
-          <div ng-message="url">
-            <span translate="INTEGRATIONS.ERRORS.HOST_MUST_VALID_URL"
-              >Host must be a valid url http://www.xcally.com</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
-          >MotionProxyAddress</label
-        >
-        <input
-          type="url"
-          name="serverUrl"
-          ng-model="vm.servicenowAccount.serverUrl"
-        />
-
-        <div class="hint">
-          <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
-        </div>
-        <div
-          ng-messages="servicenowAccountForm['serverUrl'].$error"
-          ng-show="servicenowAccountForm['serverUrl'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
-              >MotionProxyAddress field is required</span
-            >
-          </div>
-          <div ng-message="url">
-            <span
-              translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
-              >MotionProxyAddress must be a valid url
-              http://www.xcally.com</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.servicenowAccount.description"
-        />
-
-        <div
-          ng-messages="servicenowAccountForm['description'].$error"
-          ng-show="servicenowAccountForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newServicenowAccount"
-          ng-click="vm.saveServicenowAccount()"
-          class="send-button md-accent md-raised"
-          ng-disabled="servicenowAccountForm.$invalid || servicenowAccountForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newServicenowAccount"
-          ng-click="vm.addNewServicenowAccount()"
-          class="send-button md-accent md-raised"
-          ng-disabled="servicenowAccountForm.$invalid"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD_SERVICENOWACCOUNT"
-          translate-attr-aria-label="INTEGRATIONS.ADD_SERVICENOWACCOUNT"
-        >
-          ADD SERVICENOWACCOUNT
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newServicenowAccount"
-          ng-click="vm.deleteServicenowAccount($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/create/dialog.html/dialog.html
new file mode 100644
index 0000000..69ed457
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/create/dialog.html/dialog.html
@@ -0,0 +1,289 @@
+<md-dialog class="servicenowAccount-dialog" aria-label="New ServicenowAccount">
+  <form name="servicenowAccountForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.servicenowAccount.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="servicenowAccountForm['name'].$error"
+          ng-show="servicenowAccountForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.USERNAME">Username</label>
+        <input
+          type="text"
+          name="username"
+          ng-model="vm.servicenowAccount.username"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="servicenowAccountForm['username'].$error"
+          ng-show="servicenowAccountForm['username'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
+              >Username field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.PASSWORD">Password</label>
+        <input
+          type="password"
+          name="password"
+          ng-model="vm.servicenowAccount.password"
+          placeholder="Password"
+          translate
+          translate-attr-placeholder="INTEGRATIONS.PASSWORD"
+          required
+        />
+        <div
+          ng-messages="servicenowAccountForm['password'].$error"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.PASSWORD_REQUIRED"
+              >Password field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span translate="INTEGRATIONS.ERRORS.SECURE_PASSWORD_PATTERN"
+              >Must contain at least 8 characters, with a minimum of 1 lowercase
+              letter, 1 uppercase letter, 1 numeric character and 1 special
+              character ~!?*@#$%^&-_=+[{]}.</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.EMAIL">Email</label>
+        <input
+          type="email"
+          name="email"
+          ng-model="vm.servicenowAccount.email"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="servicenowAccountForm['email'].$error"
+          ng-show="servicenowAccountForm['email'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.EMAIL_REQUIRED"
+              >Email field is required</span
+            >
+          </div>
+          <div ng-message="email">
+            <span translate="INTEGRATIONS.ERRORS.EMAIL_MUST_VALID"
+              >Email must be a valid e-mail address</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.HOST">Host</label>
+        <input
+          type="url"
+          name="remoteUri"
+          ng-model="vm.servicenowAccount.remoteUri"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="servicenowAccountForm['remoteUri'].$error"
+          ng-show="servicenowAccountForm['remoteUri'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.HOST_REQUIRED"
+              >Host field is required</span
+            >
+          </div>
+          <div ng-message="url">
+            <span translate="INTEGRATIONS.ERRORS.HOST_MUST_VALID_URL"
+              >Host must be a valid url http://www.xcally.com</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
+          >MotionProxyAddress</label
+        >
+        <input
+          type="url"
+          name="serverUrl"
+          ng-model="vm.servicenowAccount.serverUrl"
+        />
+
+        <div class="hint">
+          <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
+        </div>
+        <div
+          ng-messages="servicenowAccountForm['serverUrl'].$error"
+          ng-show="servicenowAccountForm['serverUrl'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
+              >MotionProxyAddress field is required</span
+            >
+          </div>
+          <div ng-message="url">
+            <span
+              translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
+              >MotionProxyAddress must be a valid url
+              http://www.xcally.com</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.servicenowAccount.description"
+        />
+
+        <div
+          ng-messages="servicenowAccountForm['description'].$error"
+          ng-show="servicenowAccountForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newServicenowAccount"
+          ng-click="vm.saveServicenowAccount()"
+          class="send-button md-accent md-raised"
+          ng-disabled="servicenowAccountForm.$invalid || servicenowAccountForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newServicenowAccount"
+          ng-click="vm.addNewServicenowAccount()"
+          class="send-button md-accent md-raised"
+          ng-disabled="servicenowAccountForm.$invalid"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD_SERVICENOWACCOUNT"
+          translate-attr-aria-label="INTEGRATIONS.ADD_SERVICENOWACCOUNT"
+        >
+          ADD SERVICENOWACCOUNT
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newServicenowAccount"
+          ng-click="vm.deleteServicenowAccount($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 8ddffbf..0000000
--- a/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,187 +0,0 @@
-<md-dialog
-  class="servicenowConfiguration-dialog"
-  aria-label="New ServicenowConfiguration"
->
-  <form name="servicenowConfigurationForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.NAME">Name</label>
-        <input
-          type=""
-          name="name"
-          ng-model="vm.servicenowConfiguration.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="servicenowConfigurationForm['name'].$error"
-          ng-show="servicenowConfigurationForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.CHANNEL">Channel</label>
-        <md-select
-          name="channel"
-          ng-model="vm.servicenowConfiguration.channel"
-          required
-        >
-          <md-option ng-value="'voice'">
-            {{ 'INTEGRATIONS.VOICE' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="servicenowConfigurationForm['channel'].$error"
-          ng-show="servicenowConfigurationForm['channel'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.CHANNEL_REQUIRED"
-              >Channel field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.TYPE">Type</label>
-        <md-select
-          name="type"
-          ng-model="vm.servicenowConfiguration.type"
-          required
-        >
-          <md-option ng-value="'inbound'">
-            {{ 'INTEGRATIONS.INBOUND_IN_QUEUE' | translate }}
-          </md-option>
-
-          <md-option ng-value="'outbound'">
-            {{ 'INTEGRATIONS.OUTBOUND_CALL' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="servicenowConfigurationForm['type'].$error"
-          ng-show="servicenowConfigurationForm['type'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-              >Type field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newServicenowConfiguration"
-          ng-click="vm.saveServicenowConfiguration()"
-          class="send-button md-accent md-raised"
-          ng-disabled="servicenowConfigurationForm.$invalid || servicenowConfigurationForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newServicenowConfiguration"
-          ng-click="vm.addNewServicenowConfiguration()"
-          class="send-button md-accent md-raised"
-          ng-disabled="servicenowConfigurationForm.$invalid"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD_SERVICENOWCONFIGURATION"
-          translate-attr-aria-label="INTEGRATIONS.ADD_SERVICENOWCONFIGURATION"
-        >
-          ADD SERVICENOWCONFIGURATION
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newServicenowConfiguration"
-          ng-click="vm.deleteServicenowConfiguration($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/edit/configurations/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/edit/configurations/dialog.html/dialog.html
new file mode 100644
index 0000000..8ddffbf
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/edit/configurations/dialog.html/dialog.html
@@ -0,0 +1,187 @@
+<md-dialog
+  class="servicenowConfiguration-dialog"
+  aria-label="New ServicenowConfiguration"
+>
+  <form name="servicenowConfigurationForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.NAME">Name</label>
+        <input
+          type=""
+          name="name"
+          ng-model="vm.servicenowConfiguration.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="servicenowConfigurationForm['name'].$error"
+          ng-show="servicenowConfigurationForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.CHANNEL">Channel</label>
+        <md-select
+          name="channel"
+          ng-model="vm.servicenowConfiguration.channel"
+          required
+        >
+          <md-option ng-value="'voice'">
+            {{ 'INTEGRATIONS.VOICE' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="servicenowConfigurationForm['channel'].$error"
+          ng-show="servicenowConfigurationForm['channel'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.CHANNEL_REQUIRED"
+              >Channel field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.TYPE">Type</label>
+        <md-select
+          name="type"
+          ng-model="vm.servicenowConfiguration.type"
+          required
+        >
+          <md-option ng-value="'inbound'">
+            {{ 'INTEGRATIONS.INBOUND_IN_QUEUE' | translate }}
+          </md-option>
+
+          <md-option ng-value="'outbound'">
+            {{ 'INTEGRATIONS.OUTBOUND_CALL' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="servicenowConfigurationForm['type'].$error"
+          ng-show="servicenowConfigurationForm['type'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+              >Type field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newServicenowConfiguration"
+          ng-click="vm.saveServicenowConfiguration()"
+          class="send-button md-accent md-raised"
+          ng-disabled="servicenowConfigurationForm.$invalid || servicenowConfigurationForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newServicenowConfiguration"
+          ng-click="vm.addNewServicenowConfiguration()"
+          class="send-button md-accent md-raised"
+          ng-disabled="servicenowConfigurationForm.$invalid"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD_SERVICENOWCONFIGURATION"
+          translate-attr-aria-label="INTEGRATIONS.ADD_SERVICENOWCONFIGURATION"
+        >
+          ADD SERVICENOWCONFIGURATION
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newServicenowConfiguration"
+          ng-click="vm.deleteServicenowConfiguration($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/edit/item/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/edit/item/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index b138688..0000000
--- a/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/edit/item/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,478 +0,0 @@
-<md-dialog class="servicenowAccount-item-dialog" aria-label="New Item">
-  <form name="servicenowAccountItemForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <div ng-switch="vm.type">
-        <div ng-switch-when="subject">
-          <!-- SUBJECT SECTION -->
-          <div ng-include="'/subject.html'"></div>
-          <!-- / SUBJECT SECTION -->
-        </div>
-        <div ng-switch-when="description">
-          <!-- DESCRIPTION SECTION -->
-          <md-input-container class="md-block">
-            <label translate="INTEGRATIONS.TYPE">Type</label>
-            <md-select name="type" ng-model="vm.item.type" required>
-              <md-option value="string">String</md-option>
-              <md-option value="keyValue">Key Value</md-option>
-            </md-select>
-            <div
-              ng-messages="servicenowAccountItemForm.type.$error"
-              ng-show="servicenowAccountItemForm.type.$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-                  >Type field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
-            <label translate="INTEGRATIONS.CONTENT">Content</label>
-            <input
-              type="text"
-              name="content"
-              ng-model="vm.item.content"
-              required
-              md-autofocus
-            />
-            <div
-              ng-messages="servicenowAccountItemForm.content.$error"
-              ng-show="servicenowAccountItemForm.content.$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
-                  >Content field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <div ng-if="vm.item.type == 'keyValue'">
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.KEY">Key</label>
-              <input
-                type="text"
-                name="key"
-                ng-model="vm.item.key"
-                required
-                md-autofocus
-              />
-              <div
-                ng-messages="servicenowAccountItemForm.key.$error"
-                ng-show="servicenowAccountItemForm.key.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.KEY_REQUIRED"
-                    >Key field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.TYPE">Type</label>
-              <md-select name="keyType" ng-model="vm.item.keyType" required>
-                <md-option value="string">String</md-option>
-                <md-option value="variable">Variable</md-option>
-                <md-option value="customVariable">Custom Variable</md-option>
-              </md-select>
-              <div
-                ng-messages="servicenowAccountItemForm.keyType.$error"
-                ng-show="servicenowAccountItemForm.keyType.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-                    >Type field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'string'"
-            >
-              <label translate="INTEGRATIONS.CONTENT">Content</label>
-              <input
-                type="text"
-                name="keyContent"
-                ng-model="vm.item.keyContent"
-                required
-                md-autofocus
-              />
-              <div
-                ng-messages="servicenowAccountItemForm.keyContent.$error"
-                ng-show="servicenowAccountItemForm.keyContent.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
-                    >Content field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'variable'"
-            >
-              <label translate="INTEGRATIONS.VALUE">Value</label>
-              <md-select
-                name="variableName"
-                ng-model="vm.item.variableName"
-                md-selected-text="vm.getSelectedVariable()"
-                required
-              >
-                <md-optgroup label="Voice: Queue">
-                  <md-option
-                    ng-value="agentColumn"
-                    ng-repeat="agentColumn in vm.voiceAgentReportColumns"
-                    >{{agentColumn}}
-                  </md-option>
-                </md-optgroup>
-                <md-optgroup label="Voice: Outbound">
-                  <md-option
-                    ng-value="dialColumn"
-                    ng-repeat="dialColumn in vm.voiceDialReportColumns"
-                    >{{dialColumn}}</md-option
-                  >
-                </md-optgroup>
-              </md-select>
-              <div
-                ng-messages="servicenowAccountItemForm.variableName.$error"
-                ng-show="servicenowAccountItemForm.variableName.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED"
-                    >Variable name field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'customVariable'"
-            >
-              <label translate="INTEGRATIONS.VALUE">Value</label>
-              <md-select ng-model="vm.item.VariableId" required>
-                <md-option
-                  ng-value="variable.id"
-                  ng-repeat="variable in vm.variables"
-                  >{{variable.name}}
-                </md-option>
-              </md-select>
-            </md-input-container>
-          </div>
-          <!-- / DESCRIPTION SECTION -->
-        </div>
-        <div ng-switch-when="field">
-          <!-- FIELD SECTION -->
-          <div ng-if="vm.accountConnected">
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.FIELD">FIELD</label>
-              <!-- ITEM TYPE DEFAULT VALUE is STRING -->
-              <md-select
-                name="customField"
-                ng-model="vm.customField"
-                required
-                ng-change="vm.item.type = 'string'"
-              >
-                <md-optgroup label="Standard">
-                  <md-option
-                    ng-value="standard"
-                    ng-repeat="standard in vm.fields | filter: {custom: false} "
-                    >{{standard.name}}
-                  </md-option>
-                </md-optgroup>
-
-                <md-optgroup label="Custom">
-                  <md-option
-                    ng-value="custom"
-                    ng-repeat="custom in vm.fields | filter: {custom: true} "
-                    >{{custom.name}}
-                  </md-option>
-                </md-optgroup>
-              </md-select>
-              <div
-                ng-messages="servicenowAccountItemForm.customField.$error"
-                ng-show="servicenowAccountItemForm.customField.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.FIELD_REQUIRED"
-                    >Field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <!-- FIELDS -->
-            <div ng-if="vm.customField" ng-include="'/fields.html'"></div>
-            <!-- FIELDS -->
-          </div>
-          <div ng-if="!vm.accountConnected">
-            <p>Account is not connected. Please check your configurations!</p>
-          </div>
-          <!-- / FIELD SECTION -->
-        </div>
-        <div ng-switch-default>
-          <p>No Item</p>
-        </div>
-      </div>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newItem"
-          ng-click="vm.saveItem()"
-          class="send-button md-accent md-raised"
-          ng-disabled="servicenowAccountItemForm.$invalid || servicenowAccountItemForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newItem"
-          ng-click="vm.addNewItem()"
-          class="send-button md-accent md-raised"
-          ng-disabled="servicenowAccountItemForm.$invalid || servicenowAccountItemForm.$pristine"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD"
-          translate-attr-aria-label="INTEGRATIONS.ADD"
-        >
-          ADD
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newItem"
-          ng-click="vm.deleteItem($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
-
-<script type="text/ng-template" id="/fields.html">
-
-  <!-- type -->
-  <md-input-container class="md-block" ng-if="!vm.customField.options.length">
-
-      <label translate="INTEGRATIONS.TYPE">Type</label>
-      <md-select name="type" ng-model="vm.item.type" required>
-
-          <md-option value="string">String</md-option>
-          <md-option value="variable">Variable</md-option>
-          <md-option value="customVariable">Custom Variable</md-option>
-      </md-select>
-      <div ng-messages="servicenowAccountItemForm.type.$error" ng-show="servicenowAccountItemForm.type.$touched"
-          role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <!--/ type -->
-
-  <!-- value -->
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && vm.customField.options.length">
-      <!-- options -->
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-
-      <md-select name="option" ng-model="vm.item.content" required>
-          <md-option ng-value="option.value" ng-repeat="option in vm.customField.options">{{option.name}}</md-option>
-      </md-select>
-
-      <div ng-messages="servicenowAccountItemForm.option.$error"
-          ng-show="servicenowAccountItemForm.option.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VALUE_REQUIRED">Value field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && !vm.customField.options.length">
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-
-      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
-
-      <div ng-messages="servicenowAccountItemForm.content.$error"
-          ng-show="servicenowAccountItemForm.content.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
-          required>
-          <md-optgroup label="Voice: Queue">
-              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
-              </md-option>
-          </md-optgroup>
-          <md-optgroup label="Voice: Outbound">
-              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
-              </md-option>
-          </md-optgroup>
-      </md-select>
-      <div ng-messages="servicenowAccountItemForm.variableName.$error"
-          ng-show="servicenowAccountItemForm.variableName.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select ng-model="vm.item.VariableId" required>
-          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
-      </md-select>
-  </md-input-container>
-
-  <!--/ value -->
-</script>
-
-<script type="text/ng-template" id="/subject.html">
-    <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.TYPE">Type</label>
-            <md-select name="type" ng-model="vm.item.type" required>
-                <md-option value="string">String</md-option>
-                <md-option value="variable">Variable</md-option>
-                <md-option value="customVariable">Custom Variable</md-option>
-            </md-select>
-        <div ng-messages="servicenowAccountItemForm.type.$error" ng-show="servicenowAccountItemForm.type.$touched" role="alert">
-            <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
-             </div>
-        </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
-      <div ng-messages="servicenowAccountItemForm.content.$error"
-          ng-show="servicenowAccountItemForm.content.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
-          required>
-          <md-optgroup label="Voice: Queue">
-              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
-              </md-option>
-          </md-optgroup>
-          <md-optgroup label="Voice: Outbound">
-              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
-              </md-option>
-          </md-optgroup>
-      </md-select>
-      <div ng-messages="servicenowAccountItemForm.variableName.$error"
-          ng-show="servicenowAccountItemForm.variableName.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select ng-model="vm.item.VariableId" required>
-          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
-      </md-select>
-  </md-input-container>
-</script>
diff --git a/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/edit/item/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/edit/item/dialog.html/dialog.html
new file mode 100644
index 0000000..b138688
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/edit/item/dialog.html/dialog.html
@@ -0,0 +1,478 @@
+<md-dialog class="servicenowAccount-item-dialog" aria-label="New Item">
+  <form name="servicenowAccountItemForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <div ng-switch="vm.type">
+        <div ng-switch-when="subject">
+          <!-- SUBJECT SECTION -->
+          <div ng-include="'/subject.html'"></div>
+          <!-- / SUBJECT SECTION -->
+        </div>
+        <div ng-switch-when="description">
+          <!-- DESCRIPTION SECTION -->
+          <md-input-container class="md-block">
+            <label translate="INTEGRATIONS.TYPE">Type</label>
+            <md-select name="type" ng-model="vm.item.type" required>
+              <md-option value="string">String</md-option>
+              <md-option value="keyValue">Key Value</md-option>
+            </md-select>
+            <div
+              ng-messages="servicenowAccountItemForm.type.$error"
+              ng-show="servicenowAccountItemForm.type.$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+                  >Type field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
+            <label translate="INTEGRATIONS.CONTENT">Content</label>
+            <input
+              type="text"
+              name="content"
+              ng-model="vm.item.content"
+              required
+              md-autofocus
+            />
+            <div
+              ng-messages="servicenowAccountItemForm.content.$error"
+              ng-show="servicenowAccountItemForm.content.$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
+                  >Content field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <div ng-if="vm.item.type == 'keyValue'">
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.KEY">Key</label>
+              <input
+                type="text"
+                name="key"
+                ng-model="vm.item.key"
+                required
+                md-autofocus
+              />
+              <div
+                ng-messages="servicenowAccountItemForm.key.$error"
+                ng-show="servicenowAccountItemForm.key.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.KEY_REQUIRED"
+                    >Key field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.TYPE">Type</label>
+              <md-select name="keyType" ng-model="vm.item.keyType" required>
+                <md-option value="string">String</md-option>
+                <md-option value="variable">Variable</md-option>
+                <md-option value="customVariable">Custom Variable</md-option>
+              </md-select>
+              <div
+                ng-messages="servicenowAccountItemForm.keyType.$error"
+                ng-show="servicenowAccountItemForm.keyType.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+                    >Type field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'string'"
+            >
+              <label translate="INTEGRATIONS.CONTENT">Content</label>
+              <input
+                type="text"
+                name="keyContent"
+                ng-model="vm.item.keyContent"
+                required
+                md-autofocus
+              />
+              <div
+                ng-messages="servicenowAccountItemForm.keyContent.$error"
+                ng-show="servicenowAccountItemForm.keyContent.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
+                    >Content field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'variable'"
+            >
+              <label translate="INTEGRATIONS.VALUE">Value</label>
+              <md-select
+                name="variableName"
+                ng-model="vm.item.variableName"
+                md-selected-text="vm.getSelectedVariable()"
+                required
+              >
+                <md-optgroup label="Voice: Queue">
+                  <md-option
+                    ng-value="agentColumn"
+                    ng-repeat="agentColumn in vm.voiceAgentReportColumns"
+                    >{{agentColumn}}
+                  </md-option>
+                </md-optgroup>
+                <md-optgroup label="Voice: Outbound">
+                  <md-option
+                    ng-value="dialColumn"
+                    ng-repeat="dialColumn in vm.voiceDialReportColumns"
+                    >{{dialColumn}}</md-option
+                  >
+                </md-optgroup>
+              </md-select>
+              <div
+                ng-messages="servicenowAccountItemForm.variableName.$error"
+                ng-show="servicenowAccountItemForm.variableName.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED"
+                    >Variable name field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'customVariable'"
+            >
+              <label translate="INTEGRATIONS.VALUE">Value</label>
+              <md-select ng-model="vm.item.VariableId" required>
+                <md-option
+                  ng-value="variable.id"
+                  ng-repeat="variable in vm.variables"
+                  >{{variable.name}}
+                </md-option>
+              </md-select>
+            </md-input-container>
+          </div>
+          <!-- / DESCRIPTION SECTION -->
+        </div>
+        <div ng-switch-when="field">
+          <!-- FIELD SECTION -->
+          <div ng-if="vm.accountConnected">
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.FIELD">FIELD</label>
+              <!-- ITEM TYPE DEFAULT VALUE is STRING -->
+              <md-select
+                name="customField"
+                ng-model="vm.customField"
+                required
+                ng-change="vm.item.type = 'string'"
+              >
+                <md-optgroup label="Standard">
+                  <md-option
+                    ng-value="standard"
+                    ng-repeat="standard in vm.fields | filter: {custom: false} "
+                    >{{standard.name}}
+                  </md-option>
+                </md-optgroup>
+
+                <md-optgroup label="Custom">
+                  <md-option
+                    ng-value="custom"
+                    ng-repeat="custom in vm.fields | filter: {custom: true} "
+                    >{{custom.name}}
+                  </md-option>
+                </md-optgroup>
+              </md-select>
+              <div
+                ng-messages="servicenowAccountItemForm.customField.$error"
+                ng-show="servicenowAccountItemForm.customField.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.FIELD_REQUIRED"
+                    >Field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <!-- FIELDS -->
+            <div ng-if="vm.customField" ng-include="'/fields.html'"></div>
+            <!-- FIELDS -->
+          </div>
+          <div ng-if="!vm.accountConnected">
+            <p>Account is not connected. Please check your configurations!</p>
+          </div>
+          <!-- / FIELD SECTION -->
+        </div>
+        <div ng-switch-default>
+          <p>No Item</p>
+        </div>
+      </div>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newItem"
+          ng-click="vm.saveItem()"
+          class="send-button md-accent md-raised"
+          ng-disabled="servicenowAccountItemForm.$invalid || servicenowAccountItemForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newItem"
+          ng-click="vm.addNewItem()"
+          class="send-button md-accent md-raised"
+          ng-disabled="servicenowAccountItemForm.$invalid || servicenowAccountItemForm.$pristine"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD"
+          translate-attr-aria-label="INTEGRATIONS.ADD"
+        >
+          ADD
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newItem"
+          ng-click="vm.deleteItem($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
+
+<script type="text/ng-template" id="/fields.html">
+
+  <!-- type -->
+  <md-input-container class="md-block" ng-if="!vm.customField.options.length">
+
+      <label translate="INTEGRATIONS.TYPE">Type</label>
+      <md-select name="type" ng-model="vm.item.type" required>
+
+          <md-option value="string">String</md-option>
+          <md-option value="variable">Variable</md-option>
+          <md-option value="customVariable">Custom Variable</md-option>
+      </md-select>
+      <div ng-messages="servicenowAccountItemForm.type.$error" ng-show="servicenowAccountItemForm.type.$touched"
+          role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <!--/ type -->
+
+  <!-- value -->
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && vm.customField.options.length">
+      <!-- options -->
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+
+      <md-select name="option" ng-model="vm.item.content" required>
+          <md-option ng-value="option.value" ng-repeat="option in vm.customField.options">{{option.name}}</md-option>
+      </md-select>
+
+      <div ng-messages="servicenowAccountItemForm.option.$error"
+          ng-show="servicenowAccountItemForm.option.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VALUE_REQUIRED">Value field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && !vm.customField.options.length">
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+
+      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
+
+      <div ng-messages="servicenowAccountItemForm.content.$error"
+          ng-show="servicenowAccountItemForm.content.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
+          required>
+          <md-optgroup label="Voice: Queue">
+              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
+              </md-option>
+          </md-optgroup>
+          <md-optgroup label="Voice: Outbound">
+              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
+              </md-option>
+          </md-optgroup>
+      </md-select>
+      <div ng-messages="servicenowAccountItemForm.variableName.$error"
+          ng-show="servicenowAccountItemForm.variableName.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select ng-model="vm.item.VariableId" required>
+          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
+      </md-select>
+  </md-input-container>
+
+  <!--/ value -->
+</script>
+
+<script type="text/ng-template" id="/subject.html">
+    <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.TYPE">Type</label>
+            <md-select name="type" ng-model="vm.item.type" required>
+                <md-option value="string">String</md-option>
+                <md-option value="variable">Variable</md-option>
+                <md-option value="customVariable">Custom Variable</md-option>
+            </md-select>
+        <div ng-messages="servicenowAccountItemForm.type.$error" ng-show="servicenowAccountItemForm.type.$touched" role="alert">
+            <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
+             </div>
+        </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
+      <div ng-messages="servicenowAccountItemForm.content.$error"
+          ng-show="servicenowAccountItemForm.content.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
+          required>
+          <md-optgroup label="Voice: Queue">
+              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
+              </md-option>
+          </md-optgroup>
+          <md-optgroup label="Voice: Outbound">
+              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
+              </md-option>
+          </md-optgroup>
+      </md-select>
+      <div ng-messages="servicenowAccountItemForm.variableName.$error"
+          ng-show="servicenowAccountItemForm.variableName.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select ng-model="vm.item.VariableId" required>
+          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
+      </md-select>
+  </md-input-container>
+</script>
diff --git a/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index 9eababd..0000000
--- a/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,762 +0,0 @@
-<div
-  id="integrations-servicenowAccount"
-  class="page-layout simple tabbed"
-  layout="column"
->
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-servicenowAccounts-button md-icon-button"
-        aria-label="Go to servicenowAccounts"
-        ng-click="vm.gotoServicenowAccounts()"
-        translate
-        translate-attr-aria-label="INTEGRATIONS.GO_TO_SERVICENOWACCOUNTS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="servicenowAccount-image" hide-xs>
-          <img ng-src="assets/images/business/servicenowAccounts.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.servicenowAccount.id}}
-            <span ng-if="vm.servicenowAccount.name"
-              >{{vm.servicenowAccount.name}}</span
-            >
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="INTEGRATIONS.CREATED_AT"></span>
-            <span>{{vm.servicenowAccount.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveServicenowAccount()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (configurationsForm.$invalid)"
-        translate="INTEGRATIONS.SAVE"
-        translate-attr-aria-label="INTEGRATIONS.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="INTEGRATIONS.ACCOUNT">ACCOUNT</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="servicenowAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="INTEGRATIONS.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.servicenowAccount.name"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.USERNAME">Username</label>
-                <input
-                  type="text"
-                  name="username"
-                  ng-model="vm.servicenowAccount.username"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['username'].$error"
-                  ng-show="generalForm['username'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
-                      >Username field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.PASSWORD">Password</label>
-                <input
-                  type="password"
-                  name="password"
-                  ng-model="vm.servicenowAccount.password"
-                  placeholder="Password"
-                  translate
-                  translate-attr-placeholder="INTEGRATIONS.PASSWORD"
-                  required
-                />
-                <div ng-messages="generalForm['password'].$error" role="alert">
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.PASSWORD_REQUIRED"
-                      >Password field is required</span
-                    >
-                  </div>
-                  <div ng-message="pattern">
-                    <span
-                      translate="INTEGRATIONS.ERRORS.SECURE_PASSWORD_PATTERN"
-                      >Must contain at least 8 characters, with a minimum of 1
-                      lowercase letter, 1 uppercase letter, 1 numeric character
-                      and 1 special character ~!?*@#$%^&-_=+[{]}.</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.EMAIL">Email</label>
-                <input
-                  type="email"
-                  name="email"
-                  ng-model="vm.servicenowAccount.email"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['email'].$error"
-                  ng-show="generalForm['email'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.EMAIL_REQUIRED"
-                      >Email field is required</span
-                    >
-                  </div>
-                  <div ng-message="email">
-                    <span translate="INTEGRATIONS.ERRORS.EMAIL_MUST_VALID"
-                      >Email must be a valid e-mail address</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.HOST">Host</label>
-                <input
-                  type="url"
-                  name="remoteUri"
-                  ng-model="vm.servicenowAccount.remoteUri"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['remoteUri'].$error"
-                  ng-show="generalForm['remoteUri'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.HOST_REQUIRED"
-                      >Host field is required</span
-                    >
-                  </div>
-                  <div ng-message="url">
-                    <span translate="INTEGRATIONS.ERRORS.HOST_MUST_VALID_URL"
-                      >Host must be a valid url http://www.xcally.com</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
-                  >MotionProxyAddress</label
-                >
-                <input
-                  type="url"
-                  name="serverUrl"
-                  ng-model="vm.servicenowAccount.serverUrl"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['serverUrl'].$error"
-                  ng-show="generalForm['serverUrl'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
-                      >MotionProxyAddress field is required</span
-                    >
-                  </div>
-                  <div ng-message="url">
-                    <span
-                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
-                      >MotionProxyAddress must be a valid url
-                      http://www.xcally.com</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.servicenowAccount.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="INTEGRATIONS.CONFIGURATIONS">CONFIGURATIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="servicenowAccount-detail-form-container configurations md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div
-                class="h2 secondary-text"
-                translate="INTEGRATIONS.CONFIGURATIONS"
-              >
-                CONFIGURATIONS
-              </div>
-            </div>
-            <div
-              ng-controller="ServicenowAccountConfigurationsController as vm_cc"
-              ng-init="vm_cc.init(vm.servicenowAccount, vm.crudPermissions)"
-              layout="row"
-            >
-              <md-card class="md-whiteframe-1dp" flex="30">
-                <div layout="row" layout-align="center center">
-                  <md-subheader flex="75" class="md-no-sticky"
-                    >{{ 'INTEGRATIONS.CONFIGURATIONS' | translate
-                    }}</md-subheader
-                  >
-                  <md-button
-                    flex="25"
-                    ng-if="vm_cc.crudPermissions.canEdit"
-                    ng-click="vm_cc.createOrEditServicenowConfiguration($event)"
-                    class="md-icon-button"
-                    aria-label="create servicenowConfiguration"
-                  >
-                    <md-icon md-font-icon="icon-plus"></md-icon>
-                  </md-button>
-                </div>
-                <md-list>
-                  <md-list-item
-                    layout="row"
-                    layout-align="center center"
-                    ng-repeat="servicenowConfiguration in vm_cc.configurations"
-                    class="border-top"
-                    md-colors="{background: (vm_cc.selectedServicenowConfiguration == $index ? 'accent' : 'grey-A100')}"
-                    ng-click="vm_cc.getServicenowConfiguration($index)"
-                  >
-                    <span class="text-truncate" flex="80"
-                      >{{ servicenowConfiguration.name }}</span
-                    >
-                    <md-menu ng-if="vm_cc.crudPermissions.canDelete">
-                      <md-button
-                        class="md-icon-button"
-                        aria-label="More"
-                        translate
-                        translate-attr-aria-label="INTEGRATIONS.MORE"
-                        ng-click="$mdOpenMenu($event)"
-                      >
-                        <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                      </md-button>
-                      <md-menu-content width="3">
-                        <md-menu-item ng-if="vm_cc.crudPermissions.canDelete">
-                          <md-button
-                            ng-click="vm_cc.deleteServicenowConfiguration($event, servicenowConfiguration)"
-                            translate="INTEGRATIONS.DELETE_SERVICENOWCONFIGURATION"
-                          >
-                            Delete ServicenowConfiguration
-                          </md-button>
-                        </md-menu-item>
-                      </md-menu-content>
-                    </md-menu>
-                  </md-list-item>
-                </md-list>
-              </md-card>
-              <div flex></div>
-              <md-card class="md-whiteframe-1dp" flex="65">
-                <md-tabs ng-if="vm_cc.configurations.length" md-dynamic-height>
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.SUBJECTS">SUBJECTS</span>
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-toolbar
-                        class="md-table-toolbar md-default no-padding"
-                        ng-hide="vm_cc.selectedSubjects.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <div flex></div>
-                          <ms-search-bar
-                            on-search="vm_cc.query.subject = query"
-                            on-collapse="vm_cc.query.subject = undefined"
-                            debounce="300"
-                          ></ms-search-bar>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canEdit"
-                            class="md-icon-button"
-                            ng-click="vm_cc.createOrEditSubject($event)"
-                            aria-label="add subject"
-                            translate
-                            translate-attr-label="INTEGRATIONS.ADD_SUBJECT"
-                          >
-                            <md-icon md-font-icon="icon-plus"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-toolbar
-                        class="md-table-toolbar md-accent"
-                        ng-show="vm_cc.selectedSubjects.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <span class="md-subhead"
-                            >{{vm_cc.selectedSubjects.length}}
-                            {{vm_cc.selectedSubjects.length > 1 ? 'items' :
-                            'item'}} selected</span
-                          >
-                          <div flex></div>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canDelete"
-                            class="md-icon-button"
-                            ng-click="vm_cc.deleteSelectedSubjects($event)"
-                            aria-label="delete selected"
-                            translate
-                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-                          >
-                            <md-icon md-font-icon="icon-delete"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-table-container
-                        class="md-whiteframe-1dp padding-horizontal"
-                      >
-                        <table
-                          md-table
-                          md-row-select
-                          multiple
-                          ng-model="vm_cc.selectedSubjects"
-                        >
-                          <thead md-head>
-                            <tr md-row>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.ID' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.TYPE' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.CONTENT' | translate }}
-                              </th>
-                              <th md-column width="10px"></th>
-                            </tr>
-                          </thead>
-                          <tbody md-body>
-                            <tr
-                              md-row
-                              md-select="subject"
-                              md-select-id="id"
-                              ng-repeat="subject in vm_cc.subjects | filter: vm_cc.query.subject"
-                            >
-                              <td
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                                class="id"
-                              >
-                                {{subject.id}}
-                              </td>
-                              <td
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                                class="type"
-                              >
-                                <span ng-if="subject.FieldId"
-                                  >{{subject.nameField ||
-                                  subject.idField}}</span
-                                >
-                                <span ng-if="!subject.FieldId"
-                                  >{{subject.type}}</span
-                                >
-                              </td>
-                              <td
-                                ng-switch="subject.type"
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                              >
-                                <span ng-switch-when="string"
-                                  >{{subject.content}}</span
-                                >
-                                <span
-                                  ng-switch-when="variable"
-                                  class="text-boxed"
-                                  >{{subject.variableName}}</span
-                                >
-                                <span
-                                  ng-switch-when="customVariable"
-                                  class="text-boxed"
-                                  >{{
-                                  vm_cc.variablesById[subject.VariableId].name
-                                  }}</span
-                                >
-                                <span ng-switch-when="keyValue">
-                                  {{subject.key}}
-                                  <span ng-switch="description.keyType">
-                                    <span ng-switch-when="string"
-                                      >{{subject.keyContent}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="variable"
-                                      class="text-boxed"
-                                      >{{subject.variableName}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="customVariable"
-                                      class="text-boxed"
-                                      >{{
-                                      vm_cc.variablesById[subject.VariableId].name
-                                      }}</span
-                                    >
-                                  </span>
-                                </span>
-                                <span ng-switch-default
-                                  >{{subject.content}}</span
-                                >
-                              </td>
-                              <td
-                                md-cell
-                                class="actions"
-                                ng-if="!vm_cc.crudPermissions.readOnly"
-                              >
-                                <md-menu>
-                                  <md-button
-                                    class="md-icon-button"
-                                    aria-label="More"
-                                    translate
-                                    translate-attr-aria-label="INTEGRATIONS.MORE"
-                                    ng-click="$mdOpenMenu($event)"
-                                  >
-                                    <md-icon
-                                      md-font-icon="icon-dots-vertical"
-                                    ></md-icon>
-                                  </md-button>
-
-                                  <md-menu-content width="3">
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canEdit"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                        translate="INTEGRATIONS.EDIT_SUBJECT"
-                                      >
-                                        Edit Subject
-                                      </md-button>
-                                    </md-menu-item>
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canDelete"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.deleteSubjectConfirm($event, subject)"
-                                        translate="INTEGRATIONS.DELETE_SUBJECT"
-                                      >
-                                        Delete Subject
-                                      </md-button>
-                                    </md-menu-item>
-                                  </md-menu-content>
-                                </md-menu>
-                              </td>
-                            </tr>
-                          </tbody>
-                        </table>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.DESCRIPTIONS"
-                        >DESCRIPTIONS</span
-                      >
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-toolbar
-                        class="md-table-toolbar md-default no-padding"
-                        ng-hide="vm_cc.selectedDescriptions.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <div flex></div>
-                          <ms-search-bar
-                            on-search="vm_cc.query.description = query"
-                            on-collapse="vm_cc.query.description = undefined"
-                            debounce="300"
-                          ></ms-search-bar>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canEdit"
-                            class="md-icon-button"
-                            ng-click="vm_cc.createOrEditDescription($event)"
-                            aria-label="add description"
-                            translate
-                            translate-attr-label="INTEGRATIONS.ADD_DESCRIPTION"
-                          >
-                            <md-icon md-font-icon="icon-plus"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-toolbar
-                        class="md-table-toolbar md-accent"
-                        ng-show="vm_cc.selectedDescriptions.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <span class="md-subhead"
-                            >{{vm_cc.selectedDescriptions.length}}
-                            {{vm_cc.selectedDescriptions.length > 1 ? 'items' :
-                            'item'}} selected</span
-                          >
-                          <div flex></div>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canDelete"
-                            class="md-icon-button"
-                            ng-click="vm_cc.deleteSelectedDescriptions($event)"
-                            aria-label="delete selected"
-                            translate
-                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-                          >
-                            <md-icon md-font-icon="icon-delete"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-table-container
-                        class="md-whiteframe-1dp padding-horizontal"
-                      >
-                        <table
-                          md-table
-                          md-row-select
-                          multiple
-                          ng-model="vm_cc.selectedDescriptions"
-                        >
-                          <thead md-head>
-                            <tr md-row>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.ID' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.TYPE' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.CONTENT' | translate }}
-                              </th>
-                              <th md-column width="10px"></th>
-                            </tr>
-                          </thead>
-                          <tbody md-body>
-                            <tr
-                              md-row
-                              md-select="description"
-                              md-select-id="id"
-                              ng-repeat="description in vm_cc.descriptions | filter: vm_cc.query.description"
-                            >
-                              <td
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                                class="id"
-                              >
-                                {{description.id}}
-                              </td>
-                              <td
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                                class="type"
-                              >
-                                <span ng-if="description.FieldId"
-                                  >{{description.nameField ||
-                                  description.idField}}</span
-                                >
-                                <span ng-if="!description.FieldId"
-                                  >{{description.type}}</span
-                                >
-                              </td>
-                              <td
-                                ng-switch="description.type"
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                              >
-                                <span ng-switch-when="string"
-                                  >{{description.content}}</span
-                                >
-                                <span
-                                  ng-switch-when="variable"
-                                  class="text-boxed"
-                                  >{{description.variableName}}</span
-                                >
-                                <span
-                                  ng-switch-when="customVariable"
-                                  class="text-boxed"
-                                  >{{
-                                  vm_cc.variablesById[description.VariableId].name
-                                  }}</span
-                                >
-                                <span ng-switch-when="keyValue">
-                                  {{description.key}}
-                                  <span ng-switch="description.keyType">
-                                    <span ng-switch-when="string"
-                                      >{{description.keyContent}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="variable"
-                                      class="text-boxed"
-                                      >{{description.variableName}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="customVariable"
-                                      class="text-boxed"
-                                      >{{
-                                      vm_cc.variablesById[description.VariableId].name
-                                      }}</span
-                                    >
-                                  </span>
-                                </span>
-                                <span ng-switch-default
-                                  >{{description.content}}</span
-                                >
-                              </td>
-                              <td
-                                md-cell
-                                class="actions"
-                                ng-if="!vm_cc.crudPermissions.readOnly"
-                              >
-                                <md-menu>
-                                  <md-button
-                                    class="md-icon-button"
-                                    aria-label="More"
-                                    translate
-                                    translate-attr-aria-label="INTEGRATIONS.MORE"
-                                    ng-click="$mdOpenMenu($event)"
-                                  >
-                                    <md-icon
-                                      md-font-icon="icon-dots-vertical"
-                                    ></md-icon>
-                                  </md-button>
-
-                                  <md-menu-content width="3">
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canEdit"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.createOrEditDescription($event, description)"
-                                        translate="INTEGRATIONS.EDIT_DESCRIPTION"
-                                      >
-                                        Edit Description
-                                      </md-button>
-                                    </md-menu-item>
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canDelete"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.deleteDescriptionConfirm($event, description)"
-                                        translate="INTEGRATIONS.DELETE_DESCRIPTION"
-                                      >
-                                        Delete Description
-                                      </md-button>
-                                    </md-menu-item>
-                                  </md-menu-content>
-                                </md-menu>
-                              </td>
-                            </tr>
-                          </tbody>
-                        </table>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-                </md-tabs>
-                <div
-                  class="padding-20"
-                  ng-if="!vm_cc.configurations.length && vm_cc.crudPermissions.canEdit"
-                  ng-click="vm_cc.createOrEditServicenowConfiguration($event)"
-                  layout="row"
-                  layout-sm="column"
-                  layout-align="center center"
-                  layout-wrap
-                >
-                  <div
-                    class="padding-20 md-whiteframe-3dp md-accent-bg"
-                    layout="column"
-                    layout-align="center center"
-                  >
-                    <md-button class="md-icon-button">
-                      <md-icon md-font-icon="icon-plus"></md-icon>
-                    </md-button>
-                    <span
-                      aria-label="add configuration"
-                      translate
-                      translate-attr-label="INTEGRATIONS.ADD_CONFIGURATION"
-                      >ADD CONFIGURATION</span
-                    >
-                  </div>
-                </div>
-              </md-card>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/edit/view.html/view.html b/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/edit/view.html/view.html
new file mode 100644
index 0000000..9eababd
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/edit/view.html/view.html
@@ -0,0 +1,762 @@
+<div
+  id="integrations-servicenowAccount"
+  class="page-layout simple tabbed"
+  layout="column"
+>
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-servicenowAccounts-button md-icon-button"
+        aria-label="Go to servicenowAccounts"
+        ng-click="vm.gotoServicenowAccounts()"
+        translate
+        translate-attr-aria-label="INTEGRATIONS.GO_TO_SERVICENOWACCOUNTS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="servicenowAccount-image" hide-xs>
+          <img ng-src="assets/images/business/servicenowAccounts.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.servicenowAccount.id}}
+            <span ng-if="vm.servicenowAccount.name"
+              >{{vm.servicenowAccount.name}}</span
+            >
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="INTEGRATIONS.CREATED_AT"></span>
+            <span>{{vm.servicenowAccount.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveServicenowAccount()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (configurationsForm.$invalid)"
+        translate="INTEGRATIONS.SAVE"
+        translate-attr-aria-label="INTEGRATIONS.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="INTEGRATIONS.ACCOUNT">ACCOUNT</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="servicenowAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="INTEGRATIONS.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.servicenowAccount.name"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.USERNAME">Username</label>
+                <input
+                  type="text"
+                  name="username"
+                  ng-model="vm.servicenowAccount.username"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['username'].$error"
+                  ng-show="generalForm['username'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
+                      >Username field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.PASSWORD">Password</label>
+                <input
+                  type="password"
+                  name="password"
+                  ng-model="vm.servicenowAccount.password"
+                  placeholder="Password"
+                  translate
+                  translate-attr-placeholder="INTEGRATIONS.PASSWORD"
+                  required
+                />
+                <div ng-messages="generalForm['password'].$error" role="alert">
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.PASSWORD_REQUIRED"
+                      >Password field is required</span
+                    >
+                  </div>
+                  <div ng-message="pattern">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.SECURE_PASSWORD_PATTERN"
+                      >Must contain at least 8 characters, with a minimum of 1
+                      lowercase letter, 1 uppercase letter, 1 numeric character
+                      and 1 special character ~!?*@#$%^&-_=+[{]}.</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.EMAIL">Email</label>
+                <input
+                  type="email"
+                  name="email"
+                  ng-model="vm.servicenowAccount.email"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['email'].$error"
+                  ng-show="generalForm['email'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.EMAIL_REQUIRED"
+                      >Email field is required</span
+                    >
+                  </div>
+                  <div ng-message="email">
+                    <span translate="INTEGRATIONS.ERRORS.EMAIL_MUST_VALID"
+                      >Email must be a valid e-mail address</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.HOST">Host</label>
+                <input
+                  type="url"
+                  name="remoteUri"
+                  ng-model="vm.servicenowAccount.remoteUri"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['remoteUri'].$error"
+                  ng-show="generalForm['remoteUri'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.HOST_REQUIRED"
+                      >Host field is required</span
+                    >
+                  </div>
+                  <div ng-message="url">
+                    <span translate="INTEGRATIONS.ERRORS.HOST_MUST_VALID_URL"
+                      >Host must be a valid url http://www.xcally.com</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
+                  >MotionProxyAddress</label
+                >
+                <input
+                  type="url"
+                  name="serverUrl"
+                  ng-model="vm.servicenowAccount.serverUrl"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['serverUrl'].$error"
+                  ng-show="generalForm['serverUrl'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
+                      >MotionProxyAddress field is required</span
+                    >
+                  </div>
+                  <div ng-message="url">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
+                      >MotionProxyAddress must be a valid url
+                      http://www.xcally.com</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.servicenowAccount.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="INTEGRATIONS.CONFIGURATIONS">CONFIGURATIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="servicenowAccount-detail-form-container configurations md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div
+                class="h2 secondary-text"
+                translate="INTEGRATIONS.CONFIGURATIONS"
+              >
+                CONFIGURATIONS
+              </div>
+            </div>
+            <div
+              ng-controller="ServicenowAccountConfigurationsController as vm_cc"
+              ng-init="vm_cc.init(vm.servicenowAccount, vm.crudPermissions)"
+              layout="row"
+            >
+              <md-card class="md-whiteframe-1dp" flex="30">
+                <div layout="row" layout-align="center center">
+                  <md-subheader flex="75" class="md-no-sticky"
+                    >{{ 'INTEGRATIONS.CONFIGURATIONS' | translate
+                    }}</md-subheader
+                  >
+                  <md-button
+                    flex="25"
+                    ng-if="vm_cc.crudPermissions.canEdit"
+                    ng-click="vm_cc.createOrEditServicenowConfiguration($event)"
+                    class="md-icon-button"
+                    aria-label="create servicenowConfiguration"
+                  >
+                    <md-icon md-font-icon="icon-plus"></md-icon>
+                  </md-button>
+                </div>
+                <md-list>
+                  <md-list-item
+                    layout="row"
+                    layout-align="center center"
+                    ng-repeat="servicenowConfiguration in vm_cc.configurations"
+                    class="border-top"
+                    md-colors="{background: (vm_cc.selectedServicenowConfiguration == $index ? 'accent' : 'grey-A100')}"
+                    ng-click="vm_cc.getServicenowConfiguration($index)"
+                  >
+                    <span class="text-truncate" flex="80"
+                      >{{ servicenowConfiguration.name }}</span
+                    >
+                    <md-menu ng-if="vm_cc.crudPermissions.canDelete">
+                      <md-button
+                        class="md-icon-button"
+                        aria-label="More"
+                        translate
+                        translate-attr-aria-label="INTEGRATIONS.MORE"
+                        ng-click="$mdOpenMenu($event)"
+                      >
+                        <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                      </md-button>
+                      <md-menu-content width="3">
+                        <md-menu-item ng-if="vm_cc.crudPermissions.canDelete">
+                          <md-button
+                            ng-click="vm_cc.deleteServicenowConfiguration($event, servicenowConfiguration)"
+                            translate="INTEGRATIONS.DELETE_SERVICENOWCONFIGURATION"
+                          >
+                            Delete ServicenowConfiguration
+                          </md-button>
+                        </md-menu-item>
+                      </md-menu-content>
+                    </md-menu>
+                  </md-list-item>
+                </md-list>
+              </md-card>
+              <div flex></div>
+              <md-card class="md-whiteframe-1dp" flex="65">
+                <md-tabs ng-if="vm_cc.configurations.length" md-dynamic-height>
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.SUBJECTS">SUBJECTS</span>
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedSubjects.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.subject = query"
+                            on-collapse="vm_cc.query.subject = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditSubject($event)"
+                            aria-label="add subject"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_SUBJECT"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedSubjects.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedSubjects.length}}
+                            {{vm_cc.selectedSubjects.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedSubjects($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedSubjects"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.ID' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.TYPE' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.CONTENT' | translate }}
+                              </th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="subject"
+                              md-select-id="id"
+                              ng-repeat="subject in vm_cc.subjects | filter: vm_cc.query.subject"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                                class="id"
+                              >
+                                {{subject.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="subject.FieldId"
+                                  >{{subject.nameField ||
+                                  subject.idField}}</span
+                                >
+                                <span ng-if="!subject.FieldId"
+                                  >{{subject.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="subject.type"
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{subject.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{subject.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{
+                                  vm_cc.variablesById[subject.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{subject.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{subject.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{subject.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[subject.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default
+                                  >{{subject.content}}</span
+                                >
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="INTEGRATIONS.MORE"
+                                    ng-click="$mdOpenMenu($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                        translate="INTEGRATIONS.EDIT_SUBJECT"
+                                      >
+                                        Edit Subject
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteSubjectConfirm($event, subject)"
+                                        translate="INTEGRATIONS.DELETE_SUBJECT"
+                                      >
+                                        Delete Subject
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.DESCRIPTIONS"
+                        >DESCRIPTIONS</span
+                      >
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedDescriptions.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.description = query"
+                            on-collapse="vm_cc.query.description = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditDescription($event)"
+                            aria-label="add description"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_DESCRIPTION"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedDescriptions.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedDescriptions.length}}
+                            {{vm_cc.selectedDescriptions.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedDescriptions($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedDescriptions"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.ID' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.TYPE' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.CONTENT' | translate }}
+                              </th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="description"
+                              md-select-id="id"
+                              ng-repeat="description in vm_cc.descriptions | filter: vm_cc.query.description"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                                class="id"
+                              >
+                                {{description.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="description.FieldId"
+                                  >{{description.nameField ||
+                                  description.idField}}</span
+                                >
+                                <span ng-if="!description.FieldId"
+                                  >{{description.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="description.type"
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{description.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{description.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{
+                                  vm_cc.variablesById[description.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{description.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{description.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{description.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[description.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default
+                                  >{{description.content}}</span
+                                >
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="INTEGRATIONS.MORE"
+                                    ng-click="$mdOpenMenu($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditDescription($event, description)"
+                                        translate="INTEGRATIONS.EDIT_DESCRIPTION"
+                                      >
+                                        Edit Description
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteDescriptionConfirm($event, description)"
+                                        translate="INTEGRATIONS.DELETE_DESCRIPTION"
+                                      >
+                                        Delete Description
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+                </md-tabs>
+                <div
+                  class="padding-20"
+                  ng-if="!vm_cc.configurations.length && vm_cc.crudPermissions.canEdit"
+                  ng-click="vm_cc.createOrEditServicenowConfiguration($event)"
+                  layout="row"
+                  layout-sm="column"
+                  layout-align="center center"
+                  layout-wrap
+                >
+                  <div
+                    class="padding-20 md-whiteframe-3dp md-accent-bg"
+                    layout="column"
+                    layout-align="center center"
+                  >
+                    <md-button class="md-icon-button">
+                      <md-icon md-font-icon="icon-plus"></md-icon>
+                    </md-button>
+                    <span
+                      aria-label="add configuration"
+                      translate
+                      translate-attr-label="INTEGRATIONS.ADD_CONFIGURATION"
+                      >ADD CONFIGURATION</span
+                    >
+                  </div>
+                </div>
+              </md-card>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/servicenowAccounts.html/servicenowAccounts-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/servicenowAccounts.html/servicenowAccounts-[chunkhash].html
deleted file mode 100644
index ce838e7..0000000
--- a/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/servicenowAccounts.html/servicenowAccounts-[chunkhash].html
+++ /dev/null
@@ -1,335 +0,0 @@
-<div
-  id="servicenowAccounts"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-heart" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="INTEGRATIONS.SERVICENOWACCOUNTS"
-          >ServicenowAccounts</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="INTEGRATIONS.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedServicenowAccounts.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div
-      class="close-button-wrapper"
-      ng-click="vm.selectedServicenowAccounts =[]"
-    >
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="INTEGRATIONS.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-servicenowAccounts-count">
-          <span>{{vm.selectedServicenowAccounts.length}}</span>
-          <span translate="INTEGRATIONS.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="INTEGRATIONS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllServicenowAccounts()"
-                translate="INTEGRATIONS.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectServicenowAccounts()"
-                translate="INTEGRATIONS.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedServicenowAccounts"
-          csv-label="true"
-          filename="servicenowAccounts.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedServicenowAccounts($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- SERVICENOWACCOUNT TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedServicenowAccounts"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getServicenowAccounts"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">
-                  {{ 'INTEGRATIONS.ID' | translate }}
-                </th>
-                <th md-column md-order-by="name">
-                  {{ 'INTEGRATIONS.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="username">
-                  {{ 'INTEGRATIONS.USERNAME' | translate }}
-                </th>
-                <th md-column md-order-by="email">
-                  {{ 'INTEGRATIONS.EMAIL' | translate }}
-                </th>
-                <th md-column md-order-by="remoteUri">
-                  {{ 'INTEGRATIONS.HOST' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.servicenowAccounts.rows.length">
-                <td md-cell colspan="6">
-                  <div layout="row" layout-align="center center">
-                    <span translate="INTEGRATIONS.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="servicenowAccount"
-                md-select-id="id"
-                ng-repeat="servicenowAccount in vm.servicenowAccounts.rows"
-              >
-                <td md-cell ng-if="servicenowAccount.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{servicenowAccount.name}}"
-                    ng-src="api/users/{{servicenowAccount.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!servicenowAccount.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{servicenowAccount.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(servicenowAccount, ev) : vm.createOrEditServicenowAccount($event, servicenowAccount)"
-                  md-cell
-                  class="id"
-                >
-                  {{servicenowAccount.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(servicenowAccount, ev) : vm.createOrEditServicenowAccount($event, servicenowAccount)"
-                  md-cell
-                  class="name"
-                >
-                  {{servicenowAccount.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(servicenowAccount, ev) : vm.createOrEditServicenowAccount($event, servicenowAccount)"
-                  md-cell
-                  class="username"
-                >
-                  {{servicenowAccount.username}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(servicenowAccount, ev) : vm.createOrEditServicenowAccount($event, servicenowAccount)"
-                  md-cell
-                  class="email"
-                >
-                  {{servicenowAccount.email}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(servicenowAccount, ev) : vm.createOrEditServicenowAccount($event, servicenowAccount)"
-                  md-cell
-                  class="remoteUri"
-                >
-                  {{servicenowAccount.remoteUri}}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="INTEGRATIONS.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(servicenowAccount, $event    )"
-                          translate="INTEGRATIONS.EDIT_SERVICENOWACCOUNT"
-                        >
-                          Edit ServicenowAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.testtestintegrationaccount(servicenowAccount, $event    )"
-                          translate="INTEGRATIONS.TEST_SERVICENOWACCOUNT"
-                        >
-                          Test ServicenowAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item
-                        ng-if="vm.currentUser.crudPermissions === 0 || vm.currentUser.role === 'admin'"
-                      >
-                        <md-button
-                          ng-click="vm.deleteconfirm(servicenowAccount, $event    )"
-                          translate="INTEGRATIONS.DELETE_SERVICENOWACCOUNT"
-                        >
-                          Delete ServicenowAccount
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'INTEGRATIONS.PAGE' | translate}}:', rowsPerPage: '{{'INTEGRATIONS.ROWSPERPAGE' | translate}}:', of: '{{'INTEGRATIONS.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.servicenowAccounts.count}}"
-          md-on-paginate="vm.getServicenowAccounts"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / SERVICENOWACCOUNT TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD SERVICENOWACCOUNT BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-servicenowAccount-button"
-    ng-click="vm.createOrEditServicenowAccount($event)"
-    aria-label="add servicenowAccount"
-    translate
-    translate-attr-aria-label="INTEGRATIONS.ADD_SERVICENOWACCOUNT"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD SERVICENOWACCOUNT BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/servicenowAccounts.html/servicenowAccounts.html b/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/servicenowAccounts.html/servicenowAccounts.html
new file mode 100644
index 0000000..ce838e7
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/servicenowAccounts/servicenowAccounts.html/servicenowAccounts.html
@@ -0,0 +1,335 @@
+<div
+  id="servicenowAccounts"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-heart" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="INTEGRATIONS.SERVICENOWACCOUNTS"
+          >ServicenowAccounts</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="INTEGRATIONS.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedServicenowAccounts.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div
+      class="close-button-wrapper"
+      ng-click="vm.selectedServicenowAccounts =[]"
+    >
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="INTEGRATIONS.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-servicenowAccounts-count">
+          <span>{{vm.selectedServicenowAccounts.length}}</span>
+          <span translate="INTEGRATIONS.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="INTEGRATIONS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllServicenowAccounts()"
+                translate="INTEGRATIONS.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectServicenowAccounts()"
+                translate="INTEGRATIONS.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedServicenowAccounts"
+          csv-label="true"
+          filename="servicenowAccounts.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedServicenowAccounts($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- SERVICENOWACCOUNT TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedServicenowAccounts"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getServicenowAccounts"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">
+                  {{ 'INTEGRATIONS.ID' | translate }}
+                </th>
+                <th md-column md-order-by="name">
+                  {{ 'INTEGRATIONS.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="username">
+                  {{ 'INTEGRATIONS.USERNAME' | translate }}
+                </th>
+                <th md-column md-order-by="email">
+                  {{ 'INTEGRATIONS.EMAIL' | translate }}
+                </th>
+                <th md-column md-order-by="remoteUri">
+                  {{ 'INTEGRATIONS.HOST' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.servicenowAccounts.rows.length">
+                <td md-cell colspan="6">
+                  <div layout="row" layout-align="center center">
+                    <span translate="INTEGRATIONS.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="servicenowAccount"
+                md-select-id="id"
+                ng-repeat="servicenowAccount in vm.servicenowAccounts.rows"
+              >
+                <td md-cell ng-if="servicenowAccount.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{servicenowAccount.name}}"
+                    ng-src="api/users/{{servicenowAccount.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!servicenowAccount.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{servicenowAccount.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(servicenowAccount, ev) : vm.createOrEditServicenowAccount($event, servicenowAccount)"
+                  md-cell
+                  class="id"
+                >
+                  {{servicenowAccount.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(servicenowAccount, ev) : vm.createOrEditServicenowAccount($event, servicenowAccount)"
+                  md-cell
+                  class="name"
+                >
+                  {{servicenowAccount.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(servicenowAccount, ev) : vm.createOrEditServicenowAccount($event, servicenowAccount)"
+                  md-cell
+                  class="username"
+                >
+                  {{servicenowAccount.username}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(servicenowAccount, ev) : vm.createOrEditServicenowAccount($event, servicenowAccount)"
+                  md-cell
+                  class="email"
+                >
+                  {{servicenowAccount.email}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(servicenowAccount, ev) : vm.createOrEditServicenowAccount($event, servicenowAccount)"
+                  md-cell
+                  class="remoteUri"
+                >
+                  {{servicenowAccount.remoteUri}}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="INTEGRATIONS.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(servicenowAccount, $event    )"
+                          translate="INTEGRATIONS.EDIT_SERVICENOWACCOUNT"
+                        >
+                          Edit ServicenowAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.testtestintegrationaccount(servicenowAccount, $event    )"
+                          translate="INTEGRATIONS.TEST_SERVICENOWACCOUNT"
+                        >
+                          Test ServicenowAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item
+                        ng-if="vm.currentUser.crudPermissions === 0 || vm.currentUser.role === 'admin'"
+                      >
+                        <md-button
+                          ng-click="vm.deleteconfirm(servicenowAccount, $event    )"
+                          translate="INTEGRATIONS.DELETE_SERVICENOWACCOUNT"
+                        >
+                          Delete ServicenowAccount
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'INTEGRATIONS.PAGE' | translate}}:', rowsPerPage: '{{'INTEGRATIONS.ROWSPERPAGE' | translate}}:', of: '{{'INTEGRATIONS.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.servicenowAccounts.count}}"
+          md-on-paginate="vm.getServicenowAccounts"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / SERVICENOWACCOUNT TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD SERVICENOWACCOUNT BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-servicenowAccount-button"
+    ng-click="vm.createOrEditServicenowAccount($event)"
+    aria-label="add servicenowAccount"
+    translate
+    translate-attr-aria-label="INTEGRATIONS.ADD_SERVICENOWACCOUNT"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD SERVICENOWACCOUNT BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index ff5b70f..0000000
--- a/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,260 +0,0 @@
-<md-dialog class="sugarcrmAccount-dialog" aria-label="New SugarcrmAccount">
-  <form name="sugarcrmAccountForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.sugarcrmAccount.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="sugarcrmAccountForm['name'].$error"
-          ng-show="sugarcrmAccountForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.USERNAME">Username</label>
-        <input
-          type="text"
-          name="username"
-          ng-model="vm.sugarcrmAccount.username"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="sugarcrmAccountForm['username'].$error"
-          ng-show="sugarcrmAccountForm['username'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
-              >Username field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.URI">Uri</label>
-        <input
-          type="url"
-          name="remoteUri"
-          ng-model="vm.sugarcrmAccount.remoteUri"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="sugarcrmAccountForm['remoteUri'].$error"
-          ng-show="sugarcrmAccountForm['remoteUri'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
-              >Uri field is required</span
-            >
-          </div>
-          <div ng-message="url">
-            <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
-              >Uri must be a valid url http://www.xcally.com</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.PASSWORD">Password</label>
-        <input
-          type="password"
-          name="password"
-          ng-model="vm.sugarcrmAccount.password"
-          placeholder="Password"
-          translate
-          translate-attr-placeholder="INTEGRATIONS.PASSWORD"
-          required
-        />
-        <div ng-messages="sugarcrmAccountForm['password'].$error" role="alert">
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.PASSWORD_REQUIRED"
-              >Password field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span translate="INTEGRATIONS.ERRORS.SECURE_PASSWORD_PATTERN"
-              >Must contain at least 8 characters, with a minimum of 1 lowercase
-              letter, 1 uppercase letter, 1 numeric character and 1 special
-              character ~!?*@#$%^&-_=+[{]}.</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
-          >MotionProxyAddress</label
-        >
-        <input
-          type="url"
-          name="serverUrl"
-          ng-model="vm.sugarcrmAccount.serverUrl"
-        />
-
-        <div class="hint">
-          <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
-        </div>
-        <div
-          ng-messages="sugarcrmAccountForm['serverUrl'].$error"
-          ng-show="sugarcrmAccountForm['serverUrl'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
-              >MotionProxyAddress field is required</span
-            >
-          </div>
-          <div ng-message="url">
-            <span
-              translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
-              >MotionProxyAddress must be a valid url
-              http://www.xcally.com</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.sugarcrmAccount.description"
-        />
-
-        <div
-          ng-messages="sugarcrmAccountForm['description'].$error"
-          ng-show="sugarcrmAccountForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newSugarcrmAccount"
-          ng-click="vm.saveSugarcrmAccount()"
-          class="send-button md-accent md-raised"
-          ng-disabled="sugarcrmAccountForm.$invalid || sugarcrmAccountForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newSugarcrmAccount"
-          ng-click="vm.addNewSugarcrmAccount()"
-          class="send-button md-accent md-raised"
-          ng-disabled="sugarcrmAccountForm.$invalid"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD_SUGARCRMACCOUNT"
-          translate-attr-aria-label="INTEGRATIONS.ADD_SUGARCRMACCOUNT"
-        >
-          ADD SUGARCRMACCOUNT
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newSugarcrmAccount"
-          ng-click="vm.deleteSugarcrmAccount($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/create/dialog.html/dialog.html
new file mode 100644
index 0000000..ff5b70f
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/create/dialog.html/dialog.html
@@ -0,0 +1,260 @@
+<md-dialog class="sugarcrmAccount-dialog" aria-label="New SugarcrmAccount">
+  <form name="sugarcrmAccountForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.sugarcrmAccount.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="sugarcrmAccountForm['name'].$error"
+          ng-show="sugarcrmAccountForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.USERNAME">Username</label>
+        <input
+          type="text"
+          name="username"
+          ng-model="vm.sugarcrmAccount.username"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="sugarcrmAccountForm['username'].$error"
+          ng-show="sugarcrmAccountForm['username'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
+              >Username field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.URI">Uri</label>
+        <input
+          type="url"
+          name="remoteUri"
+          ng-model="vm.sugarcrmAccount.remoteUri"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="sugarcrmAccountForm['remoteUri'].$error"
+          ng-show="sugarcrmAccountForm['remoteUri'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
+              >Uri field is required</span
+            >
+          </div>
+          <div ng-message="url">
+            <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
+              >Uri must be a valid url http://www.xcally.com</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.PASSWORD">Password</label>
+        <input
+          type="password"
+          name="password"
+          ng-model="vm.sugarcrmAccount.password"
+          placeholder="Password"
+          translate
+          translate-attr-placeholder="INTEGRATIONS.PASSWORD"
+          required
+        />
+        <div ng-messages="sugarcrmAccountForm['password'].$error" role="alert">
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.PASSWORD_REQUIRED"
+              >Password field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span translate="INTEGRATIONS.ERRORS.SECURE_PASSWORD_PATTERN"
+              >Must contain at least 8 characters, with a minimum of 1 lowercase
+              letter, 1 uppercase letter, 1 numeric character and 1 special
+              character ~!?*@#$%^&-_=+[{]}.</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
+          >MotionProxyAddress</label
+        >
+        <input
+          type="url"
+          name="serverUrl"
+          ng-model="vm.sugarcrmAccount.serverUrl"
+        />
+
+        <div class="hint">
+          <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
+        </div>
+        <div
+          ng-messages="sugarcrmAccountForm['serverUrl'].$error"
+          ng-show="sugarcrmAccountForm['serverUrl'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
+              >MotionProxyAddress field is required</span
+            >
+          </div>
+          <div ng-message="url">
+            <span
+              translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
+              >MotionProxyAddress must be a valid url
+              http://www.xcally.com</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.sugarcrmAccount.description"
+        />
+
+        <div
+          ng-messages="sugarcrmAccountForm['description'].$error"
+          ng-show="sugarcrmAccountForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newSugarcrmAccount"
+          ng-click="vm.saveSugarcrmAccount()"
+          class="send-button md-accent md-raised"
+          ng-disabled="sugarcrmAccountForm.$invalid || sugarcrmAccountForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newSugarcrmAccount"
+          ng-click="vm.addNewSugarcrmAccount()"
+          class="send-button md-accent md-raised"
+          ng-disabled="sugarcrmAccountForm.$invalid"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD_SUGARCRMACCOUNT"
+          translate-attr-aria-label="INTEGRATIONS.ADD_SUGARCRMACCOUNT"
+        >
+          ADD SUGARCRMACCOUNT
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newSugarcrmAccount"
+          ng-click="vm.deleteSugarcrmAccount($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index b30fb49..0000000
--- a/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,187 +0,0 @@
-<md-dialog
-  class="sugarcrmConfiguration-dialog"
-  aria-label="New SugarcrmConfiguration"
->
-  <form name="sugarcrmConfigurationForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.NAME">Name</label>
-        <input
-          type=""
-          name="name"
-          ng-model="vm.sugarcrmConfiguration.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="sugarcrmConfigurationForm['name'].$error"
-          ng-show="sugarcrmConfigurationForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.CHANNEL">Channel</label>
-        <md-select
-          name="channel"
-          ng-model="vm.sugarcrmConfiguration.channel"
-          required
-        >
-          <md-option ng-value="'voice'">
-            {{ 'INTEGRATIONS.VOICE' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="sugarcrmConfigurationForm['channel'].$error"
-          ng-show="sugarcrmConfigurationForm['channel'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.CHANNEL_REQUIRED"
-              >Channel field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.TYPE">Type</label>
-        <md-select
-          name="type"
-          ng-model="vm.sugarcrmConfiguration.type"
-          required
-        >
-          <md-option ng-value="'inbound'">
-            {{ 'INTEGRATIONS.INBOUND_IN_QUEUE' | translate }}
-          </md-option>
-
-          <md-option ng-value="'outbound'">
-            {{ 'INTEGRATIONS.OUTBOUND_CALL' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="sugarcrmConfigurationForm['type'].$error"
-          ng-show="sugarcrmConfigurationForm['type'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-              >Type field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newSugarcrmConfiguration"
-          ng-click="vm.saveSugarcrmConfiguration()"
-          class="send-button md-accent md-raised"
-          ng-disabled="sugarcrmConfigurationForm.$invalid || sugarcrmConfigurationForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newSugarcrmConfiguration"
-          ng-click="vm.addNewSugarcrmConfiguration()"
-          class="send-button md-accent md-raised"
-          ng-disabled="sugarcrmConfigurationForm.$invalid"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD_SUGARCRMCONFIGURATION"
-          translate-attr-aria-label="INTEGRATIONS.ADD_SUGARCRMCONFIGURATION"
-        >
-          ADD SUGARCRMCONFIGURATION
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newSugarcrmConfiguration"
-          ng-click="vm.deleteSugarcrmConfiguration($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/edit/configurations/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/edit/configurations/dialog.html/dialog.html
new file mode 100644
index 0000000..b30fb49
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/edit/configurations/dialog.html/dialog.html
@@ -0,0 +1,187 @@
+<md-dialog
+  class="sugarcrmConfiguration-dialog"
+  aria-label="New SugarcrmConfiguration"
+>
+  <form name="sugarcrmConfigurationForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.NAME">Name</label>
+        <input
+          type=""
+          name="name"
+          ng-model="vm.sugarcrmConfiguration.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="sugarcrmConfigurationForm['name'].$error"
+          ng-show="sugarcrmConfigurationForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.CHANNEL">Channel</label>
+        <md-select
+          name="channel"
+          ng-model="vm.sugarcrmConfiguration.channel"
+          required
+        >
+          <md-option ng-value="'voice'">
+            {{ 'INTEGRATIONS.VOICE' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="sugarcrmConfigurationForm['channel'].$error"
+          ng-show="sugarcrmConfigurationForm['channel'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.CHANNEL_REQUIRED"
+              >Channel field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.TYPE">Type</label>
+        <md-select
+          name="type"
+          ng-model="vm.sugarcrmConfiguration.type"
+          required
+        >
+          <md-option ng-value="'inbound'">
+            {{ 'INTEGRATIONS.INBOUND_IN_QUEUE' | translate }}
+          </md-option>
+
+          <md-option ng-value="'outbound'">
+            {{ 'INTEGRATIONS.OUTBOUND_CALL' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="sugarcrmConfigurationForm['type'].$error"
+          ng-show="sugarcrmConfigurationForm['type'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+              >Type field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newSugarcrmConfiguration"
+          ng-click="vm.saveSugarcrmConfiguration()"
+          class="send-button md-accent md-raised"
+          ng-disabled="sugarcrmConfigurationForm.$invalid || sugarcrmConfigurationForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newSugarcrmConfiguration"
+          ng-click="vm.addNewSugarcrmConfiguration()"
+          class="send-button md-accent md-raised"
+          ng-disabled="sugarcrmConfigurationForm.$invalid"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD_SUGARCRMCONFIGURATION"
+          translate-attr-aria-label="INTEGRATIONS.ADD_SUGARCRMCONFIGURATION"
+        >
+          ADD SUGARCRMCONFIGURATION
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newSugarcrmConfiguration"
+          ng-click="vm.deleteSugarcrmConfiguration($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/edit/item/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/edit/item/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 61ee715..0000000
--- a/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/edit/item/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,478 +0,0 @@
-<md-dialog class="sugarcrmAccount-item-dialog" aria-label="New Item">
-  <form name="sugarcrmAccountItemForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <div ng-switch="vm.type">
-        <div ng-switch-when="subject">
-          <!-- SUBJECT SECTION -->
-          <div ng-include="'/subject.html'"></div>
-          <!-- / SUBJECT SECTION -->
-        </div>
-        <div ng-switch-when="description">
-          <!-- DESCRIPTION SECTION -->
-          <md-input-container class="md-block">
-            <label translate="INTEGRATIONS.TYPE">Type</label>
-            <md-select name="type" ng-model="vm.item.type" required>
-              <md-option value="string">String</md-option>
-              <md-option value="keyValue">Key Value</md-option>
-            </md-select>
-            <div
-              ng-messages="sugarcrmAccountItemForm.type.$error"
-              ng-show="sugarcrmAccountItemForm.type.$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-                  >Type field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
-            <label translate="INTEGRATIONS.CONTENT">Content</label>
-            <input
-              type="text"
-              name="content"
-              ng-model="vm.item.content"
-              required
-              md-autofocus
-            />
-            <div
-              ng-messages="sugarcrmAccountItemForm.content.$error"
-              ng-show="sugarcrmAccountItemForm.content.$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
-                  >Content field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <div ng-if="vm.item.type == 'keyValue'">
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.KEY">Key</label>
-              <input
-                type="text"
-                name="key"
-                ng-model="vm.item.key"
-                required
-                md-autofocus
-              />
-              <div
-                ng-messages="sugarcrmAccountItemForm.key.$error"
-                ng-show="sugarcrmAccountItemForm.key.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.KEY_REQUIRED"
-                    >Key field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.TYPE">Type</label>
-              <md-select name="keyType" ng-model="vm.item.keyType" required>
-                <md-option value="string">String</md-option>
-                <md-option value="variable">Variable</md-option>
-                <md-option value="customVariable">Custom Variable</md-option>
-              </md-select>
-              <div
-                ng-messages="sugarcrmAccountItemForm.keyType.$error"
-                ng-show="sugarcrmAccountItemForm.keyType.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-                    >Type field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'string'"
-            >
-              <label translate="INTEGRATIONS.CONTENT">Content</label>
-              <input
-                type="text"
-                name="keyContent"
-                ng-model="vm.item.keyContent"
-                required
-                md-autofocus
-              />
-              <div
-                ng-messages="sugarcrmAccountItemForm.keyContent.$error"
-                ng-show="sugarcrmAccountItemForm.keyContent.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
-                    >Content field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'variable'"
-            >
-              <label translate="INTEGRATIONS.VALUE">Value</label>
-              <md-select
-                name="variableName"
-                ng-model="vm.item.variableName"
-                md-selected-text="vm.getSelectedVariable()"
-                required
-              >
-                <md-optgroup label="Voice: Queue">
-                  <md-option
-                    ng-value="agentColumn"
-                    ng-repeat="agentColumn in vm.voiceAgentReportColumns"
-                    >{{agentColumn}}
-                  </md-option>
-                </md-optgroup>
-                <md-optgroup label="Voice: Outbound">
-                  <md-option
-                    ng-value="dialColumn"
-                    ng-repeat="dialColumn in vm.voiceDialReportColumns"
-                    >{{dialColumn}}</md-option
-                  >
-                </md-optgroup>
-              </md-select>
-              <div
-                ng-messages="sugarcrmAccountItemForm.variableName.$error"
-                ng-show="sugarcrmAccountItemForm.variableName.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED"
-                    >Variable name field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'customVariable'"
-            >
-              <label translate="INTEGRATIONS.VALUE">Value</label>
-              <md-select ng-model="vm.item.VariableId" required>
-                <md-option
-                  ng-value="variable.id"
-                  ng-repeat="variable in vm.variables"
-                  >{{variable.name}}
-                </md-option>
-              </md-select>
-            </md-input-container>
-          </div>
-          <!-- / DESCRIPTION SECTION -->
-        </div>
-        <div ng-switch-when="field">
-          <!-- FIELD SECTION -->
-          <div ng-if="vm.accountConnected">
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.FIELD">FIELD</label>
-              <!-- ITEM TYPE DEFAULT VALUE is STRING -->
-              <md-select
-                name="customField"
-                ng-model="vm.customField"
-                required
-                ng-change="vm.item.type = 'string'"
-              >
-                <md-optgroup label="Standard">
-                  <md-option
-                    ng-value="standard"
-                    ng-repeat="standard in vm.fields | filter: {custom: false} "
-                    >{{standard.name}}
-                  </md-option>
-                </md-optgroup>
-
-                <md-optgroup label="Custom">
-                  <md-option
-                    ng-value="custom"
-                    ng-repeat="custom in vm.fields | filter: {custom: true} "
-                    >{{custom.name}}
-                  </md-option>
-                </md-optgroup>
-              </md-select>
-              <div
-                ng-messages="sugarcrmAccountItemForm.customField.$error"
-                ng-show="sugarcrmAccountItemForm.customField.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.FIELD_REQUIRED"
-                    >Field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <!-- FIELDS -->
-            <div ng-if="vm.customField" ng-include="'/fields.html'"></div>
-            <!-- FIELDS -->
-          </div>
-          <div ng-if="!vm.accountConnected">
-            <p>Account is not connected. Please check your configurations!</p>
-          </div>
-          <!-- / FIELD SECTION -->
-        </div>
-        <div ng-switch-default>
-          <p>No Item</p>
-        </div>
-      </div>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newItem"
-          ng-click="vm.saveItem()"
-          class="send-button md-accent md-raised"
-          ng-disabled="sugarcrmAccountItemForm.$invalid || sugarcrmAccountItemForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newItem"
-          ng-click="vm.addNewItem()"
-          class="send-button md-accent md-raised"
-          ng-disabled="sugarcrmAccountItemForm.$invalid || sugarcrmAccountItemForm.$pristine"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD"
-          translate-attr-aria-label="INTEGRATIONS.ADD"
-        >
-          ADD
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newItem"
-          ng-click="vm.deleteItem($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
-
-<script type="text/ng-template" id="/fields.html">
-
-  <!-- type -->
-  <md-input-container class="md-block" ng-if="!vm.customField.options.length">
-
-      <label translate="INTEGRATIONS.TYPE">Type</label>
-      <md-select name="type" ng-model="vm.item.type" required>
-
-          <md-option value="string">String</md-option>
-          <md-option value="variable">Variable</md-option>
-          <md-option value="customVariable">Custom Variable</md-option>
-      </md-select>
-      <div ng-messages="sugarcrmAccountItemForm.type.$error" ng-show="sugarcrmAccountItemForm.type.$touched"
-          role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <!--/ type -->
-
-  <!-- value -->
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && vm.customField.options.length">
-      <!-- options -->
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-
-      <md-select name="option" ng-model="vm.item.content" required>
-          <md-option ng-value="option.value" ng-repeat="option in vm.customField.options">{{option.name}}</md-option>
-      </md-select>
-
-      <div ng-messages="sugarcrmAccountItemForm.option.$error"
-          ng-show="sugarcrmAccountItemForm.option.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VALUE_REQUIRED">Value field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && !vm.customField.options.length">
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-
-      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
-
-      <div ng-messages="sugarcrmAccountItemForm.content.$error"
-          ng-show="sugarcrmAccountItemForm.content.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
-          required>
-          <md-optgroup label="Voice: Queue">
-              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
-              </md-option>
-          </md-optgroup>
-          <md-optgroup label="Voice: Outbound">
-              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
-              </md-option>
-          </md-optgroup>
-      </md-select>
-      <div ng-messages="sugarcrmAccountItemForm.variableName.$error"
-          ng-show="sugarcrmAccountItemForm.variableName.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select ng-model="vm.item.VariableId" required>
-          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
-      </md-select>
-  </md-input-container>
-
-  <!--/ value -->
-</script>
-
-<script type="text/ng-template" id="/subject.html">
-    <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.TYPE">Type</label>
-            <md-select name="type" ng-model="vm.item.type" required>
-                <md-option value="string">String</md-option>
-                <md-option value="variable">Variable</md-option>
-                <md-option value="customVariable">Custom Variable</md-option>
-            </md-select>
-        <div ng-messages="sugarcrmAccountItemForm.type.$error" ng-show="sugarcrmAccountItemForm.type.$touched" role="alert">
-            <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
-             </div>
-        </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
-      <div ng-messages="sugarcrmAccountItemForm.content.$error"
-          ng-show="sugarcrmAccountItemForm.content.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
-          required>
-          <md-optgroup label="Voice: Queue">
-              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
-              </md-option>
-          </md-optgroup>
-          <md-optgroup label="Voice: Outbound">
-              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
-              </md-option>
-          </md-optgroup>
-      </md-select>
-      <div ng-messages="sugarcrmAccountItemForm.variableName.$error"
-          ng-show="sugarcrmAccountItemForm.variableName.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select ng-model="vm.item.VariableId" required>
-          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
-      </md-select>
-  </md-input-container>
-</script>
diff --git a/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/edit/item/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/edit/item/dialog.html/dialog.html
new file mode 100644
index 0000000..61ee715
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/edit/item/dialog.html/dialog.html
@@ -0,0 +1,478 @@
+<md-dialog class="sugarcrmAccount-item-dialog" aria-label="New Item">
+  <form name="sugarcrmAccountItemForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <div ng-switch="vm.type">
+        <div ng-switch-when="subject">
+          <!-- SUBJECT SECTION -->
+          <div ng-include="'/subject.html'"></div>
+          <!-- / SUBJECT SECTION -->
+        </div>
+        <div ng-switch-when="description">
+          <!-- DESCRIPTION SECTION -->
+          <md-input-container class="md-block">
+            <label translate="INTEGRATIONS.TYPE">Type</label>
+            <md-select name="type" ng-model="vm.item.type" required>
+              <md-option value="string">String</md-option>
+              <md-option value="keyValue">Key Value</md-option>
+            </md-select>
+            <div
+              ng-messages="sugarcrmAccountItemForm.type.$error"
+              ng-show="sugarcrmAccountItemForm.type.$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+                  >Type field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
+            <label translate="INTEGRATIONS.CONTENT">Content</label>
+            <input
+              type="text"
+              name="content"
+              ng-model="vm.item.content"
+              required
+              md-autofocus
+            />
+            <div
+              ng-messages="sugarcrmAccountItemForm.content.$error"
+              ng-show="sugarcrmAccountItemForm.content.$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
+                  >Content field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <div ng-if="vm.item.type == 'keyValue'">
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.KEY">Key</label>
+              <input
+                type="text"
+                name="key"
+                ng-model="vm.item.key"
+                required
+                md-autofocus
+              />
+              <div
+                ng-messages="sugarcrmAccountItemForm.key.$error"
+                ng-show="sugarcrmAccountItemForm.key.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.KEY_REQUIRED"
+                    >Key field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.TYPE">Type</label>
+              <md-select name="keyType" ng-model="vm.item.keyType" required>
+                <md-option value="string">String</md-option>
+                <md-option value="variable">Variable</md-option>
+                <md-option value="customVariable">Custom Variable</md-option>
+              </md-select>
+              <div
+                ng-messages="sugarcrmAccountItemForm.keyType.$error"
+                ng-show="sugarcrmAccountItemForm.keyType.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+                    >Type field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'string'"
+            >
+              <label translate="INTEGRATIONS.CONTENT">Content</label>
+              <input
+                type="text"
+                name="keyContent"
+                ng-model="vm.item.keyContent"
+                required
+                md-autofocus
+              />
+              <div
+                ng-messages="sugarcrmAccountItemForm.keyContent.$error"
+                ng-show="sugarcrmAccountItemForm.keyContent.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
+                    >Content field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'variable'"
+            >
+              <label translate="INTEGRATIONS.VALUE">Value</label>
+              <md-select
+                name="variableName"
+                ng-model="vm.item.variableName"
+                md-selected-text="vm.getSelectedVariable()"
+                required
+              >
+                <md-optgroup label="Voice: Queue">
+                  <md-option
+                    ng-value="agentColumn"
+                    ng-repeat="agentColumn in vm.voiceAgentReportColumns"
+                    >{{agentColumn}}
+                  </md-option>
+                </md-optgroup>
+                <md-optgroup label="Voice: Outbound">
+                  <md-option
+                    ng-value="dialColumn"
+                    ng-repeat="dialColumn in vm.voiceDialReportColumns"
+                    >{{dialColumn}}</md-option
+                  >
+                </md-optgroup>
+              </md-select>
+              <div
+                ng-messages="sugarcrmAccountItemForm.variableName.$error"
+                ng-show="sugarcrmAccountItemForm.variableName.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED"
+                    >Variable name field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'customVariable'"
+            >
+              <label translate="INTEGRATIONS.VALUE">Value</label>
+              <md-select ng-model="vm.item.VariableId" required>
+                <md-option
+                  ng-value="variable.id"
+                  ng-repeat="variable in vm.variables"
+                  >{{variable.name}}
+                </md-option>
+              </md-select>
+            </md-input-container>
+          </div>
+          <!-- / DESCRIPTION SECTION -->
+        </div>
+        <div ng-switch-when="field">
+          <!-- FIELD SECTION -->
+          <div ng-if="vm.accountConnected">
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.FIELD">FIELD</label>
+              <!-- ITEM TYPE DEFAULT VALUE is STRING -->
+              <md-select
+                name="customField"
+                ng-model="vm.customField"
+                required
+                ng-change="vm.item.type = 'string'"
+              >
+                <md-optgroup label="Standard">
+                  <md-option
+                    ng-value="standard"
+                    ng-repeat="standard in vm.fields | filter: {custom: false} "
+                    >{{standard.name}}
+                  </md-option>
+                </md-optgroup>
+
+                <md-optgroup label="Custom">
+                  <md-option
+                    ng-value="custom"
+                    ng-repeat="custom in vm.fields | filter: {custom: true} "
+                    >{{custom.name}}
+                  </md-option>
+                </md-optgroup>
+              </md-select>
+              <div
+                ng-messages="sugarcrmAccountItemForm.customField.$error"
+                ng-show="sugarcrmAccountItemForm.customField.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.FIELD_REQUIRED"
+                    >Field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <!-- FIELDS -->
+            <div ng-if="vm.customField" ng-include="'/fields.html'"></div>
+            <!-- FIELDS -->
+          </div>
+          <div ng-if="!vm.accountConnected">
+            <p>Account is not connected. Please check your configurations!</p>
+          </div>
+          <!-- / FIELD SECTION -->
+        </div>
+        <div ng-switch-default>
+          <p>No Item</p>
+        </div>
+      </div>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newItem"
+          ng-click="vm.saveItem()"
+          class="send-button md-accent md-raised"
+          ng-disabled="sugarcrmAccountItemForm.$invalid || sugarcrmAccountItemForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newItem"
+          ng-click="vm.addNewItem()"
+          class="send-button md-accent md-raised"
+          ng-disabled="sugarcrmAccountItemForm.$invalid || sugarcrmAccountItemForm.$pristine"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD"
+          translate-attr-aria-label="INTEGRATIONS.ADD"
+        >
+          ADD
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newItem"
+          ng-click="vm.deleteItem($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
+
+<script type="text/ng-template" id="/fields.html">
+
+  <!-- type -->
+  <md-input-container class="md-block" ng-if="!vm.customField.options.length">
+
+      <label translate="INTEGRATIONS.TYPE">Type</label>
+      <md-select name="type" ng-model="vm.item.type" required>
+
+          <md-option value="string">String</md-option>
+          <md-option value="variable">Variable</md-option>
+          <md-option value="customVariable">Custom Variable</md-option>
+      </md-select>
+      <div ng-messages="sugarcrmAccountItemForm.type.$error" ng-show="sugarcrmAccountItemForm.type.$touched"
+          role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <!--/ type -->
+
+  <!-- value -->
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && vm.customField.options.length">
+      <!-- options -->
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+
+      <md-select name="option" ng-model="vm.item.content" required>
+          <md-option ng-value="option.value" ng-repeat="option in vm.customField.options">{{option.name}}</md-option>
+      </md-select>
+
+      <div ng-messages="sugarcrmAccountItemForm.option.$error"
+          ng-show="sugarcrmAccountItemForm.option.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VALUE_REQUIRED">Value field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && !vm.customField.options.length">
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+
+      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
+
+      <div ng-messages="sugarcrmAccountItemForm.content.$error"
+          ng-show="sugarcrmAccountItemForm.content.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
+          required>
+          <md-optgroup label="Voice: Queue">
+              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
+              </md-option>
+          </md-optgroup>
+          <md-optgroup label="Voice: Outbound">
+              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
+              </md-option>
+          </md-optgroup>
+      </md-select>
+      <div ng-messages="sugarcrmAccountItemForm.variableName.$error"
+          ng-show="sugarcrmAccountItemForm.variableName.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select ng-model="vm.item.VariableId" required>
+          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
+      </md-select>
+  </md-input-container>
+
+  <!--/ value -->
+</script>
+
+<script type="text/ng-template" id="/subject.html">
+    <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.TYPE">Type</label>
+            <md-select name="type" ng-model="vm.item.type" required>
+                <md-option value="string">String</md-option>
+                <md-option value="variable">Variable</md-option>
+                <md-option value="customVariable">Custom Variable</md-option>
+            </md-select>
+        <div ng-messages="sugarcrmAccountItemForm.type.$error" ng-show="sugarcrmAccountItemForm.type.$touched" role="alert">
+            <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
+             </div>
+        </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
+      <div ng-messages="sugarcrmAccountItemForm.content.$error"
+          ng-show="sugarcrmAccountItemForm.content.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
+          required>
+          <md-optgroup label="Voice: Queue">
+              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
+              </md-option>
+          </md-optgroup>
+          <md-optgroup label="Voice: Outbound">
+              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
+              </md-option>
+          </md-optgroup>
+      </md-select>
+      <div ng-messages="sugarcrmAccountItemForm.variableName.$error"
+          ng-show="sugarcrmAccountItemForm.variableName.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select ng-model="vm.item.VariableId" required>
+          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
+      </md-select>
+  </md-input-container>
+</script>
diff --git a/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index f6ef1bb..0000000
--- a/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,925 +0,0 @@
-<div
-  id="integrations-sugarcrmAccount"
-  class="page-layout simple tabbed"
-  layout="column"
->
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-sugarcrmAccounts-button md-icon-button"
-        aria-label="Go to sugarcrmAccounts"
-        ng-click="vm.gotoSugarcrmAccounts()"
-        translate
-        translate-attr-aria-label="INTEGRATIONS.GO_TO_SUGARCRMACCOUNTS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="sugarcrmAccount-image" hide-xs>
-          <img ng-src="assets/images/business/sugarcrmAccounts.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.sugarcrmAccount.id}}
-            <span ng-if="vm.sugarcrmAccount.name"
-              >{{vm.sugarcrmAccount.name}}</span
-            >
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="INTEGRATIONS.CREATED_AT"></span>
-            <span>{{vm.sugarcrmAccount.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveSugarcrmAccount()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (configurationsForm.$invalid)"
-        translate="INTEGRATIONS.SAVE"
-        translate-attr-aria-label="INTEGRATIONS.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="INTEGRATIONS.ACCOUNT">ACCOUNT</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="sugarcrmAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="INTEGRATIONS.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.sugarcrmAccount.name"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.USERNAME">Username</label>
-                <input
-                  type="text"
-                  name="username"
-                  ng-model="vm.sugarcrmAccount.username"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['username'].$error"
-                  ng-show="generalForm['username'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
-                      >Username field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.URI">Uri</label>
-                <input
-                  type="url"
-                  name="remoteUri"
-                  ng-model="vm.sugarcrmAccount.remoteUri"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['remoteUri'].$error"
-                  ng-show="generalForm['remoteUri'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
-                      >Uri field is required</span
-                    >
-                  </div>
-                  <div ng-message="url">
-                    <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
-                      >Uri must be a valid url http://www.xcally.com</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.PASSWORD">Password</label>
-                <input
-                  type="password"
-                  name="password"
-                  ng-model="vm.sugarcrmAccount.password"
-                  placeholder="Password"
-                  translate
-                  translate-attr-placeholder="INTEGRATIONS.PASSWORD"
-                  required
-                />
-                <div ng-messages="generalForm['password'].$error" role="alert">
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.PASSWORD_REQUIRED"
-                      >Password field is required</span
-                    >
-                  </div>
-                  <div ng-message="pattern">
-                    <span
-                      translate="INTEGRATIONS.ERRORS.SECURE_PASSWORD_PATTERN"
-                      >Must contain at least 8 characters, with a minimum of 1
-                      lowercase letter, 1 uppercase letter, 1 numeric character
-                      and 1 special character ~!?*@#$%^&-_=+[{]}.</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
-                  >MotionProxyAddress</label
-                >
-                <input
-                  type="url"
-                  name="serverUrl"
-                  ng-model="vm.sugarcrmAccount.serverUrl"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['serverUrl'].$error"
-                  ng-show="generalForm['serverUrl'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
-                      >MotionProxyAddress field is required</span
-                    >
-                  </div>
-                  <div ng-message="url">
-                    <span
-                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
-                      >MotionProxyAddress must be a valid url
-                      http://www.xcally.com</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.sugarcrmAccount.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="INTEGRATIONS.CONFIGURATIONS">CONFIGURATIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="sugarcrmAccount-detail-form-container configurations md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div
-                class="h2 secondary-text"
-                translate="INTEGRATIONS.CONFIGURATIONS"
-              >
-                CONFIGURATIONS
-              </div>
-            </div>
-            <div
-              ng-controller="SugarcrmAccountConfigurationsController as vm_cc"
-              ng-init="vm_cc.init(vm.sugarcrmAccount, vm.crudPermissions)"
-              layout="row"
-            >
-              <md-card class="md-whiteframe-1dp" flex="30">
-                <div layout="row" layout-align="center center">
-                  <md-subheader flex="75" class="md-no-sticky"
-                    >{{ 'INTEGRATIONS.CONFIGURATIONS' | translate
-                    }}</md-subheader
-                  >
-                  <md-button
-                    flex="25"
-                    ng-if="vm_cc.crudPermissions.canEdit"
-                    ng-click="vm_cc.createOrEditSugarcrmConfiguration($event)"
-                    class="md-icon-button"
-                    aria-label="create sugarcrmConfiguration"
-                  >
-                    <md-icon md-font-icon="icon-plus"></md-icon>
-                  </md-button>
-                </div>
-                <md-list>
-                  <md-list-item
-                    layout="row"
-                    layout-align="center center"
-                    ng-repeat="sugarcrmConfiguration in vm_cc.configurations"
-                    class="border-top"
-                    md-colors="{background: (vm_cc.selectedSugarcrmConfiguration == $index ? 'accent' : 'grey-A100')}"
-                    ng-click="vm_cc.getSugarcrmConfiguration($index)"
-                  >
-                    <span class="text-truncate" flex="80"
-                      >{{ sugarcrmConfiguration.name }}</span
-                    >
-                    <md-menu ng-if="vm_cc.crudPermissions.canDelete">
-                      <md-button
-                        class="md-icon-button"
-                        aria-label="More"
-                        translate
-                        translate-attr-aria-label="INTEGRATIONS.MORE"
-                        ng-click="$mdOpenMenu($event)"
-                      >
-                        <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                      </md-button>
-                      <md-menu-content width="3">
-                        <md-menu-item ng-if="vm_cc.crudPermissions.canDelete">
-                          <md-button
-                            ng-click="vm_cc.deleteSugarcrmConfiguration($event, sugarcrmConfiguration)"
-                            translate="INTEGRATIONS.DELETE_SUGARCRMCONFIGURATION"
-                          >
-                            Delete SugarcrmConfiguration
-                          </md-button>
-                        </md-menu-item>
-                      </md-menu-content>
-                    </md-menu>
-                  </md-list-item>
-                </md-list>
-              </md-card>
-              <div flex></div>
-              <md-card class="md-whiteframe-1dp" flex="65">
-                <md-tabs ng-if="vm_cc.configurations.length" md-dynamic-height>
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.SUBJECTS">SUBJECTS</span>
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-toolbar
-                        class="md-table-toolbar md-default no-padding"
-                        ng-hide="vm_cc.selectedSubjects.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <div flex></div>
-                          <ms-search-bar
-                            on-search="vm_cc.query.subject = query"
-                            on-collapse="vm_cc.query.subject = undefined"
-                            debounce="300"
-                          ></ms-search-bar>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canEdit"
-                            class="md-icon-button"
-                            ng-click="vm_cc.createOrEditSubject($event)"
-                            aria-label="add subject"
-                            translate
-                            translate-attr-label="INTEGRATIONS.ADD_SUBJECT"
-                          >
-                            <md-icon md-font-icon="icon-plus"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-toolbar
-                        class="md-table-toolbar md-accent"
-                        ng-show="vm_cc.selectedSubjects.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <span class="md-subhead"
-                            >{{vm_cc.selectedSubjects.length}}
-                            {{vm_cc.selectedSubjects.length > 1 ? 'items' :
-                            'item'}} selected</span
-                          >
-                          <div flex></div>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canDelete"
-                            class="md-icon-button"
-                            ng-click="vm_cc.deleteSelectedSubjects($event)"
-                            aria-label="delete selected"
-                            translate
-                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-                          >
-                            <md-icon md-font-icon="icon-delete"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-table-container
-                        class="md-whiteframe-1dp padding-horizontal"
-                      >
-                        <table
-                          md-table
-                          md-row-select
-                          multiple
-                          ng-model="vm_cc.selectedSubjects"
-                        >
-                          <thead md-head>
-                            <tr md-row>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.ID' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.TYPE' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.CONTENT' | translate }}
-                              </th>
-                              <th md-column width="10px"></th>
-                            </tr>
-                          </thead>
-                          <tbody md-body>
-                            <tr
-                              md-row
-                              md-select="subject"
-                              md-select-id="id"
-                              ng-repeat="subject in vm_cc.subjects | filter: vm_cc.query.subject"
-                            >
-                              <td
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                                class="id"
-                              >
-                                {{subject.id}}
-                              </td>
-                              <td
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                                class="type"
-                              >
-                                <span ng-if="subject.FieldId"
-                                  >{{subject.nameField ||
-                                  subject.idField}}</span
-                                >
-                                <span ng-if="!subject.FieldId"
-                                  >{{subject.type}}</span
-                                >
-                              </td>
-                              <td
-                                ng-switch="subject.type"
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                              >
-                                <span ng-switch-when="string"
-                                  >{{subject.content}}</span
-                                >
-                                <span
-                                  ng-switch-when="variable"
-                                  class="text-boxed"
-                                  >{{subject.variableName}}</span
-                                >
-                                <span
-                                  ng-switch-when="customVariable"
-                                  class="text-boxed"
-                                  >{{
-                                  vm_cc.variablesById[subject.VariableId].name
-                                  }}</span
-                                >
-                                <span ng-switch-when="keyValue">
-                                  {{subject.key}}
-                                  <span ng-switch="description.keyType">
-                                    <span ng-switch-when="string"
-                                      >{{subject.keyContent}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="variable"
-                                      class="text-boxed"
-                                      >{{subject.variableName}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="customVariable"
-                                      class="text-boxed"
-                                      >{{
-                                      vm_cc.variablesById[subject.VariableId].name
-                                      }}</span
-                                    >
-                                  </span>
-                                </span>
-                                <span ng-switch-default
-                                  >{{subject.content}}</span
-                                >
-                              </td>
-                              <td
-                                md-cell
-                                class="actions"
-                                ng-if="!vm_cc.crudPermissions.readOnly"
-                              >
-                                <md-menu>
-                                  <md-button
-                                    class="md-icon-button"
-                                    aria-label="More"
-                                    translate
-                                    translate-attr-aria-label="INTEGRATIONS.MORE"
-                                    ng-click="$mdOpenMenu($event)"
-                                  >
-                                    <md-icon
-                                      md-font-icon="icon-dots-vertical"
-                                    ></md-icon>
-                                  </md-button>
-
-                                  <md-menu-content width="3">
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canEdit"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                        translate="INTEGRATIONS.EDIT_SUBJECT"
-                                      >
-                                        Edit Subject
-                                      </md-button>
-                                    </md-menu-item>
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canDelete"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.deleteSubjectConfirm($event, subject)"
-                                        translate="INTEGRATIONS.DELETE_SUBJECT"
-                                      >
-                                        Delete Subject
-                                      </md-button>
-                                    </md-menu-item>
-                                  </md-menu-content>
-                                </md-menu>
-                              </td>
-                            </tr>
-                          </tbody>
-                        </table>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.DESCRIPTIONS"
-                        >DESCRIPTIONS</span
-                      >
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-toolbar
-                        class="md-table-toolbar md-default no-padding"
-                        ng-hide="vm_cc.selectedDescriptions.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <div flex></div>
-                          <ms-search-bar
-                            on-search="vm_cc.query.description = query"
-                            on-collapse="vm_cc.query.description = undefined"
-                            debounce="300"
-                          ></ms-search-bar>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canEdit"
-                            class="md-icon-button"
-                            ng-click="vm_cc.createOrEditDescription($event)"
-                            aria-label="add description"
-                            translate
-                            translate-attr-label="INTEGRATIONS.ADD_DESCRIPTION"
-                          >
-                            <md-icon md-font-icon="icon-plus"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-toolbar
-                        class="md-table-toolbar md-accent"
-                        ng-show="vm_cc.selectedDescriptions.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <span class="md-subhead"
-                            >{{vm_cc.selectedDescriptions.length}}
-                            {{vm_cc.selectedDescriptions.length > 1 ? 'items' :
-                            'item'}} selected</span
-                          >
-                          <div flex></div>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canDelete"
-                            class="md-icon-button"
-                            ng-click="vm_cc.deleteSelectedDescriptions($event)"
-                            aria-label="delete selected"
-                            translate
-                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-                          >
-                            <md-icon md-font-icon="icon-delete"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-table-container
-                        class="md-whiteframe-1dp padding-horizontal"
-                      >
-                        <table
-                          md-table
-                          md-row-select
-                          multiple
-                          ng-model="vm_cc.selectedDescriptions"
-                        >
-                          <thead md-head>
-                            <tr md-row>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.ID' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.TYPE' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.CONTENT' | translate }}
-                              </th>
-                              <th md-column width="10px"></th>
-                            </tr>
-                          </thead>
-                          <tbody md-body>
-                            <tr
-                              md-row
-                              md-select="description"
-                              md-select-id="id"
-                              ng-repeat="description in vm_cc.descriptions | filter: vm_cc.query.description"
-                            >
-                              <td
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                                class="id"
-                              >
-                                {{description.id}}
-                              </td>
-                              <td
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                                class="type"
-                              >
-                                <span ng-if="description.FieldId"
-                                  >{{description.nameField ||
-                                  description.idField}}</span
-                                >
-                                <span ng-if="!description.FieldId"
-                                  >{{description.type}}</span
-                                >
-                              </td>
-                              <td
-                                ng-switch="description.type"
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                              >
-                                <span ng-switch-when="string"
-                                  >{{description.content}}</span
-                                >
-                                <span
-                                  ng-switch-when="variable"
-                                  class="text-boxed"
-                                  >{{description.variableName}}</span
-                                >
-                                <span
-                                  ng-switch-when="customVariable"
-                                  class="text-boxed"
-                                  >{{
-                                  vm_cc.variablesById[description.VariableId].name
-                                  }}</span
-                                >
-                                <span ng-switch-when="keyValue">
-                                  {{description.key}}
-                                  <span ng-switch="description.keyType">
-                                    <span ng-switch-when="string"
-                                      >{{description.keyContent}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="variable"
-                                      class="text-boxed"
-                                      >{{description.variableName}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="customVariable"
-                                      class="text-boxed"
-                                      >{{
-                                      vm_cc.variablesById[description.VariableId].name
-                                      }}</span
-                                    >
-                                  </span>
-                                </span>
-                                <span ng-switch-default
-                                  >{{description.content}}</span
-                                >
-                              </td>
-                              <td
-                                md-cell
-                                class="actions"
-                                ng-if="!vm_cc.crudPermissions.readOnly"
-                              >
-                                <md-menu>
-                                  <md-button
-                                    class="md-icon-button"
-                                    aria-label="More"
-                                    translate
-                                    translate-attr-aria-label="INTEGRATIONS.MORE"
-                                    ng-click="$mdOpenMenu($event)"
-                                  >
-                                    <md-icon
-                                      md-font-icon="icon-dots-vertical"
-                                    ></md-icon>
-                                  </md-button>
-
-                                  <md-menu-content width="3">
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canEdit"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.createOrEditDescription($event, description)"
-                                        translate="INTEGRATIONS.EDIT_DESCRIPTION"
-                                      >
-                                        Edit Description
-                                      </md-button>
-                                    </md-menu-item>
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canDelete"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.deleteDescriptionConfirm($event, description)"
-                                        translate="INTEGRATIONS.DELETE_DESCRIPTION"
-                                      >
-                                        Delete Description
-                                      </md-button>
-                                    </md-menu-item>
-                                  </md-menu-content>
-                                </md-menu>
-                              </td>
-                            </tr>
-                          </tbody>
-                        </table>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.FIELDS">FIELDS</span>
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-toolbar
-                        class="md-table-toolbar md-default no-padding"
-                        ng-hide="vm_cc.selectedFields.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <div flex></div>
-                          <ms-search-bar
-                            on-search="vm_cc.query.field = query"
-                            on-collapse="vm_cc.query.field = undefined"
-                            debounce="300"
-                          ></ms-search-bar>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canEdit"
-                            class="md-icon-button"
-                            ng-click="vm_cc.createOrEditField($event)"
-                            aria-label="add field"
-                            translate
-                            translate-attr-label="INTEGRATIONS.ADD_FIELD"
-                          >
-                            <md-icon md-font-icon="icon-plus"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-toolbar
-                        class="md-table-toolbar md-accent"
-                        ng-show="vm_cc.selectedFields.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <span class="md-subhead"
-                            >{{vm_cc.selectedFields.length}}
-                            {{vm_cc.selectedFields.length > 1 ? 'items' :
-                            'item'}} selected</span
-                          >
-                          <div flex></div>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canDelete"
-                            class="md-icon-button"
-                            ng-click="vm_cc.deleteSelectedFields($event)"
-                            aria-label="delete selected"
-                            translate
-                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-                          >
-                            <md-icon md-font-icon="icon-delete"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-table-container
-                        class="md-whiteframe-1dp padding-horizontal"
-                      >
-                        <table
-                          md-table
-                          md-row-select
-                          multiple
-                          ng-model="vm_cc.selectedFields"
-                        >
-                          <thead md-head>
-                            <tr md-row>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.ID' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.TYPE' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.CONTENT' | translate }}
-                              </th>
-                              <th md-column width="10px"></th>
-                            </tr>
-                          </thead>
-                          <tbody md-body>
-                            <tr
-                              md-row
-                              md-select="field"
-                              md-select-id="id"
-                              ng-repeat="field in vm_cc.fields | filter: vm_cc.query.field"
-                            >
-                              <td
-                                ng-click="vm_cc.createOrEditField($event, field)"
-                                md-cell
-                                class="id"
-                              >
-                                {{field.id}}
-                              </td>
-                              <td
-                                ng-click="vm_cc.createOrEditField($event, field)"
-                                md-cell
-                                class="type"
-                              >
-                                <span ng-if="field.FieldId"
-                                  >{{field.nameField || field.idField}}</span
-                                >
-                                <span ng-if="!field.FieldId"
-                                  >{{field.type}}</span
-                                >
-                              </td>
-                              <td
-                                ng-switch="field.type"
-                                ng-click="vm_cc.createOrEditField($event, field)"
-                                md-cell
-                              >
-                                <span ng-switch-when="string"
-                                  >{{field.content}}</span
-                                >
-                                <span
-                                  ng-switch-when="variable"
-                                  class="text-boxed"
-                                  >{{field.variableName}}</span
-                                >
-                                <span
-                                  ng-switch-when="customVariable"
-                                  class="text-boxed"
-                                  >{{ vm_cc.variablesById[field.VariableId].name
-                                  }}</span
-                                >
-                                <span ng-switch-when="keyValue">
-                                  {{field.key}}
-                                  <span ng-switch="description.keyType">
-                                    <span ng-switch-when="string"
-                                      >{{field.keyContent}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="variable"
-                                      class="text-boxed"
-                                      >{{field.variableName}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="customVariable"
-                                      class="text-boxed"
-                                      >{{
-                                      vm_cc.variablesById[field.VariableId].name
-                                      }}</span
-                                    >
-                                  </span>
-                                </span>
-                                <span ng-switch-default>{{field.content}}</span>
-                              </td>
-                              <td
-                                md-cell
-                                class="actions"
-                                ng-if="!vm_cc.crudPermissions.readOnly"
-                              >
-                                <md-menu>
-                                  <md-button
-                                    class="md-icon-button"
-                                    aria-label="More"
-                                    translate
-                                    translate-attr-aria-label="INTEGRATIONS.MORE"
-                                    ng-click="$mdOpenMenu($event)"
-                                  >
-                                    <md-icon
-                                      md-font-icon="icon-dots-vertical"
-                                    ></md-icon>
-                                  </md-button>
-
-                                  <md-menu-content width="3">
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canEdit"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.createOrEditField($event, field)"
-                                        translate="INTEGRATIONS.EDIT_FIELD"
-                                      >
-                                        Edit Field
-                                      </md-button>
-                                    </md-menu-item>
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canDelete"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.deleteFieldConfirm($event, field)"
-                                        translate="INTEGRATIONS.DELETE_FIELD"
-                                      >
-                                        Delete Field
-                                      </md-button>
-                                    </md-menu-item>
-                                  </md-menu-content>
-                                </md-menu>
-                              </td>
-                            </tr>
-                          </tbody>
-                        </table>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-                </md-tabs>
-                <div
-                  class="padding-20"
-                  ng-if="!vm_cc.configurations.length && vm_cc.crudPermissions.canEdit"
-                  ng-click="vm_cc.createOrEditSugarcrmConfiguration($event)"
-                  layout="row"
-                  layout-sm="column"
-                  layout-align="center center"
-                  layout-wrap
-                >
-                  <div
-                    class="padding-20 md-whiteframe-3dp md-accent-bg"
-                    layout="column"
-                    layout-align="center center"
-                  >
-                    <md-button class="md-icon-button">
-                      <md-icon md-font-icon="icon-plus"></md-icon>
-                    </md-button>
-                    <span
-                      aria-label="add configuration"
-                      translate
-                      translate-attr-label="INTEGRATIONS.ADD_CONFIGURATION"
-                      >ADD CONFIGURATION</span
-                    >
-                  </div>
-                </div>
-              </md-card>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/edit/view.html/view.html b/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/edit/view.html/view.html
new file mode 100644
index 0000000..f6ef1bb
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/edit/view.html/view.html
@@ -0,0 +1,925 @@
+<div
+  id="integrations-sugarcrmAccount"
+  class="page-layout simple tabbed"
+  layout="column"
+>
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-sugarcrmAccounts-button md-icon-button"
+        aria-label="Go to sugarcrmAccounts"
+        ng-click="vm.gotoSugarcrmAccounts()"
+        translate
+        translate-attr-aria-label="INTEGRATIONS.GO_TO_SUGARCRMACCOUNTS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="sugarcrmAccount-image" hide-xs>
+          <img ng-src="assets/images/business/sugarcrmAccounts.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.sugarcrmAccount.id}}
+            <span ng-if="vm.sugarcrmAccount.name"
+              >{{vm.sugarcrmAccount.name}}</span
+            >
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="INTEGRATIONS.CREATED_AT"></span>
+            <span>{{vm.sugarcrmAccount.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveSugarcrmAccount()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (configurationsForm.$invalid)"
+        translate="INTEGRATIONS.SAVE"
+        translate-attr-aria-label="INTEGRATIONS.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="INTEGRATIONS.ACCOUNT">ACCOUNT</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="sugarcrmAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="INTEGRATIONS.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.sugarcrmAccount.name"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.USERNAME">Username</label>
+                <input
+                  type="text"
+                  name="username"
+                  ng-model="vm.sugarcrmAccount.username"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['username'].$error"
+                  ng-show="generalForm['username'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
+                      >Username field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.URI">Uri</label>
+                <input
+                  type="url"
+                  name="remoteUri"
+                  ng-model="vm.sugarcrmAccount.remoteUri"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['remoteUri'].$error"
+                  ng-show="generalForm['remoteUri'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
+                      >Uri field is required</span
+                    >
+                  </div>
+                  <div ng-message="url">
+                    <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
+                      >Uri must be a valid url http://www.xcally.com</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.PASSWORD">Password</label>
+                <input
+                  type="password"
+                  name="password"
+                  ng-model="vm.sugarcrmAccount.password"
+                  placeholder="Password"
+                  translate
+                  translate-attr-placeholder="INTEGRATIONS.PASSWORD"
+                  required
+                />
+                <div ng-messages="generalForm['password'].$error" role="alert">
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.PASSWORD_REQUIRED"
+                      >Password field is required</span
+                    >
+                  </div>
+                  <div ng-message="pattern">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.SECURE_PASSWORD_PATTERN"
+                      >Must contain at least 8 characters, with a minimum of 1
+                      lowercase letter, 1 uppercase letter, 1 numeric character
+                      and 1 special character ~!?*@#$%^&-_=+[{]}.</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
+                  >MotionProxyAddress</label
+                >
+                <input
+                  type="url"
+                  name="serverUrl"
+                  ng-model="vm.sugarcrmAccount.serverUrl"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['serverUrl'].$error"
+                  ng-show="generalForm['serverUrl'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
+                      >MotionProxyAddress field is required</span
+                    >
+                  </div>
+                  <div ng-message="url">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
+                      >MotionProxyAddress must be a valid url
+                      http://www.xcally.com</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.sugarcrmAccount.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="INTEGRATIONS.CONFIGURATIONS">CONFIGURATIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="sugarcrmAccount-detail-form-container configurations md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div
+                class="h2 secondary-text"
+                translate="INTEGRATIONS.CONFIGURATIONS"
+              >
+                CONFIGURATIONS
+              </div>
+            </div>
+            <div
+              ng-controller="SugarcrmAccountConfigurationsController as vm_cc"
+              ng-init="vm_cc.init(vm.sugarcrmAccount, vm.crudPermissions)"
+              layout="row"
+            >
+              <md-card class="md-whiteframe-1dp" flex="30">
+                <div layout="row" layout-align="center center">
+                  <md-subheader flex="75" class="md-no-sticky"
+                    >{{ 'INTEGRATIONS.CONFIGURATIONS' | translate
+                    }}</md-subheader
+                  >
+                  <md-button
+                    flex="25"
+                    ng-if="vm_cc.crudPermissions.canEdit"
+                    ng-click="vm_cc.createOrEditSugarcrmConfiguration($event)"
+                    class="md-icon-button"
+                    aria-label="create sugarcrmConfiguration"
+                  >
+                    <md-icon md-font-icon="icon-plus"></md-icon>
+                  </md-button>
+                </div>
+                <md-list>
+                  <md-list-item
+                    layout="row"
+                    layout-align="center center"
+                    ng-repeat="sugarcrmConfiguration in vm_cc.configurations"
+                    class="border-top"
+                    md-colors="{background: (vm_cc.selectedSugarcrmConfiguration == $index ? 'accent' : 'grey-A100')}"
+                    ng-click="vm_cc.getSugarcrmConfiguration($index)"
+                  >
+                    <span class="text-truncate" flex="80"
+                      >{{ sugarcrmConfiguration.name }}</span
+                    >
+                    <md-menu ng-if="vm_cc.crudPermissions.canDelete">
+                      <md-button
+                        class="md-icon-button"
+                        aria-label="More"
+                        translate
+                        translate-attr-aria-label="INTEGRATIONS.MORE"
+                        ng-click="$mdOpenMenu($event)"
+                      >
+                        <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                      </md-button>
+                      <md-menu-content width="3">
+                        <md-menu-item ng-if="vm_cc.crudPermissions.canDelete">
+                          <md-button
+                            ng-click="vm_cc.deleteSugarcrmConfiguration($event, sugarcrmConfiguration)"
+                            translate="INTEGRATIONS.DELETE_SUGARCRMCONFIGURATION"
+                          >
+                            Delete SugarcrmConfiguration
+                          </md-button>
+                        </md-menu-item>
+                      </md-menu-content>
+                    </md-menu>
+                  </md-list-item>
+                </md-list>
+              </md-card>
+              <div flex></div>
+              <md-card class="md-whiteframe-1dp" flex="65">
+                <md-tabs ng-if="vm_cc.configurations.length" md-dynamic-height>
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.SUBJECTS">SUBJECTS</span>
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedSubjects.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.subject = query"
+                            on-collapse="vm_cc.query.subject = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditSubject($event)"
+                            aria-label="add subject"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_SUBJECT"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedSubjects.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedSubjects.length}}
+                            {{vm_cc.selectedSubjects.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedSubjects($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedSubjects"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.ID' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.TYPE' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.CONTENT' | translate }}
+                              </th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="subject"
+                              md-select-id="id"
+                              ng-repeat="subject in vm_cc.subjects | filter: vm_cc.query.subject"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                                class="id"
+                              >
+                                {{subject.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="subject.FieldId"
+                                  >{{subject.nameField ||
+                                  subject.idField}}</span
+                                >
+                                <span ng-if="!subject.FieldId"
+                                  >{{subject.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="subject.type"
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{subject.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{subject.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{
+                                  vm_cc.variablesById[subject.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{subject.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{subject.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{subject.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[subject.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default
+                                  >{{subject.content}}</span
+                                >
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="INTEGRATIONS.MORE"
+                                    ng-click="$mdOpenMenu($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                        translate="INTEGRATIONS.EDIT_SUBJECT"
+                                      >
+                                        Edit Subject
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteSubjectConfirm($event, subject)"
+                                        translate="INTEGRATIONS.DELETE_SUBJECT"
+                                      >
+                                        Delete Subject
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.DESCRIPTIONS"
+                        >DESCRIPTIONS</span
+                      >
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedDescriptions.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.description = query"
+                            on-collapse="vm_cc.query.description = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditDescription($event)"
+                            aria-label="add description"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_DESCRIPTION"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedDescriptions.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedDescriptions.length}}
+                            {{vm_cc.selectedDescriptions.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedDescriptions($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedDescriptions"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.ID' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.TYPE' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.CONTENT' | translate }}
+                              </th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="description"
+                              md-select-id="id"
+                              ng-repeat="description in vm_cc.descriptions | filter: vm_cc.query.description"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                                class="id"
+                              >
+                                {{description.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="description.FieldId"
+                                  >{{description.nameField ||
+                                  description.idField}}</span
+                                >
+                                <span ng-if="!description.FieldId"
+                                  >{{description.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="description.type"
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{description.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{description.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{
+                                  vm_cc.variablesById[description.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{description.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{description.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{description.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[description.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default
+                                  >{{description.content}}</span
+                                >
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="INTEGRATIONS.MORE"
+                                    ng-click="$mdOpenMenu($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditDescription($event, description)"
+                                        translate="INTEGRATIONS.EDIT_DESCRIPTION"
+                                      >
+                                        Edit Description
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteDescriptionConfirm($event, description)"
+                                        translate="INTEGRATIONS.DELETE_DESCRIPTION"
+                                      >
+                                        Delete Description
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.FIELDS">FIELDS</span>
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedFields.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.field = query"
+                            on-collapse="vm_cc.query.field = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditField($event)"
+                            aria-label="add field"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_FIELD"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedFields.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedFields.length}}
+                            {{vm_cc.selectedFields.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedFields($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedFields"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.ID' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.TYPE' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.CONTENT' | translate }}
+                              </th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="field"
+                              md-select-id="id"
+                              ng-repeat="field in vm_cc.fields | filter: vm_cc.query.field"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditField($event, field)"
+                                md-cell
+                                class="id"
+                              >
+                                {{field.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditField($event, field)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="field.FieldId"
+                                  >{{field.nameField || field.idField}}</span
+                                >
+                                <span ng-if="!field.FieldId"
+                                  >{{field.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="field.type"
+                                ng-click="vm_cc.createOrEditField($event, field)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{field.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{field.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{ vm_cc.variablesById[field.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{field.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{field.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{field.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[field.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default>{{field.content}}</span>
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="INTEGRATIONS.MORE"
+                                    ng-click="$mdOpenMenu($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditField($event, field)"
+                                        translate="INTEGRATIONS.EDIT_FIELD"
+                                      >
+                                        Edit Field
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteFieldConfirm($event, field)"
+                                        translate="INTEGRATIONS.DELETE_FIELD"
+                                      >
+                                        Delete Field
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+                </md-tabs>
+                <div
+                  class="padding-20"
+                  ng-if="!vm_cc.configurations.length && vm_cc.crudPermissions.canEdit"
+                  ng-click="vm_cc.createOrEditSugarcrmConfiguration($event)"
+                  layout="row"
+                  layout-sm="column"
+                  layout-align="center center"
+                  layout-wrap
+                >
+                  <div
+                    class="padding-20 md-whiteframe-3dp md-accent-bg"
+                    layout="column"
+                    layout-align="center center"
+                  >
+                    <md-button class="md-icon-button">
+                      <md-icon md-font-icon="icon-plus"></md-icon>
+                    </md-button>
+                    <span
+                      aria-label="add configuration"
+                      translate
+                      translate-attr-label="INTEGRATIONS.ADD_CONFIGURATION"
+                      >ADD CONFIGURATION</span
+                    >
+                  </div>
+                </div>
+              </md-card>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/sugarcrmAccounts.html/sugarcrmAccounts-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/sugarcrmAccounts.html/sugarcrmAccounts-[chunkhash].html
deleted file mode 100644
index e305658..0000000
--- a/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/sugarcrmAccounts.html/sugarcrmAccounts-[chunkhash].html
+++ /dev/null
@@ -1,323 +0,0 @@
-<div
-  id="sugarcrmAccounts"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-heart" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="INTEGRATIONS.SUGARCRMACCOUNTS"
-          >SugarcrmAccounts</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="INTEGRATIONS.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedSugarcrmAccounts.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div
-      class="close-button-wrapper"
-      ng-click="vm.selectedSugarcrmAccounts =[]"
-    >
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="INTEGRATIONS.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-sugarcrmAccounts-count">
-          <span>{{vm.selectedSugarcrmAccounts.length}}</span>
-          <span translate="INTEGRATIONS.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="INTEGRATIONS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllSugarcrmAccounts()"
-                translate="INTEGRATIONS.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectSugarcrmAccounts()"
-                translate="INTEGRATIONS.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedSugarcrmAccounts"
-          csv-label="true"
-          filename="sugarcrmAccounts.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedSugarcrmAccounts($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- SUGARCRMACCOUNT TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedSugarcrmAccounts"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getSugarcrmAccounts"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">
-                  {{ 'INTEGRATIONS.ID' | translate }}
-                </th>
-                <th md-column md-order-by="name">
-                  {{ 'INTEGRATIONS.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="username">
-                  {{ 'INTEGRATIONS.USERNAME' | translate }}
-                </th>
-                <th md-column md-order-by="remoteUri">
-                  {{ 'INTEGRATIONS.URI' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.sugarcrmAccounts.rows.length">
-                <td md-cell colspan="5">
-                  <div layout="row" layout-align="center center">
-                    <span translate="INTEGRATIONS.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="sugarcrmAccount"
-                md-select-id="id"
-                ng-repeat="sugarcrmAccount in vm.sugarcrmAccounts.rows"
-              >
-                <td md-cell ng-if="sugarcrmAccount.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{sugarcrmAccount.name}}"
-                    ng-src="api/users/{{sugarcrmAccount.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!sugarcrmAccount.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{sugarcrmAccount.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(sugarcrmAccount, ev) : vm.createOrEditSugarcrmAccount($event, sugarcrmAccount)"
-                  md-cell
-                  class="id"
-                >
-                  {{sugarcrmAccount.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(sugarcrmAccount, ev) : vm.createOrEditSugarcrmAccount($event, sugarcrmAccount)"
-                  md-cell
-                  class="name"
-                >
-                  {{sugarcrmAccount.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(sugarcrmAccount, ev) : vm.createOrEditSugarcrmAccount($event, sugarcrmAccount)"
-                  md-cell
-                  class="username"
-                >
-                  {{sugarcrmAccount.username}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(sugarcrmAccount, ev) : vm.createOrEditSugarcrmAccount($event, sugarcrmAccount)"
-                  md-cell
-                  class="remoteUri"
-                >
-                  {{sugarcrmAccount.remoteUri}}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="INTEGRATIONS.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(sugarcrmAccount, $event    )"
-                          translate="INTEGRATIONS.EDIT_SUGARCRMACCOUNT"
-                        >
-                          Edit SugarcrmAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.testtestintegrationaccount(sugarcrmAccount, $event    )"
-                          translate="INTEGRATIONS.TEST_SUGARCRMACCOUNT"
-                        >
-                          Test SugarcrmAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.deleteconfirm(sugarcrmAccount, $event    )"
-                          translate="INTEGRATIONS.DELETE_SUGARCRMACCOUNT"
-                        >
-                          Delete SugarcrmAccount
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'INTEGRATIONS.PAGE' | translate}}:', rowsPerPage: '{{'INTEGRATIONS.ROWSPERPAGE' | translate}}:', of: '{{'INTEGRATIONS.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.sugarcrmAccounts.count}}"
-          md-on-paginate="vm.getSugarcrmAccounts"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / SUGARCRMACCOUNT TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD SUGARCRMACCOUNT BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-sugarcrmAccount-button"
-    ng-click="vm.createOrEditSugarcrmAccount($event)"
-    aria-label="add sugarcrmAccount"
-    translate
-    translate-attr-aria-label="INTEGRATIONS.ADD_SUGARCRMACCOUNT"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD SUGARCRMACCOUNT BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/sugarcrmAccounts.html/sugarcrmAccounts.html b/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/sugarcrmAccounts.html/sugarcrmAccounts.html
new file mode 100644
index 0000000..e305658
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/sugarcrmAccounts/sugarcrmAccounts.html/sugarcrmAccounts.html
@@ -0,0 +1,323 @@
+<div
+  id="sugarcrmAccounts"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-heart" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="INTEGRATIONS.SUGARCRMACCOUNTS"
+          >SugarcrmAccounts</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="INTEGRATIONS.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedSugarcrmAccounts.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div
+      class="close-button-wrapper"
+      ng-click="vm.selectedSugarcrmAccounts =[]"
+    >
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="INTEGRATIONS.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-sugarcrmAccounts-count">
+          <span>{{vm.selectedSugarcrmAccounts.length}}</span>
+          <span translate="INTEGRATIONS.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="INTEGRATIONS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllSugarcrmAccounts()"
+                translate="INTEGRATIONS.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectSugarcrmAccounts()"
+                translate="INTEGRATIONS.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedSugarcrmAccounts"
+          csv-label="true"
+          filename="sugarcrmAccounts.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedSugarcrmAccounts($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- SUGARCRMACCOUNT TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedSugarcrmAccounts"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getSugarcrmAccounts"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">
+                  {{ 'INTEGRATIONS.ID' | translate }}
+                </th>
+                <th md-column md-order-by="name">
+                  {{ 'INTEGRATIONS.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="username">
+                  {{ 'INTEGRATIONS.USERNAME' | translate }}
+                </th>
+                <th md-column md-order-by="remoteUri">
+                  {{ 'INTEGRATIONS.URI' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.sugarcrmAccounts.rows.length">
+                <td md-cell colspan="5">
+                  <div layout="row" layout-align="center center">
+                    <span translate="INTEGRATIONS.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="sugarcrmAccount"
+                md-select-id="id"
+                ng-repeat="sugarcrmAccount in vm.sugarcrmAccounts.rows"
+              >
+                <td md-cell ng-if="sugarcrmAccount.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{sugarcrmAccount.name}}"
+                    ng-src="api/users/{{sugarcrmAccount.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!sugarcrmAccount.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{sugarcrmAccount.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(sugarcrmAccount, ev) : vm.createOrEditSugarcrmAccount($event, sugarcrmAccount)"
+                  md-cell
+                  class="id"
+                >
+                  {{sugarcrmAccount.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(sugarcrmAccount, ev) : vm.createOrEditSugarcrmAccount($event, sugarcrmAccount)"
+                  md-cell
+                  class="name"
+                >
+                  {{sugarcrmAccount.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(sugarcrmAccount, ev) : vm.createOrEditSugarcrmAccount($event, sugarcrmAccount)"
+                  md-cell
+                  class="username"
+                >
+                  {{sugarcrmAccount.username}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(sugarcrmAccount, ev) : vm.createOrEditSugarcrmAccount($event, sugarcrmAccount)"
+                  md-cell
+                  class="remoteUri"
+                >
+                  {{sugarcrmAccount.remoteUri}}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="INTEGRATIONS.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(sugarcrmAccount, $event    )"
+                          translate="INTEGRATIONS.EDIT_SUGARCRMACCOUNT"
+                        >
+                          Edit SugarcrmAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.testtestintegrationaccount(sugarcrmAccount, $event    )"
+                          translate="INTEGRATIONS.TEST_SUGARCRMACCOUNT"
+                        >
+                          Test SugarcrmAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.deleteconfirm(sugarcrmAccount, $event    )"
+                          translate="INTEGRATIONS.DELETE_SUGARCRMACCOUNT"
+                        >
+                          Delete SugarcrmAccount
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'INTEGRATIONS.PAGE' | translate}}:', rowsPerPage: '{{'INTEGRATIONS.ROWSPERPAGE' | translate}}:', of: '{{'INTEGRATIONS.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.sugarcrmAccounts.count}}"
+          md-on-paginate="vm.getSugarcrmAccounts"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / SUGARCRMACCOUNT TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD SUGARCRMACCOUNT BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-sugarcrmAccount-button"
+    ng-click="vm.createOrEditSugarcrmAccount($event)"
+    aria-label="add sugarcrmAccount"
+    translate
+    translate-attr-aria-label="INTEGRATIONS.ADD_SUGARCRMACCOUNT"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD SUGARCRMACCOUNT BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 3c07f6a..0000000
--- a/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,256 +0,0 @@
-<md-dialog class="vtigerAccount-dialog" aria-label="New VtigerAccount">
-  <form name="vtigerAccountForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.vtigerAccount.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="vtigerAccountForm['name'].$error"
-          ng-show="vtigerAccountForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.vtigerAccount.description"
-        />
-
-        <div
-          ng-messages="vtigerAccountForm['description'].$error"
-          ng-show="vtigerAccountForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.VTIGER_USER_NAME"
-          >vTiger_User_Name</label
-        >
-        <input
-          type="text"
-          name="username"
-          ng-model="vm.vtigerAccount.username"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="vtigerAccountForm['username'].$error"
-          ng-show="vtigerAccountForm['username'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.VTIGER_USER_NAME_REQUIRED"
-              >vTiger_User_Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.ACCESS_KEY">Access_Key</label>
-        <input
-          type="text"
-          name="accessKey"
-          ng-model="vm.vtigerAccount.accessKey"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="vtigerAccountForm['accessKey'].$error"
-          ng-show="vtigerAccountForm['accessKey'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.ACCESS_KEY_REQUIRED"
-              >Access_Key field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.HOST">Host</label>
-        <input
-          type="url"
-          name="remoteUri"
-          ng-model="vm.vtigerAccount.remoteUri"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="vtigerAccountForm['remoteUri'].$error"
-          ng-show="vtigerAccountForm['remoteUri'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.HOST_REQUIRED"
-              >Host field is required</span
-            >
-          </div>
-          <div ng-message="url">
-            <span translate="INTEGRATIONS.ERRORS.HOST_MUST_VALID_URL"
-              >Host must be a valid url http://www.xcally.com</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
-          >MotionProxyAddress</label
-        >
-        <input
-          type="url"
-          name="serverUrl"
-          ng-model="vm.vtigerAccount.serverUrl"
-        />
-
-        <div class="hint">
-          <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
-        </div>
-        <div
-          ng-messages="vtigerAccountForm['serverUrl'].$error"
-          ng-show="vtigerAccountForm['serverUrl'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
-              >MotionProxyAddress field is required</span
-            >
-          </div>
-          <div ng-message="url">
-            <span
-              translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
-              >MotionProxyAddress must be a valid url
-              http://www.xcally.com</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newVtigerAccount"
-          ng-click="vm.saveVtigerAccount()"
-          class="send-button md-accent md-raised"
-          ng-disabled="vtigerAccountForm.$invalid || vtigerAccountForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newVtigerAccount"
-          ng-click="vm.addNewVtigerAccount()"
-          class="send-button md-accent md-raised"
-          ng-disabled="vtigerAccountForm.$invalid"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD_VTIGERACCOUNT"
-          translate-attr-aria-label="INTEGRATIONS.ADD_VTIGERACCOUNT"
-        >
-          ADD VTIGERACCOUNT
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newVtigerAccount"
-          ng-click="vm.deleteVtigerAccount($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/create/dialog.html/dialog.html
new file mode 100644
index 0000000..3c07f6a
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/create/dialog.html/dialog.html
@@ -0,0 +1,256 @@
+<md-dialog class="vtigerAccount-dialog" aria-label="New VtigerAccount">
+  <form name="vtigerAccountForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.vtigerAccount.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="vtigerAccountForm['name'].$error"
+          ng-show="vtigerAccountForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.vtigerAccount.description"
+        />
+
+        <div
+          ng-messages="vtigerAccountForm['description'].$error"
+          ng-show="vtigerAccountForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.VTIGER_USER_NAME"
+          >vTiger_User_Name</label
+        >
+        <input
+          type="text"
+          name="username"
+          ng-model="vm.vtigerAccount.username"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="vtigerAccountForm['username'].$error"
+          ng-show="vtigerAccountForm['username'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.VTIGER_USER_NAME_REQUIRED"
+              >vTiger_User_Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.ACCESS_KEY">Access_Key</label>
+        <input
+          type="text"
+          name="accessKey"
+          ng-model="vm.vtigerAccount.accessKey"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="vtigerAccountForm['accessKey'].$error"
+          ng-show="vtigerAccountForm['accessKey'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.ACCESS_KEY_REQUIRED"
+              >Access_Key field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.HOST">Host</label>
+        <input
+          type="url"
+          name="remoteUri"
+          ng-model="vm.vtigerAccount.remoteUri"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="vtigerAccountForm['remoteUri'].$error"
+          ng-show="vtigerAccountForm['remoteUri'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.HOST_REQUIRED"
+              >Host field is required</span
+            >
+          </div>
+          <div ng-message="url">
+            <span translate="INTEGRATIONS.ERRORS.HOST_MUST_VALID_URL"
+              >Host must be a valid url http://www.xcally.com</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
+          >MotionProxyAddress</label
+        >
+        <input
+          type="url"
+          name="serverUrl"
+          ng-model="vm.vtigerAccount.serverUrl"
+        />
+
+        <div class="hint">
+          <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
+        </div>
+        <div
+          ng-messages="vtigerAccountForm['serverUrl'].$error"
+          ng-show="vtigerAccountForm['serverUrl'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
+              >MotionProxyAddress field is required</span
+            >
+          </div>
+          <div ng-message="url">
+            <span
+              translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
+              >MotionProxyAddress must be a valid url
+              http://www.xcally.com</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newVtigerAccount"
+          ng-click="vm.saveVtigerAccount()"
+          class="send-button md-accent md-raised"
+          ng-disabled="vtigerAccountForm.$invalid || vtigerAccountForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newVtigerAccount"
+          ng-click="vm.addNewVtigerAccount()"
+          class="send-button md-accent md-raised"
+          ng-disabled="vtigerAccountForm.$invalid"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD_VTIGERACCOUNT"
+          translate-attr-aria-label="INTEGRATIONS.ADD_VTIGERACCOUNT"
+        >
+          ADD VTIGERACCOUNT
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newVtigerAccount"
+          ng-click="vm.deleteVtigerAccount($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index a4a8663..0000000
--- a/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,183 +0,0 @@
-<md-dialog
-  class="vtigerConfiguration-dialog"
-  aria-label="New VtigerConfiguration"
->
-  <form name="vtigerConfigurationForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.NAME">Name</label>
-        <input
-          type=""
-          name="name"
-          ng-model="vm.vtigerConfiguration.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="vtigerConfigurationForm['name'].$error"
-          ng-show="vtigerConfigurationForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.CHANNEL">Channel</label>
-        <md-select
-          name="channel"
-          ng-model="vm.vtigerConfiguration.channel"
-          required
-        >
-          <md-option ng-value="'voice'">
-            {{ 'INTEGRATIONS.VOICE' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="vtigerConfigurationForm['channel'].$error"
-          ng-show="vtigerConfigurationForm['channel'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.CHANNEL_REQUIRED"
-              >Channel field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.TYPE">Type</label>
-        <md-select name="type" ng-model="vm.vtigerConfiguration.type" required>
-          <md-option ng-value="'inbound'">
-            {{ 'INTEGRATIONS.INBOUND_IN_QUEUE' | translate }}
-          </md-option>
-
-          <md-option ng-value="'outbound'">
-            {{ 'INTEGRATIONS.OUTBOUND_CALL' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="vtigerConfigurationForm['type'].$error"
-          ng-show="vtigerConfigurationForm['type'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-              >Type field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newVtigerConfiguration"
-          ng-click="vm.saveVtigerConfiguration()"
-          class="send-button md-accent md-raised"
-          ng-disabled="vtigerConfigurationForm.$invalid || vtigerConfigurationForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newVtigerConfiguration"
-          ng-click="vm.addNewVtigerConfiguration()"
-          class="send-button md-accent md-raised"
-          ng-disabled="vtigerConfigurationForm.$invalid"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD_VTIGERCONFIGURATION"
-          translate-attr-aria-label="INTEGRATIONS.ADD_VTIGERCONFIGURATION"
-        >
-          ADD VTIGERCONFIGURATION
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newVtigerConfiguration"
-          ng-click="vm.deleteVtigerConfiguration($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/edit/configurations/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/edit/configurations/dialog.html/dialog.html
new file mode 100644
index 0000000..a4a8663
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/edit/configurations/dialog.html/dialog.html
@@ -0,0 +1,183 @@
+<md-dialog
+  class="vtigerConfiguration-dialog"
+  aria-label="New VtigerConfiguration"
+>
+  <form name="vtigerConfigurationForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.NAME">Name</label>
+        <input
+          type=""
+          name="name"
+          ng-model="vm.vtigerConfiguration.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="vtigerConfigurationForm['name'].$error"
+          ng-show="vtigerConfigurationForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.CHANNEL">Channel</label>
+        <md-select
+          name="channel"
+          ng-model="vm.vtigerConfiguration.channel"
+          required
+        >
+          <md-option ng-value="'voice'">
+            {{ 'INTEGRATIONS.VOICE' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="vtigerConfigurationForm['channel'].$error"
+          ng-show="vtigerConfigurationForm['channel'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.CHANNEL_REQUIRED"
+              >Channel field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.TYPE">Type</label>
+        <md-select name="type" ng-model="vm.vtigerConfiguration.type" required>
+          <md-option ng-value="'inbound'">
+            {{ 'INTEGRATIONS.INBOUND_IN_QUEUE' | translate }}
+          </md-option>
+
+          <md-option ng-value="'outbound'">
+            {{ 'INTEGRATIONS.OUTBOUND_CALL' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="vtigerConfigurationForm['type'].$error"
+          ng-show="vtigerConfigurationForm['type'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+              >Type field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newVtigerConfiguration"
+          ng-click="vm.saveVtigerConfiguration()"
+          class="send-button md-accent md-raised"
+          ng-disabled="vtigerConfigurationForm.$invalid || vtigerConfigurationForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newVtigerConfiguration"
+          ng-click="vm.addNewVtigerConfiguration()"
+          class="send-button md-accent md-raised"
+          ng-disabled="vtigerConfigurationForm.$invalid"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD_VTIGERCONFIGURATION"
+          translate-attr-aria-label="INTEGRATIONS.ADD_VTIGERCONFIGURATION"
+        >
+          ADD VTIGERCONFIGURATION
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newVtigerConfiguration"
+          ng-click="vm.deleteVtigerConfiguration($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/edit/item/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/edit/item/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index e5dc68a..0000000
--- a/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/edit/item/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,478 +0,0 @@
-<md-dialog class="vtigerAccount-item-dialog" aria-label="New Item">
-  <form name="vtigerAccountItemForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <div ng-switch="vm.type">
-        <div ng-switch-when="subject">
-          <!-- SUBJECT SECTION -->
-          <div ng-include="'/subject.html'"></div>
-          <!-- / SUBJECT SECTION -->
-        </div>
-        <div ng-switch-when="description">
-          <!-- DESCRIPTION SECTION -->
-          <md-input-container class="md-block">
-            <label translate="INTEGRATIONS.TYPE">Type</label>
-            <md-select name="type" ng-model="vm.item.type" required>
-              <md-option value="string">String</md-option>
-              <md-option value="keyValue">Key Value</md-option>
-            </md-select>
-            <div
-              ng-messages="vtigerAccountItemForm.type.$error"
-              ng-show="vtigerAccountItemForm.type.$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-                  >Type field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
-            <label translate="INTEGRATIONS.CONTENT">Content</label>
-            <input
-              type="text"
-              name="content"
-              ng-model="vm.item.content"
-              required
-              md-autofocus
-            />
-            <div
-              ng-messages="vtigerAccountItemForm.content.$error"
-              ng-show="vtigerAccountItemForm.content.$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
-                  >Content field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <div ng-if="vm.item.type == 'keyValue'">
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.KEY">Key</label>
-              <input
-                type="text"
-                name="key"
-                ng-model="vm.item.key"
-                required
-                md-autofocus
-              />
-              <div
-                ng-messages="vtigerAccountItemForm.key.$error"
-                ng-show="vtigerAccountItemForm.key.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.KEY_REQUIRED"
-                    >Key field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.TYPE">Type</label>
-              <md-select name="keyType" ng-model="vm.item.keyType" required>
-                <md-option value="string">String</md-option>
-                <md-option value="variable">Variable</md-option>
-                <md-option value="customVariable">Custom Variable</md-option>
-              </md-select>
-              <div
-                ng-messages="vtigerAccountItemForm.keyType.$error"
-                ng-show="vtigerAccountItemForm.keyType.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-                    >Type field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'string'"
-            >
-              <label translate="INTEGRATIONS.CONTENT">Content</label>
-              <input
-                type="text"
-                name="keyContent"
-                ng-model="vm.item.keyContent"
-                required
-                md-autofocus
-              />
-              <div
-                ng-messages="vtigerAccountItemForm.keyContent.$error"
-                ng-show="vtigerAccountItemForm.keyContent.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
-                    >Content field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'variable'"
-            >
-              <label translate="INTEGRATIONS.VALUE">Value</label>
-              <md-select
-                name="variableName"
-                ng-model="vm.item.variableName"
-                md-selected-text="vm.getSelectedVariable()"
-                required
-              >
-                <md-optgroup label="Voice: Queue">
-                  <md-option
-                    ng-value="agentColumn"
-                    ng-repeat="agentColumn in vm.voiceAgentReportColumns"
-                    >{{agentColumn}}
-                  </md-option>
-                </md-optgroup>
-                <md-optgroup label="Voice: Outbound">
-                  <md-option
-                    ng-value="dialColumn"
-                    ng-repeat="dialColumn in vm.voiceDialReportColumns"
-                    >{{dialColumn}}</md-option
-                  >
-                </md-optgroup>
-              </md-select>
-              <div
-                ng-messages="vtigerAccountItemForm.variableName.$error"
-                ng-show="vtigerAccountItemForm.variableName.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED"
-                    >Variable name field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'customVariable'"
-            >
-              <label translate="INTEGRATIONS.VALUE">Value</label>
-              <md-select ng-model="vm.item.VariableId" required>
-                <md-option
-                  ng-value="variable.id"
-                  ng-repeat="variable in vm.variables"
-                  >{{variable.name}}
-                </md-option>
-              </md-select>
-            </md-input-container>
-          </div>
-          <!-- / DESCRIPTION SECTION -->
-        </div>
-        <div ng-switch-when="field">
-          <!-- FIELD SECTION -->
-          <div ng-if="vm.accountConnected">
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.FIELD">FIELD</label>
-              <!-- ITEM TYPE DEFAULT VALUE is STRING -->
-              <md-select
-                name="customField"
-                ng-model="vm.customField"
-                required
-                ng-change="vm.item.type = 'string'"
-              >
-                <md-optgroup label="Standard">
-                  <md-option
-                    ng-value="standard"
-                    ng-repeat="standard in vm.fields | filter: {custom: false} "
-                    >{{standard.name}}
-                  </md-option>
-                </md-optgroup>
-
-                <md-optgroup label="Custom">
-                  <md-option
-                    ng-value="custom"
-                    ng-repeat="custom in vm.fields | filter: {custom: true} "
-                    >{{custom.name}}
-                  </md-option>
-                </md-optgroup>
-              </md-select>
-              <div
-                ng-messages="vtigerAccountItemForm.customField.$error"
-                ng-show="vtigerAccountItemForm.customField.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.FIELD_REQUIRED"
-                    >Field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <!-- FIELDS -->
-            <div ng-if="vm.customField" ng-include="'/fields.html'"></div>
-            <!-- FIELDS -->
-          </div>
-          <div ng-if="!vm.accountConnected">
-            <p>Account is not connected. Please check your configurations!</p>
-          </div>
-          <!-- / FIELD SECTION -->
-        </div>
-        <div ng-switch-default>
-          <p>No Item</p>
-        </div>
-      </div>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newItem"
-          ng-click="vm.saveItem()"
-          class="send-button md-accent md-raised"
-          ng-disabled="vtigerAccountItemForm.$invalid || vtigerAccountItemForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newItem"
-          ng-click="vm.addNewItem()"
-          class="send-button md-accent md-raised"
-          ng-disabled="vtigerAccountItemForm.$invalid || vtigerAccountItemForm.$pristine"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD"
-          translate-attr-aria-label="INTEGRATIONS.ADD"
-        >
-          ADD
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newItem"
-          ng-click="vm.deleteItem($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
-
-<script type="text/ng-template" id="/fields.html">
-
-  <!-- type -->
-  <md-input-container class="md-block" ng-if="!vm.customField.options.length">
-
-      <label translate="INTEGRATIONS.TYPE">Type</label>
-      <md-select name="type" ng-model="vm.item.type" required>
-
-          <md-option value="string">String</md-option>
-          <md-option value="variable">Variable</md-option>
-          <md-option value="customVariable">Custom Variable</md-option>
-      </md-select>
-      <div ng-messages="vtigerAccountItemForm.type.$error" ng-show="vtigerAccountItemForm.type.$touched"
-          role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <!--/ type -->
-
-  <!-- value -->
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && vm.customField.options.length">
-      <!-- options -->
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-
-      <md-select name="option" ng-model="vm.item.content" required>
-          <md-option ng-value="option.value" ng-repeat="option in vm.customField.options">{{option.name}}</md-option>
-      </md-select>
-
-      <div ng-messages="vtigerAccountItemForm.option.$error"
-          ng-show="vtigerAccountItemForm.option.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VALUE_REQUIRED">Value field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && !vm.customField.options.length">
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-
-      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
-
-      <div ng-messages="vtigerAccountItemForm.content.$error"
-          ng-show="vtigerAccountItemForm.content.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
-          required>
-          <md-optgroup label="Voice: Queue">
-              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
-              </md-option>
-          </md-optgroup>
-          <md-optgroup label="Voice: Outbound">
-              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
-              </md-option>
-          </md-optgroup>
-      </md-select>
-      <div ng-messages="vtigerAccountItemForm.variableName.$error"
-          ng-show="vtigerAccountItemForm.variableName.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select ng-model="vm.item.VariableId" required>
-          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
-      </md-select>
-  </md-input-container>
-
-  <!--/ value -->
-</script>
-
-<script type="text/ng-template" id="/subject.html">
-    <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.TYPE">Type</label>
-            <md-select name="type" ng-model="vm.item.type" required>
-                <md-option value="string">String</md-option>
-                <md-option value="variable">Variable</md-option>
-                <md-option value="customVariable">Custom Variable</md-option>
-            </md-select>
-        <div ng-messages="vtigerAccountItemForm.type.$error" ng-show="vtigerAccountItemForm.type.$touched" role="alert">
-            <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
-             </div>
-        </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
-      <div ng-messages="vtigerAccountItemForm.content.$error"
-          ng-show="vtigerAccountItemForm.content.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
-          required>
-          <md-optgroup label="Voice: Queue">
-              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
-              </md-option>
-          </md-optgroup>
-          <md-optgroup label="Voice: Outbound">
-              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
-              </md-option>
-          </md-optgroup>
-      </md-select>
-      <div ng-messages="vtigerAccountItemForm.variableName.$error"
-          ng-show="vtigerAccountItemForm.variableName.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select ng-model="vm.item.VariableId" required>
-          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
-      </md-select>
-  </md-input-container>
-</script>
diff --git a/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/edit/item/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/edit/item/dialog.html/dialog.html
new file mode 100644
index 0000000..e5dc68a
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/edit/item/dialog.html/dialog.html
@@ -0,0 +1,478 @@
+<md-dialog class="vtigerAccount-item-dialog" aria-label="New Item">
+  <form name="vtigerAccountItemForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <div ng-switch="vm.type">
+        <div ng-switch-when="subject">
+          <!-- SUBJECT SECTION -->
+          <div ng-include="'/subject.html'"></div>
+          <!-- / SUBJECT SECTION -->
+        </div>
+        <div ng-switch-when="description">
+          <!-- DESCRIPTION SECTION -->
+          <md-input-container class="md-block">
+            <label translate="INTEGRATIONS.TYPE">Type</label>
+            <md-select name="type" ng-model="vm.item.type" required>
+              <md-option value="string">String</md-option>
+              <md-option value="keyValue">Key Value</md-option>
+            </md-select>
+            <div
+              ng-messages="vtigerAccountItemForm.type.$error"
+              ng-show="vtigerAccountItemForm.type.$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+                  >Type field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
+            <label translate="INTEGRATIONS.CONTENT">Content</label>
+            <input
+              type="text"
+              name="content"
+              ng-model="vm.item.content"
+              required
+              md-autofocus
+            />
+            <div
+              ng-messages="vtigerAccountItemForm.content.$error"
+              ng-show="vtigerAccountItemForm.content.$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
+                  >Content field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <div ng-if="vm.item.type == 'keyValue'">
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.KEY">Key</label>
+              <input
+                type="text"
+                name="key"
+                ng-model="vm.item.key"
+                required
+                md-autofocus
+              />
+              <div
+                ng-messages="vtigerAccountItemForm.key.$error"
+                ng-show="vtigerAccountItemForm.key.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.KEY_REQUIRED"
+                    >Key field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.TYPE">Type</label>
+              <md-select name="keyType" ng-model="vm.item.keyType" required>
+                <md-option value="string">String</md-option>
+                <md-option value="variable">Variable</md-option>
+                <md-option value="customVariable">Custom Variable</md-option>
+              </md-select>
+              <div
+                ng-messages="vtigerAccountItemForm.keyType.$error"
+                ng-show="vtigerAccountItemForm.keyType.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+                    >Type field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'string'"
+            >
+              <label translate="INTEGRATIONS.CONTENT">Content</label>
+              <input
+                type="text"
+                name="keyContent"
+                ng-model="vm.item.keyContent"
+                required
+                md-autofocus
+              />
+              <div
+                ng-messages="vtigerAccountItemForm.keyContent.$error"
+                ng-show="vtigerAccountItemForm.keyContent.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
+                    >Content field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'variable'"
+            >
+              <label translate="INTEGRATIONS.VALUE">Value</label>
+              <md-select
+                name="variableName"
+                ng-model="vm.item.variableName"
+                md-selected-text="vm.getSelectedVariable()"
+                required
+              >
+                <md-optgroup label="Voice: Queue">
+                  <md-option
+                    ng-value="agentColumn"
+                    ng-repeat="agentColumn in vm.voiceAgentReportColumns"
+                    >{{agentColumn}}
+                  </md-option>
+                </md-optgroup>
+                <md-optgroup label="Voice: Outbound">
+                  <md-option
+                    ng-value="dialColumn"
+                    ng-repeat="dialColumn in vm.voiceDialReportColumns"
+                    >{{dialColumn}}</md-option
+                  >
+                </md-optgroup>
+              </md-select>
+              <div
+                ng-messages="vtigerAccountItemForm.variableName.$error"
+                ng-show="vtigerAccountItemForm.variableName.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED"
+                    >Variable name field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'customVariable'"
+            >
+              <label translate="INTEGRATIONS.VALUE">Value</label>
+              <md-select ng-model="vm.item.VariableId" required>
+                <md-option
+                  ng-value="variable.id"
+                  ng-repeat="variable in vm.variables"
+                  >{{variable.name}}
+                </md-option>
+              </md-select>
+            </md-input-container>
+          </div>
+          <!-- / DESCRIPTION SECTION -->
+        </div>
+        <div ng-switch-when="field">
+          <!-- FIELD SECTION -->
+          <div ng-if="vm.accountConnected">
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.FIELD">FIELD</label>
+              <!-- ITEM TYPE DEFAULT VALUE is STRING -->
+              <md-select
+                name="customField"
+                ng-model="vm.customField"
+                required
+                ng-change="vm.item.type = 'string'"
+              >
+                <md-optgroup label="Standard">
+                  <md-option
+                    ng-value="standard"
+                    ng-repeat="standard in vm.fields | filter: {custom: false} "
+                    >{{standard.name}}
+                  </md-option>
+                </md-optgroup>
+
+                <md-optgroup label="Custom">
+                  <md-option
+                    ng-value="custom"
+                    ng-repeat="custom in vm.fields | filter: {custom: true} "
+                    >{{custom.name}}
+                  </md-option>
+                </md-optgroup>
+              </md-select>
+              <div
+                ng-messages="vtigerAccountItemForm.customField.$error"
+                ng-show="vtigerAccountItemForm.customField.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.FIELD_REQUIRED"
+                    >Field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <!-- FIELDS -->
+            <div ng-if="vm.customField" ng-include="'/fields.html'"></div>
+            <!-- FIELDS -->
+          </div>
+          <div ng-if="!vm.accountConnected">
+            <p>Account is not connected. Please check your configurations!</p>
+          </div>
+          <!-- / FIELD SECTION -->
+        </div>
+        <div ng-switch-default>
+          <p>No Item</p>
+        </div>
+      </div>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newItem"
+          ng-click="vm.saveItem()"
+          class="send-button md-accent md-raised"
+          ng-disabled="vtigerAccountItemForm.$invalid || vtigerAccountItemForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newItem"
+          ng-click="vm.addNewItem()"
+          class="send-button md-accent md-raised"
+          ng-disabled="vtigerAccountItemForm.$invalid || vtigerAccountItemForm.$pristine"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD"
+          translate-attr-aria-label="INTEGRATIONS.ADD"
+        >
+          ADD
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newItem"
+          ng-click="vm.deleteItem($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
+
+<script type="text/ng-template" id="/fields.html">
+
+  <!-- type -->
+  <md-input-container class="md-block" ng-if="!vm.customField.options.length">
+
+      <label translate="INTEGRATIONS.TYPE">Type</label>
+      <md-select name="type" ng-model="vm.item.type" required>
+
+          <md-option value="string">String</md-option>
+          <md-option value="variable">Variable</md-option>
+          <md-option value="customVariable">Custom Variable</md-option>
+      </md-select>
+      <div ng-messages="vtigerAccountItemForm.type.$error" ng-show="vtigerAccountItemForm.type.$touched"
+          role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <!--/ type -->
+
+  <!-- value -->
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && vm.customField.options.length">
+      <!-- options -->
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+
+      <md-select name="option" ng-model="vm.item.content" required>
+          <md-option ng-value="option.value" ng-repeat="option in vm.customField.options">{{option.name}}</md-option>
+      </md-select>
+
+      <div ng-messages="vtigerAccountItemForm.option.$error"
+          ng-show="vtigerAccountItemForm.option.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VALUE_REQUIRED">Value field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && !vm.customField.options.length">
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+
+      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
+
+      <div ng-messages="vtigerAccountItemForm.content.$error"
+          ng-show="vtigerAccountItemForm.content.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
+          required>
+          <md-optgroup label="Voice: Queue">
+              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
+              </md-option>
+          </md-optgroup>
+          <md-optgroup label="Voice: Outbound">
+              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
+              </md-option>
+          </md-optgroup>
+      </md-select>
+      <div ng-messages="vtigerAccountItemForm.variableName.$error"
+          ng-show="vtigerAccountItemForm.variableName.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select ng-model="vm.item.VariableId" required>
+          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
+      </md-select>
+  </md-input-container>
+
+  <!--/ value -->
+</script>
+
+<script type="text/ng-template" id="/subject.html">
+    <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.TYPE">Type</label>
+            <md-select name="type" ng-model="vm.item.type" required>
+                <md-option value="string">String</md-option>
+                <md-option value="variable">Variable</md-option>
+                <md-option value="customVariable">Custom Variable</md-option>
+            </md-select>
+        <div ng-messages="vtigerAccountItemForm.type.$error" ng-show="vtigerAccountItemForm.type.$touched" role="alert">
+            <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
+             </div>
+        </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
+      <div ng-messages="vtigerAccountItemForm.content.$error"
+          ng-show="vtigerAccountItemForm.content.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
+          required>
+          <md-optgroup label="Voice: Queue">
+              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
+              </md-option>
+          </md-optgroup>
+          <md-optgroup label="Voice: Outbound">
+              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
+              </md-option>
+          </md-optgroup>
+      </md-select>
+      <div ng-messages="vtigerAccountItemForm.variableName.$error"
+          ng-show="vtigerAccountItemForm.variableName.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select ng-model="vm.item.VariableId" required>
+          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
+      </md-select>
+  </md-input-container>
+</script>
diff --git a/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index 18edb54..0000000
--- a/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,920 +0,0 @@
-<div
-  id="integrations-vtigerAccount"
-  class="page-layout simple tabbed"
-  layout="column"
->
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-vtigerAccounts-button md-icon-button"
-        aria-label="Go to vtigerAccounts"
-        ng-click="vm.gotoVtigerAccounts()"
-        translate
-        translate-attr-aria-label="INTEGRATIONS.GO_TO_VTIGERACCOUNTS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="vtigerAccount-image" hide-xs>
-          <img ng-src="assets/images/business/vtigerAccounts.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.vtigerAccount.id}}
-            <span ng-if="vm.vtigerAccount.name">{{vm.vtigerAccount.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="INTEGRATIONS.CREATED_AT"></span>
-            <span>{{vm.vtigerAccount.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveVtigerAccount()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (configurationsForm.$invalid)"
-        translate="INTEGRATIONS.SAVE"
-        translate-attr-aria-label="INTEGRATIONS.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="INTEGRATIONS.ACCOUNT">ACCOUNT</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="vtigerAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="INTEGRATIONS.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.vtigerAccount.name"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.vtigerAccount.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.VTIGER_USER_NAME"
-                  >vTiger_User_Name</label
-                >
-                <input
-                  type="text"
-                  name="username"
-                  ng-model="vm.vtigerAccount.username"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['username'].$error"
-                  ng-show="generalForm['username'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="INTEGRATIONS.ERRORS.VTIGER_USER_NAME_REQUIRED"
-                      >vTiger_User_Name field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.ACCESS_KEY">Access_Key</label>
-                <input
-                  type="text"
-                  name="accessKey"
-                  ng-model="vm.vtigerAccount.accessKey"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['accessKey'].$error"
-                  ng-show="generalForm['accessKey'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.ACCESS_KEY_REQUIRED"
-                      >Access_Key field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.HOST">Host</label>
-                <input
-                  type="url"
-                  name="remoteUri"
-                  ng-model="vm.vtigerAccount.remoteUri"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['remoteUri'].$error"
-                  ng-show="generalForm['remoteUri'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.HOST_REQUIRED"
-                      >Host field is required</span
-                    >
-                  </div>
-                  <div ng-message="url">
-                    <span translate="INTEGRATIONS.ERRORS.HOST_MUST_VALID_URL"
-                      >Host must be a valid url http://www.xcally.com</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
-                  >MotionProxyAddress</label
-                >
-                <input
-                  type="url"
-                  name="serverUrl"
-                  ng-model="vm.vtigerAccount.serverUrl"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['serverUrl'].$error"
-                  ng-show="generalForm['serverUrl'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
-                      >MotionProxyAddress field is required</span
-                    >
-                  </div>
-                  <div ng-message="url">
-                    <span
-                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
-                      >MotionProxyAddress must be a valid url
-                      http://www.xcally.com</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="INTEGRATIONS.CONFIGURATIONS">CONFIGURATIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="vtigerAccount-detail-form-container configurations md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div
-                class="h2 secondary-text"
-                translate="INTEGRATIONS.CONFIGURATIONS"
-              >
-                CONFIGURATIONS
-              </div>
-            </div>
-            <div
-              ng-controller="VtigerAccountConfigurationsController as vm_cc"
-              ng-init="vm_cc.init(vm.vtigerAccount, vm.crudPermissions)"
-              layout="row"
-            >
-              <md-card class="md-whiteframe-1dp" flex="30">
-                <div layout="row" layout-align="center center">
-                  <md-subheader flex="75" class="md-no-sticky"
-                    >{{ 'INTEGRATIONS.CONFIGURATIONS' | translate
-                    }}</md-subheader
-                  >
-                  <md-button
-                    flex="25"
-                    ng-if="vm_cc.crudPermissions.canEdit"
-                    ng-click="vm_cc.createOrEditVtigerConfiguration($event)"
-                    class="md-icon-button"
-                    aria-label="create vtigerConfiguration"
-                  >
-                    <md-icon md-font-icon="icon-plus"></md-icon>
-                  </md-button>
-                </div>
-                <md-list>
-                  <md-list-item
-                    layout="row"
-                    layout-align="center center"
-                    ng-repeat="vtigerConfiguration in vm_cc.configurations"
-                    class="border-top"
-                    md-colors="{background: (vm_cc.selectedVtigerConfiguration == $index ? 'accent' : 'grey-A100')}"
-                    ng-click="vm_cc.getVtigerConfiguration($index)"
-                  >
-                    <span class="text-truncate" flex="80"
-                      >{{ vtigerConfiguration.name }}</span
-                    >
-                    <md-menu ng-if="vm_cc.crudPermissions.canDelete">
-                      <md-button
-                        class="md-icon-button"
-                        aria-label="More"
-                        translate
-                        translate-attr-aria-label="INTEGRATIONS.MORE"
-                        ng-click="$mdOpenMenu($event)"
-                      >
-                        <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                      </md-button>
-                      <md-menu-content width="3">
-                        <md-menu-item ng-if="vm_cc.crudPermissions.canDelete">
-                          <md-button
-                            ng-click="vm_cc.deleteVtigerConfiguration($event, vtigerConfiguration)"
-                            translate="INTEGRATIONS.DELETE_VTIGERCONFIGURATION"
-                          >
-                            Delete VtigerConfiguration
-                          </md-button>
-                        </md-menu-item>
-                      </md-menu-content>
-                    </md-menu>
-                  </md-list-item>
-                </md-list>
-              </md-card>
-              <div flex></div>
-              <md-card class="md-whiteframe-1dp" flex="65">
-                <md-tabs ng-if="vm_cc.configurations.length" md-dynamic-height>
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.SUBJECTS">SUBJECTS</span>
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-toolbar
-                        class="md-table-toolbar md-default no-padding"
-                        ng-hide="vm_cc.selectedSubjects.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <div flex></div>
-                          <ms-search-bar
-                            on-search="vm_cc.query.subject = query"
-                            on-collapse="vm_cc.query.subject = undefined"
-                            debounce="300"
-                          ></ms-search-bar>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canEdit"
-                            class="md-icon-button"
-                            ng-click="vm_cc.createOrEditSubject($event)"
-                            aria-label="add subject"
-                            translate
-                            translate-attr-label="INTEGRATIONS.ADD_SUBJECT"
-                          >
-                            <md-icon md-font-icon="icon-plus"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-toolbar
-                        class="md-table-toolbar md-accent"
-                        ng-show="vm_cc.selectedSubjects.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <span class="md-subhead"
-                            >{{vm_cc.selectedSubjects.length}}
-                            {{vm_cc.selectedSubjects.length > 1 ? 'items' :
-                            'item'}} selected</span
-                          >
-                          <div flex></div>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canDelete"
-                            class="md-icon-button"
-                            ng-click="vm_cc.deleteSelectedSubjects($event)"
-                            aria-label="delete selected"
-                            translate
-                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-                          >
-                            <md-icon md-font-icon="icon-delete"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-table-container
-                        class="md-whiteframe-1dp padding-horizontal"
-                      >
-                        <table
-                          md-table
-                          md-row-select
-                          multiple
-                          ng-model="vm_cc.selectedSubjects"
-                        >
-                          <thead md-head>
-                            <tr md-row>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.ID' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.TYPE' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.CONTENT' | translate }}
-                              </th>
-                              <th md-column width="10px"></th>
-                            </tr>
-                          </thead>
-                          <tbody md-body>
-                            <tr
-                              md-row
-                              md-select="subject"
-                              md-select-id="id"
-                              ng-repeat="subject in vm_cc.subjects | filter: vm_cc.query.subject"
-                            >
-                              <td
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                                class="id"
-                              >
-                                {{subject.id}}
-                              </td>
-                              <td
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                                class="type"
-                              >
-                                <span ng-if="subject.FieldId"
-                                  >{{subject.nameField ||
-                                  subject.idField}}</span
-                                >
-                                <span ng-if="!subject.FieldId"
-                                  >{{subject.type}}</span
-                                >
-                              </td>
-                              <td
-                                ng-switch="subject.type"
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                              >
-                                <span ng-switch-when="string"
-                                  >{{subject.content}}</span
-                                >
-                                <span
-                                  ng-switch-when="variable"
-                                  class="text-boxed"
-                                  >{{subject.variableName}}</span
-                                >
-                                <span
-                                  ng-switch-when="customVariable"
-                                  class="text-boxed"
-                                  >{{
-                                  vm_cc.variablesById[subject.VariableId].name
-                                  }}</span
-                                >
-                                <span ng-switch-when="keyValue">
-                                  {{subject.key}}
-                                  <span ng-switch="description.keyType">
-                                    <span ng-switch-when="string"
-                                      >{{subject.keyContent}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="variable"
-                                      class="text-boxed"
-                                      >{{subject.variableName}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="customVariable"
-                                      class="text-boxed"
-                                      >{{
-                                      vm_cc.variablesById[subject.VariableId].name
-                                      }}</span
-                                    >
-                                  </span>
-                                </span>
-                                <span ng-switch-default
-                                  >{{subject.content}}</span
-                                >
-                              </td>
-                              <td
-                                md-cell
-                                class="actions"
-                                ng-if="!vm_cc.crudPermissions.readOnly"
-                              >
-                                <md-menu>
-                                  <md-button
-                                    class="md-icon-button"
-                                    aria-label="More"
-                                    translate
-                                    translate-attr-aria-label="INTEGRATIONS.MORE"
-                                    ng-click="$mdOpenMenu($event)"
-                                  >
-                                    <md-icon
-                                      md-font-icon="icon-dots-vertical"
-                                    ></md-icon>
-                                  </md-button>
-
-                                  <md-menu-content width="3">
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canEdit"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                        translate="INTEGRATIONS.EDIT_SUBJECT"
-                                      >
-                                        Edit Subject
-                                      </md-button>
-                                    </md-menu-item>
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canDelete"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.deleteSubjectConfirm($event, subject)"
-                                        translate="INTEGRATIONS.DELETE_SUBJECT"
-                                      >
-                                        Delete Subject
-                                      </md-button>
-                                    </md-menu-item>
-                                  </md-menu-content>
-                                </md-menu>
-                              </td>
-                            </tr>
-                          </tbody>
-                        </table>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.DESCRIPTIONS"
-                        >DESCRIPTIONS</span
-                      >
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-toolbar
-                        class="md-table-toolbar md-default no-padding"
-                        ng-hide="vm_cc.selectedDescriptions.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <div flex></div>
-                          <ms-search-bar
-                            on-search="vm_cc.query.description = query"
-                            on-collapse="vm_cc.query.description = undefined"
-                            debounce="300"
-                          ></ms-search-bar>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canEdit"
-                            class="md-icon-button"
-                            ng-click="vm_cc.createOrEditDescription($event)"
-                            aria-label="add description"
-                            translate
-                            translate-attr-label="INTEGRATIONS.ADD_DESCRIPTION"
-                          >
-                            <md-icon md-font-icon="icon-plus"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-toolbar
-                        class="md-table-toolbar md-accent"
-                        ng-show="vm_cc.selectedDescriptions.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <span class="md-subhead"
-                            >{{vm_cc.selectedDescriptions.length}}
-                            {{vm_cc.selectedDescriptions.length > 1 ? 'items' :
-                            'item'}} selected</span
-                          >
-                          <div flex></div>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canDelete"
-                            class="md-icon-button"
-                            ng-click="vm_cc.deleteSelectedDescriptions($event)"
-                            aria-label="delete selected"
-                            translate
-                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-                          >
-                            <md-icon md-font-icon="icon-delete"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-table-container
-                        class="md-whiteframe-1dp padding-horizontal"
-                      >
-                        <table
-                          md-table
-                          md-row-select
-                          multiple
-                          ng-model="vm_cc.selectedDescriptions"
-                        >
-                          <thead md-head>
-                            <tr md-row>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.ID' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.TYPE' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.CONTENT' | translate }}
-                              </th>
-                              <th md-column width="10px"></th>
-                            </tr>
-                          </thead>
-                          <tbody md-body>
-                            <tr
-                              md-row
-                              md-select="description"
-                              md-select-id="id"
-                              ng-repeat="description in vm_cc.descriptions | filter: vm_cc.query.description"
-                            >
-                              <td
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                                class="id"
-                              >
-                                {{description.id}}
-                              </td>
-                              <td
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                                class="type"
-                              >
-                                <span ng-if="description.FieldId"
-                                  >{{description.nameField ||
-                                  description.idField}}</span
-                                >
-                                <span ng-if="!description.FieldId"
-                                  >{{description.type}}</span
-                                >
-                              </td>
-                              <td
-                                ng-switch="description.type"
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                              >
-                                <span ng-switch-when="string"
-                                  >{{description.content}}</span
-                                >
-                                <span
-                                  ng-switch-when="variable"
-                                  class="text-boxed"
-                                  >{{description.variableName}}</span
-                                >
-                                <span
-                                  ng-switch-when="customVariable"
-                                  class="text-boxed"
-                                  >{{
-                                  vm_cc.variablesById[description.VariableId].name
-                                  }}</span
-                                >
-                                <span ng-switch-when="keyValue">
-                                  {{description.key}}
-                                  <span ng-switch="description.keyType">
-                                    <span ng-switch-when="string"
-                                      >{{description.keyContent}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="variable"
-                                      class="text-boxed"
-                                      >{{description.variableName}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="customVariable"
-                                      class="text-boxed"
-                                      >{{
-                                      vm_cc.variablesById[description.VariableId].name
-                                      }}</span
-                                    >
-                                  </span>
-                                </span>
-                                <span ng-switch-default
-                                  >{{description.content}}</span
-                                >
-                              </td>
-                              <td
-                                md-cell
-                                class="actions"
-                                ng-if="!vm_cc.crudPermissions.readOnly"
-                              >
-                                <md-menu>
-                                  <md-button
-                                    class="md-icon-button"
-                                    aria-label="More"
-                                    translate
-                                    translate-attr-aria-label="INTEGRATIONS.MORE"
-                                    ng-click="$mdOpenMenu($event)"
-                                  >
-                                    <md-icon
-                                      md-font-icon="icon-dots-vertical"
-                                    ></md-icon>
-                                  </md-button>
-
-                                  <md-menu-content width="3">
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canEdit"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.createOrEditDescription($event, description)"
-                                        translate="INTEGRATIONS.EDIT_DESCRIPTION"
-                                      >
-                                        Edit Description
-                                      </md-button>
-                                    </md-menu-item>
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canDelete"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.deleteDescriptionConfirm($event, description)"
-                                        translate="INTEGRATIONS.DELETE_DESCRIPTION"
-                                      >
-                                        Delete Description
-                                      </md-button>
-                                    </md-menu-item>
-                                  </md-menu-content>
-                                </md-menu>
-                              </td>
-                            </tr>
-                          </tbody>
-                        </table>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.FIELDS">FIELDS</span>
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-toolbar
-                        class="md-table-toolbar md-default no-padding"
-                        ng-hide="vm_cc.selectedFields.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <div flex></div>
-                          <ms-search-bar
-                            on-search="vm_cc.query.field = query"
-                            on-collapse="vm_cc.query.field = undefined"
-                            debounce="300"
-                          ></ms-search-bar>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canEdit"
-                            class="md-icon-button"
-                            ng-click="vm_cc.createOrEditField($event)"
-                            aria-label="add field"
-                            translate
-                            translate-attr-label="INTEGRATIONS.ADD_FIELD"
-                          >
-                            <md-icon md-font-icon="icon-plus"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-toolbar
-                        class="md-table-toolbar md-accent"
-                        ng-show="vm_cc.selectedFields.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <span class="md-subhead"
-                            >{{vm_cc.selectedFields.length}}
-                            {{vm_cc.selectedFields.length > 1 ? 'items' :
-                            'item'}} selected</span
-                          >
-                          <div flex></div>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canDelete"
-                            class="md-icon-button"
-                            ng-click="vm_cc.deleteSelectedFields($event)"
-                            aria-label="delete selected"
-                            translate
-                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-                          >
-                            <md-icon md-font-icon="icon-delete"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-table-container
-                        class="md-whiteframe-1dp padding-horizontal"
-                      >
-                        <table
-                          md-table
-                          md-row-select
-                          multiple
-                          ng-model="vm_cc.selectedFields"
-                        >
-                          <thead md-head>
-                            <tr md-row>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.ID' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.TYPE' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.CONTENT' | translate }}
-                              </th>
-                              <th md-column width="10px"></th>
-                            </tr>
-                          </thead>
-                          <tbody md-body>
-                            <tr
-                              md-row
-                              md-select="field"
-                              md-select-id="id"
-                              ng-repeat="field in vm_cc.fields | filter: vm_cc.query.field"
-                            >
-                              <td
-                                ng-click="vm_cc.createOrEditField($event, field)"
-                                md-cell
-                                class="id"
-                              >
-                                {{field.id}}
-                              </td>
-                              <td
-                                ng-click="vm_cc.createOrEditField($event, field)"
-                                md-cell
-                                class="type"
-                              >
-                                <span ng-if="field.FieldId"
-                                  >{{field.nameField || field.idField}}</span
-                                >
-                                <span ng-if="!field.FieldId"
-                                  >{{field.type}}</span
-                                >
-                              </td>
-                              <td
-                                ng-switch="field.type"
-                                ng-click="vm_cc.createOrEditField($event, field)"
-                                md-cell
-                              >
-                                <span ng-switch-when="string"
-                                  >{{field.content}}</span
-                                >
-                                <span
-                                  ng-switch-when="variable"
-                                  class="text-boxed"
-                                  >{{field.variableName}}</span
-                                >
-                                <span
-                                  ng-switch-when="customVariable"
-                                  class="text-boxed"
-                                  >{{ vm_cc.variablesById[field.VariableId].name
-                                  }}</span
-                                >
-                                <span ng-switch-when="keyValue">
-                                  {{field.key}}
-                                  <span ng-switch="description.keyType">
-                                    <span ng-switch-when="string"
-                                      >{{field.keyContent}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="variable"
-                                      class="text-boxed"
-                                      >{{field.variableName}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="customVariable"
-                                      class="text-boxed"
-                                      >{{
-                                      vm_cc.variablesById[field.VariableId].name
-                                      }}</span
-                                    >
-                                  </span>
-                                </span>
-                                <span ng-switch-default>{{field.content}}</span>
-                              </td>
-                              <td
-                                md-cell
-                                class="actions"
-                                ng-if="!vm_cc.crudPermissions.readOnly"
-                              >
-                                <md-menu>
-                                  <md-button
-                                    class="md-icon-button"
-                                    aria-label="More"
-                                    translate
-                                    translate-attr-aria-label="INTEGRATIONS.MORE"
-                                    ng-click="$mdOpenMenu($event)"
-                                  >
-                                    <md-icon
-                                      md-font-icon="icon-dots-vertical"
-                                    ></md-icon>
-                                  </md-button>
-
-                                  <md-menu-content width="3">
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canEdit"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.createOrEditField($event, field)"
-                                        translate="INTEGRATIONS.EDIT_FIELD"
-                                      >
-                                        Edit Field
-                                      </md-button>
-                                    </md-menu-item>
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canDelete"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.deleteFieldConfirm($event, field)"
-                                        translate="INTEGRATIONS.DELETE_FIELD"
-                                      >
-                                        Delete Field
-                                      </md-button>
-                                    </md-menu-item>
-                                  </md-menu-content>
-                                </md-menu>
-                              </td>
-                            </tr>
-                          </tbody>
-                        </table>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-                </md-tabs>
-                <div
-                  class="padding-20"
-                  ng-if="!vm_cc.configurations.length && vm_cc.crudPermissions.canEdit"
-                  ng-click="vm_cc.createOrEditVtigerConfiguration($event)"
-                  layout="row"
-                  layout-sm="column"
-                  layout-align="center center"
-                  layout-wrap
-                >
-                  <div
-                    class="padding-20 md-whiteframe-3dp md-accent-bg"
-                    layout="column"
-                    layout-align="center center"
-                  >
-                    <md-button class="md-icon-button">
-                      <md-icon md-font-icon="icon-plus"></md-icon>
-                    </md-button>
-                    <span
-                      aria-label="add configuration"
-                      translate
-                      translate-attr-label="INTEGRATIONS.ADD_CONFIGURATION"
-                      >ADD CONFIGURATION</span
-                    >
-                  </div>
-                </div>
-              </md-card>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/edit/view.html/view.html b/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/edit/view.html/view.html
new file mode 100644
index 0000000..18edb54
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/edit/view.html/view.html
@@ -0,0 +1,920 @@
+<div
+  id="integrations-vtigerAccount"
+  class="page-layout simple tabbed"
+  layout="column"
+>
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-vtigerAccounts-button md-icon-button"
+        aria-label="Go to vtigerAccounts"
+        ng-click="vm.gotoVtigerAccounts()"
+        translate
+        translate-attr-aria-label="INTEGRATIONS.GO_TO_VTIGERACCOUNTS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="vtigerAccount-image" hide-xs>
+          <img ng-src="assets/images/business/vtigerAccounts.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.vtigerAccount.id}}
+            <span ng-if="vm.vtigerAccount.name">{{vm.vtigerAccount.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="INTEGRATIONS.CREATED_AT"></span>
+            <span>{{vm.vtigerAccount.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveVtigerAccount()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (configurationsForm.$invalid)"
+        translate="INTEGRATIONS.SAVE"
+        translate-attr-aria-label="INTEGRATIONS.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="INTEGRATIONS.ACCOUNT">ACCOUNT</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="vtigerAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="INTEGRATIONS.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.vtigerAccount.name"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.vtigerAccount.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.VTIGER_USER_NAME"
+                  >vTiger_User_Name</label
+                >
+                <input
+                  type="text"
+                  name="username"
+                  ng-model="vm.vtigerAccount.username"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['username'].$error"
+                  ng-show="generalForm['username'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.VTIGER_USER_NAME_REQUIRED"
+                      >vTiger_User_Name field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.ACCESS_KEY">Access_Key</label>
+                <input
+                  type="text"
+                  name="accessKey"
+                  ng-model="vm.vtigerAccount.accessKey"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['accessKey'].$error"
+                  ng-show="generalForm['accessKey'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.ACCESS_KEY_REQUIRED"
+                      >Access_Key field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.HOST">Host</label>
+                <input
+                  type="url"
+                  name="remoteUri"
+                  ng-model="vm.vtigerAccount.remoteUri"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['remoteUri'].$error"
+                  ng-show="generalForm['remoteUri'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.HOST_REQUIRED"
+                      >Host field is required</span
+                    >
+                  </div>
+                  <div ng-message="url">
+                    <span translate="INTEGRATIONS.ERRORS.HOST_MUST_VALID_URL"
+                      >Host must be a valid url http://www.xcally.com</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
+                  >MotionProxyAddress</label
+                >
+                <input
+                  type="url"
+                  name="serverUrl"
+                  ng-model="vm.vtigerAccount.serverUrl"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['serverUrl'].$error"
+                  ng-show="generalForm['serverUrl'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
+                      >MotionProxyAddress field is required</span
+                    >
+                  </div>
+                  <div ng-message="url">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
+                      >MotionProxyAddress must be a valid url
+                      http://www.xcally.com</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="INTEGRATIONS.CONFIGURATIONS">CONFIGURATIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="vtigerAccount-detail-form-container configurations md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div
+                class="h2 secondary-text"
+                translate="INTEGRATIONS.CONFIGURATIONS"
+              >
+                CONFIGURATIONS
+              </div>
+            </div>
+            <div
+              ng-controller="VtigerAccountConfigurationsController as vm_cc"
+              ng-init="vm_cc.init(vm.vtigerAccount, vm.crudPermissions)"
+              layout="row"
+            >
+              <md-card class="md-whiteframe-1dp" flex="30">
+                <div layout="row" layout-align="center center">
+                  <md-subheader flex="75" class="md-no-sticky"
+                    >{{ 'INTEGRATIONS.CONFIGURATIONS' | translate
+                    }}</md-subheader
+                  >
+                  <md-button
+                    flex="25"
+                    ng-if="vm_cc.crudPermissions.canEdit"
+                    ng-click="vm_cc.createOrEditVtigerConfiguration($event)"
+                    class="md-icon-button"
+                    aria-label="create vtigerConfiguration"
+                  >
+                    <md-icon md-font-icon="icon-plus"></md-icon>
+                  </md-button>
+                </div>
+                <md-list>
+                  <md-list-item
+                    layout="row"
+                    layout-align="center center"
+                    ng-repeat="vtigerConfiguration in vm_cc.configurations"
+                    class="border-top"
+                    md-colors="{background: (vm_cc.selectedVtigerConfiguration == $index ? 'accent' : 'grey-A100')}"
+                    ng-click="vm_cc.getVtigerConfiguration($index)"
+                  >
+                    <span class="text-truncate" flex="80"
+                      >{{ vtigerConfiguration.name }}</span
+                    >
+                    <md-menu ng-if="vm_cc.crudPermissions.canDelete">
+                      <md-button
+                        class="md-icon-button"
+                        aria-label="More"
+                        translate
+                        translate-attr-aria-label="INTEGRATIONS.MORE"
+                        ng-click="$mdOpenMenu($event)"
+                      >
+                        <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                      </md-button>
+                      <md-menu-content width="3">
+                        <md-menu-item ng-if="vm_cc.crudPermissions.canDelete">
+                          <md-button
+                            ng-click="vm_cc.deleteVtigerConfiguration($event, vtigerConfiguration)"
+                            translate="INTEGRATIONS.DELETE_VTIGERCONFIGURATION"
+                          >
+                            Delete VtigerConfiguration
+                          </md-button>
+                        </md-menu-item>
+                      </md-menu-content>
+                    </md-menu>
+                  </md-list-item>
+                </md-list>
+              </md-card>
+              <div flex></div>
+              <md-card class="md-whiteframe-1dp" flex="65">
+                <md-tabs ng-if="vm_cc.configurations.length" md-dynamic-height>
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.SUBJECTS">SUBJECTS</span>
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedSubjects.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.subject = query"
+                            on-collapse="vm_cc.query.subject = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditSubject($event)"
+                            aria-label="add subject"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_SUBJECT"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedSubjects.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedSubjects.length}}
+                            {{vm_cc.selectedSubjects.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedSubjects($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedSubjects"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.ID' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.TYPE' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.CONTENT' | translate }}
+                              </th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="subject"
+                              md-select-id="id"
+                              ng-repeat="subject in vm_cc.subjects | filter: vm_cc.query.subject"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                                class="id"
+                              >
+                                {{subject.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="subject.FieldId"
+                                  >{{subject.nameField ||
+                                  subject.idField}}</span
+                                >
+                                <span ng-if="!subject.FieldId"
+                                  >{{subject.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="subject.type"
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{subject.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{subject.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{
+                                  vm_cc.variablesById[subject.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{subject.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{subject.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{subject.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[subject.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default
+                                  >{{subject.content}}</span
+                                >
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="INTEGRATIONS.MORE"
+                                    ng-click="$mdOpenMenu($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                        translate="INTEGRATIONS.EDIT_SUBJECT"
+                                      >
+                                        Edit Subject
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteSubjectConfirm($event, subject)"
+                                        translate="INTEGRATIONS.DELETE_SUBJECT"
+                                      >
+                                        Delete Subject
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.DESCRIPTIONS"
+                        >DESCRIPTIONS</span
+                      >
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedDescriptions.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.description = query"
+                            on-collapse="vm_cc.query.description = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditDescription($event)"
+                            aria-label="add description"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_DESCRIPTION"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedDescriptions.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedDescriptions.length}}
+                            {{vm_cc.selectedDescriptions.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedDescriptions($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedDescriptions"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.ID' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.TYPE' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.CONTENT' | translate }}
+                              </th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="description"
+                              md-select-id="id"
+                              ng-repeat="description in vm_cc.descriptions | filter: vm_cc.query.description"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                                class="id"
+                              >
+                                {{description.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="description.FieldId"
+                                  >{{description.nameField ||
+                                  description.idField}}</span
+                                >
+                                <span ng-if="!description.FieldId"
+                                  >{{description.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="description.type"
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{description.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{description.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{
+                                  vm_cc.variablesById[description.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{description.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{description.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{description.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[description.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default
+                                  >{{description.content}}</span
+                                >
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="INTEGRATIONS.MORE"
+                                    ng-click="$mdOpenMenu($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditDescription($event, description)"
+                                        translate="INTEGRATIONS.EDIT_DESCRIPTION"
+                                      >
+                                        Edit Description
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteDescriptionConfirm($event, description)"
+                                        translate="INTEGRATIONS.DELETE_DESCRIPTION"
+                                      >
+                                        Delete Description
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.FIELDS">FIELDS</span>
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedFields.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.field = query"
+                            on-collapse="vm_cc.query.field = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditField($event)"
+                            aria-label="add field"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_FIELD"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedFields.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedFields.length}}
+                            {{vm_cc.selectedFields.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedFields($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedFields"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.ID' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.TYPE' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.CONTENT' | translate }}
+                              </th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="field"
+                              md-select-id="id"
+                              ng-repeat="field in vm_cc.fields | filter: vm_cc.query.field"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditField($event, field)"
+                                md-cell
+                                class="id"
+                              >
+                                {{field.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditField($event, field)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="field.FieldId"
+                                  >{{field.nameField || field.idField}}</span
+                                >
+                                <span ng-if="!field.FieldId"
+                                  >{{field.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="field.type"
+                                ng-click="vm_cc.createOrEditField($event, field)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{field.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{field.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{ vm_cc.variablesById[field.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{field.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{field.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{field.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[field.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default>{{field.content}}</span>
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="INTEGRATIONS.MORE"
+                                    ng-click="$mdOpenMenu($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditField($event, field)"
+                                        translate="INTEGRATIONS.EDIT_FIELD"
+                                      >
+                                        Edit Field
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteFieldConfirm($event, field)"
+                                        translate="INTEGRATIONS.DELETE_FIELD"
+                                      >
+                                        Delete Field
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+                </md-tabs>
+                <div
+                  class="padding-20"
+                  ng-if="!vm_cc.configurations.length && vm_cc.crudPermissions.canEdit"
+                  ng-click="vm_cc.createOrEditVtigerConfiguration($event)"
+                  layout="row"
+                  layout-sm="column"
+                  layout-align="center center"
+                  layout-wrap
+                >
+                  <div
+                    class="padding-20 md-whiteframe-3dp md-accent-bg"
+                    layout="column"
+                    layout-align="center center"
+                  >
+                    <md-button class="md-icon-button">
+                      <md-icon md-font-icon="icon-plus"></md-icon>
+                    </md-button>
+                    <span
+                      aria-label="add configuration"
+                      translate
+                      translate-attr-label="INTEGRATIONS.ADD_CONFIGURATION"
+                      >ADD CONFIGURATION</span
+                    >
+                  </div>
+                </div>
+              </md-card>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/vtigerAccounts.html/vtigerAccounts-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/vtigerAccounts.html/vtigerAccounts-[chunkhash].html
deleted file mode 100644
index dbe5a7d..0000000
--- a/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/vtigerAccounts.html/vtigerAccounts-[chunkhash].html
+++ /dev/null
@@ -1,320 +0,0 @@
-<div
-  id="vtigerAccounts"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-heart" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="INTEGRATIONS.VTIGERACCOUNTS"
-          >VtigerAccounts</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="INTEGRATIONS.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedVtigerAccounts.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedVtigerAccounts =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="INTEGRATIONS.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-vtigerAccounts-count">
-          <span>{{vm.selectedVtigerAccounts.length}}</span>
-          <span translate="INTEGRATIONS.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="INTEGRATIONS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllVtigerAccounts()"
-                translate="INTEGRATIONS.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectVtigerAccounts()"
-                translate="INTEGRATIONS.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedVtigerAccounts"
-          csv-label="true"
-          filename="vtigerAccounts.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedVtigerAccounts($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- VTIGERACCOUNT TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedVtigerAccounts"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getVtigerAccounts"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">
-                  {{ 'INTEGRATIONS.ID' | translate }}
-                </th>
-                <th md-column md-order-by="name">
-                  {{ 'INTEGRATIONS.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="username">
-                  {{ 'INTEGRATIONS.VTIGER_USER_NAME' | translate }}
-                </th>
-                <th md-column md-order-by="remoteUri">
-                  {{ 'INTEGRATIONS.HOST' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.vtigerAccounts.rows.length">
-                <td md-cell colspan="5">
-                  <div layout="row" layout-align="center center">
-                    <span translate="INTEGRATIONS.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="vtigerAccount"
-                md-select-id="id"
-                ng-repeat="vtigerAccount in vm.vtigerAccounts.rows"
-              >
-                <td md-cell ng-if="vtigerAccount.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{vtigerAccount.name}}"
-                    ng-src="api/users/{{vtigerAccount.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!vtigerAccount.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{vtigerAccount.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(vtigerAccount, ev) : vm.createOrEditVtigerAccount($event, vtigerAccount)"
-                  md-cell
-                  class="id"
-                >
-                  {{vtigerAccount.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(vtigerAccount, ev) : vm.createOrEditVtigerAccount($event, vtigerAccount)"
-                  md-cell
-                  class="name"
-                >
-                  {{vtigerAccount.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(vtigerAccount, ev) : vm.createOrEditVtigerAccount($event, vtigerAccount)"
-                  md-cell
-                  class="username"
-                >
-                  {{vtigerAccount.username}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(vtigerAccount, ev) : vm.createOrEditVtigerAccount($event, vtigerAccount)"
-                  md-cell
-                  class="remoteUri"
-                >
-                  {{vtigerAccount.remoteUri}}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="INTEGRATIONS.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(vtigerAccount, $event    )"
-                          translate="INTEGRATIONS.EDIT_VTIGERACCOUNT"
-                        >
-                          Edit VtigerAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.testtestintegrationaccount(vtigerAccount, $event    )"
-                          translate="INTEGRATIONS.TEST_VTIGERACCOUNT"
-                        >
-                          Test VtigerAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(vtigerAccount, $event    )"
-                          translate="INTEGRATIONS.DELETE_VTIGERACCOUNT"
-                        >
-                          Delete VtigerAccount
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'INTEGRATIONS.PAGE' | translate}}:', rowsPerPage: '{{'INTEGRATIONS.ROWSPERPAGE' | translate}}:', of: '{{'INTEGRATIONS.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.vtigerAccounts.count}}"
-          md-on-paginate="vm.getVtigerAccounts"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / VTIGERACCOUNT TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD VTIGERACCOUNT BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-vtigerAccount-button"
-    ng-click="vm.createOrEditVtigerAccount($event)"
-    aria-label="add vtigerAccount"
-    translate
-    translate-attr-aria-label="INTEGRATIONS.ADD_VTIGERACCOUNT"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD VTIGERACCOUNT BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/vtigerAccounts.html/vtigerAccounts.html b/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/vtigerAccounts.html/vtigerAccounts.html
new file mode 100644
index 0000000..dbe5a7d
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/vtigerAccounts/vtigerAccounts.html/vtigerAccounts.html
@@ -0,0 +1,320 @@
+<div
+  id="vtigerAccounts"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-heart" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="INTEGRATIONS.VTIGERACCOUNTS"
+          >VtigerAccounts</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="INTEGRATIONS.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedVtigerAccounts.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedVtigerAccounts =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="INTEGRATIONS.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-vtigerAccounts-count">
+          <span>{{vm.selectedVtigerAccounts.length}}</span>
+          <span translate="INTEGRATIONS.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="INTEGRATIONS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllVtigerAccounts()"
+                translate="INTEGRATIONS.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectVtigerAccounts()"
+                translate="INTEGRATIONS.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedVtigerAccounts"
+          csv-label="true"
+          filename="vtigerAccounts.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedVtigerAccounts($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- VTIGERACCOUNT TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedVtigerAccounts"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getVtigerAccounts"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">
+                  {{ 'INTEGRATIONS.ID' | translate }}
+                </th>
+                <th md-column md-order-by="name">
+                  {{ 'INTEGRATIONS.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="username">
+                  {{ 'INTEGRATIONS.VTIGER_USER_NAME' | translate }}
+                </th>
+                <th md-column md-order-by="remoteUri">
+                  {{ 'INTEGRATIONS.HOST' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.vtigerAccounts.rows.length">
+                <td md-cell colspan="5">
+                  <div layout="row" layout-align="center center">
+                    <span translate="INTEGRATIONS.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="vtigerAccount"
+                md-select-id="id"
+                ng-repeat="vtigerAccount in vm.vtigerAccounts.rows"
+              >
+                <td md-cell ng-if="vtigerAccount.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{vtigerAccount.name}}"
+                    ng-src="api/users/{{vtigerAccount.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!vtigerAccount.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{vtigerAccount.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(vtigerAccount, ev) : vm.createOrEditVtigerAccount($event, vtigerAccount)"
+                  md-cell
+                  class="id"
+                >
+                  {{vtigerAccount.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(vtigerAccount, ev) : vm.createOrEditVtigerAccount($event, vtigerAccount)"
+                  md-cell
+                  class="name"
+                >
+                  {{vtigerAccount.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(vtigerAccount, ev) : vm.createOrEditVtigerAccount($event, vtigerAccount)"
+                  md-cell
+                  class="username"
+                >
+                  {{vtigerAccount.username}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(vtigerAccount, ev) : vm.createOrEditVtigerAccount($event, vtigerAccount)"
+                  md-cell
+                  class="remoteUri"
+                >
+                  {{vtigerAccount.remoteUri}}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="INTEGRATIONS.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(vtigerAccount, $event    )"
+                          translate="INTEGRATIONS.EDIT_VTIGERACCOUNT"
+                        >
+                          Edit VtigerAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.testtestintegrationaccount(vtigerAccount, $event    )"
+                          translate="INTEGRATIONS.TEST_VTIGERACCOUNT"
+                        >
+                          Test VtigerAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(vtigerAccount, $event    )"
+                          translate="INTEGRATIONS.DELETE_VTIGERACCOUNT"
+                        >
+                          Delete VtigerAccount
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'INTEGRATIONS.PAGE' | translate}}:', rowsPerPage: '{{'INTEGRATIONS.ROWSPERPAGE' | translate}}:', of: '{{'INTEGRATIONS.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.vtigerAccounts.count}}"
+          md-on-paginate="vm.getVtigerAccounts"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / VTIGERACCOUNT TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD VTIGERACCOUNT BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-vtigerAccount-button"
+    ng-click="vm.createOrEditVtigerAccount($event)"
+    aria-label="add vtigerAccount"
+    translate
+    translate-attr-aria-label="INTEGRATIONS.ADD_VTIGERACCOUNT"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD VTIGERACCOUNT BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 1e7670e..0000000
--- a/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,332 +0,0 @@
-<md-dialog class="zendeskAccount-dialog" aria-label="New ZendeskAccount">
-  <form name="zendeskAccountForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.zendeskAccount.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="zendeskAccountForm['name'].$error"
-          ng-show="zendeskAccountForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.TYPE">Type</label>
-        <md-select name="type" ng-model="vm.zendeskAccount.type" required>
-          <md-option ng-value="'integrationTab'">
-            {{ 'INTEGRATIONS.INTEGRATION_TAB' | translate }}
-          </md-option>
-
-          <md-option ng-value="'newTab'">
-            {{ 'INTEGRATIONS.NEW_TAB' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="zendeskAccountForm['type'].$error"
-          ng-show="zendeskAccountForm['type'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-              >Type field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.USERNAME">Username</label>
-        <input
-          type="text"
-          name="username"
-          ng-model="vm.zendeskAccount.username"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="zendeskAccountForm['username'].$error"
-          ng-show="zendeskAccountForm['username'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
-              >Username field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.URI">Uri</label>
-        <input
-          type="url"
-          name="remoteUri"
-          ng-model="vm.zendeskAccount.remoteUri"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="zendeskAccountForm['remoteUri'].$error"
-          ng-show="zendeskAccountForm['remoteUri'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
-              >Uri field is required</span
-            >
-          </div>
-          <div ng-message="url">
-            <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
-              >Uri must be a valid url http://www.xcally.com</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.AUTHTYPE">AuthType</label>
-        <md-select
-          name="authType"
-          ng-model="vm.zendeskAccount.authType"
-          required
-        >
-          <md-option ng-value="'password'">Password</md-option>
-          <md-option ng-value="'token'">Token</md-option>
-        </md-select>
-        <div
-          ng-messages="zendeskAccountForm['authType'].$error"
-          ng-show="zendeskAccountForm['authType'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.AUTHTYPE_REQUIRED"
-              >AuthType field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        class="md-block"
-        ng-if="vm.zendeskAccount.authType == 'password'"
-      >
-        <label translate="INTEGRATIONS.PASSWORD">Password</label>
-        <input
-          type="password"
-          name="password"
-          ng-model="vm.zendeskAccount.password"
-          placeholder="Password"
-          translate
-          translate-attr-placeholder="INTEGRATIONS.PASSWORD"
-          required
-        />
-        <div ng-messages="zendeskAccountForm['password'].$error" role="alert">
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.PASSWORD_REQUIRED"
-              >Password field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span translate="INTEGRATIONS.ERRORS.SECURE_PASSWORD_PATTERN"
-              >Must contain at least 8 characters, with a minimum of 1 lowercase
-              letter, 1 uppercase letter, 1 numeric character and 1 special
-              character ~!?*@#$%^&-_=+[{]}.</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <md-input-container
-        ng-if="vm.zendeskAccount.authType == 'token'"
-        class="md-block"
-      >
-        <label translate="INTEGRATIONS.TOKEN">Token</label>
-        <input
-          type="text"
-          name="token"
-          ng-model="vm.zendeskAccount.token"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="zendeskAccountForm['token'].$error"
-          ng-show="zendeskAccountForm['token'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.TOKEN_REQUIRED"
-              >Token field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
-          >MotionProxyAddress</label
-        >
-        <input
-          type="url"
-          name="serverUrl"
-          ng-model="vm.zendeskAccount.serverUrl"
-        />
-
-        <div class="hint">
-          <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
-        </div>
-        <div
-          ng-messages="zendeskAccountForm['serverUrl'].$error"
-          ng-show="zendeskAccountForm['serverUrl'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
-              >MotionProxyAddress field is required</span
-            >
-          </div>
-          <div ng-message="url">
-            <span
-              translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
-              >MotionProxyAddress must be a valid url
-              http://www.xcally.com</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.zendeskAccount.description"
-        />
-
-        <div
-          ng-messages="zendeskAccountForm['description'].$error"
-          ng-show="zendeskAccountForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newZendeskAccount"
-          ng-click="vm.saveZendeskAccount()"
-          class="send-button md-accent md-raised"
-          ng-disabled="zendeskAccountForm.$invalid || zendeskAccountForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newZendeskAccount"
-          ng-click="vm.addNewZendeskAccount()"
-          class="send-button md-accent md-raised"
-          ng-disabled="zendeskAccountForm.$invalid"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD_ZENDESKACCOUNT"
-          translate-attr-aria-label="INTEGRATIONS.ADD_ZENDESKACCOUNT"
-        >
-          ADD ZENDESKACCOUNT
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newZendeskAccount"
-          ng-click="vm.deleteZendeskAccount($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/create/dialog.html/dialog.html
new file mode 100644
index 0000000..1e7670e
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/create/dialog.html/dialog.html
@@ -0,0 +1,332 @@
+<md-dialog class="zendeskAccount-dialog" aria-label="New ZendeskAccount">
+  <form name="zendeskAccountForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.zendeskAccount.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="zendeskAccountForm['name'].$error"
+          ng-show="zendeskAccountForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.TYPE">Type</label>
+        <md-select name="type" ng-model="vm.zendeskAccount.type" required>
+          <md-option ng-value="'integrationTab'">
+            {{ 'INTEGRATIONS.INTEGRATION_TAB' | translate }}
+          </md-option>
+
+          <md-option ng-value="'newTab'">
+            {{ 'INTEGRATIONS.NEW_TAB' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="zendeskAccountForm['type'].$error"
+          ng-show="zendeskAccountForm['type'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+              >Type field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.USERNAME">Username</label>
+        <input
+          type="text"
+          name="username"
+          ng-model="vm.zendeskAccount.username"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="zendeskAccountForm['username'].$error"
+          ng-show="zendeskAccountForm['username'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
+              >Username field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.URI">Uri</label>
+        <input
+          type="url"
+          name="remoteUri"
+          ng-model="vm.zendeskAccount.remoteUri"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="zendeskAccountForm['remoteUri'].$error"
+          ng-show="zendeskAccountForm['remoteUri'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
+              >Uri field is required</span
+            >
+          </div>
+          <div ng-message="url">
+            <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
+              >Uri must be a valid url http://www.xcally.com</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.AUTHTYPE">AuthType</label>
+        <md-select
+          name="authType"
+          ng-model="vm.zendeskAccount.authType"
+          required
+        >
+          <md-option ng-value="'password'">Password</md-option>
+          <md-option ng-value="'token'">Token</md-option>
+        </md-select>
+        <div
+          ng-messages="zendeskAccountForm['authType'].$error"
+          ng-show="zendeskAccountForm['authType'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.AUTHTYPE_REQUIRED"
+              >AuthType field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        class="md-block"
+        ng-if="vm.zendeskAccount.authType == 'password'"
+      >
+        <label translate="INTEGRATIONS.PASSWORD">Password</label>
+        <input
+          type="password"
+          name="password"
+          ng-model="vm.zendeskAccount.password"
+          placeholder="Password"
+          translate
+          translate-attr-placeholder="INTEGRATIONS.PASSWORD"
+          required
+        />
+        <div ng-messages="zendeskAccountForm['password'].$error" role="alert">
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.PASSWORD_REQUIRED"
+              >Password field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span translate="INTEGRATIONS.ERRORS.SECURE_PASSWORD_PATTERN"
+              >Must contain at least 8 characters, with a minimum of 1 lowercase
+              letter, 1 uppercase letter, 1 numeric character and 1 special
+              character ~!?*@#$%^&-_=+[{]}.</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <md-input-container
+        ng-if="vm.zendeskAccount.authType == 'token'"
+        class="md-block"
+      >
+        <label translate="INTEGRATIONS.TOKEN">Token</label>
+        <input
+          type="text"
+          name="token"
+          ng-model="vm.zendeskAccount.token"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="zendeskAccountForm['token'].$error"
+          ng-show="zendeskAccountForm['token'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.TOKEN_REQUIRED"
+              >Token field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
+          >MotionProxyAddress</label
+        >
+        <input
+          type="url"
+          name="serverUrl"
+          ng-model="vm.zendeskAccount.serverUrl"
+        />
+
+        <div class="hint">
+          <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
+        </div>
+        <div
+          ng-messages="zendeskAccountForm['serverUrl'].$error"
+          ng-show="zendeskAccountForm['serverUrl'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
+              >MotionProxyAddress field is required</span
+            >
+          </div>
+          <div ng-message="url">
+            <span
+              translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
+              >MotionProxyAddress must be a valid url
+              http://www.xcally.com</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.zendeskAccount.description"
+        />
+
+        <div
+          ng-messages="zendeskAccountForm['description'].$error"
+          ng-show="zendeskAccountForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newZendeskAccount"
+          ng-click="vm.saveZendeskAccount()"
+          class="send-button md-accent md-raised"
+          ng-disabled="zendeskAccountForm.$invalid || zendeskAccountForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newZendeskAccount"
+          ng-click="vm.addNewZendeskAccount()"
+          class="send-button md-accent md-raised"
+          ng-disabled="zendeskAccountForm.$invalid"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD_ZENDESKACCOUNT"
+          translate-attr-aria-label="INTEGRATIONS.ADD_ZENDESKACCOUNT"
+        >
+          ADD ZENDESKACCOUNT
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newZendeskAccount"
+          ng-click="vm.deleteZendeskAccount($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/edit/item/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/edit/item/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index ffed286..0000000
--- a/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/edit/item/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,478 +0,0 @@
-<md-dialog class="zendeskAccount-item-dialog" aria-label="New Item">
-  <form name="zendeskAccountItemForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <div ng-switch="vm.type">
-        <div ng-switch-when="subject">
-          <!-- SUBJECT SECTION -->
-          <div ng-include="'/subject.html'"></div>
-          <!-- / SUBJECT SECTION -->
-        </div>
-        <div ng-switch-when="description">
-          <!-- DESCRIPTION SECTION -->
-          <md-input-container class="md-block">
-            <label translate="INTEGRATIONS.TYPE">Type</label>
-            <md-select name="type" ng-model="vm.item.type" required>
-              <md-option value="string">String</md-option>
-              <md-option value="keyValue">Key Value</md-option>
-            </md-select>
-            <div
-              ng-messages="zendeskAccountItemForm.type.$error"
-              ng-show="zendeskAccountItemForm.type.$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-                  >Type field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
-            <label translate="INTEGRATIONS.CONTENT">Content</label>
-            <input
-              type="text"
-              name="content"
-              ng-model="vm.item.content"
-              required
-              md-autofocus
-            />
-            <div
-              ng-messages="zendeskAccountItemForm.content.$error"
-              ng-show="zendeskAccountItemForm.content.$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
-                  >Content field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <div ng-if="vm.item.type == 'keyValue'">
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.KEY">Key</label>
-              <input
-                type="text"
-                name="key"
-                ng-model="vm.item.key"
-                required
-                md-autofocus
-              />
-              <div
-                ng-messages="zendeskAccountItemForm.key.$error"
-                ng-show="zendeskAccountItemForm.key.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.KEY_REQUIRED"
-                    >Key field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.TYPE">Type</label>
-              <md-select name="keyType" ng-model="vm.item.keyType" required>
-                <md-option value="string">String</md-option>
-                <md-option value="variable">Variable</md-option>
-                <md-option value="customVariable">Custom Variable</md-option>
-              </md-select>
-              <div
-                ng-messages="zendeskAccountItemForm.keyType.$error"
-                ng-show="zendeskAccountItemForm.keyType.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-                    >Type field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'string'"
-            >
-              <label translate="INTEGRATIONS.CONTENT">Content</label>
-              <input
-                type="text"
-                name="keyContent"
-                ng-model="vm.item.keyContent"
-                required
-                md-autofocus
-              />
-              <div
-                ng-messages="zendeskAccountItemForm.keyContent.$error"
-                ng-show="zendeskAccountItemForm.keyContent.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
-                    >Content field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'variable'"
-            >
-              <label translate="INTEGRATIONS.VALUE">Value</label>
-              <md-select
-                name="variableName"
-                ng-model="vm.item.variableName"
-                md-selected-text="vm.getSelectedVariable()"
-                required
-              >
-                <md-optgroup label="Voice: Queue">
-                  <md-option
-                    ng-value="agentColumn"
-                    ng-repeat="agentColumn in vm.voiceAgentReportColumns"
-                    >{{agentColumn}}
-                  </md-option>
-                </md-optgroup>
-                <md-optgroup label="Voice: Outbound">
-                  <md-option
-                    ng-value="dialColumn"
-                    ng-repeat="dialColumn in vm.voiceDialReportColumns"
-                    >{{dialColumn}}</md-option
-                  >
-                </md-optgroup>
-              </md-select>
-              <div
-                ng-messages="zendeskAccountItemForm.variableName.$error"
-                ng-show="zendeskAccountItemForm.variableName.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED"
-                    >Variable name field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'customVariable'"
-            >
-              <label translate="INTEGRATIONS.VALUE">Value</label>
-              <md-select ng-model="vm.item.VariableId" required>
-                <md-option
-                  ng-value="variable.id"
-                  ng-repeat="variable in vm.variables"
-                  >{{variable.name}}
-                </md-option>
-              </md-select>
-            </md-input-container>
-          </div>
-          <!-- / DESCRIPTION SECTION -->
-        </div>
-        <div ng-switch-when="field">
-          <!-- FIELD SECTION -->
-          <div ng-if="vm.accountConnected">
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.FIELD">FIELD</label>
-              <!-- ITEM TYPE DEFAULT VALUE is STRING -->
-              <md-select
-                name="customField"
-                ng-model="vm.customField"
-                required
-                ng-change="vm.item.type = 'string'"
-              >
-                <md-optgroup label="Standard">
-                  <md-option
-                    ng-value="standard"
-                    ng-repeat="standard in vm.fields | filter: {custom: false} "
-                    >{{standard.name}}
-                  </md-option>
-                </md-optgroup>
-
-                <md-optgroup label="Custom">
-                  <md-option
-                    ng-value="custom"
-                    ng-repeat="custom in vm.fields | filter: {custom: true} "
-                    >{{custom.name}}
-                  </md-option>
-                </md-optgroup>
-              </md-select>
-              <div
-                ng-messages="zendeskAccountItemForm.customField.$error"
-                ng-show="zendeskAccountItemForm.customField.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.FIELD_REQUIRED"
-                    >Field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <!-- FIELDS -->
-            <div ng-if="vm.customField" ng-include="'/fields.html'"></div>
-            <!-- FIELDS -->
-          </div>
-          <div ng-if="!vm.accountConnected">
-            <p>Account is not connected. Please check your configurations!</p>
-          </div>
-          <!-- / FIELD SECTION -->
-        </div>
-        <div ng-switch-default>
-          <p>No Item</p>
-        </div>
-      </div>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newItem"
-          ng-click="vm.saveItem()"
-          class="send-button md-accent md-raised"
-          ng-disabled="zendeskAccountItemForm.$invalid || zendeskAccountItemForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newItem"
-          ng-click="vm.addNewItem()"
-          class="send-button md-accent md-raised"
-          ng-disabled="zendeskAccountItemForm.$invalid || zendeskAccountItemForm.$pristine"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD"
-          translate-attr-aria-label="INTEGRATIONS.ADD"
-        >
-          ADD
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newItem"
-          ng-click="vm.deleteItem($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
-
-<script type="text/ng-template" id="/fields.html">
-
-  <!-- type -->
-  <md-input-container class="md-block" ng-if="!vm.customField.options.length">
-
-      <label translate="INTEGRATIONS.TYPE">Type</label>
-      <md-select name="type" ng-model="vm.item.type" required>
-
-          <md-option value="string">String</md-option>
-          <md-option value="variable">Variable</md-option>
-          <md-option value="customVariable">Custom Variable</md-option>
-      </md-select>
-      <div ng-messages="zendeskAccountItemForm.type.$error" ng-show="zendeskAccountItemForm.type.$touched"
-          role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <!--/ type -->
-
-  <!-- value -->
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && vm.customField.options.length">
-      <!-- options -->
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-
-      <md-select name="option" ng-model="vm.item.content" required>
-          <md-option ng-value="option.value" ng-repeat="option in vm.customField.options">{{option.name}}</md-option>
-      </md-select>
-
-      <div ng-messages="zendeskAccountItemForm.option.$error"
-          ng-show="zendeskAccountItemForm.option.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VALUE_REQUIRED">Value field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && !vm.customField.options.length">
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-
-      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
-
-      <div ng-messages="zendeskAccountItemForm.content.$error"
-          ng-show="zendeskAccountItemForm.content.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
-          required>
-          <md-optgroup label="Voice: Queue">
-              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
-              </md-option>
-          </md-optgroup>
-          <md-optgroup label="Voice: Outbound">
-              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
-              </md-option>
-          </md-optgroup>
-      </md-select>
-      <div ng-messages="zendeskAccountItemForm.variableName.$error"
-          ng-show="zendeskAccountItemForm.variableName.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select ng-model="vm.item.VariableId" required>
-          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
-      </md-select>
-  </md-input-container>
-
-  <!--/ value -->
-</script>
-
-<script type="text/ng-template" id="/subject.html">
-    <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.TYPE">Type</label>
-            <md-select name="type" ng-model="vm.item.type" required>
-                <md-option value="string">String</md-option>
-                <md-option value="variable">Variable</md-option>
-                <md-option value="customVariable">Custom Variable</md-option>
-            </md-select>
-        <div ng-messages="zendeskAccountItemForm.type.$error" ng-show="zendeskAccountItemForm.type.$touched" role="alert">
-            <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
-             </div>
-        </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
-      <div ng-messages="zendeskAccountItemForm.content.$error"
-          ng-show="zendeskAccountItemForm.content.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
-          required>
-          <md-optgroup label="Voice: Queue">
-              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
-              </md-option>
-          </md-optgroup>
-          <md-optgroup label="Voice: Outbound">
-              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
-              </md-option>
-          </md-optgroup>
-      </md-select>
-      <div ng-messages="zendeskAccountItemForm.variableName.$error"
-          ng-show="zendeskAccountItemForm.variableName.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select ng-model="vm.item.VariableId" required>
-          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
-      </md-select>
-  </md-input-container>
-</script>
diff --git a/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/edit/item/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/edit/item/dialog.html/dialog.html
new file mode 100644
index 0000000..ffed286
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/edit/item/dialog.html/dialog.html
@@ -0,0 +1,478 @@
+<md-dialog class="zendeskAccount-item-dialog" aria-label="New Item">
+  <form name="zendeskAccountItemForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <div ng-switch="vm.type">
+        <div ng-switch-when="subject">
+          <!-- SUBJECT SECTION -->
+          <div ng-include="'/subject.html'"></div>
+          <!-- / SUBJECT SECTION -->
+        </div>
+        <div ng-switch-when="description">
+          <!-- DESCRIPTION SECTION -->
+          <md-input-container class="md-block">
+            <label translate="INTEGRATIONS.TYPE">Type</label>
+            <md-select name="type" ng-model="vm.item.type" required>
+              <md-option value="string">String</md-option>
+              <md-option value="keyValue">Key Value</md-option>
+            </md-select>
+            <div
+              ng-messages="zendeskAccountItemForm.type.$error"
+              ng-show="zendeskAccountItemForm.type.$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+                  >Type field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
+            <label translate="INTEGRATIONS.CONTENT">Content</label>
+            <input
+              type="text"
+              name="content"
+              ng-model="vm.item.content"
+              required
+              md-autofocus
+            />
+            <div
+              ng-messages="zendeskAccountItemForm.content.$error"
+              ng-show="zendeskAccountItemForm.content.$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
+                  >Content field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <div ng-if="vm.item.type == 'keyValue'">
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.KEY">Key</label>
+              <input
+                type="text"
+                name="key"
+                ng-model="vm.item.key"
+                required
+                md-autofocus
+              />
+              <div
+                ng-messages="zendeskAccountItemForm.key.$error"
+                ng-show="zendeskAccountItemForm.key.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.KEY_REQUIRED"
+                    >Key field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.TYPE">Type</label>
+              <md-select name="keyType" ng-model="vm.item.keyType" required>
+                <md-option value="string">String</md-option>
+                <md-option value="variable">Variable</md-option>
+                <md-option value="customVariable">Custom Variable</md-option>
+              </md-select>
+              <div
+                ng-messages="zendeskAccountItemForm.keyType.$error"
+                ng-show="zendeskAccountItemForm.keyType.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+                    >Type field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'string'"
+            >
+              <label translate="INTEGRATIONS.CONTENT">Content</label>
+              <input
+                type="text"
+                name="keyContent"
+                ng-model="vm.item.keyContent"
+                required
+                md-autofocus
+              />
+              <div
+                ng-messages="zendeskAccountItemForm.keyContent.$error"
+                ng-show="zendeskAccountItemForm.keyContent.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
+                    >Content field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'variable'"
+            >
+              <label translate="INTEGRATIONS.VALUE">Value</label>
+              <md-select
+                name="variableName"
+                ng-model="vm.item.variableName"
+                md-selected-text="vm.getSelectedVariable()"
+                required
+              >
+                <md-optgroup label="Voice: Queue">
+                  <md-option
+                    ng-value="agentColumn"
+                    ng-repeat="agentColumn in vm.voiceAgentReportColumns"
+                    >{{agentColumn}}
+                  </md-option>
+                </md-optgroup>
+                <md-optgroup label="Voice: Outbound">
+                  <md-option
+                    ng-value="dialColumn"
+                    ng-repeat="dialColumn in vm.voiceDialReportColumns"
+                    >{{dialColumn}}</md-option
+                  >
+                </md-optgroup>
+              </md-select>
+              <div
+                ng-messages="zendeskAccountItemForm.variableName.$error"
+                ng-show="zendeskAccountItemForm.variableName.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED"
+                    >Variable name field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'customVariable'"
+            >
+              <label translate="INTEGRATIONS.VALUE">Value</label>
+              <md-select ng-model="vm.item.VariableId" required>
+                <md-option
+                  ng-value="variable.id"
+                  ng-repeat="variable in vm.variables"
+                  >{{variable.name}}
+                </md-option>
+              </md-select>
+            </md-input-container>
+          </div>
+          <!-- / DESCRIPTION SECTION -->
+        </div>
+        <div ng-switch-when="field">
+          <!-- FIELD SECTION -->
+          <div ng-if="vm.accountConnected">
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.FIELD">FIELD</label>
+              <!-- ITEM TYPE DEFAULT VALUE is STRING -->
+              <md-select
+                name="customField"
+                ng-model="vm.customField"
+                required
+                ng-change="vm.item.type = 'string'"
+              >
+                <md-optgroup label="Standard">
+                  <md-option
+                    ng-value="standard"
+                    ng-repeat="standard in vm.fields | filter: {custom: false} "
+                    >{{standard.name}}
+                  </md-option>
+                </md-optgroup>
+
+                <md-optgroup label="Custom">
+                  <md-option
+                    ng-value="custom"
+                    ng-repeat="custom in vm.fields | filter: {custom: true} "
+                    >{{custom.name}}
+                  </md-option>
+                </md-optgroup>
+              </md-select>
+              <div
+                ng-messages="zendeskAccountItemForm.customField.$error"
+                ng-show="zendeskAccountItemForm.customField.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.FIELD_REQUIRED"
+                    >Field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <!-- FIELDS -->
+            <div ng-if="vm.customField" ng-include="'/fields.html'"></div>
+            <!-- FIELDS -->
+          </div>
+          <div ng-if="!vm.accountConnected">
+            <p>Account is not connected. Please check your configurations!</p>
+          </div>
+          <!-- / FIELD SECTION -->
+        </div>
+        <div ng-switch-default>
+          <p>No Item</p>
+        </div>
+      </div>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newItem"
+          ng-click="vm.saveItem()"
+          class="send-button md-accent md-raised"
+          ng-disabled="zendeskAccountItemForm.$invalid || zendeskAccountItemForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newItem"
+          ng-click="vm.addNewItem()"
+          class="send-button md-accent md-raised"
+          ng-disabled="zendeskAccountItemForm.$invalid || zendeskAccountItemForm.$pristine"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD"
+          translate-attr-aria-label="INTEGRATIONS.ADD"
+        >
+          ADD
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newItem"
+          ng-click="vm.deleteItem($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
+
+<script type="text/ng-template" id="/fields.html">
+
+  <!-- type -->
+  <md-input-container class="md-block" ng-if="!vm.customField.options.length">
+
+      <label translate="INTEGRATIONS.TYPE">Type</label>
+      <md-select name="type" ng-model="vm.item.type" required>
+
+          <md-option value="string">String</md-option>
+          <md-option value="variable">Variable</md-option>
+          <md-option value="customVariable">Custom Variable</md-option>
+      </md-select>
+      <div ng-messages="zendeskAccountItemForm.type.$error" ng-show="zendeskAccountItemForm.type.$touched"
+          role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <!--/ type -->
+
+  <!-- value -->
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && vm.customField.options.length">
+      <!-- options -->
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+
+      <md-select name="option" ng-model="vm.item.content" required>
+          <md-option ng-value="option.value" ng-repeat="option in vm.customField.options">{{option.name}}</md-option>
+      </md-select>
+
+      <div ng-messages="zendeskAccountItemForm.option.$error"
+          ng-show="zendeskAccountItemForm.option.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VALUE_REQUIRED">Value field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && !vm.customField.options.length">
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+
+      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
+
+      <div ng-messages="zendeskAccountItemForm.content.$error"
+          ng-show="zendeskAccountItemForm.content.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
+          required>
+          <md-optgroup label="Voice: Queue">
+              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
+              </md-option>
+          </md-optgroup>
+          <md-optgroup label="Voice: Outbound">
+              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
+              </md-option>
+          </md-optgroup>
+      </md-select>
+      <div ng-messages="zendeskAccountItemForm.variableName.$error"
+          ng-show="zendeskAccountItemForm.variableName.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select ng-model="vm.item.VariableId" required>
+          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
+      </md-select>
+  </md-input-container>
+
+  <!--/ value -->
+</script>
+
+<script type="text/ng-template" id="/subject.html">
+    <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.TYPE">Type</label>
+            <md-select name="type" ng-model="vm.item.type" required>
+                <md-option value="string">String</md-option>
+                <md-option value="variable">Variable</md-option>
+                <md-option value="customVariable">Custom Variable</md-option>
+            </md-select>
+        <div ng-messages="zendeskAccountItemForm.type.$error" ng-show="zendeskAccountItemForm.type.$touched" role="alert">
+            <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
+             </div>
+        </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
+      <div ng-messages="zendeskAccountItemForm.content.$error"
+          ng-show="zendeskAccountItemForm.content.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
+          required>
+          <md-optgroup label="Voice: Queue">
+              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
+              </md-option>
+          </md-optgroup>
+          <md-optgroup label="Voice: Outbound">
+              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
+              </md-option>
+          </md-optgroup>
+      </md-select>
+      <div ng-messages="zendeskAccountItemForm.variableName.$error"
+          ng-show="zendeskAccountItemForm.variableName.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select ng-model="vm.item.VariableId" required>
+          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
+      </md-select>
+  </md-input-container>
+</script>
diff --git a/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index 69a8a8a..0000000
--- a/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,1031 +0,0 @@
-<div
-  id="integrations-zendeskAccount"
-  class="page-layout simple tabbed"
-  layout="column"
->
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-zendeskAccounts-button md-icon-button"
-        aria-label="Go to zendeskAccounts"
-        ng-click="vm.gotoZendeskAccounts()"
-        translate
-        translate-attr-aria-label="INTEGRATIONS.GO_TO_ZENDESKACCOUNTS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="zendeskAccount-image" hide-xs>
-          <img ng-src="assets/images/business/zendeskAccounts.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.zendeskAccount.id}}
-            <span ng-if="vm.zendeskAccount.name"
-              >{{vm.zendeskAccount.name}}</span
-            >
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="INTEGRATIONS.CREATED_AT"></span>
-            <span>{{vm.zendeskAccount.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveZendeskAccount()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (zendeskConfigurationsForm.$invalid)"
-        translate="INTEGRATIONS.SAVE"
-        translate-attr-aria-label="INTEGRATIONS.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="INTEGRATIONS.ACCOUNT">ACCOUNT</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="zendeskAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="INTEGRATIONS.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.zendeskAccount.name"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.TYPE">Type</label>
-                <md-select
-                  name="type"
-                  ng-model="vm.zendeskAccount.type"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'integrationTab'">
-                    {{ 'INTEGRATIONS.INTEGRATION_TAB' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'newTab'">
-                    {{ 'INTEGRATIONS.NEW_TAB' | translate }}
-                  </md-option>
-                </md-select>
-                <div
-                  ng-messages="generalForm['type'].$error"
-                  ng-show="generalForm['type'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-                      >Type field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.USERNAME">Username</label>
-                <input
-                  type="text"
-                  name="username"
-                  ng-model="vm.zendeskAccount.username"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['username'].$error"
-                  ng-show="generalForm['username'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
-                      >Username field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.URI">Uri</label>
-                <input
-                  type="url"
-                  name="remoteUri"
-                  ng-model="vm.zendeskAccount.remoteUri"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['remoteUri'].$error"
-                  ng-show="generalForm['remoteUri'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
-                      >Uri field is required</span
-                    >
-                  </div>
-                  <div ng-message="url">
-                    <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
-                      >Uri must be a valid url http://www.xcally.com</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.AUTHTYPE">AuthType</label>
-                <md-select
-                  name="authType"
-                  ng-model="vm.zendeskAccount.authType"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'password'">Password</md-option>
-                  <md-option ng-value="'token'">Token</md-option>
-                </md-select>
-                <div
-                  ng-messages="generalForm['authType'].$error"
-                  ng-show="generalForm['authType'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.AUTHTYPE_REQUIRED"
-                      >AuthType field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                class="md-block"
-                ng-if="vm.zendeskAccount.authType == 'password'"
-              >
-                <label translate="INTEGRATIONS.PASSWORD">Password</label>
-                <input
-                  type="password"
-                  name="password"
-                  ng-model="vm.zendeskAccount.password"
-                  placeholder="Password"
-                  translate
-                  translate-attr-placeholder="INTEGRATIONS.PASSWORD"
-                  required
-                />
-                <div ng-messages="generalForm['password'].$error" role="alert">
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.PASSWORD_REQUIRED"
-                      >Password field is required</span
-                    >
-                  </div>
-                  <div ng-message="pattern">
-                    <span
-                      translate="INTEGRATIONS.ERRORS.SECURE_PASSWORD_PATTERN"
-                      >Must contain at least 8 characters, with a minimum of 1
-                      lowercase letter, 1 uppercase letter, 1 numeric character
-                      and 1 special character ~!?*@#$%^&-_=+[{]}.</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-
-              <md-input-container
-                ng-if="vm.zendeskAccount.authType == 'token'"
-                class="md-block"
-              >
-                <label translate="INTEGRATIONS.TOKEN">Token</label>
-                <input
-                  type="text"
-                  name="token"
-                  ng-model="vm.zendeskAccount.token"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['token'].$error"
-                  ng-show="generalForm['token'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.TOKEN_REQUIRED"
-                      >Token field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
-                  >MotionProxyAddress</label
-                >
-                <input
-                  type="url"
-                  name="serverUrl"
-                  ng-model="vm.zendeskAccount.serverUrl"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['serverUrl'].$error"
-                  ng-show="generalForm['serverUrl'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
-                      >MotionProxyAddress field is required</span
-                    >
-                  </div>
-                  <div ng-message="url">
-                    <span
-                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
-                      >MotionProxyAddress must be a valid url
-                      http://www.xcally.com</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.zendeskAccount.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="INTEGRATIONS.CONFIGURATIONS">CONFIGURATIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="zendeskAccount-detail-form-container zendeskconfigurations md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div
-                class="h2 secondary-text"
-                translate="INTEGRATIONS.ZENDESKCONFIGURATIONS"
-              >
-                ZENDESKCONFIGURATIONS
-              </div>
-            </div>
-            <div
-              ng-controller="ZendeskAccountConfigurationsController as vm_cc"
-              ng-init="vm_cc.init(vm.zendeskAccount, vm.crudPermissions)"
-              layout="row"
-            >
-              <md-card class="md-whiteframe-1dp" flex="30">
-                <div layout="row" layout-align="center center">
-                  <md-subheader flex="75" class="md-no-sticky"
-                    >{{ 'INTEGRATIONS.CONFIGURATIONS' | translate
-                    }}</md-subheader
-                  >
-                  <md-button
-                    flex="25"
-                    ng-if="vm_cc.crudPermissions.canEdit"
-                    ng-click="vm_cc.createOrEditZendeskConfiguration($event)"
-                    class="md-icon-button"
-                    aria-label="create zendeskConfiguration"
-                  >
-                    <md-icon md-font-icon="icon-plus"></md-icon>
-                  </md-button>
-                </div>
-                <md-list>
-                  <md-list-item
-                    layout="row"
-                    layout-align="center center"
-                    ng-repeat="zendeskConfiguration in vm_cc.zendeskConfigurations"
-                    class="border-top"
-                    md-colors="{background: (vm_cc.selectedZendeskConfiguration == $index ? 'accent' : 'grey-A100')}"
-                    ng-click="vm_cc.getZendeskConfiguration($index)"
-                  >
-                    <span class="text-truncate" flex="80"
-                      >{{ zendeskConfiguration.name }}</span
-                    >
-                    <md-menu ng-if="vm_cc.crudPermissions.canDelete">
-                      <md-button
-                        class="md-icon-button"
-                        aria-label="More"
-                        translate
-                        translate-attr-aria-label="INTEGRATIONS.MORE"
-                        ng-click="$mdOpenMenu($event)"
-                      >
-                        <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                      </md-button>
-                      <md-menu-content width="3">
-                        <md-menu-item ng-if="vm_cc.crudPermissions.canDelete">
-                          <md-button
-                            ng-click="vm_cc.deleteZendeskConfiguration($event, zendeskConfiguration)"
-                            translate="INTEGRATIONS.DELETE_ZENDESKCONFIGURATION"
-                          >
-                            Delete ZendeskConfiguration
-                          </md-button>
-                        </md-menu-item>
-                      </md-menu-content>
-                    </md-menu>
-                  </md-list-item>
-                </md-list>
-              </md-card>
-              <div flex></div>
-              <md-card class="md-whiteframe-1dp" flex="65">
-                <md-tabs
-                  ng-if="vm_cc.zendeskConfigurations.length"
-                  md-dynamic-height
-                >
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.SUBJECTS">SUBJECTS</span>
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-toolbar
-                        class="md-table-toolbar md-default no-padding"
-                        ng-hide="vm_cc.selectedSubjects.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <div flex></div>
-                          <ms-search-bar
-                            on-search="vm_cc.query.subject = query"
-                            on-collapse="vm_cc.query.subject = undefined"
-                            debounce="300"
-                          ></ms-search-bar>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canEdit"
-                            class="md-icon-button"
-                            ng-click="vm_cc.createOrEditSubject($event)"
-                            aria-label="add subject"
-                            translate
-                            translate-attr-label="INTEGRATIONS.ADD_SUBJECT"
-                          >
-                            <md-icon md-font-icon="icon-plus"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-toolbar
-                        class="md-table-toolbar md-accent"
-                        ng-show="vm_cc.selectedSubjects.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <span class="md-subhead"
-                            >{{vm_cc.selectedSubjects.length}}
-                            {{vm_cc.selectedSubjects.length > 1 ? 'items' :
-                            'item'}} selected</span
-                          >
-                          <div flex></div>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canDelete"
-                            class="md-icon-button"
-                            ng-click="vm_cc.deleteSelectedSubjects($event)"
-                            aria-label="delete selected"
-                            translate
-                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-                          >
-                            <md-icon md-font-icon="icon-delete"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-table-container
-                        class="md-whiteframe-1dp padding-horizontal"
-                      >
-                        <table
-                          md-table
-                          md-row-select
-                          multiple
-                          ng-model="vm_cc.selectedSubjects"
-                        >
-                          <thead md-head>
-                            <tr md-row>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.ID' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.TYPE' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.CONTENT' | translate }}
-                              </th>
-                              <th md-column width="10px"></th>
-                            </tr>
-                          </thead>
-                          <tbody md-body>
-                            <tr
-                              md-row
-                              md-select="subject"
-                              md-select-id="id"
-                              ng-repeat="subject in vm_cc.subjects | filter: vm_cc.query.subject"
-                            >
-                              <td
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                                class="id"
-                              >
-                                {{subject.id}}
-                              </td>
-                              <td
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                                class="type"
-                              >
-                                <span ng-if="subject.FieldId"
-                                  >{{subject.nameField ||
-                                  subject.idField}}</span
-                                >
-                                <span ng-if="!subject.FieldId"
-                                  >{{subject.type}}</span
-                                >
-                              </td>
-                              <td
-                                ng-switch="subject.type"
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                              >
-                                <span ng-switch-when="string"
-                                  >{{subject.content}}</span
-                                >
-                                <span
-                                  ng-switch-when="variable"
-                                  class="text-boxed"
-                                  >{{subject.variableName}}</span
-                                >
-                                <span
-                                  ng-switch-when="customVariable"
-                                  class="text-boxed"
-                                  >{{
-                                  vm_cc.variablesById[subject.VariableId].name
-                                  }}</span
-                                >
-                                <span ng-switch-when="keyValue">
-                                  {{subject.key}}
-                                  <span ng-switch="description.keyType">
-                                    <span ng-switch-when="string"
-                                      >{{subject.keyContent}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="variable"
-                                      class="text-boxed"
-                                      >{{subject.variableName}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="customVariable"
-                                      class="text-boxed"
-                                      >{{
-                                      vm_cc.variablesById[subject.VariableId].name
-                                      }}</span
-                                    >
-                                  </span>
-                                </span>
-                                <span ng-switch-default
-                                  >{{subject.content}}</span
-                                >
-                              </td>
-                              <td
-                                md-cell
-                                class="actions"
-                                ng-if="!vm_cc.crudPermissions.readOnly"
-                              >
-                                <md-menu>
-                                  <md-button
-                                    class="md-icon-button"
-                                    aria-label="More"
-                                    translate
-                                    translate-attr-aria-label="INTEGRATIONS.MORE"
-                                    ng-click="$mdOpenMenu($event)"
-                                  >
-                                    <md-icon
-                                      md-font-icon="icon-dots-vertical"
-                                    ></md-icon>
-                                  </md-button>
-
-                                  <md-menu-content width="3">
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canEdit"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                        translate="INTEGRATIONS.EDIT_SUBJECT"
-                                      >
-                                        Edit Subject
-                                      </md-button>
-                                    </md-menu-item>
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canDelete"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.deleteSubjectConfirm($event, subject)"
-                                        translate="INTEGRATIONS.DELETE_SUBJECT"
-                                      >
-                                        Delete Subject
-                                      </md-button>
-                                    </md-menu-item>
-                                  </md-menu-content>
-                                </md-menu>
-                              </td>
-                            </tr>
-                          </tbody>
-                        </table>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.DESCRIPTIONS"
-                        >DESCRIPTIONS</span
-                      >
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-toolbar
-                        class="md-table-toolbar md-default no-padding"
-                        ng-hide="vm_cc.selectedDescriptions.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <div flex></div>
-                          <ms-search-bar
-                            on-search="vm_cc.query.description = query"
-                            on-collapse="vm_cc.query.description = undefined"
-                            debounce="300"
-                          ></ms-search-bar>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canEdit"
-                            class="md-icon-button"
-                            ng-click="vm_cc.createOrEditDescription($event)"
-                            aria-label="add description"
-                            translate
-                            translate-attr-label="INTEGRATIONS.ADD_DESCRIPTION"
-                          >
-                            <md-icon md-font-icon="icon-plus"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-toolbar
-                        class="md-table-toolbar md-accent"
-                        ng-show="vm_cc.selectedDescriptions.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <span class="md-subhead"
-                            >{{vm_cc.selectedDescriptions.length}}
-                            {{vm_cc.selectedDescriptions.length > 1 ? 'items' :
-                            'item'}} selected</span
-                          >
-                          <div flex></div>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canDelete"
-                            class="md-icon-button"
-                            ng-click="vm_cc.deleteSelectedDescriptions($event)"
-                            aria-label="delete selected"
-                            translate
-                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-                          >
-                            <md-icon md-font-icon="icon-delete"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-table-container
-                        class="md-whiteframe-1dp padding-horizontal"
-                      >
-                        <table
-                          md-table
-                          md-row-select
-                          multiple
-                          ng-model="vm_cc.selectedDescriptions"
-                        >
-                          <thead md-head>
-                            <tr md-row>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.ID' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.TYPE' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.CONTENT' | translate }}
-                              </th>
-                              <th md-column width="10px"></th>
-                            </tr>
-                          </thead>
-                          <tbody md-body>
-                            <tr
-                              md-row
-                              md-select="description"
-                              md-select-id="id"
-                              ng-repeat="description in vm_cc.descriptions | filter: vm_cc.query.description"
-                            >
-                              <td
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                                class="id"
-                              >
-                                {{description.id}}
-                              </td>
-                              <td
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                                class="type"
-                              >
-                                <span ng-if="description.FieldId"
-                                  >{{description.nameField ||
-                                  description.idField}}</span
-                                >
-                                <span ng-if="!description.FieldId"
-                                  >{{description.type}}</span
-                                >
-                              </td>
-                              <td
-                                ng-switch="description.type"
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                              >
-                                <span ng-switch-when="string"
-                                  >{{description.content}}</span
-                                >
-                                <span
-                                  ng-switch-when="variable"
-                                  class="text-boxed"
-                                  >{{description.variableName}}</span
-                                >
-                                <span
-                                  ng-switch-when="customVariable"
-                                  class="text-boxed"
-                                  >{{
-                                  vm_cc.variablesById[description.VariableId].name
-                                  }}</span
-                                >
-                                <span ng-switch-when="keyValue">
-                                  {{description.key}}
-                                  <span ng-switch="description.keyType">
-                                    <span ng-switch-when="string"
-                                      >{{description.keyContent}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="variable"
-                                      class="text-boxed"
-                                      >{{description.variableName}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="customVariable"
-                                      class="text-boxed"
-                                      >{{
-                                      vm_cc.variablesById[description.VariableId].name
-                                      }}</span
-                                    >
-                                  </span>
-                                </span>
-                                <span ng-switch-default
-                                  >{{description.content}}</span
-                                >
-                              </td>
-                              <td
-                                md-cell
-                                class="actions"
-                                ng-if="!vm_cc.crudPermissions.readOnly"
-                              >
-                                <md-menu>
-                                  <md-button
-                                    class="md-icon-button"
-                                    aria-label="More"
-                                    translate
-                                    translate-attr-aria-label="INTEGRATIONS.MORE"
-                                    ng-click="$mdOpenMenu($event)"
-                                  >
-                                    <md-icon
-                                      md-font-icon="icon-dots-vertical"
-                                    ></md-icon>
-                                  </md-button>
-
-                                  <md-menu-content width="3">
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canEdit"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.createOrEditDescription($event, description)"
-                                        translate="INTEGRATIONS.EDIT_DESCRIPTION"
-                                      >
-                                        Edit Description
-                                      </md-button>
-                                    </md-menu-item>
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canDelete"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.deleteDescriptionConfirm($event, description)"
-                                        translate="INTEGRATIONS.DELETE_DESCRIPTION"
-                                      >
-                                        Delete Description
-                                      </md-button>
-                                    </md-menu-item>
-                                  </md-menu-content>
-                                </md-menu>
-                              </td>
-                            </tr>
-                          </tbody>
-                        </table>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.FIELDS">FIELDS</span>
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-toolbar
-                        class="md-table-toolbar md-default no-padding"
-                        ng-hide="vm_cc.selectedFields.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <div flex></div>
-                          <ms-search-bar
-                            on-search="vm_cc.query.field = query"
-                            on-collapse="vm_cc.query.field = undefined"
-                            debounce="300"
-                          ></ms-search-bar>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canEdit"
-                            class="md-icon-button"
-                            ng-click="vm_cc.createOrEditField($event)"
-                            aria-label="add field"
-                            translate
-                            translate-attr-label="INTEGRATIONS.ADD_FIELD"
-                          >
-                            <md-icon md-font-icon="icon-plus"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-toolbar
-                        class="md-table-toolbar md-accent"
-                        ng-show="vm_cc.selectedFields.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <span class="md-subhead"
-                            >{{vm_cc.selectedFields.length}}
-                            {{vm_cc.selectedFields.length > 1 ? 'items' :
-                            'item'}} selected</span
-                          >
-                          <div flex></div>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canDelete"
-                            class="md-icon-button"
-                            ng-click="vm_cc.deleteSelectedFields($event)"
-                            aria-label="delete selected"
-                            translate
-                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-                          >
-                            <md-icon md-font-icon="icon-delete"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-table-container
-                        class="md-whiteframe-1dp padding-horizontal"
-                      >
-                        <table
-                          md-table
-                          md-row-select
-                          multiple
-                          ng-model="vm_cc.selectedFields"
-                        >
-                          <thead md-head>
-                            <tr md-row>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.ID' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.TYPE' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.CONTENT' | translate }}
-                              </th>
-                              <th md-column width="10px"></th>
-                            </tr>
-                          </thead>
-                          <tbody md-body>
-                            <tr
-                              md-row
-                              md-select="field"
-                              md-select-id="id"
-                              ng-repeat="field in vm_cc.fields | filter: vm_cc.query.field"
-                            >
-                              <td
-                                ng-click="vm_cc.createOrEditField($event, field)"
-                                md-cell
-                                class="id"
-                              >
-                                {{field.id}}
-                              </td>
-                              <td
-                                ng-click="vm_cc.createOrEditField($event, field)"
-                                md-cell
-                                class="type"
-                              >
-                                <span ng-if="field.FieldId"
-                                  >{{field.nameField || field.idField}}</span
-                                >
-                                <span ng-if="!field.FieldId"
-                                  >{{field.type}}</span
-                                >
-                              </td>
-                              <td
-                                ng-switch="field.type"
-                                ng-click="vm_cc.createOrEditField($event, field)"
-                                md-cell
-                              >
-                                <span ng-switch-when="string"
-                                  >{{field.content}}</span
-                                >
-                                <span
-                                  ng-switch-when="variable"
-                                  class="text-boxed"
-                                  >{{field.variableName}}</span
-                                >
-                                <span
-                                  ng-switch-when="customVariable"
-                                  class="text-boxed"
-                                  >{{ vm_cc.variablesById[field.VariableId].name
-                                  }}</span
-                                >
-                                <span ng-switch-when="keyValue">
-                                  {{field.key}}
-                                  <span ng-switch="description.keyType">
-                                    <span ng-switch-when="string"
-                                      >{{field.keyContent}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="variable"
-                                      class="text-boxed"
-                                      >{{field.variableName}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="customVariable"
-                                      class="text-boxed"
-                                      >{{
-                                      vm_cc.variablesById[field.VariableId].name
-                                      }}</span
-                                    >
-                                  </span>
-                                </span>
-                                <span ng-switch-default>{{field.content}}</span>
-                              </td>
-                              <td
-                                md-cell
-                                class="actions"
-                                ng-if="!vm_cc.crudPermissions.readOnly"
-                              >
-                                <md-menu>
-                                  <md-button
-                                    class="md-icon-button"
-                                    aria-label="More"
-                                    translate
-                                    translate-attr-aria-label="INTEGRATIONS.MORE"
-                                    ng-click="$mdOpenMenu($event)"
-                                  >
-                                    <md-icon
-                                      md-font-icon="icon-dots-vertical"
-                                    ></md-icon>
-                                  </md-button>
-
-                                  <md-menu-content width="3">
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canEdit"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.createOrEditField($event, field)"
-                                        translate="INTEGRATIONS.EDIT_FIELD"
-                                      >
-                                        Edit Field
-                                      </md-button>
-                                    </md-menu-item>
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canDelete"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.deleteFieldConfirm($event, field)"
-                                        translate="INTEGRATIONS.DELETE_FIELD"
-                                      >
-                                        Delete Field
-                                      </md-button>
-                                    </md-menu-item>
-                                  </md-menu-content>
-                                </md-menu>
-                              </td>
-                            </tr>
-                          </tbody>
-                        </table>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.TAGS">TAGS</span>
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-table-container class="md-whiteframe-1dp padding-20">
-                        <md-input-container class="md-block">
-                          <label translate="INTEGRATIONS.TAGS">Tags</label>
-                          <md-select
-                            ng-model="vm_cc.selectedTags"
-                            ng-change="vm_cc.selectTagsChanged($event)"
-                            multiple
-                          >
-                            <md-option
-                              ng-value="tag.id"
-                              ng-repeat="tag in vm_cc.tags"
-                              >{{ tag.name }}</md-option
-                            >
-                          </md-select>
-                        </md-input-container>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-                </md-tabs>
-                <div
-                  class="padding-20"
-                  ng-if="!vm_cc.zendeskConfigurations.length && vm_cc.crudPermissions.canEdit"
-                  ng-click="vm_cc.createOrEditZendeskConfiguration($event)"
-                  layout="row"
-                  layout-sm="column"
-                  layout-align="center center"
-                  layout-wrap
-                >
-                  <div
-                    class="padding-20 md-whiteframe-3dp md-accent-bg"
-                    layout="column"
-                    layout-align="center center"
-                  >
-                    <md-button class="md-icon-button">
-                      <md-icon md-font-icon="icon-plus"></md-icon>
-                    </md-button>
-                    <span
-                      aria-label="add configuration"
-                      translate
-                      translate-attr-label="INTEGRATIONS.ADD_CONFIGURATION"
-                      >ADD CONFIGURATION</span
-                    >
-                  </div>
-                </div>
-              </md-card>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/edit/view.html/view.html b/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/edit/view.html/view.html
new file mode 100644
index 0000000..69a8a8a
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/edit/view.html/view.html
@@ -0,0 +1,1031 @@
+<div
+  id="integrations-zendeskAccount"
+  class="page-layout simple tabbed"
+  layout="column"
+>
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-zendeskAccounts-button md-icon-button"
+        aria-label="Go to zendeskAccounts"
+        ng-click="vm.gotoZendeskAccounts()"
+        translate
+        translate-attr-aria-label="INTEGRATIONS.GO_TO_ZENDESKACCOUNTS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="zendeskAccount-image" hide-xs>
+          <img ng-src="assets/images/business/zendeskAccounts.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.zendeskAccount.id}}
+            <span ng-if="vm.zendeskAccount.name"
+              >{{vm.zendeskAccount.name}}</span
+            >
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="INTEGRATIONS.CREATED_AT"></span>
+            <span>{{vm.zendeskAccount.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveZendeskAccount()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (zendeskConfigurationsForm.$invalid)"
+        translate="INTEGRATIONS.SAVE"
+        translate-attr-aria-label="INTEGRATIONS.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="INTEGRATIONS.ACCOUNT">ACCOUNT</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="zendeskAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="INTEGRATIONS.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.zendeskAccount.name"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.TYPE">Type</label>
+                <md-select
+                  name="type"
+                  ng-model="vm.zendeskAccount.type"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'integrationTab'">
+                    {{ 'INTEGRATIONS.INTEGRATION_TAB' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'newTab'">
+                    {{ 'INTEGRATIONS.NEW_TAB' | translate }}
+                  </md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['type'].$error"
+                  ng-show="generalForm['type'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+                      >Type field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.USERNAME">Username</label>
+                <input
+                  type="text"
+                  name="username"
+                  ng-model="vm.zendeskAccount.username"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['username'].$error"
+                  ng-show="generalForm['username'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.USERNAME_REQUIRED"
+                      >Username field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.URI">Uri</label>
+                <input
+                  type="url"
+                  name="remoteUri"
+                  ng-model="vm.zendeskAccount.remoteUri"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['remoteUri'].$error"
+                  ng-show="generalForm['remoteUri'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.URI_REQUIRED"
+                      >Uri field is required</span
+                    >
+                  </div>
+                  <div ng-message="url">
+                    <span translate="INTEGRATIONS.ERRORS.URI_MUST_VALID_URL"
+                      >Uri must be a valid url http://www.xcally.com</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.AUTHTYPE">AuthType</label>
+                <md-select
+                  name="authType"
+                  ng-model="vm.zendeskAccount.authType"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'password'">Password</md-option>
+                  <md-option ng-value="'token'">Token</md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['authType'].$error"
+                  ng-show="generalForm['authType'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.AUTHTYPE_REQUIRED"
+                      >AuthType field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                class="md-block"
+                ng-if="vm.zendeskAccount.authType == 'password'"
+              >
+                <label translate="INTEGRATIONS.PASSWORD">Password</label>
+                <input
+                  type="password"
+                  name="password"
+                  ng-model="vm.zendeskAccount.password"
+                  placeholder="Password"
+                  translate
+                  translate-attr-placeholder="INTEGRATIONS.PASSWORD"
+                  required
+                />
+                <div ng-messages="generalForm['password'].$error" role="alert">
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.PASSWORD_REQUIRED"
+                      >Password field is required</span
+                    >
+                  </div>
+                  <div ng-message="pattern">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.SECURE_PASSWORD_PATTERN"
+                      >Must contain at least 8 characters, with a minimum of 1
+                      lowercase letter, 1 uppercase letter, 1 numeric character
+                      and 1 special character ~!?*@#$%^&-_=+[{]}.</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+
+              <md-input-container
+                ng-if="vm.zendeskAccount.authType == 'token'"
+                class="md-block"
+              >
+                <label translate="INTEGRATIONS.TOKEN">Token</label>
+                <input
+                  type="text"
+                  name="token"
+                  ng-model="vm.zendeskAccount.token"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['token'].$error"
+                  ng-show="generalForm['token'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.TOKEN_REQUIRED"
+                      >Token field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
+                  >MotionProxyAddress</label
+                >
+                <input
+                  type="url"
+                  name="serverUrl"
+                  ng-model="vm.zendeskAccount.serverUrl"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['serverUrl'].$error"
+                  ng-show="generalForm['serverUrl'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
+                      >MotionProxyAddress field is required</span
+                    >
+                  </div>
+                  <div ng-message="url">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
+                      >MotionProxyAddress must be a valid url
+                      http://www.xcally.com</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.zendeskAccount.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="INTEGRATIONS.CONFIGURATIONS">CONFIGURATIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="zendeskAccount-detail-form-container zendeskconfigurations md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div
+                class="h2 secondary-text"
+                translate="INTEGRATIONS.ZENDESKCONFIGURATIONS"
+              >
+                ZENDESKCONFIGURATIONS
+              </div>
+            </div>
+            <div
+              ng-controller="ZendeskAccountConfigurationsController as vm_cc"
+              ng-init="vm_cc.init(vm.zendeskAccount, vm.crudPermissions)"
+              layout="row"
+            >
+              <md-card class="md-whiteframe-1dp" flex="30">
+                <div layout="row" layout-align="center center">
+                  <md-subheader flex="75" class="md-no-sticky"
+                    >{{ 'INTEGRATIONS.CONFIGURATIONS' | translate
+                    }}</md-subheader
+                  >
+                  <md-button
+                    flex="25"
+                    ng-if="vm_cc.crudPermissions.canEdit"
+                    ng-click="vm_cc.createOrEditZendeskConfiguration($event)"
+                    class="md-icon-button"
+                    aria-label="create zendeskConfiguration"
+                  >
+                    <md-icon md-font-icon="icon-plus"></md-icon>
+                  </md-button>
+                </div>
+                <md-list>
+                  <md-list-item
+                    layout="row"
+                    layout-align="center center"
+                    ng-repeat="zendeskConfiguration in vm_cc.zendeskConfigurations"
+                    class="border-top"
+                    md-colors="{background: (vm_cc.selectedZendeskConfiguration == $index ? 'accent' : 'grey-A100')}"
+                    ng-click="vm_cc.getZendeskConfiguration($index)"
+                  >
+                    <span class="text-truncate" flex="80"
+                      >{{ zendeskConfiguration.name }}</span
+                    >
+                    <md-menu ng-if="vm_cc.crudPermissions.canDelete">
+                      <md-button
+                        class="md-icon-button"
+                        aria-label="More"
+                        translate
+                        translate-attr-aria-label="INTEGRATIONS.MORE"
+                        ng-click="$mdOpenMenu($event)"
+                      >
+                        <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                      </md-button>
+                      <md-menu-content width="3">
+                        <md-menu-item ng-if="vm_cc.crudPermissions.canDelete">
+                          <md-button
+                            ng-click="vm_cc.deleteZendeskConfiguration($event, zendeskConfiguration)"
+                            translate="INTEGRATIONS.DELETE_ZENDESKCONFIGURATION"
+                          >
+                            Delete ZendeskConfiguration
+                          </md-button>
+                        </md-menu-item>
+                      </md-menu-content>
+                    </md-menu>
+                  </md-list-item>
+                </md-list>
+              </md-card>
+              <div flex></div>
+              <md-card class="md-whiteframe-1dp" flex="65">
+                <md-tabs
+                  ng-if="vm_cc.zendeskConfigurations.length"
+                  md-dynamic-height
+                >
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.SUBJECTS">SUBJECTS</span>
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedSubjects.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.subject = query"
+                            on-collapse="vm_cc.query.subject = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditSubject($event)"
+                            aria-label="add subject"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_SUBJECT"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedSubjects.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedSubjects.length}}
+                            {{vm_cc.selectedSubjects.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedSubjects($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedSubjects"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.ID' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.TYPE' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.CONTENT' | translate }}
+                              </th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="subject"
+                              md-select-id="id"
+                              ng-repeat="subject in vm_cc.subjects | filter: vm_cc.query.subject"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                                class="id"
+                              >
+                                {{subject.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="subject.FieldId"
+                                  >{{subject.nameField ||
+                                  subject.idField}}</span
+                                >
+                                <span ng-if="!subject.FieldId"
+                                  >{{subject.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="subject.type"
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{subject.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{subject.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{
+                                  vm_cc.variablesById[subject.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{subject.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{subject.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{subject.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[subject.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default
+                                  >{{subject.content}}</span
+                                >
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="INTEGRATIONS.MORE"
+                                    ng-click="$mdOpenMenu($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                        translate="INTEGRATIONS.EDIT_SUBJECT"
+                                      >
+                                        Edit Subject
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteSubjectConfirm($event, subject)"
+                                        translate="INTEGRATIONS.DELETE_SUBJECT"
+                                      >
+                                        Delete Subject
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.DESCRIPTIONS"
+                        >DESCRIPTIONS</span
+                      >
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedDescriptions.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.description = query"
+                            on-collapse="vm_cc.query.description = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditDescription($event)"
+                            aria-label="add description"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_DESCRIPTION"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedDescriptions.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedDescriptions.length}}
+                            {{vm_cc.selectedDescriptions.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedDescriptions($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedDescriptions"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.ID' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.TYPE' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.CONTENT' | translate }}
+                              </th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="description"
+                              md-select-id="id"
+                              ng-repeat="description in vm_cc.descriptions | filter: vm_cc.query.description"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                                class="id"
+                              >
+                                {{description.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="description.FieldId"
+                                  >{{description.nameField ||
+                                  description.idField}}</span
+                                >
+                                <span ng-if="!description.FieldId"
+                                  >{{description.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="description.type"
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{description.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{description.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{
+                                  vm_cc.variablesById[description.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{description.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{description.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{description.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[description.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default
+                                  >{{description.content}}</span
+                                >
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="INTEGRATIONS.MORE"
+                                    ng-click="$mdOpenMenu($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditDescription($event, description)"
+                                        translate="INTEGRATIONS.EDIT_DESCRIPTION"
+                                      >
+                                        Edit Description
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteDescriptionConfirm($event, description)"
+                                        translate="INTEGRATIONS.DELETE_DESCRIPTION"
+                                      >
+                                        Delete Description
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.FIELDS">FIELDS</span>
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedFields.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.field = query"
+                            on-collapse="vm_cc.query.field = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditField($event)"
+                            aria-label="add field"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_FIELD"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedFields.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedFields.length}}
+                            {{vm_cc.selectedFields.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedFields($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedFields"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.ID' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.TYPE' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.CONTENT' | translate }}
+                              </th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="field"
+                              md-select-id="id"
+                              ng-repeat="field in vm_cc.fields | filter: vm_cc.query.field"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditField($event, field)"
+                                md-cell
+                                class="id"
+                              >
+                                {{field.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditField($event, field)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="field.FieldId"
+                                  >{{field.nameField || field.idField}}</span
+                                >
+                                <span ng-if="!field.FieldId"
+                                  >{{field.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="field.type"
+                                ng-click="vm_cc.createOrEditField($event, field)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{field.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{field.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{ vm_cc.variablesById[field.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{field.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{field.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{field.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[field.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default>{{field.content}}</span>
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="INTEGRATIONS.MORE"
+                                    ng-click="$mdOpenMenu($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditField($event, field)"
+                                        translate="INTEGRATIONS.EDIT_FIELD"
+                                      >
+                                        Edit Field
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteFieldConfirm($event, field)"
+                                        translate="INTEGRATIONS.DELETE_FIELD"
+                                      >
+                                        Delete Field
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.TAGS">TAGS</span>
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-table-container class="md-whiteframe-1dp padding-20">
+                        <md-input-container class="md-block">
+                          <label translate="INTEGRATIONS.TAGS">Tags</label>
+                          <md-select
+                            ng-model="vm_cc.selectedTags"
+                            ng-change="vm_cc.selectTagsChanged($event)"
+                            multiple
+                          >
+                            <md-option
+                              ng-value="tag.id"
+                              ng-repeat="tag in vm_cc.tags"
+                              >{{ tag.name }}</md-option
+                            >
+                          </md-select>
+                        </md-input-container>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+                </md-tabs>
+                <div
+                  class="padding-20"
+                  ng-if="!vm_cc.zendeskConfigurations.length && vm_cc.crudPermissions.canEdit"
+                  ng-click="vm_cc.createOrEditZendeskConfiguration($event)"
+                  layout="row"
+                  layout-sm="column"
+                  layout-align="center center"
+                  layout-wrap
+                >
+                  <div
+                    class="padding-20 md-whiteframe-3dp md-accent-bg"
+                    layout="column"
+                    layout-align="center center"
+                  >
+                    <md-button class="md-icon-button">
+                      <md-icon md-font-icon="icon-plus"></md-icon>
+                    </md-button>
+                    <span
+                      aria-label="add configuration"
+                      translate
+                      translate-attr-label="INTEGRATIONS.ADD_CONFIGURATION"
+                      >ADD CONFIGURATION</span
+                    >
+                  </div>
+                </div>
+              </md-card>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/edit/zendeskConfigurations/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/edit/zendeskConfigurations/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index d68d38e..0000000
--- a/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/edit/zendeskConfigurations/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,183 +0,0 @@
-<md-dialog
-  class="zendeskConfiguration-dialog"
-  aria-label="New ZendeskConfiguration"
->
-  <form name="zendeskConfigurationForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.NAME">Name</label>
-        <input
-          type=""
-          name="name"
-          ng-model="vm.zendeskConfiguration.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="zendeskConfigurationForm['name'].$error"
-          ng-show="zendeskConfigurationForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.CHANNEL">Channel</label>
-        <md-select
-          name="channel"
-          ng-model="vm.zendeskConfiguration.channel"
-          required
-        >
-          <md-option ng-value="'voice'">
-            {{ 'INTEGRATIONS.VOICE' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="zendeskConfigurationForm['channel'].$error"
-          ng-show="zendeskConfigurationForm['channel'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.CHANNEL_REQUIRED"
-              >Channel field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.TYPE">Type</label>
-        <md-select name="type" ng-model="vm.zendeskConfiguration.type" required>
-          <md-option ng-value="'inbound'">
-            {{ 'INTEGRATIONS.INBOUND_IN_QUEUE' | translate }}
-          </md-option>
-
-          <md-option ng-value="'outbound'">
-            {{ 'INTEGRATIONS.OUTBOUND_CALL' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="zendeskConfigurationForm['type'].$error"
-          ng-show="zendeskConfigurationForm['type'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-              >Type field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newZendeskConfiguration"
-          ng-click="vm.saveZendeskConfiguration()"
-          class="send-button md-accent md-raised"
-          ng-disabled="zendeskConfigurationForm.$invalid || zendeskConfigurationForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newZendeskConfiguration"
-          ng-click="vm.addNewZendeskConfiguration()"
-          class="send-button md-accent md-raised"
-          ng-disabled="zendeskConfigurationForm.$invalid"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD_ZENDESKCONFIGURATION"
-          translate-attr-aria-label="INTEGRATIONS.ADD_ZENDESKCONFIGURATION"
-        >
-          ADD ZENDESKCONFIGURATION
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newZendeskConfiguration"
-          ng-click="vm.deleteZendeskConfiguration($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/edit/zendeskConfigurations/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/edit/zendeskConfigurations/dialog.html/dialog.html
new file mode 100644
index 0000000..d68d38e
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/edit/zendeskConfigurations/dialog.html/dialog.html
@@ -0,0 +1,183 @@
+<md-dialog
+  class="zendeskConfiguration-dialog"
+  aria-label="New ZendeskConfiguration"
+>
+  <form name="zendeskConfigurationForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.NAME">Name</label>
+        <input
+          type=""
+          name="name"
+          ng-model="vm.zendeskConfiguration.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="zendeskConfigurationForm['name'].$error"
+          ng-show="zendeskConfigurationForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.CHANNEL">Channel</label>
+        <md-select
+          name="channel"
+          ng-model="vm.zendeskConfiguration.channel"
+          required
+        >
+          <md-option ng-value="'voice'">
+            {{ 'INTEGRATIONS.VOICE' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="zendeskConfigurationForm['channel'].$error"
+          ng-show="zendeskConfigurationForm['channel'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.CHANNEL_REQUIRED"
+              >Channel field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.TYPE">Type</label>
+        <md-select name="type" ng-model="vm.zendeskConfiguration.type" required>
+          <md-option ng-value="'inbound'">
+            {{ 'INTEGRATIONS.INBOUND_IN_QUEUE' | translate }}
+          </md-option>
+
+          <md-option ng-value="'outbound'">
+            {{ 'INTEGRATIONS.OUTBOUND_CALL' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="zendeskConfigurationForm['type'].$error"
+          ng-show="zendeskConfigurationForm['type'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+              >Type field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newZendeskConfiguration"
+          ng-click="vm.saveZendeskConfiguration()"
+          class="send-button md-accent md-raised"
+          ng-disabled="zendeskConfigurationForm.$invalid || zendeskConfigurationForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newZendeskConfiguration"
+          ng-click="vm.addNewZendeskConfiguration()"
+          class="send-button md-accent md-raised"
+          ng-disabled="zendeskConfigurationForm.$invalid"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD_ZENDESKCONFIGURATION"
+          translate-attr-aria-label="INTEGRATIONS.ADD_ZENDESKCONFIGURATION"
+        >
+          ADD ZENDESKCONFIGURATION
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newZendeskConfiguration"
+          ng-click="vm.deleteZendeskConfiguration($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/zendeskAccounts.html/zendeskAccounts-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/zendeskAccounts.html/zendeskAccounts-[chunkhash].html
deleted file mode 100644
index 1d1586b..0000000
--- a/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/zendeskAccounts.html/zendeskAccounts-[chunkhash].html
+++ /dev/null
@@ -1,320 +0,0 @@
-<div
-  id="zendeskAccounts"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-heart" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="INTEGRATIONS.ZENDESKACCOUNTS"
-          >ZendeskAccounts</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="INTEGRATIONS.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedZendeskAccounts.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedZendeskAccounts =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="INTEGRATIONS.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-zendeskAccounts-count">
-          <span>{{vm.selectedZendeskAccounts.length}}</span>
-          <span translate="INTEGRATIONS.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="INTEGRATIONS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllZendeskAccounts()"
-                translate="INTEGRATIONS.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectZendeskAccounts()"
-                translate="INTEGRATIONS.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedZendeskAccounts"
-          csv-label="true"
-          filename="zendeskAccounts.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedZendeskAccounts($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- ZENDESKACCOUNT TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedZendeskAccounts"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getZendeskAccounts"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">
-                  {{ 'INTEGRATIONS.ID' | translate }}
-                </th>
-                <th md-column md-order-by="name">
-                  {{ 'INTEGRATIONS.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="username">
-                  {{ 'INTEGRATIONS.USERNAME' | translate }}
-                </th>
-                <th md-column md-order-by="remoteUri">
-                  {{ 'INTEGRATIONS.URI' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.zendeskAccounts.rows.length">
-                <td md-cell colspan="5">
-                  <div layout="row" layout-align="center center">
-                    <span translate="INTEGRATIONS.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="zendeskAccount"
-                md-select-id="id"
-                ng-repeat="zendeskAccount in vm.zendeskAccounts.rows"
-              >
-                <td md-cell ng-if="zendeskAccount.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{zendeskAccount.name}}"
-                    ng-src="api/users/{{zendeskAccount.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!zendeskAccount.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{zendeskAccount.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(zendeskAccount, ev) : vm.createOrEditZendeskAccount($event, zendeskAccount)"
-                  md-cell
-                  class="id"
-                >
-                  {{zendeskAccount.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(zendeskAccount, ev) : vm.createOrEditZendeskAccount($event, zendeskAccount)"
-                  md-cell
-                  class="name"
-                >
-                  {{zendeskAccount.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(zendeskAccount, ev) : vm.createOrEditZendeskAccount($event, zendeskAccount)"
-                  md-cell
-                  class="username"
-                >
-                  {{zendeskAccount.username}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(zendeskAccount, ev) : vm.createOrEditZendeskAccount($event, zendeskAccount)"
-                  md-cell
-                  class="remoteUri"
-                >
-                  {{zendeskAccount.remoteUri}}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="INTEGRATIONS.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(zendeskAccount, $event    )"
-                          translate="INTEGRATIONS.EDIT_ZENDESKACCOUNT"
-                        >
-                          Edit ZendeskAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.testtestintegrationaccount(zendeskAccount, $event    )"
-                          translate="INTEGRATIONS.TEST_ZENDESKACCOUNT"
-                        >
-                          Test ZendeskAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(zendeskAccount, $event    )"
-                          translate="INTEGRATIONS.DELETE_ZENDESKACCOUNT"
-                        >
-                          Delete ZendeskAccount
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'INTEGRATIONS.PAGE' | translate}}:', rowsPerPage: '{{'INTEGRATIONS.ROWSPERPAGE' | translate}}:', of: '{{'INTEGRATIONS.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.zendeskAccounts.count}}"
-          md-on-paginate="vm.getZendeskAccounts"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / ZENDESKACCOUNT TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD ZENDESKACCOUNT BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-zendeskAccount-button"
-    ng-click="vm.createOrEditZendeskAccount($event)"
-    aria-label="add zendeskAccount"
-    translate
-    translate-attr-aria-label="INTEGRATIONS.ADD_ZENDESKACCOUNT"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD ZENDESKACCOUNT BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/zendeskAccounts.html/zendeskAccounts.html b/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/zendeskAccounts.html/zendeskAccounts.html
new file mode 100644
index 0000000..1d1586b
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/zendeskAccounts/zendeskAccounts.html/zendeskAccounts.html
@@ -0,0 +1,320 @@
+<div
+  id="zendeskAccounts"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-heart" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="INTEGRATIONS.ZENDESKACCOUNTS"
+          >ZendeskAccounts</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="INTEGRATIONS.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedZendeskAccounts.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedZendeskAccounts =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="INTEGRATIONS.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-zendeskAccounts-count">
+          <span>{{vm.selectedZendeskAccounts.length}}</span>
+          <span translate="INTEGRATIONS.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="INTEGRATIONS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllZendeskAccounts()"
+                translate="INTEGRATIONS.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectZendeskAccounts()"
+                translate="INTEGRATIONS.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedZendeskAccounts"
+          csv-label="true"
+          filename="zendeskAccounts.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedZendeskAccounts($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- ZENDESKACCOUNT TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedZendeskAccounts"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getZendeskAccounts"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">
+                  {{ 'INTEGRATIONS.ID' | translate }}
+                </th>
+                <th md-column md-order-by="name">
+                  {{ 'INTEGRATIONS.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="username">
+                  {{ 'INTEGRATIONS.USERNAME' | translate }}
+                </th>
+                <th md-column md-order-by="remoteUri">
+                  {{ 'INTEGRATIONS.URI' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.zendeskAccounts.rows.length">
+                <td md-cell colspan="5">
+                  <div layout="row" layout-align="center center">
+                    <span translate="INTEGRATIONS.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="zendeskAccount"
+                md-select-id="id"
+                ng-repeat="zendeskAccount in vm.zendeskAccounts.rows"
+              >
+                <td md-cell ng-if="zendeskAccount.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{zendeskAccount.name}}"
+                    ng-src="api/users/{{zendeskAccount.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!zendeskAccount.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{zendeskAccount.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(zendeskAccount, ev) : vm.createOrEditZendeskAccount($event, zendeskAccount)"
+                  md-cell
+                  class="id"
+                >
+                  {{zendeskAccount.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(zendeskAccount, ev) : vm.createOrEditZendeskAccount($event, zendeskAccount)"
+                  md-cell
+                  class="name"
+                >
+                  {{zendeskAccount.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(zendeskAccount, ev) : vm.createOrEditZendeskAccount($event, zendeskAccount)"
+                  md-cell
+                  class="username"
+                >
+                  {{zendeskAccount.username}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(zendeskAccount, ev) : vm.createOrEditZendeskAccount($event, zendeskAccount)"
+                  md-cell
+                  class="remoteUri"
+                >
+                  {{zendeskAccount.remoteUri}}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="INTEGRATIONS.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(zendeskAccount, $event    )"
+                          translate="INTEGRATIONS.EDIT_ZENDESKACCOUNT"
+                        >
+                          Edit ZendeskAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.testtestintegrationaccount(zendeskAccount, $event    )"
+                          translate="INTEGRATIONS.TEST_ZENDESKACCOUNT"
+                        >
+                          Test ZendeskAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(zendeskAccount, $event    )"
+                          translate="INTEGRATIONS.DELETE_ZENDESKACCOUNT"
+                        >
+                          Delete ZendeskAccount
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'INTEGRATIONS.PAGE' | translate}}:', rowsPerPage: '{{'INTEGRATIONS.ROWSPERPAGE' | translate}}:', of: '{{'INTEGRATIONS.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.zendeskAccounts.count}}"
+          md-on-paginate="vm.getZendeskAccounts"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / ZENDESKACCOUNT TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD ZENDESKACCOUNT BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-zendeskAccount-button"
+    ng-click="vm.createOrEditZendeskAccount($event)"
+    aria-label="add zendeskAccount"
+    translate
+    translate-attr-aria-label="INTEGRATIONS.ADD_ZENDESKACCOUNT"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD ZENDESKACCOUNT BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/zohoAccounts/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/zohoAccounts/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 08ec333..0000000
--- a/public/src/js/modules/main/apps/integrations/views/zohoAccounts/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,296 +0,0 @@
-<md-dialog class="zohoAccount-dialog" aria-label="New ZohoAccount">
-  <form name="zohoAccountForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.zohoAccount.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="zohoAccountForm['name'].$error"
-          ng-show="zohoAccountForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.HOST">Host</label>
-        <md-select name="host" ng-model="vm.zohoAccount.host" required>
-          <md-option ng-value="'zoho.com'">zoho.com</md-option>
-          <md-option ng-value="'zoho.eu'">zoho.eu</md-option>
-        </md-select>
-        <div
-          ng-messages="zohoAccountForm['host'].$error"
-          ng-show="zohoAccountForm['host'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.HOST_REQUIRED"
-              >Host field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.ZONE">Zone</label>
-        <md-select name="zone" ng-model="vm.zohoAccount.zone" required>
-          <md-option ng-value="'US'">US</md-option>
-          <md-option ng-value="'AU'">AU</md-option>
-          <md-option ng-value="'EU'">EU</md-option>
-          <md-option ng-value="'IN'">IN</md-option>
-          <md-option ng-value="'CN'">CN</md-option>
-        </md-select>
-        <div class="hint"><span translate="INTEGRATIONS.HELP.ZONE"></span></div>
-        <div
-          ng-messages="zohoAccountForm['zone'].$error"
-          ng-show="zohoAccountForm['zone'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.ZONE_REQUIRED"
-              >Zone field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.CLIENTID">ClientId</label>
-        <input
-          type="text"
-          name="clientId"
-          ng-model="vm.zohoAccount.clientId"
-          ng-required="true"
-        />
-
-        <div class="hint">
-          <span translate="INTEGRATIONS.HELP.CLIENTID"></span>
-        </div>
-        <div
-          ng-messages="zohoAccountForm['clientId'].$error"
-          ng-show="zohoAccountForm['clientId'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.CLIENTID_REQUIRED"
-              >ClientId field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.CLIENTSECRET">ClientSecret</label>
-        <input
-          type="text"
-          name="clientSecret"
-          ng-model="vm.zohoAccount.clientSecret"
-          ng-required="true"
-        />
-
-        <div class="hint">
-          <span translate="INTEGRATIONS.HELP.CLIENTSECRET"></span>
-        </div>
-        <div
-          ng-messages="zohoAccountForm['clientSecret'].$error"
-          ng-show="zohoAccountForm['clientSecret'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.CLIENTSECRET_REQUIRED"
-              >ClientSecret field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.CODE">Code</label>
-        <input
-          type="text"
-          name="code"
-          ng-model="vm.zohoAccount.code"
-          ng-required="true"
-        />
-
-        <div class="hint"><span translate="INTEGRATIONS.HELP.CODE"></span></div>
-        <div
-          ng-messages="zohoAccountForm['code'].$error"
-          ng-show="zohoAccountForm['code'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.CODE_REQUIRED"
-              >Code field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
-          >MotionProxyAddress</label
-        >
-        <input
-          type="url"
-          name="serverUrl"
-          ng-model="vm.zohoAccount.serverUrl"
-        />
-
-        <div class="hint">
-          <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
-        </div>
-        <div
-          ng-messages="zohoAccountForm['serverUrl'].$error"
-          ng-show="zohoAccountForm['serverUrl'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
-              >MotionProxyAddress field is required</span
-            >
-          </div>
-          <div ng-message="url">
-            <span
-              translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
-              >MotionProxyAddress must be a valid url
-              http://www.xcally.com</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.zohoAccount.description"
-        />
-
-        <div
-          ng-messages="zohoAccountForm['description'].$error"
-          ng-show="zohoAccountForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newZohoAccount"
-          ng-click="vm.saveZohoAccount()"
-          class="send-button md-accent md-raised"
-          ng-disabled="zohoAccountForm.$invalid || zohoAccountForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newZohoAccount"
-          ng-click="vm.addNewZohoAccount()"
-          class="send-button md-accent md-raised"
-          ng-disabled="zohoAccountForm.$invalid"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD_ZOHOACCOUNT"
-          translate-attr-aria-label="INTEGRATIONS.ADD_ZOHOACCOUNT"
-        >
-          ADD ZOHOACCOUNT
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newZohoAccount"
-          ng-click="vm.deleteZohoAccount($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/zohoAccounts/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/zohoAccounts/create/dialog.html/dialog.html
new file mode 100644
index 0000000..08ec333
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/zohoAccounts/create/dialog.html/dialog.html
@@ -0,0 +1,296 @@
+<md-dialog class="zohoAccount-dialog" aria-label="New ZohoAccount">
+  <form name="zohoAccountForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.zohoAccount.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="zohoAccountForm['name'].$error"
+          ng-show="zohoAccountForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.HOST">Host</label>
+        <md-select name="host" ng-model="vm.zohoAccount.host" required>
+          <md-option ng-value="'zoho.com'">zoho.com</md-option>
+          <md-option ng-value="'zoho.eu'">zoho.eu</md-option>
+        </md-select>
+        <div
+          ng-messages="zohoAccountForm['host'].$error"
+          ng-show="zohoAccountForm['host'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.HOST_REQUIRED"
+              >Host field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.ZONE">Zone</label>
+        <md-select name="zone" ng-model="vm.zohoAccount.zone" required>
+          <md-option ng-value="'US'">US</md-option>
+          <md-option ng-value="'AU'">AU</md-option>
+          <md-option ng-value="'EU'">EU</md-option>
+          <md-option ng-value="'IN'">IN</md-option>
+          <md-option ng-value="'CN'">CN</md-option>
+        </md-select>
+        <div class="hint"><span translate="INTEGRATIONS.HELP.ZONE"></span></div>
+        <div
+          ng-messages="zohoAccountForm['zone'].$error"
+          ng-show="zohoAccountForm['zone'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.ZONE_REQUIRED"
+              >Zone field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.CLIENTID">ClientId</label>
+        <input
+          type="text"
+          name="clientId"
+          ng-model="vm.zohoAccount.clientId"
+          ng-required="true"
+        />
+
+        <div class="hint">
+          <span translate="INTEGRATIONS.HELP.CLIENTID"></span>
+        </div>
+        <div
+          ng-messages="zohoAccountForm['clientId'].$error"
+          ng-show="zohoAccountForm['clientId'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.CLIENTID_REQUIRED"
+              >ClientId field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.CLIENTSECRET">ClientSecret</label>
+        <input
+          type="text"
+          name="clientSecret"
+          ng-model="vm.zohoAccount.clientSecret"
+          ng-required="true"
+        />
+
+        <div class="hint">
+          <span translate="INTEGRATIONS.HELP.CLIENTSECRET"></span>
+        </div>
+        <div
+          ng-messages="zohoAccountForm['clientSecret'].$error"
+          ng-show="zohoAccountForm['clientSecret'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.CLIENTSECRET_REQUIRED"
+              >ClientSecret field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.CODE">Code</label>
+        <input
+          type="text"
+          name="code"
+          ng-model="vm.zohoAccount.code"
+          ng-required="true"
+        />
+
+        <div class="hint"><span translate="INTEGRATIONS.HELP.CODE"></span></div>
+        <div
+          ng-messages="zohoAccountForm['code'].$error"
+          ng-show="zohoAccountForm['code'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.CODE_REQUIRED"
+              >Code field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
+          >MotionProxyAddress</label
+        >
+        <input
+          type="url"
+          name="serverUrl"
+          ng-model="vm.zohoAccount.serverUrl"
+        />
+
+        <div class="hint">
+          <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
+        </div>
+        <div
+          ng-messages="zohoAccountForm['serverUrl'].$error"
+          ng-show="zohoAccountForm['serverUrl'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
+              >MotionProxyAddress field is required</span
+            >
+          </div>
+          <div ng-message="url">
+            <span
+              translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
+              >MotionProxyAddress must be a valid url
+              http://www.xcally.com</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.zohoAccount.description"
+        />
+
+        <div
+          ng-messages="zohoAccountForm['description'].$error"
+          ng-show="zohoAccountForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newZohoAccount"
+          ng-click="vm.saveZohoAccount()"
+          class="send-button md-accent md-raised"
+          ng-disabled="zohoAccountForm.$invalid || zohoAccountForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newZohoAccount"
+          ng-click="vm.addNewZohoAccount()"
+          class="send-button md-accent md-raised"
+          ng-disabled="zohoAccountForm.$invalid"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD_ZOHOACCOUNT"
+          translate-attr-aria-label="INTEGRATIONS.ADD_ZOHOACCOUNT"
+        >
+          ADD ZOHOACCOUNT
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newZohoAccount"
+          ng-click="vm.deleteZohoAccount($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/zohoAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/zohoAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 26628de..0000000
--- a/public/src/js/modules/main/apps/integrations/views/zohoAccounts/edit/configurations/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,180 +0,0 @@
-<md-dialog class="zohoConfiguration-dialog" aria-label="New ZohoConfiguration">
-  <form name="zohoConfigurationForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.NAME">Name</label>
-        <input
-          type=""
-          name="name"
-          ng-model="vm.zohoConfiguration.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="zohoConfigurationForm['name'].$error"
-          ng-show="zohoConfigurationForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.CHANNEL">Channel</label>
-        <md-select
-          name="channel"
-          ng-model="vm.zohoConfiguration.channel"
-          required
-        >
-          <md-option ng-value="'voice'">
-            {{ 'INTEGRATIONS.VOICE' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="zohoConfigurationForm['channel'].$error"
-          ng-show="zohoConfigurationForm['channel'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.CHANNEL_REQUIRED"
-              >Channel field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.TYPE">Type</label>
-        <md-select name="type" ng-model="vm.zohoConfiguration.type" required>
-          <md-option ng-value="'inbound'">
-            {{ 'INTEGRATIONS.INBOUND_IN_QUEUE' | translate }}
-          </md-option>
-
-          <md-option ng-value="'outbound'">
-            {{ 'INTEGRATIONS.OUTBOUND_CALL' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="zohoConfigurationForm['type'].$error"
-          ng-show="zohoConfigurationForm['type'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-              >Type field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newZohoConfiguration"
-          ng-click="vm.saveZohoConfiguration()"
-          class="send-button md-accent md-raised"
-          ng-disabled="zohoConfigurationForm.$invalid || zohoConfigurationForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newZohoConfiguration"
-          ng-click="vm.addNewZohoConfiguration()"
-          class="send-button md-accent md-raised"
-          ng-disabled="zohoConfigurationForm.$invalid"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD_ZOHOCONFIGURATION"
-          translate-attr-aria-label="INTEGRATIONS.ADD_ZOHOCONFIGURATION"
-        >
-          ADD ZOHOCONFIGURATION
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newZohoConfiguration"
-          ng-click="vm.deleteZohoConfiguration($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/zohoAccounts/edit/configurations/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/zohoAccounts/edit/configurations/dialog.html/dialog.html
new file mode 100644
index 0000000..26628de
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/zohoAccounts/edit/configurations/dialog.html/dialog.html
@@ -0,0 +1,180 @@
+<md-dialog class="zohoConfiguration-dialog" aria-label="New ZohoConfiguration">
+  <form name="zohoConfigurationForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.NAME">Name</label>
+        <input
+          type=""
+          name="name"
+          ng-model="vm.zohoConfiguration.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="zohoConfigurationForm['name'].$error"
+          ng-show="zohoConfigurationForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.CHANNEL">Channel</label>
+        <md-select
+          name="channel"
+          ng-model="vm.zohoConfiguration.channel"
+          required
+        >
+          <md-option ng-value="'voice'">
+            {{ 'INTEGRATIONS.VOICE' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="zohoConfigurationForm['channel'].$error"
+          ng-show="zohoConfigurationForm['channel'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.CHANNEL_REQUIRED"
+              >Channel field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.TYPE">Type</label>
+        <md-select name="type" ng-model="vm.zohoConfiguration.type" required>
+          <md-option ng-value="'inbound'">
+            {{ 'INTEGRATIONS.INBOUND_IN_QUEUE' | translate }}
+          </md-option>
+
+          <md-option ng-value="'outbound'">
+            {{ 'INTEGRATIONS.OUTBOUND_CALL' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="zohoConfigurationForm['type'].$error"
+          ng-show="zohoConfigurationForm['type'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+              >Type field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newZohoConfiguration"
+          ng-click="vm.saveZohoConfiguration()"
+          class="send-button md-accent md-raised"
+          ng-disabled="zohoConfigurationForm.$invalid || zohoConfigurationForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newZohoConfiguration"
+          ng-click="vm.addNewZohoConfiguration()"
+          class="send-button md-accent md-raised"
+          ng-disabled="zohoConfigurationForm.$invalid"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD_ZOHOCONFIGURATION"
+          translate-attr-aria-label="INTEGRATIONS.ADD_ZOHOCONFIGURATION"
+        >
+          ADD ZOHOCONFIGURATION
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newZohoConfiguration"
+          ng-click="vm.deleteZohoConfiguration($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/integrations/views/zohoAccounts/edit/item/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/zohoAccounts/edit/item/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index ed123e9..0000000
--- a/public/src/js/modules/main/apps/integrations/views/zohoAccounts/edit/item/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,478 +0,0 @@
-<md-dialog class="zohoAccount-item-dialog" aria-label="New Item">
-  <form name="zohoAccountItemForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <div ng-switch="vm.type">
-        <div ng-switch-when="subject">
-          <!-- SUBJECT SECTION -->
-          <div ng-include="'/subject.html'"></div>
-          <!-- / SUBJECT SECTION -->
-        </div>
-        <div ng-switch-when="description">
-          <!-- DESCRIPTION SECTION -->
-          <md-input-container class="md-block">
-            <label translate="INTEGRATIONS.TYPE">Type</label>
-            <md-select name="type" ng-model="vm.item.type" required>
-              <md-option value="string">String</md-option>
-              <md-option value="keyValue">Key Value</md-option>
-            </md-select>
-            <div
-              ng-messages="zohoAccountItemForm.type.$error"
-              ng-show="zohoAccountItemForm.type.$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-                  >Type field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
-            <label translate="INTEGRATIONS.CONTENT">Content</label>
-            <input
-              type="text"
-              name="content"
-              ng-model="vm.item.content"
-              required
-              md-autofocus
-            />
-            <div
-              ng-messages="zohoAccountItemForm.content.$error"
-              ng-show="zohoAccountItemForm.content.$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
-                  >Content field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <div ng-if="vm.item.type == 'keyValue'">
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.KEY">Key</label>
-              <input
-                type="text"
-                name="key"
-                ng-model="vm.item.key"
-                required
-                md-autofocus
-              />
-              <div
-                ng-messages="zohoAccountItemForm.key.$error"
-                ng-show="zohoAccountItemForm.key.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.KEY_REQUIRED"
-                    >Key field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.TYPE">Type</label>
-              <md-select name="keyType" ng-model="vm.item.keyType" required>
-                <md-option value="string">String</md-option>
-                <md-option value="variable">Variable</md-option>
-                <md-option value="customVariable">Custom Variable</md-option>
-              </md-select>
-              <div
-                ng-messages="zohoAccountItemForm.keyType.$error"
-                ng-show="zohoAccountItemForm.keyType.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
-                    >Type field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'string'"
-            >
-              <label translate="INTEGRATIONS.CONTENT">Content</label>
-              <input
-                type="text"
-                name="keyContent"
-                ng-model="vm.item.keyContent"
-                required
-                md-autofocus
-              />
-              <div
-                ng-messages="zohoAccountItemForm.keyContent.$error"
-                ng-show="zohoAccountItemForm.keyContent.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
-                    >Content field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'variable'"
-            >
-              <label translate="INTEGRATIONS.VALUE">Value</label>
-              <md-select
-                name="variableName"
-                ng-model="vm.item.variableName"
-                md-selected-text="vm.getSelectedVariable()"
-                required
-              >
-                <md-optgroup label="Voice: Queue">
-                  <md-option
-                    ng-value="agentColumn"
-                    ng-repeat="agentColumn in vm.voiceAgentReportColumns"
-                    >{{agentColumn}}
-                  </md-option>
-                </md-optgroup>
-                <md-optgroup label="Voice: Outbound">
-                  <md-option
-                    ng-value="dialColumn"
-                    ng-repeat="dialColumn in vm.voiceDialReportColumns"
-                    >{{dialColumn}}</md-option
-                  >
-                </md-optgroup>
-              </md-select>
-              <div
-                ng-messages="zohoAccountItemForm.variableName.$error"
-                ng-show="zohoAccountItemForm.variableName.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED"
-                    >Variable name field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <md-input-container
-              class="md-block"
-              ng-if="vm.item.keyType == 'customVariable'"
-            >
-              <label translate="INTEGRATIONS.VALUE">Value</label>
-              <md-select ng-model="vm.item.VariableId" required>
-                <md-option
-                  ng-value="variable.id"
-                  ng-repeat="variable in vm.variables"
-                  >{{variable.name}}
-                </md-option>
-              </md-select>
-            </md-input-container>
-          </div>
-          <!-- / DESCRIPTION SECTION -->
-        </div>
-        <div ng-switch-when="field">
-          <!-- FIELD SECTION -->
-          <div ng-if="vm.accountConnected">
-            <md-input-container class="md-block">
-              <label translate="INTEGRATIONS.FIELD">FIELD</label>
-              <!-- ITEM TYPE DEFAULT VALUE is STRING -->
-              <md-select
-                name="customField"
-                ng-model="vm.customField"
-                required
-                ng-change="vm.item.type = 'string'"
-              >
-                <md-optgroup label="Standard">
-                  <md-option
-                    ng-value="standard"
-                    ng-repeat="standard in vm.fields | filter: {custom: false} "
-                    >{{standard.name}}
-                  </md-option>
-                </md-optgroup>
-
-                <md-optgroup label="Custom">
-                  <md-option
-                    ng-value="custom"
-                    ng-repeat="custom in vm.fields | filter: {custom: true} "
-                    >{{custom.name}}
-                  </md-option>
-                </md-optgroup>
-              </md-select>
-              <div
-                ng-messages="zohoAccountItemForm.customField.$error"
-                ng-show="zohoAccountItemForm.customField.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="INTEGRATIONS.ERRORS.FIELD_REQUIRED"
-                    >Field is required</span
-                  >
-                </div>
-              </div>
-            </md-input-container>
-
-            <!-- FIELDS -->
-            <div ng-if="vm.customField" ng-include="'/fields.html'"></div>
-            <!-- FIELDS -->
-          </div>
-          <div ng-if="!vm.accountConnected">
-            <p>Account is not connected. Please check your configurations!</p>
-          </div>
-          <!-- / FIELD SECTION -->
-        </div>
-        <div ng-switch-default>
-          <p>No Item</p>
-        </div>
-      </div>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newItem"
-          ng-click="vm.saveItem()"
-          class="send-button md-accent md-raised"
-          ng-disabled="zohoAccountItemForm.$invalid || zohoAccountItemForm.$pristine"
-          aria-label="SAVE"
-          translate="INTEGRATIONS.SAVE"
-          translate-attr-aria-label="INTEGRATIONS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newItem"
-          ng-click="vm.addNewItem()"
-          class="send-button md-accent md-raised"
-          ng-disabled="zohoAccountItemForm.$invalid || zohoAccountItemForm.$pristine"
-          aria-label="ADD"
-          translate="INTEGRATIONS.ADD"
-          translate-attr-aria-label="INTEGRATIONS.ADD"
-        >
-          ADD
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newItem"
-          ng-click="vm.deleteItem($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="INTEGRATIONS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
-
-<script type="text/ng-template" id="/fields.html">
-
-  <!-- type -->
-  <md-input-container class="md-block" ng-if="!vm.customField.options.length">
-
-      <label translate="INTEGRATIONS.TYPE">Type</label>
-      <md-select name="type" ng-model="vm.item.type" required>
-
-          <md-option value="string">String</md-option>
-          <md-option value="variable">Variable</md-option>
-          <md-option value="customVariable">Custom Variable</md-option>
-      </md-select>
-      <div ng-messages="zohoAccountItemForm.type.$error" ng-show="zohoAccountItemForm.type.$touched"
-          role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <!--/ type -->
-
-  <!-- value -->
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && vm.customField.options.length">
-      <!-- options -->
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-
-      <md-select name="option" ng-model="vm.item.content" required>
-          <md-option ng-value="option.value" ng-repeat="option in vm.customField.options">{{option.name}}</md-option>
-      </md-select>
-
-      <div ng-messages="zohoAccountItemForm.option.$error"
-          ng-show="zohoAccountItemForm.option.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VALUE_REQUIRED">Value field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && !vm.customField.options.length">
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-
-      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
-
-      <div ng-messages="zohoAccountItemForm.content.$error"
-          ng-show="zohoAccountItemForm.content.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
-          required>
-          <md-optgroup label="Voice: Queue">
-              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
-              </md-option>
-          </md-optgroup>
-          <md-optgroup label="Voice: Outbound">
-              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
-              </md-option>
-          </md-optgroup>
-      </md-select>
-      <div ng-messages="zohoAccountItemForm.variableName.$error"
-          ng-show="zohoAccountItemForm.variableName.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select ng-model="vm.item.VariableId" required>
-          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
-      </md-select>
-  </md-input-container>
-
-  <!--/ value -->
-</script>
-
-<script type="text/ng-template" id="/subject.html">
-    <md-input-container class="md-block">
-        <label translate="INTEGRATIONS.TYPE">Type</label>
-            <md-select name="type" ng-model="vm.item.type" required>
-                <md-option value="string">String</md-option>
-                <md-option value="variable">Variable</md-option>
-                <md-option value="customVariable">Custom Variable</md-option>
-            </md-select>
-        <div ng-messages="zohoAccountItemForm.type.$error" ng-show="zohoAccountItemForm.type.$touched" role="alert">
-            <div ng-message="required">
-                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
-             </div>
-        </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
-      <label translate="INTEGRATIONS.CONTENT">Content</label>
-      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
-      <div ng-messages="zohoAccountItemForm.content.$error"
-          ng-show="zohoAccountItemForm.content.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
-          required>
-          <md-optgroup label="Voice: Queue">
-              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
-              </md-option>
-          </md-optgroup>
-          <md-optgroup label="Voice: Outbound">
-              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
-              </md-option>
-          </md-optgroup>
-      </md-select>
-      <div ng-messages="zohoAccountItemForm.variableName.$error"
-          ng-show="zohoAccountItemForm.variableName.$touched" role="alert">
-          <div ng-message="required">
-              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
-                  required</span>
-          </div>
-      </div>
-  </md-input-container>
-
-  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
-      <label translate="INTEGRATIONS.VALUE">Value</label>
-      <md-select ng-model="vm.item.VariableId" required>
-          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
-      </md-select>
-  </md-input-container>
-</script>
diff --git a/public/src/js/modules/main/apps/integrations/views/zohoAccounts/edit/item/dialog.html/dialog.html b/public/src/js/modules/main/apps/integrations/views/zohoAccounts/edit/item/dialog.html/dialog.html
new file mode 100644
index 0000000..ed123e9
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/zohoAccounts/edit/item/dialog.html/dialog.html
@@ -0,0 +1,478 @@
+<md-dialog class="zohoAccount-item-dialog" aria-label="New Item">
+  <form name="zohoAccountItemForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <div ng-switch="vm.type">
+        <div ng-switch-when="subject">
+          <!-- SUBJECT SECTION -->
+          <div ng-include="'/subject.html'"></div>
+          <!-- / SUBJECT SECTION -->
+        </div>
+        <div ng-switch-when="description">
+          <!-- DESCRIPTION SECTION -->
+          <md-input-container class="md-block">
+            <label translate="INTEGRATIONS.TYPE">Type</label>
+            <md-select name="type" ng-model="vm.item.type" required>
+              <md-option value="string">String</md-option>
+              <md-option value="keyValue">Key Value</md-option>
+            </md-select>
+            <div
+              ng-messages="zohoAccountItemForm.type.$error"
+              ng-show="zohoAccountItemForm.type.$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+                  >Type field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
+            <label translate="INTEGRATIONS.CONTENT">Content</label>
+            <input
+              type="text"
+              name="content"
+              ng-model="vm.item.content"
+              required
+              md-autofocus
+            />
+            <div
+              ng-messages="zohoAccountItemForm.content.$error"
+              ng-show="zohoAccountItemForm.content.$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
+                  >Content field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <div ng-if="vm.item.type == 'keyValue'">
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.KEY">Key</label>
+              <input
+                type="text"
+                name="key"
+                ng-model="vm.item.key"
+                required
+                md-autofocus
+              />
+              <div
+                ng-messages="zohoAccountItemForm.key.$error"
+                ng-show="zohoAccountItemForm.key.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.KEY_REQUIRED"
+                    >Key field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.TYPE">Type</label>
+              <md-select name="keyType" ng-model="vm.item.keyType" required>
+                <md-option value="string">String</md-option>
+                <md-option value="variable">Variable</md-option>
+                <md-option value="customVariable">Custom Variable</md-option>
+              </md-select>
+              <div
+                ng-messages="zohoAccountItemForm.keyType.$error"
+                ng-show="zohoAccountItemForm.keyType.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED"
+                    >Type field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'string'"
+            >
+              <label translate="INTEGRATIONS.CONTENT">Content</label>
+              <input
+                type="text"
+                name="keyContent"
+                ng-model="vm.item.keyContent"
+                required
+                md-autofocus
+              />
+              <div
+                ng-messages="zohoAccountItemForm.keyContent.$error"
+                ng-show="zohoAccountItemForm.keyContent.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED"
+                    >Content field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'variable'"
+            >
+              <label translate="INTEGRATIONS.VALUE">Value</label>
+              <md-select
+                name="variableName"
+                ng-model="vm.item.variableName"
+                md-selected-text="vm.getSelectedVariable()"
+                required
+              >
+                <md-optgroup label="Voice: Queue">
+                  <md-option
+                    ng-value="agentColumn"
+                    ng-repeat="agentColumn in vm.voiceAgentReportColumns"
+                    >{{agentColumn}}
+                  </md-option>
+                </md-optgroup>
+                <md-optgroup label="Voice: Outbound">
+                  <md-option
+                    ng-value="dialColumn"
+                    ng-repeat="dialColumn in vm.voiceDialReportColumns"
+                    >{{dialColumn}}</md-option
+                  >
+                </md-optgroup>
+              </md-select>
+              <div
+                ng-messages="zohoAccountItemForm.variableName.$error"
+                ng-show="zohoAccountItemForm.variableName.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED"
+                    >Variable name field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <md-input-container
+              class="md-block"
+              ng-if="vm.item.keyType == 'customVariable'"
+            >
+              <label translate="INTEGRATIONS.VALUE">Value</label>
+              <md-select ng-model="vm.item.VariableId" required>
+                <md-option
+                  ng-value="variable.id"
+                  ng-repeat="variable in vm.variables"
+                  >{{variable.name}}
+                </md-option>
+              </md-select>
+            </md-input-container>
+          </div>
+          <!-- / DESCRIPTION SECTION -->
+        </div>
+        <div ng-switch-when="field">
+          <!-- FIELD SECTION -->
+          <div ng-if="vm.accountConnected">
+            <md-input-container class="md-block">
+              <label translate="INTEGRATIONS.FIELD">FIELD</label>
+              <!-- ITEM TYPE DEFAULT VALUE is STRING -->
+              <md-select
+                name="customField"
+                ng-model="vm.customField"
+                required
+                ng-change="vm.item.type = 'string'"
+              >
+                <md-optgroup label="Standard">
+                  <md-option
+                    ng-value="standard"
+                    ng-repeat="standard in vm.fields | filter: {custom: false} "
+                    >{{standard.name}}
+                  </md-option>
+                </md-optgroup>
+
+                <md-optgroup label="Custom">
+                  <md-option
+                    ng-value="custom"
+                    ng-repeat="custom in vm.fields | filter: {custom: true} "
+                    >{{custom.name}}
+                  </md-option>
+                </md-optgroup>
+              </md-select>
+              <div
+                ng-messages="zohoAccountItemForm.customField.$error"
+                ng-show="zohoAccountItemForm.customField.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="INTEGRATIONS.ERRORS.FIELD_REQUIRED"
+                    >Field is required</span
+                  >
+                </div>
+              </div>
+            </md-input-container>
+
+            <!-- FIELDS -->
+            <div ng-if="vm.customField" ng-include="'/fields.html'"></div>
+            <!-- FIELDS -->
+          </div>
+          <div ng-if="!vm.accountConnected">
+            <p>Account is not connected. Please check your configurations!</p>
+          </div>
+          <!-- / FIELD SECTION -->
+        </div>
+        <div ng-switch-default>
+          <p>No Item</p>
+        </div>
+      </div>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newItem"
+          ng-click="vm.saveItem()"
+          class="send-button md-accent md-raised"
+          ng-disabled="zohoAccountItemForm.$invalid || zohoAccountItemForm.$pristine"
+          aria-label="SAVE"
+          translate="INTEGRATIONS.SAVE"
+          translate-attr-aria-label="INTEGRATIONS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newItem"
+          ng-click="vm.addNewItem()"
+          class="send-button md-accent md-raised"
+          ng-disabled="zohoAccountItemForm.$invalid || zohoAccountItemForm.$pristine"
+          aria-label="ADD"
+          translate="INTEGRATIONS.ADD"
+          translate-attr-aria-label="INTEGRATIONS.ADD"
+        >
+          ADD
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newItem"
+          ng-click="vm.deleteItem($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="INTEGRATIONS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="INTEGRATIONS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
+
+<script type="text/ng-template" id="/fields.html">
+
+  <!-- type -->
+  <md-input-container class="md-block" ng-if="!vm.customField.options.length">
+
+      <label translate="INTEGRATIONS.TYPE">Type</label>
+      <md-select name="type" ng-model="vm.item.type" required>
+
+          <md-option value="string">String</md-option>
+          <md-option value="variable">Variable</md-option>
+          <md-option value="customVariable">Custom Variable</md-option>
+      </md-select>
+      <div ng-messages="zohoAccountItemForm.type.$error" ng-show="zohoAccountItemForm.type.$touched"
+          role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <!--/ type -->
+
+  <!-- value -->
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && vm.customField.options.length">
+      <!-- options -->
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+
+      <md-select name="option" ng-model="vm.item.content" required>
+          <md-option ng-value="option.value" ng-repeat="option in vm.customField.options">{{option.name}}</md-option>
+      </md-select>
+
+      <div ng-messages="zohoAccountItemForm.option.$error"
+          ng-show="zohoAccountItemForm.option.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VALUE_REQUIRED">Value field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string' && !vm.customField.options.length">
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+
+      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
+
+      <div ng-messages="zohoAccountItemForm.content.$error"
+          ng-show="zohoAccountItemForm.content.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
+          required>
+          <md-optgroup label="Voice: Queue">
+              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
+              </md-option>
+          </md-optgroup>
+          <md-optgroup label="Voice: Outbound">
+              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
+              </md-option>
+          </md-optgroup>
+      </md-select>
+      <div ng-messages="zohoAccountItemForm.variableName.$error"
+          ng-show="zohoAccountItemForm.variableName.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select ng-model="vm.item.VariableId" required>
+          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
+      </md-select>
+  </md-input-container>
+
+  <!--/ value -->
+</script>
+
+<script type="text/ng-template" id="/subject.html">
+    <md-input-container class="md-block">
+        <label translate="INTEGRATIONS.TYPE">Type</label>
+            <md-select name="type" ng-model="vm.item.type" required>
+                <md-option value="string">String</md-option>
+                <md-option value="variable">Variable</md-option>
+                <md-option value="customVariable">Custom Variable</md-option>
+            </md-select>
+        <div ng-messages="zohoAccountItemForm.type.$error" ng-show="zohoAccountItemForm.type.$touched" role="alert">
+            <div ng-message="required">
+                <span translate="INTEGRATIONS.ERRORS.TYPE_REQUIRED">Type field is required</span>
+             </div>
+        </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'string'">
+      <label translate="INTEGRATIONS.CONTENT">Content</label>
+      <input type="text" name="content" ng-model="vm.item.content" required md-autofocus>
+      <div ng-messages="zohoAccountItemForm.content.$error"
+          ng-show="zohoAccountItemForm.content.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.CONTENT_REQUIRED">Content field is required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'variable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select name="variableName" ng-model="vm.item.variableName" md-selected-text="vm.getSelectedVariable()"
+          required>
+          <md-optgroup label="Voice: Queue">
+              <md-option ng-value="agentColumn" ng-repeat="agentColumn in vm.voiceAgentReportColumns">{{agentColumn}}
+              </md-option>
+          </md-optgroup>
+          <md-optgroup label="Voice: Outbound">
+              <md-option ng-value="dialColumn" ng-repeat="dialColumn in vm.voiceDialReportColumns">{{dialColumn}}
+              </md-option>
+          </md-optgroup>
+      </md-select>
+      <div ng-messages="zohoAccountItemForm.variableName.$error"
+          ng-show="zohoAccountItemForm.variableName.$touched" role="alert">
+          <div ng-message="required">
+              <span translate="INTEGRATIONS.ERRORS.VARIABLENAME_REQUIRED">Variable name field is
+                  required</span>
+          </div>
+      </div>
+  </md-input-container>
+
+  <md-input-container class="md-block" ng-if="vm.item.type == 'customVariable'">
+      <label translate="INTEGRATIONS.VALUE">Value</label>
+      <md-select ng-model="vm.item.VariableId" required>
+          <md-option ng-value="variable.id" ng-repeat="variable in vm.variables">{{variable.name}}</md-option>
+      </md-select>
+  </md-input-container>
+</script>
diff --git a/public/src/js/modules/main/apps/integrations/views/zohoAccounts/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/zohoAccounts/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index 4bc4b23..0000000
--- a/public/src/js/modules/main/apps/integrations/views/zohoAccounts/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,1037 +0,0 @@
-<div
-  id="integrations-zohoAccount"
-  class="page-layout simple tabbed"
-  layout="column"
->
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-zohoAccounts-button md-icon-button"
-        aria-label="Go to zohoAccounts"
-        ng-click="vm.gotoZohoAccounts()"
-        translate
-        translate-attr-aria-label="INTEGRATIONS.GO_TO_ZOHOACCOUNTS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="zohoAccount-image" hide-xs>
-          <img ng-src="assets/images/business/zohoAccounts.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.zohoAccount.id}}
-            <span ng-if="vm.zohoAccount.name">{{vm.zohoAccount.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="INTEGRATIONS.CREATED_AT"></span>
-            <span>{{vm.zohoAccount.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveZohoAccount()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (configurationsForm.$invalid)"
-        translate="INTEGRATIONS.SAVE"
-        translate-attr-aria-label="INTEGRATIONS.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="INTEGRATIONS.ACCOUNT">ACCOUNT</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="zohoAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="INTEGRATIONS.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.zohoAccount.name"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.HOST">Host</label>
-                <md-select
-                  name="host"
-                  ng-model="vm.zohoAccount.host"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'zoho.com'">zoho.com</md-option>
-                  <md-option ng-value="'zoho.eu'">zoho.eu</md-option>
-                </md-select>
-                <div
-                  ng-messages="generalForm['host'].$error"
-                  ng-show="generalForm['host'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.HOST_REQUIRED"
-                      >Host field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.ZONE">Zone</label>
-                <md-select
-                  name="zone"
-                  ng-model="vm.zohoAccount.zone"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'US'">US</md-option>
-                  <md-option ng-value="'AU'">AU</md-option>
-                  <md-option ng-value="'EU'">EU</md-option>
-                  <md-option ng-value="'IN'">IN</md-option>
-                  <md-option ng-value="'CN'">CN</md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="INTEGRATIONS.HELP.ZONE"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['zone'].$error"
-                  ng-show="generalForm['zone'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.ZONE_REQUIRED"
-                      >Zone field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.CLIENTID">ClientId</label>
-                <input
-                  type="text"
-                  name="clientId"
-                  ng-model="vm.zohoAccount.clientId"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="INTEGRATIONS.HELP.CLIENTID"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['clientId'].$error"
-                  ng-show="generalForm['clientId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.CLIENTID_REQUIRED"
-                      >ClientId field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.CLIENTSECRET"
-                  >ClientSecret</label
-                >
-                <input
-                  type="text"
-                  name="clientSecret"
-                  ng-model="vm.zohoAccount.clientSecret"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="INTEGRATIONS.HELP.CLIENTSECRET"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['clientSecret'].$error"
-                  ng-show="generalForm['clientSecret'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.CLIENTSECRET_REQUIRED"
-                      >ClientSecret field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.CODE">Code</label>
-                <input
-                  type="text"
-                  name="code"
-                  ng-model="vm.zohoAccount.code"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="INTEGRATIONS.HELP.CODE"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['code'].$error"
-                  ng-show="generalForm['code'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.CODE_REQUIRED"
-                      >Code field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.REFRESHTOKEN"
-                  >RefreshToken</label
-                >
-                <input
-                  type="text"
-                  name="refreshToken"
-                  ng-model="vm.zohoAccount.refreshToken"
-                  disabled
-                />
-
-                <div class="hint">
-                  <span translate="INTEGRATIONS.HELP.REFRESHTOKEN"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['refreshToken'].$error"
-                  ng-show="generalForm['refreshToken'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.REFRESHTOKEN_REQUIRED"
-                      >RefreshToken field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
-                  >MotionProxyAddress</label
-                >
-                <input
-                  type="url"
-                  name="serverUrl"
-                  ng-model="vm.zohoAccount.serverUrl"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['serverUrl'].$error"
-                  ng-show="generalForm['serverUrl'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
-                      >MotionProxyAddress field is required</span
-                    >
-                  </div>
-                  <div ng-message="url">
-                    <span
-                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
-                      >MotionProxyAddress must be a valid url
-                      http://www.xcally.com</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.zohoAccount.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="INTEGRATIONS.CONFIGURATIONS">CONFIGURATIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="zohoAccount-detail-form-container configurations md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div
-                class="h2 secondary-text"
-                translate="INTEGRATIONS.CONFIGURATIONS"
-              >
-                CONFIGURATIONS
-              </div>
-            </div>
-            <div
-              ng-controller="ZohoAccountConfigurationsController as vm_cc"
-              ng-init="vm_cc.init(vm.zohoAccount, vm.crudPermissions)"
-              layout="row"
-            >
-              <md-card class="md-whiteframe-1dp" flex="30">
-                <div layout="row" layout-align="center center">
-                  <md-subheader flex="75" class="md-no-sticky"
-                    >{{ 'INTEGRATIONS.CONFIGURATIONS' | translate
-                    }}</md-subheader
-                  >
-                  <md-button
-                    flex="25"
-                    ng-if="vm_cc.crudPermissions.canEdit"
-                    ng-click="vm_cc.createOrEditZohoConfiguration($event)"
-                    class="md-icon-button"
-                    aria-label="create zohoConfiguration"
-                  >
-                    <md-icon md-font-icon="icon-plus"></md-icon>
-                  </md-button>
-                </div>
-                <md-list>
-                  <md-list-item
-                    layout="row"
-                    layout-align="center center"
-                    ng-repeat="zohoConfiguration in vm_cc.configurations"
-                    class="border-top"
-                    md-colors="{background: (vm_cc.selectedZohoConfiguration == $index ? 'accent' : 'grey-A100')}"
-                    ng-click="vm_cc.getZohoConfiguration($index)"
-                  >
-                    <span class="text-truncate" flex="80"
-                      >{{ zohoConfiguration.name }}</span
-                    >
-                    <md-menu ng-if="vm_cc.crudPermissions.canDelete">
-                      <md-button
-                        class="md-icon-button"
-                        aria-label="More"
-                        translate
-                        translate-attr-aria-label="INTEGRATIONS.MORE"
-                        ng-click="$mdOpenMenu($event)"
-                      >
-                        <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                      </md-button>
-                      <md-menu-content width="3">
-                        <md-menu-item ng-if="vm_cc.crudPermissions.canDelete">
-                          <md-button
-                            ng-click="vm_cc.deleteZohoConfiguration($event, zohoConfiguration)"
-                            translate="INTEGRATIONS.DELETE_ZOHOCONFIGURATION"
-                          >
-                            Delete ZohoConfiguration
-                          </md-button>
-                        </md-menu-item>
-                      </md-menu-content>
-                    </md-menu>
-                  </md-list-item>
-                </md-list>
-              </md-card>
-              <div flex></div>
-              <md-card class="md-whiteframe-1dp" flex="65">
-                <md-tabs ng-if="vm_cc.configurations.length" md-dynamic-height>
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.SUBJECTS">SUBJECTS</span>
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-toolbar
-                        class="md-table-toolbar md-default no-padding"
-                        ng-hide="vm_cc.selectedSubjects.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <div flex></div>
-                          <ms-search-bar
-                            on-search="vm_cc.query.subject = query"
-                            on-collapse="vm_cc.query.subject = undefined"
-                            debounce="300"
-                          ></ms-search-bar>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canEdit"
-                            class="md-icon-button"
-                            ng-click="vm_cc.createOrEditSubject($event)"
-                            aria-label="add subject"
-                            translate
-                            translate-attr-label="INTEGRATIONS.ADD_SUBJECT"
-                          >
-                            <md-icon md-font-icon="icon-plus"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-toolbar
-                        class="md-table-toolbar md-accent"
-                        ng-show="vm_cc.selectedSubjects.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <span class="md-subhead"
-                            >{{vm_cc.selectedSubjects.length}}
-                            {{vm_cc.selectedSubjects.length > 1 ? 'items' :
-                            'item'}} selected</span
-                          >
-                          <div flex></div>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canDelete"
-                            class="md-icon-button"
-                            ng-click="vm_cc.deleteSelectedSubjects($event)"
-                            aria-label="delete selected"
-                            translate
-                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-                          >
-                            <md-icon md-font-icon="icon-delete"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-table-container
-                        class="md-whiteframe-1dp padding-horizontal"
-                      >
-                        <table
-                          md-table
-                          md-row-select
-                          multiple
-                          ng-model="vm_cc.selectedSubjects"
-                        >
-                          <thead md-head>
-                            <tr md-row>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.ID' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.TYPE' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.CONTENT' | translate }}
-                              </th>
-                              <th md-column width="10px"></th>
-                            </tr>
-                          </thead>
-                          <tbody md-body>
-                            <tr
-                              md-row
-                              md-select="subject"
-                              md-select-id="id"
-                              ng-repeat="subject in vm_cc.subjects | filter: vm_cc.query.subject"
-                            >
-                              <td
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                                class="id"
-                              >
-                                {{subject.id}}
-                              </td>
-                              <td
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                                class="type"
-                              >
-                                <span ng-if="subject.FieldId"
-                                  >{{subject.nameField ||
-                                  subject.idField}}</span
-                                >
-                                <span ng-if="!subject.FieldId"
-                                  >{{subject.type}}</span
-                                >
-                              </td>
-                              <td
-                                ng-switch="subject.type"
-                                ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                md-cell
-                              >
-                                <span ng-switch-when="string"
-                                  >{{subject.content}}</span
-                                >
-                                <span
-                                  ng-switch-when="variable"
-                                  class="text-boxed"
-                                  >{{subject.variableName}}</span
-                                >
-                                <span
-                                  ng-switch-when="customVariable"
-                                  class="text-boxed"
-                                  >{{
-                                  vm_cc.variablesById[subject.VariableId].name
-                                  }}</span
-                                >
-                                <span ng-switch-when="keyValue">
-                                  {{subject.key}}
-                                  <span ng-switch="description.keyType">
-                                    <span ng-switch-when="string"
-                                      >{{subject.keyContent}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="variable"
-                                      class="text-boxed"
-                                      >{{subject.variableName}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="customVariable"
-                                      class="text-boxed"
-                                      >{{
-                                      vm_cc.variablesById[subject.VariableId].name
-                                      }}</span
-                                    >
-                                  </span>
-                                </span>
-                                <span ng-switch-default
-                                  >{{subject.content}}</span
-                                >
-                              </td>
-                              <td
-                                md-cell
-                                class="actions"
-                                ng-if="!vm_cc.crudPermissions.readOnly"
-                              >
-                                <md-menu>
-                                  <md-button
-                                    class="md-icon-button"
-                                    aria-label="More"
-                                    translate
-                                    translate-attr-aria-label="INTEGRATIONS.MORE"
-                                    ng-click="$mdOpenMenu($event)"
-                                  >
-                                    <md-icon
-                                      md-font-icon="icon-dots-vertical"
-                                    ></md-icon>
-                                  </md-button>
-
-                                  <md-menu-content width="3">
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canEdit"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.createOrEditSubject($event, subject)"
-                                        translate="INTEGRATIONS.EDIT_SUBJECT"
-                                      >
-                                        Edit Subject
-                                      </md-button>
-                                    </md-menu-item>
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canDelete"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.deleteSubjectConfirm($event, subject)"
-                                        translate="INTEGRATIONS.DELETE_SUBJECT"
-                                      >
-                                        Delete Subject
-                                      </md-button>
-                                    </md-menu-item>
-                                  </md-menu-content>
-                                </md-menu>
-                              </td>
-                            </tr>
-                          </tbody>
-                        </table>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.DESCRIPTIONS"
-                        >DESCRIPTIONS</span
-                      >
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-toolbar
-                        class="md-table-toolbar md-default no-padding"
-                        ng-hide="vm_cc.selectedDescriptions.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <div flex></div>
-                          <ms-search-bar
-                            on-search="vm_cc.query.description = query"
-                            on-collapse="vm_cc.query.description = undefined"
-                            debounce="300"
-                          ></ms-search-bar>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canEdit"
-                            class="md-icon-button"
-                            ng-click="vm_cc.createOrEditDescription($event)"
-                            aria-label="add description"
-                            translate
-                            translate-attr-label="INTEGRATIONS.ADD_DESCRIPTION"
-                          >
-                            <md-icon md-font-icon="icon-plus"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-toolbar
-                        class="md-table-toolbar md-accent"
-                        ng-show="vm_cc.selectedDescriptions.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <span class="md-subhead"
-                            >{{vm_cc.selectedDescriptions.length}}
-                            {{vm_cc.selectedDescriptions.length > 1 ? 'items' :
-                            'item'}} selected</span
-                          >
-                          <div flex></div>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canDelete"
-                            class="md-icon-button"
-                            ng-click="vm_cc.deleteSelectedDescriptions($event)"
-                            aria-label="delete selected"
-                            translate
-                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-                          >
-                            <md-icon md-font-icon="icon-delete"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-table-container
-                        class="md-whiteframe-1dp padding-horizontal"
-                      >
-                        <table
-                          md-table
-                          md-row-select
-                          multiple
-                          ng-model="vm_cc.selectedDescriptions"
-                        >
-                          <thead md-head>
-                            <tr md-row>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.ID' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.TYPE' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.CONTENT' | translate }}
-                              </th>
-                              <th md-column width="10px"></th>
-                            </tr>
-                          </thead>
-                          <tbody md-body>
-                            <tr
-                              md-row
-                              md-select="description"
-                              md-select-id="id"
-                              ng-repeat="description in vm_cc.descriptions | filter: vm_cc.query.description"
-                            >
-                              <td
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                                class="id"
-                              >
-                                {{description.id}}
-                              </td>
-                              <td
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                                class="type"
-                              >
-                                <span ng-if="description.FieldId"
-                                  >{{description.nameField ||
-                                  description.idField}}</span
-                                >
-                                <span ng-if="!description.FieldId"
-                                  >{{description.type}}</span
-                                >
-                              </td>
-                              <td
-                                ng-switch="description.type"
-                                ng-click="vm_cc.createOrEditDescription($event, description)"
-                                md-cell
-                              >
-                                <span ng-switch-when="string"
-                                  >{{description.content}}</span
-                                >
-                                <span
-                                  ng-switch-when="variable"
-                                  class="text-boxed"
-                                  >{{description.variableName}}</span
-                                >
-                                <span
-                                  ng-switch-when="customVariable"
-                                  class="text-boxed"
-                                  >{{
-                                  vm_cc.variablesById[description.VariableId].name
-                                  }}</span
-                                >
-                                <span ng-switch-when="keyValue">
-                                  {{description.key}}
-                                  <span ng-switch="description.keyType">
-                                    <span ng-switch-when="string"
-                                      >{{description.keyContent}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="variable"
-                                      class="text-boxed"
-                                      >{{description.variableName}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="customVariable"
-                                      class="text-boxed"
-                                      >{{
-                                      vm_cc.variablesById[description.VariableId].name
-                                      }}</span
-                                    >
-                                  </span>
-                                </span>
-                                <span ng-switch-default
-                                  >{{description.content}}</span
-                                >
-                              </td>
-                              <td
-                                md-cell
-                                class="actions"
-                                ng-if="!vm_cc.crudPermissions.readOnly"
-                              >
-                                <md-menu>
-                                  <md-button
-                                    class="md-icon-button"
-                                    aria-label="More"
-                                    translate
-                                    translate-attr-aria-label="INTEGRATIONS.MORE"
-                                    ng-click="$mdOpenMenu($event)"
-                                  >
-                                    <md-icon
-                                      md-font-icon="icon-dots-vertical"
-                                    ></md-icon>
-                                  </md-button>
-
-                                  <md-menu-content width="3">
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canEdit"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.createOrEditDescription($event, description)"
-                                        translate="INTEGRATIONS.EDIT_DESCRIPTION"
-                                      >
-                                        Edit Description
-                                      </md-button>
-                                    </md-menu-item>
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canDelete"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.deleteDescriptionConfirm($event, description)"
-                                        translate="INTEGRATIONS.DELETE_DESCRIPTION"
-                                      >
-                                        Delete Description
-                                      </md-button>
-                                    </md-menu-item>
-                                  </md-menu-content>
-                                </md-menu>
-                              </td>
-                            </tr>
-                          </tbody>
-                        </table>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.FIELDS">FIELDS</span>
-                    </md-tab-label>
-                    <md-tab-body>
-                      <md-toolbar
-                        class="md-table-toolbar md-default no-padding"
-                        ng-hide="vm_cc.selectedFields.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <div flex></div>
-                          <ms-search-bar
-                            on-search="vm_cc.query.field = query"
-                            on-collapse="vm_cc.query.field = undefined"
-                            debounce="300"
-                          ></ms-search-bar>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canEdit"
-                            class="md-icon-button"
-                            ng-click="vm_cc.createOrEditField($event)"
-                            aria-label="add field"
-                            translate
-                            translate-attr-label="INTEGRATIONS.ADD_FIELD"
-                          >
-                            <md-icon md-font-icon="icon-plus"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-toolbar
-                        class="md-table-toolbar md-accent"
-                        ng-show="vm_cc.selectedFields.length"
-                      >
-                        <div class="md-toolbar-tools">
-                          <span class="md-subhead"
-                            >{{vm_cc.selectedFields.length}}
-                            {{vm_cc.selectedFields.length > 1 ? 'items' :
-                            'item'}} selected</span
-                          >
-                          <div flex></div>
-                          <md-button
-                            ng-if="vm_cc.crudPermissions.canDelete"
-                            class="md-icon-button"
-                            ng-click="vm_cc.deleteSelectedFields($event)"
-                            aria-label="delete selected"
-                            translate
-                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-                          >
-                            <md-icon md-font-icon="icon-delete"></md-icon>
-                          </md-button>
-                        </div>
-                      </md-toolbar>
-                      <md-table-container
-                        class="md-whiteframe-1dp padding-horizontal"
-                      >
-                        <table
-                          md-table
-                          md-row-select
-                          multiple
-                          ng-model="vm_cc.selectedFields"
-                        >
-                          <thead md-head>
-                            <tr md-row>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.ID' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.TYPE' | translate }}
-                              </th>
-                              <th md-column>
-                                {{ 'INTEGRATIONS.CONTENT' | translate }}
-                              </th>
-                              <th md-column width="10px"></th>
-                            </tr>
-                          </thead>
-                          <tbody md-body>
-                            <tr
-                              md-row
-                              md-select="field"
-                              md-select-id="id"
-                              ng-repeat="field in vm_cc.fields | filter: vm_cc.query.field"
-                            >
-                              <td
-                                ng-click="vm_cc.createOrEditField($event, field)"
-                                md-cell
-                                class="id"
-                              >
-                                {{field.id}}
-                              </td>
-                              <td
-                                ng-click="vm_cc.createOrEditField($event, field)"
-                                md-cell
-                                class="type"
-                              >
-                                <span ng-if="field.FieldId"
-                                  >{{field.nameField || field.idField}}</span
-                                >
-                                <span ng-if="!field.FieldId"
-                                  >{{field.type}}</span
-                                >
-                              </td>
-                              <td
-                                ng-switch="field.type"
-                                ng-click="vm_cc.createOrEditField($event, field)"
-                                md-cell
-                              >
-                                <span ng-switch-when="string"
-                                  >{{field.content}}</span
-                                >
-                                <span
-                                  ng-switch-when="variable"
-                                  class="text-boxed"
-                                  >{{field.variableName}}</span
-                                >
-                                <span
-                                  ng-switch-when="customVariable"
-                                  class="text-boxed"
-                                  >{{ vm_cc.variablesById[field.VariableId].name
-                                  }}</span
-                                >
-                                <span ng-switch-when="keyValue">
-                                  {{field.key}}
-                                  <span ng-switch="description.keyType">
-                                    <span ng-switch-when="string"
-                                      >{{field.keyContent}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="variable"
-                                      class="text-boxed"
-                                      >{{field.variableName}}</span
-                                    >
-                                    <span
-                                      ng-switch-when="customVariable"
-                                      class="text-boxed"
-                                      >{{
-                                      vm_cc.variablesById[field.VariableId].name
-                                      }}</span
-                                    >
-                                  </span>
-                                </span>
-                                <span ng-switch-default>{{field.content}}</span>
-                              </td>
-                              <td
-                                md-cell
-                                class="actions"
-                                ng-if="!vm_cc.crudPermissions.readOnly"
-                              >
-                                <md-menu>
-                                  <md-button
-                                    class="md-icon-button"
-                                    aria-label="More"
-                                    translate
-                                    translate-attr-aria-label="INTEGRATIONS.MORE"
-                                    ng-click="$mdOpenMenu($event)"
-                                  >
-                                    <md-icon
-                                      md-font-icon="icon-dots-vertical"
-                                    ></md-icon>
-                                  </md-button>
-
-                                  <md-menu-content width="3">
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canEdit"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.createOrEditField($event, field)"
-                                        translate="INTEGRATIONS.EDIT_FIELD"
-                                      >
-                                        Edit Field
-                                      </md-button>
-                                    </md-menu-item>
-                                    <md-menu-item
-                                      ng-if="vm_cc.crudPermissions.canDelete"
-                                    >
-                                      <md-button
-                                        ng-click="vm_cc.deleteFieldConfirm($event, field)"
-                                        translate="INTEGRATIONS.DELETE_FIELD"
-                                      >
-                                        Delete Field
-                                      </md-button>
-                                    </md-menu-item>
-                                  </md-menu-content>
-                                </md-menu>
-                              </td>
-                            </tr>
-                          </tbody>
-                        </table>
-                      </md-table-container>
-                    </md-tab-body>
-                  </md-tab>
-
-                  <md-tab>
-                    <md-tab-label>
-                      <span translate="INTEGRATIONS.ADVANCED">ADVANCED</span>
-                    </md-tab-label>
-                    <md-tab-body>
-                      <div layout-margin>
-                        <label translate="INTEGRATIONS.MODULE_SEARCH"></label>
-                        <md-select
-                          ng-model="vm_cc.zohoConfiguration.moduleSearch"
-                          ng-change="vm_cc.selectChangedAdvanced()"
-                          ng-disabled="!vm_cc.crudPermissions.canEdit"
-                        >
-                          <md-option
-                            ng-value="option.key"
-                            ng-repeat="option in [{key: 'contact_lead', value: 'Contact & Lead'}, {key: 'contact', value: 'Contact'}, {key: 'lead', value: 'Lead'}]"
-                            >{{ option.value }}</md-option
-                          >
-                        </md-select>
-                      </div>
-                      <div layout-margin>
-                        <label translate="INTEGRATIONS.MODULE_CREATE"></label>
-                        <md-select
-                          ng-model="vm_cc.zohoConfiguration.moduleCreate"
-                          ng-change="vm_cc.selectChangedAdvanced()"
-                          ng-disabled="!vm_cc.crudPermissions.canEdit"
-                        >
-                          <md-option
-                            ng-value="option.key"
-                            ng-repeat="option in [{key: 'nothing', value: 'Nothing'}, {key: 'contact', value: 'Contact'}, {key: 'lead', value: 'Lead'}]"
-                            >{{ option.value }}</md-option
-                          >
-                        </md-select>
-                      </div>
-                    </md-tab-body>
-                  </md-tab>
-                </md-tabs>
-                <div
-                  class="padding-20"
-                  ng-if="!vm_cc.configurations.length && vm_cc.crudPermissions.canEdit"
-                  ng-click="vm_cc.createOrEditZohoConfiguration($event)"
-                  layout="row"
-                  layout-sm="column"
-                  layout-align="center center"
-                  layout-wrap
-                >
-                  <div
-                    class="padding-20 md-whiteframe-3dp md-accent-bg"
-                    layout="column"
-                    layout-align="center center"
-                  >
-                    <md-button class="md-icon-button">
-                      <md-icon md-font-icon="icon-plus"></md-icon>
-                    </md-button>
-                    <span
-                      aria-label="add configuration"
-                      translate
-                      translate-attr-label="INTEGRATIONS.ADD_CONFIGURATION"
-                      >ADD CONFIGURATION</span
-                    >
-                  </div>
-                </div>
-              </md-card>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/zohoAccounts/edit/view.html/view.html b/public/src/js/modules/main/apps/integrations/views/zohoAccounts/edit/view.html/view.html
new file mode 100644
index 0000000..4bc4b23
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/zohoAccounts/edit/view.html/view.html
@@ -0,0 +1,1037 @@
+<div
+  id="integrations-zohoAccount"
+  class="page-layout simple tabbed"
+  layout="column"
+>
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-zohoAccounts-button md-icon-button"
+        aria-label="Go to zohoAccounts"
+        ng-click="vm.gotoZohoAccounts()"
+        translate
+        translate-attr-aria-label="INTEGRATIONS.GO_TO_ZOHOACCOUNTS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="zohoAccount-image" hide-xs>
+          <img ng-src="assets/images/business/zohoAccounts.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.zohoAccount.id}}
+            <span ng-if="vm.zohoAccount.name">{{vm.zohoAccount.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="INTEGRATIONS.CREATED_AT"></span>
+            <span>{{vm.zohoAccount.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveZohoAccount()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (configurationsForm.$invalid)"
+        translate="INTEGRATIONS.SAVE"
+        translate-attr-aria-label="INTEGRATIONS.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="INTEGRATIONS.ACCOUNT">ACCOUNT</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="zohoAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="INTEGRATIONS.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.zohoAccount.name"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.HOST">Host</label>
+                <md-select
+                  name="host"
+                  ng-model="vm.zohoAccount.host"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'zoho.com'">zoho.com</md-option>
+                  <md-option ng-value="'zoho.eu'">zoho.eu</md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['host'].$error"
+                  ng-show="generalForm['host'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.HOST_REQUIRED"
+                      >Host field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.ZONE">Zone</label>
+                <md-select
+                  name="zone"
+                  ng-model="vm.zohoAccount.zone"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'US'">US</md-option>
+                  <md-option ng-value="'AU'">AU</md-option>
+                  <md-option ng-value="'EU'">EU</md-option>
+                  <md-option ng-value="'IN'">IN</md-option>
+                  <md-option ng-value="'CN'">CN</md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="INTEGRATIONS.HELP.ZONE"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['zone'].$error"
+                  ng-show="generalForm['zone'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.ZONE_REQUIRED"
+                      >Zone field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.CLIENTID">ClientId</label>
+                <input
+                  type="text"
+                  name="clientId"
+                  ng-model="vm.zohoAccount.clientId"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="INTEGRATIONS.HELP.CLIENTID"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['clientId'].$error"
+                  ng-show="generalForm['clientId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.CLIENTID_REQUIRED"
+                      >ClientId field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.CLIENTSECRET"
+                  >ClientSecret</label
+                >
+                <input
+                  type="text"
+                  name="clientSecret"
+                  ng-model="vm.zohoAccount.clientSecret"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="INTEGRATIONS.HELP.CLIENTSECRET"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['clientSecret'].$error"
+                  ng-show="generalForm['clientSecret'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.CLIENTSECRET_REQUIRED"
+                      >ClientSecret field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.CODE">Code</label>
+                <input
+                  type="text"
+                  name="code"
+                  ng-model="vm.zohoAccount.code"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="INTEGRATIONS.HELP.CODE"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['code'].$error"
+                  ng-show="generalForm['code'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.CODE_REQUIRED"
+                      >Code field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.REFRESHTOKEN"
+                  >RefreshToken</label
+                >
+                <input
+                  type="text"
+                  name="refreshToken"
+                  ng-model="vm.zohoAccount.refreshToken"
+                  disabled
+                />
+
+                <div class="hint">
+                  <span translate="INTEGRATIONS.HELP.REFRESHTOKEN"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['refreshToken'].$error"
+                  ng-show="generalForm['refreshToken'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.REFRESHTOKEN_REQUIRED"
+                      >RefreshToken field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.MOTIONPROXYADDRESS"
+                  >MotionProxyAddress</label
+                >
+                <input
+                  type="url"
+                  name="serverUrl"
+                  ng-model="vm.zohoAccount.serverUrl"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="INTEGRATIONS.HELP.MOTIONPROXYADDRESS"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['serverUrl'].$error"
+                  ng-show="generalForm['serverUrl'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_REQUIRED"
+                      >MotionProxyAddress field is required</span
+                    >
+                  </div>
+                  <div ng-message="url">
+                    <span
+                      translate="INTEGRATIONS.ERRORS.MOTIONPROXYADDRESS_MUST_VALID_URL"
+                      >MotionProxyAddress must be a valid url
+                      http://www.xcally.com</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="INTEGRATIONS.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.zohoAccount.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="INTEGRATIONS.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="INTEGRATIONS.CONFIGURATIONS">CONFIGURATIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="zohoAccount-detail-form-container configurations md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div
+                class="h2 secondary-text"
+                translate="INTEGRATIONS.CONFIGURATIONS"
+              >
+                CONFIGURATIONS
+              </div>
+            </div>
+            <div
+              ng-controller="ZohoAccountConfigurationsController as vm_cc"
+              ng-init="vm_cc.init(vm.zohoAccount, vm.crudPermissions)"
+              layout="row"
+            >
+              <md-card class="md-whiteframe-1dp" flex="30">
+                <div layout="row" layout-align="center center">
+                  <md-subheader flex="75" class="md-no-sticky"
+                    >{{ 'INTEGRATIONS.CONFIGURATIONS' | translate
+                    }}</md-subheader
+                  >
+                  <md-button
+                    flex="25"
+                    ng-if="vm_cc.crudPermissions.canEdit"
+                    ng-click="vm_cc.createOrEditZohoConfiguration($event)"
+                    class="md-icon-button"
+                    aria-label="create zohoConfiguration"
+                  >
+                    <md-icon md-font-icon="icon-plus"></md-icon>
+                  </md-button>
+                </div>
+                <md-list>
+                  <md-list-item
+                    layout="row"
+                    layout-align="center center"
+                    ng-repeat="zohoConfiguration in vm_cc.configurations"
+                    class="border-top"
+                    md-colors="{background: (vm_cc.selectedZohoConfiguration == $index ? 'accent' : 'grey-A100')}"
+                    ng-click="vm_cc.getZohoConfiguration($index)"
+                  >
+                    <span class="text-truncate" flex="80"
+                      >{{ zohoConfiguration.name }}</span
+                    >
+                    <md-menu ng-if="vm_cc.crudPermissions.canDelete">
+                      <md-button
+                        class="md-icon-button"
+                        aria-label="More"
+                        translate
+                        translate-attr-aria-label="INTEGRATIONS.MORE"
+                        ng-click="$mdOpenMenu($event)"
+                      >
+                        <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                      </md-button>
+                      <md-menu-content width="3">
+                        <md-menu-item ng-if="vm_cc.crudPermissions.canDelete">
+                          <md-button
+                            ng-click="vm_cc.deleteZohoConfiguration($event, zohoConfiguration)"
+                            translate="INTEGRATIONS.DELETE_ZOHOCONFIGURATION"
+                          >
+                            Delete ZohoConfiguration
+                          </md-button>
+                        </md-menu-item>
+                      </md-menu-content>
+                    </md-menu>
+                  </md-list-item>
+                </md-list>
+              </md-card>
+              <div flex></div>
+              <md-card class="md-whiteframe-1dp" flex="65">
+                <md-tabs ng-if="vm_cc.configurations.length" md-dynamic-height>
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.SUBJECTS">SUBJECTS</span>
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedSubjects.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.subject = query"
+                            on-collapse="vm_cc.query.subject = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditSubject($event)"
+                            aria-label="add subject"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_SUBJECT"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedSubjects.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedSubjects.length}}
+                            {{vm_cc.selectedSubjects.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedSubjects($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedSubjects"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.ID' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.TYPE' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.CONTENT' | translate }}
+                              </th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="subject"
+                              md-select-id="id"
+                              ng-repeat="subject in vm_cc.subjects | filter: vm_cc.query.subject"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                                class="id"
+                              >
+                                {{subject.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="subject.FieldId"
+                                  >{{subject.nameField ||
+                                  subject.idField}}</span
+                                >
+                                <span ng-if="!subject.FieldId"
+                                  >{{subject.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="subject.type"
+                                ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{subject.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{subject.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{
+                                  vm_cc.variablesById[subject.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{subject.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{subject.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{subject.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[subject.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default
+                                  >{{subject.content}}</span
+                                >
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="INTEGRATIONS.MORE"
+                                    ng-click="$mdOpenMenu($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditSubject($event, subject)"
+                                        translate="INTEGRATIONS.EDIT_SUBJECT"
+                                      >
+                                        Edit Subject
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteSubjectConfirm($event, subject)"
+                                        translate="INTEGRATIONS.DELETE_SUBJECT"
+                                      >
+                                        Delete Subject
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.DESCRIPTIONS"
+                        >DESCRIPTIONS</span
+                      >
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedDescriptions.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.description = query"
+                            on-collapse="vm_cc.query.description = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditDescription($event)"
+                            aria-label="add description"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_DESCRIPTION"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedDescriptions.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedDescriptions.length}}
+                            {{vm_cc.selectedDescriptions.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedDescriptions($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedDescriptions"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.ID' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.TYPE' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.CONTENT' | translate }}
+                              </th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="description"
+                              md-select-id="id"
+                              ng-repeat="description in vm_cc.descriptions | filter: vm_cc.query.description"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                                class="id"
+                              >
+                                {{description.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="description.FieldId"
+                                  >{{description.nameField ||
+                                  description.idField}}</span
+                                >
+                                <span ng-if="!description.FieldId"
+                                  >{{description.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="description.type"
+                                ng-click="vm_cc.createOrEditDescription($event, description)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{description.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{description.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{
+                                  vm_cc.variablesById[description.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{description.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{description.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{description.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[description.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default
+                                  >{{description.content}}</span
+                                >
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="INTEGRATIONS.MORE"
+                                    ng-click="$mdOpenMenu($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditDescription($event, description)"
+                                        translate="INTEGRATIONS.EDIT_DESCRIPTION"
+                                      >
+                                        Edit Description
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteDescriptionConfirm($event, description)"
+                                        translate="INTEGRATIONS.DELETE_DESCRIPTION"
+                                      >
+                                        Delete Description
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.FIELDS">FIELDS</span>
+                    </md-tab-label>
+                    <md-tab-body>
+                      <md-toolbar
+                        class="md-table-toolbar md-default no-padding"
+                        ng-hide="vm_cc.selectedFields.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <div flex></div>
+                          <ms-search-bar
+                            on-search="vm_cc.query.field = query"
+                            on-collapse="vm_cc.query.field = undefined"
+                            debounce="300"
+                          ></ms-search-bar>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canEdit"
+                            class="md-icon-button"
+                            ng-click="vm_cc.createOrEditField($event)"
+                            aria-label="add field"
+                            translate
+                            translate-attr-label="INTEGRATIONS.ADD_FIELD"
+                          >
+                            <md-icon md-font-icon="icon-plus"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-toolbar
+                        class="md-table-toolbar md-accent"
+                        ng-show="vm_cc.selectedFields.length"
+                      >
+                        <div class="md-toolbar-tools">
+                          <span class="md-subhead"
+                            >{{vm_cc.selectedFields.length}}
+                            {{vm_cc.selectedFields.length > 1 ? 'items' :
+                            'item'}} selected</span
+                          >
+                          <div flex></div>
+                          <md-button
+                            ng-if="vm_cc.crudPermissions.canDelete"
+                            class="md-icon-button"
+                            ng-click="vm_cc.deleteSelectedFields($event)"
+                            aria-label="delete selected"
+                            translate
+                            translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+                          >
+                            <md-icon md-font-icon="icon-delete"></md-icon>
+                          </md-button>
+                        </div>
+                      </md-toolbar>
+                      <md-table-container
+                        class="md-whiteframe-1dp padding-horizontal"
+                      >
+                        <table
+                          md-table
+                          md-row-select
+                          multiple
+                          ng-model="vm_cc.selectedFields"
+                        >
+                          <thead md-head>
+                            <tr md-row>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.ID' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.TYPE' | translate }}
+                              </th>
+                              <th md-column>
+                                {{ 'INTEGRATIONS.CONTENT' | translate }}
+                              </th>
+                              <th md-column width="10px"></th>
+                            </tr>
+                          </thead>
+                          <tbody md-body>
+                            <tr
+                              md-row
+                              md-select="field"
+                              md-select-id="id"
+                              ng-repeat="field in vm_cc.fields | filter: vm_cc.query.field"
+                            >
+                              <td
+                                ng-click="vm_cc.createOrEditField($event, field)"
+                                md-cell
+                                class="id"
+                              >
+                                {{field.id}}
+                              </td>
+                              <td
+                                ng-click="vm_cc.createOrEditField($event, field)"
+                                md-cell
+                                class="type"
+                              >
+                                <span ng-if="field.FieldId"
+                                  >{{field.nameField || field.idField}}</span
+                                >
+                                <span ng-if="!field.FieldId"
+                                  >{{field.type}}</span
+                                >
+                              </td>
+                              <td
+                                ng-switch="field.type"
+                                ng-click="vm_cc.createOrEditField($event, field)"
+                                md-cell
+                              >
+                                <span ng-switch-when="string"
+                                  >{{field.content}}</span
+                                >
+                                <span
+                                  ng-switch-when="variable"
+                                  class="text-boxed"
+                                  >{{field.variableName}}</span
+                                >
+                                <span
+                                  ng-switch-when="customVariable"
+                                  class="text-boxed"
+                                  >{{ vm_cc.variablesById[field.VariableId].name
+                                  }}</span
+                                >
+                                <span ng-switch-when="keyValue">
+                                  {{field.key}}
+                                  <span ng-switch="description.keyType">
+                                    <span ng-switch-when="string"
+                                      >{{field.keyContent}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="variable"
+                                      class="text-boxed"
+                                      >{{field.variableName}}</span
+                                    >
+                                    <span
+                                      ng-switch-when="customVariable"
+                                      class="text-boxed"
+                                      >{{
+                                      vm_cc.variablesById[field.VariableId].name
+                                      }}</span
+                                    >
+                                  </span>
+                                </span>
+                                <span ng-switch-default>{{field.content}}</span>
+                              </td>
+                              <td
+                                md-cell
+                                class="actions"
+                                ng-if="!vm_cc.crudPermissions.readOnly"
+                              >
+                                <md-menu>
+                                  <md-button
+                                    class="md-icon-button"
+                                    aria-label="More"
+                                    translate
+                                    translate-attr-aria-label="INTEGRATIONS.MORE"
+                                    ng-click="$mdOpenMenu($event)"
+                                  >
+                                    <md-icon
+                                      md-font-icon="icon-dots-vertical"
+                                    ></md-icon>
+                                  </md-button>
+
+                                  <md-menu-content width="3">
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canEdit"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.createOrEditField($event, field)"
+                                        translate="INTEGRATIONS.EDIT_FIELD"
+                                      >
+                                        Edit Field
+                                      </md-button>
+                                    </md-menu-item>
+                                    <md-menu-item
+                                      ng-if="vm_cc.crudPermissions.canDelete"
+                                    >
+                                      <md-button
+                                        ng-click="vm_cc.deleteFieldConfirm($event, field)"
+                                        translate="INTEGRATIONS.DELETE_FIELD"
+                                      >
+                                        Delete Field
+                                      </md-button>
+                                    </md-menu-item>
+                                  </md-menu-content>
+                                </md-menu>
+                              </td>
+                            </tr>
+                          </tbody>
+                        </table>
+                      </md-table-container>
+                    </md-tab-body>
+                  </md-tab>
+
+                  <md-tab>
+                    <md-tab-label>
+                      <span translate="INTEGRATIONS.ADVANCED">ADVANCED</span>
+                    </md-tab-label>
+                    <md-tab-body>
+                      <div layout-margin>
+                        <label translate="INTEGRATIONS.MODULE_SEARCH"></label>
+                        <md-select
+                          ng-model="vm_cc.zohoConfiguration.moduleSearch"
+                          ng-change="vm_cc.selectChangedAdvanced()"
+                          ng-disabled="!vm_cc.crudPermissions.canEdit"
+                        >
+                          <md-option
+                            ng-value="option.key"
+                            ng-repeat="option in [{key: 'contact_lead', value: 'Contact & Lead'}, {key: 'contact', value: 'Contact'}, {key: 'lead', value: 'Lead'}]"
+                            >{{ option.value }}</md-option
+                          >
+                        </md-select>
+                      </div>
+                      <div layout-margin>
+                        <label translate="INTEGRATIONS.MODULE_CREATE"></label>
+                        <md-select
+                          ng-model="vm_cc.zohoConfiguration.moduleCreate"
+                          ng-change="vm_cc.selectChangedAdvanced()"
+                          ng-disabled="!vm_cc.crudPermissions.canEdit"
+                        >
+                          <md-option
+                            ng-value="option.key"
+                            ng-repeat="option in [{key: 'nothing', value: 'Nothing'}, {key: 'contact', value: 'Contact'}, {key: 'lead', value: 'Lead'}]"
+                            >{{ option.value }}</md-option
+                          >
+                        </md-select>
+                      </div>
+                    </md-tab-body>
+                  </md-tab>
+                </md-tabs>
+                <div
+                  class="padding-20"
+                  ng-if="!vm_cc.configurations.length && vm_cc.crudPermissions.canEdit"
+                  ng-click="vm_cc.createOrEditZohoConfiguration($event)"
+                  layout="row"
+                  layout-sm="column"
+                  layout-align="center center"
+                  layout-wrap
+                >
+                  <div
+                    class="padding-20 md-whiteframe-3dp md-accent-bg"
+                    layout="column"
+                    layout-align="center center"
+                  >
+                    <md-button class="md-icon-button">
+                      <md-icon md-font-icon="icon-plus"></md-icon>
+                    </md-button>
+                    <span
+                      aria-label="add configuration"
+                      translate
+                      translate-attr-label="INTEGRATIONS.ADD_CONFIGURATION"
+                      >ADD CONFIGURATION</span
+                    >
+                  </div>
+                </div>
+              </md-card>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/zohoAccounts/zohoAccounts.html/zohoAccounts-[chunkhash].html b/public/src/js/modules/main/apps/integrations/views/zohoAccounts/zohoAccounts.html/zohoAccounts-[chunkhash].html
deleted file mode 100644
index 8157f06..0000000
--- a/public/src/js/modules/main/apps/integrations/views/zohoAccounts/zohoAccounts.html/zohoAccounts-[chunkhash].html
+++ /dev/null
@@ -1,320 +0,0 @@
-<div
-  id="zohoAccounts"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-heart" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="INTEGRATIONS.ZOHOACCOUNTS"
-          >ZohoAccounts</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="INTEGRATIONS.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedZohoAccounts.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedZohoAccounts =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="INTEGRATIONS.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-zohoAccounts-count">
-          <span>{{vm.selectedZohoAccounts.length}}</span>
-          <span translate="INTEGRATIONS.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="INTEGRATIONS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllZohoAccounts()"
-                translate="INTEGRATIONS.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectZohoAccounts()"
-                translate="INTEGRATIONS.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedZohoAccounts"
-          csv-label="true"
-          filename="zohoAccounts.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedZohoAccounts($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- ZOHOACCOUNT TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedZohoAccounts"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getZohoAccounts"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">
-                  {{ 'INTEGRATIONS.ID' | translate }}
-                </th>
-                <th md-column md-order-by="name">
-                  {{ 'INTEGRATIONS.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="host">
-                  {{ 'INTEGRATIONS.HOST' | translate }}
-                </th>
-                <th md-column md-order-by="zone">
-                  {{ 'INTEGRATIONS.ZONE' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.zohoAccounts.rows.length">
-                <td md-cell colspan="5">
-                  <div layout="row" layout-align="center center">
-                    <span translate="INTEGRATIONS.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="zohoAccount"
-                md-select-id="id"
-                ng-repeat="zohoAccount in vm.zohoAccounts.rows"
-              >
-                <td md-cell ng-if="zohoAccount.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{zohoAccount.name}}"
-                    ng-src="api/users/{{zohoAccount.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!zohoAccount.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{zohoAccount.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(zohoAccount, ev) : vm.createOrEditZohoAccount($event, zohoAccount)"
-                  md-cell
-                  class="id"
-                >
-                  {{zohoAccount.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(zohoAccount, ev) : vm.createOrEditZohoAccount($event, zohoAccount)"
-                  md-cell
-                  class="name"
-                >
-                  {{zohoAccount.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(zohoAccount, ev) : vm.createOrEditZohoAccount($event, zohoAccount)"
-                  md-cell
-                  class="host"
-                >
-                  {{ vm.arrayhost[zohoAccount.host].option }}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(zohoAccount, ev) : vm.createOrEditZohoAccount($event, zohoAccount)"
-                  md-cell
-                  class="zone"
-                >
-                  {{ vm.arrayzone[zohoAccount.zone].option }}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="INTEGRATIONS.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(zohoAccount, $event    )"
-                          translate="INTEGRATIONS.EDIT_ZOHOACCOUNT"
-                        >
-                          Edit ZohoAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.testtestintegrationaccount(zohoAccount, $event    )"
-                          translate="INTEGRATIONS.TEST_ZOHOACCOUNT"
-                        >
-                          Test ZohoAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(zohoAccount, $event    )"
-                          translate="INTEGRATIONS.DELETE_ZOHOACCOUNT"
-                        >
-                          Delete ZohoAccount
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'INTEGRATIONS.PAGE' | translate}}:', rowsPerPage: '{{'INTEGRATIONS.ROWSPERPAGE' | translate}}:', of: '{{'INTEGRATIONS.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.zohoAccounts.count}}"
-          md-on-paginate="vm.getZohoAccounts"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / ZOHOACCOUNT TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD ZOHOACCOUNT BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-zohoAccount-button"
-    ng-click="vm.createOrEditZohoAccount($event)"
-    aria-label="add zohoAccount"
-    translate
-    translate-attr-aria-label="INTEGRATIONS.ADD_ZOHOACCOUNT"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD ZOHOACCOUNT BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/integrations/views/zohoAccounts/zohoAccounts.html/zohoAccounts.html b/public/src/js/modules/main/apps/integrations/views/zohoAccounts/zohoAccounts.html/zohoAccounts.html
new file mode 100644
index 0000000..8157f06
--- /dev/null
+++ b/public/src/js/modules/main/apps/integrations/views/zohoAccounts/zohoAccounts.html/zohoAccounts.html
@@ -0,0 +1,320 @@
+<div
+  id="zohoAccounts"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-heart" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="INTEGRATIONS.ZOHOACCOUNTS"
+          >ZohoAccounts</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="INTEGRATIONS.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedZohoAccounts.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedZohoAccounts =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="INTEGRATIONS.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-zohoAccounts-count">
+          <span>{{vm.selectedZohoAccounts.length}}</span>
+          <span translate="INTEGRATIONS.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="INTEGRATIONS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllZohoAccounts()"
+                translate="INTEGRATIONS.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectZohoAccounts()"
+                translate="INTEGRATIONS.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedZohoAccounts"
+          csv-label="true"
+          filename="zohoAccounts.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedZohoAccounts($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="INTEGRATIONS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- ZOHOACCOUNT TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedZohoAccounts"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getZohoAccounts"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">
+                  {{ 'INTEGRATIONS.ID' | translate }}
+                </th>
+                <th md-column md-order-by="name">
+                  {{ 'INTEGRATIONS.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="host">
+                  {{ 'INTEGRATIONS.HOST' | translate }}
+                </th>
+                <th md-column md-order-by="zone">
+                  {{ 'INTEGRATIONS.ZONE' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.zohoAccounts.rows.length">
+                <td md-cell colspan="5">
+                  <div layout="row" layout-align="center center">
+                    <span translate="INTEGRATIONS.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="zohoAccount"
+                md-select-id="id"
+                ng-repeat="zohoAccount in vm.zohoAccounts.rows"
+              >
+                <td md-cell ng-if="zohoAccount.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{zohoAccount.name}}"
+                    ng-src="api/users/{{zohoAccount.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!zohoAccount.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{zohoAccount.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(zohoAccount, ev) : vm.createOrEditZohoAccount($event, zohoAccount)"
+                  md-cell
+                  class="id"
+                >
+                  {{zohoAccount.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(zohoAccount, ev) : vm.createOrEditZohoAccount($event, zohoAccount)"
+                  md-cell
+                  class="name"
+                >
+                  {{zohoAccount.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(zohoAccount, ev) : vm.createOrEditZohoAccount($event, zohoAccount)"
+                  md-cell
+                  class="host"
+                >
+                  {{ vm.arrayhost[zohoAccount.host].option }}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(zohoAccount, ev) : vm.createOrEditZohoAccount($event, zohoAccount)"
+                  md-cell
+                  class="zone"
+                >
+                  {{ vm.arrayzone[zohoAccount.zone].option }}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="INTEGRATIONS.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(zohoAccount, $event    )"
+                          translate="INTEGRATIONS.EDIT_ZOHOACCOUNT"
+                        >
+                          Edit ZohoAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.testtestintegrationaccount(zohoAccount, $event    )"
+                          translate="INTEGRATIONS.TEST_ZOHOACCOUNT"
+                        >
+                          Test ZohoAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(zohoAccount, $event    )"
+                          translate="INTEGRATIONS.DELETE_ZOHOACCOUNT"
+                        >
+                          Delete ZohoAccount
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'INTEGRATIONS.PAGE' | translate}}:', rowsPerPage: '{{'INTEGRATIONS.ROWSPERPAGE' | translate}}:', of: '{{'INTEGRATIONS.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.zohoAccounts.count}}"
+          md-on-paginate="vm.getZohoAccounts"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / ZOHOACCOUNT TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD ZOHOACCOUNT BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-zohoAccount-button"
+    ng-click="vm.createOrEditZohoAccount($event)"
+    aria-label="add zohoAccount"
+    translate
+    translate-attr-aria-label="INTEGRATIONS.ADD_ZOHOACCOUNT"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD ZOHOACCOUNT BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/jscripty/views/projects/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/jscripty/views/projects/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index c63fccb..0000000
--- a/public/src/js/modules/main/apps/jscripty/views/projects/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,164 +0,0 @@
-<md-dialog class="project-dialog" aria-label="New Project">
-  <form name="projectForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="JSCRIPTY.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.project.name"
-          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.newProject"
-        />
-
-        <div class="hint"><span translate="JSCRIPTY.HELP.NAME"></span></div>
-        <div
-          ng-messages="projectForm['name'].$error"
-          ng-show="projectForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="JSCRIPTY.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span
-              translate="JSCRIPTY.ERRORS.NAME_MUST_VALID_PATTERN"
-              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-              >Name must be valid pattern
-            </span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="JSCRIPTY.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.project.description"
-        />
-
-        <div
-          ng-messages="projectForm['description'].$error"
-          ng-show="projectForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="JSCRIPTY.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newProject"
-          ng-click="vm.saveProject()"
-          class="send-button md-accent md-raised"
-          ng-disabled="projectForm.$invalid || projectForm.$pristine"
-          aria-label="SAVE"
-          translate="JSCRIPTY.SAVE"
-          translate-attr-aria-label="JSCRIPTY.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newProject"
-          ng-click="vm.addNewProject()"
-          class="send-button md-accent md-raised"
-          ng-disabled="projectForm.$invalid"
-          aria-label="ADD"
-          translate="JSCRIPTY.ADD_PROJECT"
-          translate-attr-aria-label="JSCRIPTY.ADD_PROJECT"
-        >
-          ADD PROJECT
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newProject"
-          ng-click="vm.deleteProject($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="JSCRIPTY.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="JSCRIPTY.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/jscripty/views/projects/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/jscripty/views/projects/create/dialog.html/dialog.html
new file mode 100644
index 0000000..c63fccb
--- /dev/null
+++ b/public/src/js/modules/main/apps/jscripty/views/projects/create/dialog.html/dialog.html
@@ -0,0 +1,164 @@
+<md-dialog class="project-dialog" aria-label="New Project">
+  <form name="projectForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="JSCRIPTY.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.project.name"
+          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.newProject"
+        />
+
+        <div class="hint"><span translate="JSCRIPTY.HELP.NAME"></span></div>
+        <div
+          ng-messages="projectForm['name'].$error"
+          ng-show="projectForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="JSCRIPTY.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span
+              translate="JSCRIPTY.ERRORS.NAME_MUST_VALID_PATTERN"
+              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+              >Name must be valid pattern
+            </span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="JSCRIPTY.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.project.description"
+        />
+
+        <div
+          ng-messages="projectForm['description'].$error"
+          ng-show="projectForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="JSCRIPTY.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newProject"
+          ng-click="vm.saveProject()"
+          class="send-button md-accent md-raised"
+          ng-disabled="projectForm.$invalid || projectForm.$pristine"
+          aria-label="SAVE"
+          translate="JSCRIPTY.SAVE"
+          translate-attr-aria-label="JSCRIPTY.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newProject"
+          ng-click="vm.addNewProject()"
+          class="send-button md-accent md-raised"
+          ng-disabled="projectForm.$invalid"
+          aria-label="ADD"
+          translate="JSCRIPTY.ADD_PROJECT"
+          translate-attr-aria-label="JSCRIPTY.ADD_PROJECT"
+        >
+          ADD PROJECT
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newProject"
+          ng-click="vm.deleteProject($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="JSCRIPTY.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="JSCRIPTY.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/jscripty/views/projects/edit/clone/clone.html/clone-[chunkhash].html b/public/src/js/modules/main/apps/jscripty/views/projects/edit/clone/clone.html/clone-[chunkhash].html
deleted file mode 100644
index f7eff7f..0000000
--- a/public/src/js/modules/main/apps/jscripty/views/projects/edit/clone/clone.html/clone-[chunkhash].html
+++ /dev/null
@@ -1,109 +0,0 @@
-<md-dialog class="project-dialog" aria-label="Clone Project">
-  <form name="projectForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="JSCRIPTY.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.project.name"
-          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.newProject"
-        />
-
-        <div class="hint"><span translate="JSCRIPTY.HELP.NAME"></span></div>
-        <div
-          ng-messages="projectForm['name'].$error"
-          ng-show="projectForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="JSCRIPTY.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span
-              translate="JSCRIPTY.ERRORS.NAME_MUST_VALID_PATTERN"
-              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-              >Name must be valid pattern
-            </span>
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <md-button
-        type="submit"
-        ng-click="vm.cloneProject()"
-        class="send-button md-accent md-raised"
-        ng-disabled="projectForm.$invalid"
-        aria-label="CLONE"
-        translate="JSCRIPTY.CLONE_PROJECT"
-        translate-attr-aria-label="JSCRIPTY.CLONE_PROJECT"
-      >
-        CLONE PROJECT
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/jscripty/views/projects/edit/clone/clone.html/clone.html b/public/src/js/modules/main/apps/jscripty/views/projects/edit/clone/clone.html/clone.html
new file mode 100644
index 0000000..f7eff7f
--- /dev/null
+++ b/public/src/js/modules/main/apps/jscripty/views/projects/edit/clone/clone.html/clone.html
@@ -0,0 +1,109 @@
+<md-dialog class="project-dialog" aria-label="Clone Project">
+  <form name="projectForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="JSCRIPTY.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.project.name"
+          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.newProject"
+        />
+
+        <div class="hint"><span translate="JSCRIPTY.HELP.NAME"></span></div>
+        <div
+          ng-messages="projectForm['name'].$error"
+          ng-show="projectForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="JSCRIPTY.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span
+              translate="JSCRIPTY.ERRORS.NAME_MUST_VALID_PATTERN"
+              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+              >Name must be valid pattern
+            </span>
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <md-button
+        type="submit"
+        ng-click="vm.cloneProject()"
+        class="send-button md-accent md-raised"
+        ng-disabled="projectForm.$invalid"
+        aria-label="CLONE"
+        translate="JSCRIPTY.CLONE_PROJECT"
+        translate-attr-aria-label="JSCRIPTY.CLONE_PROJECT"
+      >
+        CLONE PROJECT
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/jscripty/views/projects/edit/sessions/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/jscripty/views/projects/edit/sessions/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 5d9c046..0000000
--- a/public/src/js/modules/main/apps/jscripty/views/projects/edit/sessions/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,76 +0,0 @@
-<md-dialog class="session-dialog" aria-label="New Session">
-  <form name="sessionForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <md-list>
-        <md-subheader class="md-no-sticky">
-          <div class="margin-bottom-5">
-            <span translate="JSCRIPTY.ANSWERS">Answers</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span
-              translate="JSCRIPTY.STARTTIME"
-              class="ng-scope font-weight-700"
-              >Start Time</span
-            >:
-            <span class="ng-binding"
-              >{{vm.session.starttime | date:'medium'}}</span
-            >
-          </div>
-          <div class="subtitle secondary-text">
-            <span
-              translate="JSCRIPTY.MEMBERNAME"
-              class="ng-scope font-weight-700"
-              >Member Name</span
-            >: <span class="ng-binding">{{vm.session.membername}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="JSCRIPTY.PROJECT" class="ng-scope font-weight-700"
-              >Project</span
-            >: <span class="ng-binding">{{vm.project.name}}</span>
-          </div>
-        </md-subheader>
-        <md-list-item
-          ng-if="vm.questions.rows.length"
-          class="md-2-line contact-item"
-          ng-repeat="question in vm.questions.rows"
-        >
-          <div class="md-list-item-text compact">
-            <h3>{{$index+1}}. {{question.question}}</h3>
-            <p>{{question.answer}}</p>
-          </div>
-          <md-divider ng-if="!$last"></md-divider>
-        </md-list-item>
-        <md-list-item
-          ng-if="!vm.questions.rows.length"
-          class="md-2-line contact-item"
-        >
-          <div class="md-list-item-text compact">
-            <h3>
-              <span
-                class="text-boxed-light"
-                translate="JSCRIPTY.NO_RESULTS_AVAILABLE"
-                >No results available</span
-              >
-            </h3>
-          </div>
-        </md-list-item>
-      </md-list>
-    </md-dialog-content>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/jscripty/views/projects/edit/sessions/dialog.html/dialog.html b/public/src/js/modules/main/apps/jscripty/views/projects/edit/sessions/dialog.html/dialog.html
new file mode 100644
index 0000000..5d9c046
--- /dev/null
+++ b/public/src/js/modules/main/apps/jscripty/views/projects/edit/sessions/dialog.html/dialog.html
@@ -0,0 +1,76 @@
+<md-dialog class="session-dialog" aria-label="New Session">
+  <form name="sessionForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <md-list>
+        <md-subheader class="md-no-sticky">
+          <div class="margin-bottom-5">
+            <span translate="JSCRIPTY.ANSWERS">Answers</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span
+              translate="JSCRIPTY.STARTTIME"
+              class="ng-scope font-weight-700"
+              >Start Time</span
+            >:
+            <span class="ng-binding"
+              >{{vm.session.starttime | date:'medium'}}</span
+            >
+          </div>
+          <div class="subtitle secondary-text">
+            <span
+              translate="JSCRIPTY.MEMBERNAME"
+              class="ng-scope font-weight-700"
+              >Member Name</span
+            >: <span class="ng-binding">{{vm.session.membername}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="JSCRIPTY.PROJECT" class="ng-scope font-weight-700"
+              >Project</span
+            >: <span class="ng-binding">{{vm.project.name}}</span>
+          </div>
+        </md-subheader>
+        <md-list-item
+          ng-if="vm.questions.rows.length"
+          class="md-2-line contact-item"
+          ng-repeat="question in vm.questions.rows"
+        >
+          <div class="md-list-item-text compact">
+            <h3>{{$index+1}}. {{question.question}}</h3>
+            <p>{{question.answer}}</p>
+          </div>
+          <md-divider ng-if="!$last"></md-divider>
+        </md-list-item>
+        <md-list-item
+          ng-if="!vm.questions.rows.length"
+          class="md-2-line contact-item"
+        >
+          <div class="md-list-item-text compact">
+            <h3>
+              <span
+                class="text-boxed-light"
+                translate="JSCRIPTY.NO_RESULTS_AVAILABLE"
+                >No results available</span
+              >
+            </h3>
+          </div>
+        </md-list-item>
+      </md-list>
+    </md-dialog-content>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/jscripty/views/projects/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/jscripty/views/projects/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index 9636be3..0000000
--- a/public/src/js/modules/main/apps/jscripty/views/projects/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,509 +0,0 @@
-<div id="jscripty-project" class="page-layout simple tabbed" layout="column">
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-projects-button md-icon-button"
-        aria-label="Go to projects"
-        ng-click="vm.gotoProjects()"
-        translate
-        translate-attr-aria-label="JSCRIPTY.GO_TO_PROJECTS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="project-image" hide-xs>
-          <img ng-src="assets/images/business/projects.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.project.id}}
-            <span ng-if="vm.project.name">{{vm.project.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="JSCRIPTY.CREATED_AT"></span>
-            <span>{{vm.project.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div ng-cloak ng-if="vm.crudPermissions.canEdit">
-      <md-button
-        ng-click="vm.clonedialog(vm.project, $event)"
-        class="md-fab md-green-500-bg md-icon-button"
-        aria-label="clone"
-      >
-        <md-tooltip
-          ><span translate="JSCRIPTY.CLONE_PROJECT"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-content-duplicate"></md-icon>
-      </md-button>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveProject()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (builderForm.$invalid) || (previewForm.$invalid) || (sessionsForm.$invalid) || (answersForm.$invalid)"
-        translate="JSCRIPTY.SAVE"
-        translate-attr-aria-label="JSCRIPTY.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="JSCRIPTY.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="project-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="JSCRIPTY.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="JSCRIPTY.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.project.name"
-                  ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-                  ng-required="true"
-                  autofocus
-                  disabled
-                />
-
-                <div class="hint">
-                  <span translate="JSCRIPTY.HELP.NAME"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="JSCRIPTY.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                  <div ng-message="pattern">
-                    <span
-                      translate="JSCRIPTY.ERRORS.NAME_MUST_VALID_PATTERN"
-                      translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-                      >Name must be valid pattern
-                    </span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.project.enableUncompleteSave"
-                  aria-label="EnableUncompleteSave"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="JSCRIPTY.ENABLEUNCOMPLETESAVE"
-                    >EnableUncompleteSave</span
-                  ></md-switch
-                >
-
-                <div class="hint">
-                  <span translate="JSCRIPTY.HELP.ENABLEUNCOMPLETESAVE"></span>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.project.sendUnpauseOnSubmit"
-                  aria-label="SendUnpauseOnSubmit"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="JSCRIPTY.SENDUNPAUSEONSUBMIT"
-                    >SendUnpauseOnSubmit</span
-                  ></md-switch
-                >
-
-                <div class="hint">
-                  <span translate="JSCRIPTY.HELP.SENDUNPAUSEONSUBMIT"></span>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="JSCRIPTY.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.project.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="JSCRIPTY.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="JSCRIPTY.BUILDER">BUILDER</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="project-detail-form-container builder md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="ProjectBuilderController as vm_bc"
-              ng-init="vm_bc.init(vm.project)"
-            >
-              <mw-form-builder
-                ng-if="vm_bc.project.formData"
-                form-data="vm_bc.project.formData"
-                options="vm_bc.optionsBuilder"
-                read-only="false"
-              ></mw-form-builder>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="JSCRIPTY.PREVIEW">PREVIEW</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="project-detail-form-container preview md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              layout="column"
-              layout-align="center"
-              ng-controller="ProjectViewerController as vm_vc"
-              ng-init="vm_vc.init(vm.project)"
-            >
-              <div layout="row" layout-align="center">
-                <md-button
-                  class="md-raised md-accent"
-                  aria-label="Reset"
-                  ng-click="vm_vc.resetViewer()"
-                >
-                  Reset
-                </md-button>
-              </div>
-              <mw-form-viewer
-                ng-if="vm_vc.project.formData"
-                form-data="vm_vc.project.formData"
-                response-data="vm_vc.responseData"
-                on-submit="vm_vc.onSubmit($event)"
-                api="vm_vc.formViewer"
-              ></mw-form-viewer>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="JSCRIPTY.SESSIONS">SESSIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="project-detail-form-container sessions md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="ProjectSessionsController as vm_dc"
-              ng-init="vm_dc.init(vm.project, vm.crudPermissions)"
-            >
-              <md-toolbar
-                class="md-table-toolbar md-default"
-                ng-hide="vm_dc.selectedProjectSessions.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead" translate="JSCRIPTY.SESSIONS"
-                    >Sessions</span
-                  >
-                  <ms-search-bar
-                    on-search="vm_dc.query.filter = query"
-                    on-collapse="vm_dc.query.filter = undefined"
-                    debounce="300"
-                    direction="down"
-                  ></ms-search-bar>
-                  <div flex></div>
-                </div>
-              </md-toolbar>
-              <md-toolbar
-                class="md-table-toolbar md-accent"
-                ng-show="vm_dc.selectedProjectSessions.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead"
-                    >{{vm_dc.selectedProjectSessions.length}}
-                    {{vm_dc.selectedProjectSessions.length > 1 ? 'items' :
-                    'item'}} selected</span
-                  >
-                  <div flex></div>
-                  <button
-                    class="md-icon-button"
-                    ng-csv="vm_dc.exportSelectedProjectSessions"
-                    csv-label="true"
-                    filename="projects.csv"
-                  >
-                    <md-icon md-font-icon="icon-file-excel"></md-icon>
-                  </button>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canDelete"
-                    class="md-icon-button"
-                    ng-click="vm_dc.deleteSelectedProjectSessions($event)"
-                    aria-label="delete selected"
-                    translate
-                    translate-attr-label="JSCRIPTY.DELETE_SELECTED"
-                  >
-                    <md-icon md-font-icon="icon-delete"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-table-container class="font-size-12">
-                <table
-                  md-table
-                  md-row-select
-                  multiple
-                  ng-model="vm_dc.selectedProjectSessions"
-                  md-progress="vm_dc.promise"
-                >
-                  <thead
-                    md-head
-                    md-order="vm_dc.query.sort"
-                    md-on-reorder="vm_dc.getProjectSessions"
-                  >
-                    <tr md-row>
-                      <th md-column md-order-by="id">
-                        {{ 'JSCRIPTY.ID' | translate }}
-                      </th>
-                      <th md-column md-order-by="starttime">
-                        {{ 'JSCRIPTY.STARTTIME' | translate }}
-                      </th>
-                      <th md-column md-order-by="endtime">
-                        {{ 'JSCRIPTY.ENDTIME' | translate }}
-                      </th>
-                      <th md-column md-order-by="membername">
-                        {{ 'JSCRIPTY.MEMBERNAME' | translate }}
-                      </th>
-                      <th md-column md-order-by="calleridnum">
-                        {{ 'JSCRIPTY.CALLERIDNUM' | translate }}
-                      </th>
-                      <th md-column md-order-by="completed">
-                        {{ 'JSCRIPTY.COMPLETE' | translate }}
-                      </th>
-                      <th md-column width="10px"></th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr
-                      md-row
-                      md-select="session"
-                      md-select-id="id"
-                      ng-repeat="session in vm_dc.projectSessions.rows"
-                    >
-                      <td md-cell>{{session.id}}</td>
-                      <td md-cell>{{ session.starttime | formatdate }}</td>
-                      <td md-cell>{{ session.endtime | formatdate }}</td>
-                      <td md-cell>{{session.membername}}</td>
-                      <td md-cell>{{session.calleridnum}}</td>
-                      <td md-cell class="completed">
-                        <md-icon
-                          md-colors="{color: {{session.completed ? '\'green\'' : '\'grey\''}}}"
-                          md-font-icon="{{session.completed? 'icon-check' : 'icon-close'}}"
-                        ></md-icon>
-                      </td>
-                      <td md-cell class="actions">
-                        <md-menu>
-                          <md-button
-                            class="md-icon-button"
-                            aria-label="More"
-                            translate
-                            translate-attr-aria-label="JSCRIPTY.MORE"
-                            ng-click="$mdOpenMenu($event)"
-                          >
-                            <md-icon
-                              md-font-icon="icon-dots-vertical"
-                            ></md-icon>
-                          </md-button>
-
-                          <md-menu-content width="3">
-                            <md-menu-item>
-                              <md-button
-                                ng-click="vm_dc.showQuestionsProjectSession($event, session)"
-                                translate="JSCRIPTY.SHOW_QUESTIONS_SESSION"
-                              >
-                                Results Session
-                              </md-button>
-                            </md-menu-item>
-                            <md-menu-item
-                              ng-if="vm_dc.crudPermissions.canDelete"
-                            >
-                              <md-button
-                                ng-click="vm_dc.deleteConfirm(session, $event)"
-                                translate="JSCRIPTY.DELETE_SESSION"
-                              >
-                                Delete Session
-                              </md-button>
-                            </md-menu-item>
-                          </md-menu-content>
-                        </md-menu>
-                      </td>
-                    </tr>
-                    <tr md-row ng-if="!vm_dc.projectSessions.rows.length">
-                      <td md-cell colspan="8">
-                        <div layout="row" layout-align="center center">
-                          <span
-                            class="text-boxed-light"
-                            translate="JSCRIPTY.NO_SESSION_AVAILABLE"
-                            >No session available</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-              <md-table-pagination
-                md-label="{page: '{{'JSCRIPTY.PAGE' | translate}}:', rowsPerPage: '{{'JSCRIPTY.ROWSPERPAGE' | translate}}:', of: '{{'JSCRIPTY.OF' | translate}}'}"
-                md-limit="vm_dc.query.limit"
-                md-limit-options="[10, 15, 20, 50, 100, 250]"
-                md-page="vm_dc.query.page"
-                md-total="{{vm_dc.projectSessions.count}}"
-                md-on-paginate="vm_dc.getProjectSessions"
-                md-page-select
-              ></md-table-pagination>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="JSCRIPTY.ANSWERS">ANSWERS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="project-detail-form-container answers md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="ProjectAnswersController as vm_an"
-              ng-init="vm_an.init(vm.project)"
-            >
-              <div
-                class="pb-16"
-                layout="row"
-                layout-align="space-between center"
-              >
-                <div class="h2 secondary-text" translate="JSCRIPTY.ANSWERS">
-                  Answers
-                </div>
-                <md-date-range
-                  localization-map="vm_an.localizationMap"
-                  ng-model="vm_an.pickerModel"
-                  auto-confirm="true"
-                  show-template="true"
-                  md-on-select="vm_an.getAnswers()"
-                  placeholder="{{ 'DASHBOARDS.ALL' | translate }}"
-                ></md-date-range>
-                <md-button
-                  type="button"
-                  ng-disabled="!vm_an.answers"
-                  ng-click="vm_an.getSummary($event)"
-                  class="md-accent md-raised md-button ng-scope md-default-theme md-ink-ripple md-green-500-bg md-icon-button"
-                  title="{{'JSCRIPTY.EXPORT_TO_CSV' | translate}}"
-                >
-                  <md-icon
-                    md-font-icon="icon-file-excel"
-                    class="md-default-theme md-font material-icons icon-file-excel"
-                  ></md-icon>
-                </md-button>
-              </div>
-              <div layout="row">
-                <md-card
-                  class="md-whiteframe-1dp"
-                  ng-if="vm_an.answers && vm_an.hasIdAnswers"
-                  flex
-                >
-                  <md-list>
-                    <md-list-item
-                      class="md-2-line contact-item"
-                      ng-repeat="(key, question) in vm_an.answers"
-                    >
-                      <div class="md-list-item-text compact" layout-padding>
-                        <h3>{{question.question}}</h3>
-                        <md-table-container>
-                          <table md-table>
-                            <thead md-head>
-                              <tr md-row>
-                                <th md-column></th>
-                                <th md-column>#</th>
-                                <th md-column>%</th>
-                              </tr>
-                            </thead>
-                            <tbody md-body>
-                              <tr
-                                md-row
-                                ng-repeat="(key, value) in question.answers"
-                              >
-                                <td md-cell>{{key}}</td>
-                                <td md-cell width="20px">{{value}}</td>
-                                <td md-cell width="20px">
-                                  {{value*100/question.sum | number:1}}
-                                </td>
-                              </tr>
-                              <tr md-row>
-                                <td md-cell>
-                                  <b>{{'JSCRIPTY.TOTAL' | translate}}</b>
-                                </td>
-                                <td md-cell width="20px">
-                                  <b>{{question.sum}}</b>
-                                </td>
-                                <td md-cell width="20px"><b>100</b></td>
-                              </tr>
-                            </tbody>
-                          </table>
-                        </md-table-container>
-                      </div>
-                      <md-divider ng-if="!$last"></md-divider>
-                    </md-list-item>
-                  </md-list>
-                </md-card>
-                <span
-                  ng-if="!vm_an.answers || !vm_an.hasIdAnswers"
-                  class="text-boxed-light"
-                  translate="JSCRIPTY.NO_ANSWERS_AVAILABLE"
-                  >No answers available</span
-                >
-              </div>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/jscripty/views/projects/edit/view.html/view.html b/public/src/js/modules/main/apps/jscripty/views/projects/edit/view.html/view.html
new file mode 100644
index 0000000..9636be3
--- /dev/null
+++ b/public/src/js/modules/main/apps/jscripty/views/projects/edit/view.html/view.html
@@ -0,0 +1,509 @@
+<div id="jscripty-project" class="page-layout simple tabbed" layout="column">
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-projects-button md-icon-button"
+        aria-label="Go to projects"
+        ng-click="vm.gotoProjects()"
+        translate
+        translate-attr-aria-label="JSCRIPTY.GO_TO_PROJECTS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="project-image" hide-xs>
+          <img ng-src="assets/images/business/projects.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.project.id}}
+            <span ng-if="vm.project.name">{{vm.project.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="JSCRIPTY.CREATED_AT"></span>
+            <span>{{vm.project.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div ng-cloak ng-if="vm.crudPermissions.canEdit">
+      <md-button
+        ng-click="vm.clonedialog(vm.project, $event)"
+        class="md-fab md-green-500-bg md-icon-button"
+        aria-label="clone"
+      >
+        <md-tooltip
+          ><span translate="JSCRIPTY.CLONE_PROJECT"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-content-duplicate"></md-icon>
+      </md-button>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveProject()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (builderForm.$invalid) || (previewForm.$invalid) || (sessionsForm.$invalid) || (answersForm.$invalid)"
+        translate="JSCRIPTY.SAVE"
+        translate-attr-aria-label="JSCRIPTY.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="JSCRIPTY.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="project-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="JSCRIPTY.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="JSCRIPTY.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.project.name"
+                  ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+                  ng-required="true"
+                  autofocus
+                  disabled
+                />
+
+                <div class="hint">
+                  <span translate="JSCRIPTY.HELP.NAME"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="JSCRIPTY.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                  <div ng-message="pattern">
+                    <span
+                      translate="JSCRIPTY.ERRORS.NAME_MUST_VALID_PATTERN"
+                      translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+                      >Name must be valid pattern
+                    </span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.project.enableUncompleteSave"
+                  aria-label="EnableUncompleteSave"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="JSCRIPTY.ENABLEUNCOMPLETESAVE"
+                    >EnableUncompleteSave</span
+                  ></md-switch
+                >
+
+                <div class="hint">
+                  <span translate="JSCRIPTY.HELP.ENABLEUNCOMPLETESAVE"></span>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.project.sendUnpauseOnSubmit"
+                  aria-label="SendUnpauseOnSubmit"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="JSCRIPTY.SENDUNPAUSEONSUBMIT"
+                    >SendUnpauseOnSubmit</span
+                  ></md-switch
+                >
+
+                <div class="hint">
+                  <span translate="JSCRIPTY.HELP.SENDUNPAUSEONSUBMIT"></span>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="JSCRIPTY.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.project.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="JSCRIPTY.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="JSCRIPTY.BUILDER">BUILDER</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="project-detail-form-container builder md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="ProjectBuilderController as vm_bc"
+              ng-init="vm_bc.init(vm.project)"
+            >
+              <mw-form-builder
+                ng-if="vm_bc.project.formData"
+                form-data="vm_bc.project.formData"
+                options="vm_bc.optionsBuilder"
+                read-only="false"
+              ></mw-form-builder>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="JSCRIPTY.PREVIEW">PREVIEW</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="project-detail-form-container preview md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              layout="column"
+              layout-align="center"
+              ng-controller="ProjectViewerController as vm_vc"
+              ng-init="vm_vc.init(vm.project)"
+            >
+              <div layout="row" layout-align="center">
+                <md-button
+                  class="md-raised md-accent"
+                  aria-label="Reset"
+                  ng-click="vm_vc.resetViewer()"
+                >
+                  Reset
+                </md-button>
+              </div>
+              <mw-form-viewer
+                ng-if="vm_vc.project.formData"
+                form-data="vm_vc.project.formData"
+                response-data="vm_vc.responseData"
+                on-submit="vm_vc.onSubmit($event)"
+                api="vm_vc.formViewer"
+              ></mw-form-viewer>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="JSCRIPTY.SESSIONS">SESSIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="project-detail-form-container sessions md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="ProjectSessionsController as vm_dc"
+              ng-init="vm_dc.init(vm.project, vm.crudPermissions)"
+            >
+              <md-toolbar
+                class="md-table-toolbar md-default"
+                ng-hide="vm_dc.selectedProjectSessions.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead" translate="JSCRIPTY.SESSIONS"
+                    >Sessions</span
+                  >
+                  <ms-search-bar
+                    on-search="vm_dc.query.filter = query"
+                    on-collapse="vm_dc.query.filter = undefined"
+                    debounce="300"
+                    direction="down"
+                  ></ms-search-bar>
+                  <div flex></div>
+                </div>
+              </md-toolbar>
+              <md-toolbar
+                class="md-table-toolbar md-accent"
+                ng-show="vm_dc.selectedProjectSessions.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead"
+                    >{{vm_dc.selectedProjectSessions.length}}
+                    {{vm_dc.selectedProjectSessions.length > 1 ? 'items' :
+                    'item'}} selected</span
+                  >
+                  <div flex></div>
+                  <button
+                    class="md-icon-button"
+                    ng-csv="vm_dc.exportSelectedProjectSessions"
+                    csv-label="true"
+                    filename="projects.csv"
+                  >
+                    <md-icon md-font-icon="icon-file-excel"></md-icon>
+                  </button>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canDelete"
+                    class="md-icon-button"
+                    ng-click="vm_dc.deleteSelectedProjectSessions($event)"
+                    aria-label="delete selected"
+                    translate
+                    translate-attr-label="JSCRIPTY.DELETE_SELECTED"
+                  >
+                    <md-icon md-font-icon="icon-delete"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-table-container class="font-size-12">
+                <table
+                  md-table
+                  md-row-select
+                  multiple
+                  ng-model="vm_dc.selectedProjectSessions"
+                  md-progress="vm_dc.promise"
+                >
+                  <thead
+                    md-head
+                    md-order="vm_dc.query.sort"
+                    md-on-reorder="vm_dc.getProjectSessions"
+                  >
+                    <tr md-row>
+                      <th md-column md-order-by="id">
+                        {{ 'JSCRIPTY.ID' | translate }}
+                      </th>
+                      <th md-column md-order-by="starttime">
+                        {{ 'JSCRIPTY.STARTTIME' | translate }}
+                      </th>
+                      <th md-column md-order-by="endtime">
+                        {{ 'JSCRIPTY.ENDTIME' | translate }}
+                      </th>
+                      <th md-column md-order-by="membername">
+                        {{ 'JSCRIPTY.MEMBERNAME' | translate }}
+                      </th>
+                      <th md-column md-order-by="calleridnum">
+                        {{ 'JSCRIPTY.CALLERIDNUM' | translate }}
+                      </th>
+                      <th md-column md-order-by="completed">
+                        {{ 'JSCRIPTY.COMPLETE' | translate }}
+                      </th>
+                      <th md-column width="10px"></th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr
+                      md-row
+                      md-select="session"
+                      md-select-id="id"
+                      ng-repeat="session in vm_dc.projectSessions.rows"
+                    >
+                      <td md-cell>{{session.id}}</td>
+                      <td md-cell>{{ session.starttime | formatdate }}</td>
+                      <td md-cell>{{ session.endtime | formatdate }}</td>
+                      <td md-cell>{{session.membername}}</td>
+                      <td md-cell>{{session.calleridnum}}</td>
+                      <td md-cell class="completed">
+                        <md-icon
+                          md-colors="{color: {{session.completed ? '\'green\'' : '\'grey\''}}}"
+                          md-font-icon="{{session.completed? 'icon-check' : 'icon-close'}}"
+                        ></md-icon>
+                      </td>
+                      <td md-cell class="actions">
+                        <md-menu>
+                          <md-button
+                            class="md-icon-button"
+                            aria-label="More"
+                            translate
+                            translate-attr-aria-label="JSCRIPTY.MORE"
+                            ng-click="$mdOpenMenu($event)"
+                          >
+                            <md-icon
+                              md-font-icon="icon-dots-vertical"
+                            ></md-icon>
+                          </md-button>
+
+                          <md-menu-content width="3">
+                            <md-menu-item>
+                              <md-button
+                                ng-click="vm_dc.showQuestionsProjectSession($event, session)"
+                                translate="JSCRIPTY.SHOW_QUESTIONS_SESSION"
+                              >
+                                Results Session
+                              </md-button>
+                            </md-menu-item>
+                            <md-menu-item
+                              ng-if="vm_dc.crudPermissions.canDelete"
+                            >
+                              <md-button
+                                ng-click="vm_dc.deleteConfirm(session, $event)"
+                                translate="JSCRIPTY.DELETE_SESSION"
+                              >
+                                Delete Session
+                              </md-button>
+                            </md-menu-item>
+                          </md-menu-content>
+                        </md-menu>
+                      </td>
+                    </tr>
+                    <tr md-row ng-if="!vm_dc.projectSessions.rows.length">
+                      <td md-cell colspan="8">
+                        <div layout="row" layout-align="center center">
+                          <span
+                            class="text-boxed-light"
+                            translate="JSCRIPTY.NO_SESSION_AVAILABLE"
+                            >No session available</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+              <md-table-pagination
+                md-label="{page: '{{'JSCRIPTY.PAGE' | translate}}:', rowsPerPage: '{{'JSCRIPTY.ROWSPERPAGE' | translate}}:', of: '{{'JSCRIPTY.OF' | translate}}'}"
+                md-limit="vm_dc.query.limit"
+                md-limit-options="[10, 15, 20, 50, 100, 250]"
+                md-page="vm_dc.query.page"
+                md-total="{{vm_dc.projectSessions.count}}"
+                md-on-paginate="vm_dc.getProjectSessions"
+                md-page-select
+              ></md-table-pagination>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="JSCRIPTY.ANSWERS">ANSWERS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="project-detail-form-container answers md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="ProjectAnswersController as vm_an"
+              ng-init="vm_an.init(vm.project)"
+            >
+              <div
+                class="pb-16"
+                layout="row"
+                layout-align="space-between center"
+              >
+                <div class="h2 secondary-text" translate="JSCRIPTY.ANSWERS">
+                  Answers
+                </div>
+                <md-date-range
+                  localization-map="vm_an.localizationMap"
+                  ng-model="vm_an.pickerModel"
+                  auto-confirm="true"
+                  show-template="true"
+                  md-on-select="vm_an.getAnswers()"
+                  placeholder="{{ 'DASHBOARDS.ALL' | translate }}"
+                ></md-date-range>
+                <md-button
+                  type="button"
+                  ng-disabled="!vm_an.answers"
+                  ng-click="vm_an.getSummary($event)"
+                  class="md-accent md-raised md-button ng-scope md-default-theme md-ink-ripple md-green-500-bg md-icon-button"
+                  title="{{'JSCRIPTY.EXPORT_TO_CSV' | translate}}"
+                >
+                  <md-icon
+                    md-font-icon="icon-file-excel"
+                    class="md-default-theme md-font material-icons icon-file-excel"
+                  ></md-icon>
+                </md-button>
+              </div>
+              <div layout="row">
+                <md-card
+                  class="md-whiteframe-1dp"
+                  ng-if="vm_an.answers && vm_an.hasIdAnswers"
+                  flex
+                >
+                  <md-list>
+                    <md-list-item
+                      class="md-2-line contact-item"
+                      ng-repeat="(key, question) in vm_an.answers"
+                    >
+                      <div class="md-list-item-text compact" layout-padding>
+                        <h3>{{question.question}}</h3>
+                        <md-table-container>
+                          <table md-table>
+                            <thead md-head>
+                              <tr md-row>
+                                <th md-column></th>
+                                <th md-column>#</th>
+                                <th md-column>%</th>
+                              </tr>
+                            </thead>
+                            <tbody md-body>
+                              <tr
+                                md-row
+                                ng-repeat="(key, value) in question.answers"
+                              >
+                                <td md-cell>{{key}}</td>
+                                <td md-cell width="20px">{{value}}</td>
+                                <td md-cell width="20px">
+                                  {{value*100/question.sum | number:1}}
+                                </td>
+                              </tr>
+                              <tr md-row>
+                                <td md-cell>
+                                  <b>{{'JSCRIPTY.TOTAL' | translate}}</b>
+                                </td>
+                                <td md-cell width="20px">
+                                  <b>{{question.sum}}</b>
+                                </td>
+                                <td md-cell width="20px"><b>100</b></td>
+                              </tr>
+                            </tbody>
+                          </table>
+                        </md-table-container>
+                      </div>
+                      <md-divider ng-if="!$last"></md-divider>
+                    </md-list-item>
+                  </md-list>
+                </md-card>
+                <span
+                  ng-if="!vm_an.answers || !vm_an.hasIdAnswers"
+                  class="text-boxed-light"
+                  translate="JSCRIPTY.NO_ANSWERS_AVAILABLE"
+                  >No answers available</span
+                >
+              </div>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/jscripty/views/projects/projects.html/projects-[chunkhash].html b/public/src/js/modules/main/apps/jscripty/views/projects/projects.html/projects-[chunkhash].html
deleted file mode 100644
index 899b077..0000000
--- a/public/src/js/modules/main/apps/jscripty/views/projects/projects.html/projects-[chunkhash].html
+++ /dev/null
@@ -1,331 +0,0 @@
-<div
-  id="projects"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-script" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="JSCRIPTY.PROJECTS">Projects</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="JSCRIPTY.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedProjects.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedProjects =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="JSCRIPTY.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-projects-count">
-          <span>{{vm.selectedProjects.length}}</span>
-          <span translate="JSCRIPTY.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="JSCRIPTY.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllProjects()"
-                translate="JSCRIPTY.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectProjects()"
-                translate="JSCRIPTY.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedProjects"
-          csv-label="true"
-          filename="projects.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedProjects($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="JSCRIPTY.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- PROJECT TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedProjects"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getProjects"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">
-                  {{ 'JSCRIPTY.ID' | translate }}
-                </th>
-                <th md-column md-order-by="name">
-                  {{ 'JSCRIPTY.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'JSCRIPTY.DESCRIPTION' | translate }}
-                </th>
-                <th md-column md-order-by="createdAt">
-                  {{ 'JSCRIPTY.CREATED_AT' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.projects.rows.length">
-                <td md-cell colspan="5">
-                  <div layout="row" layout-align="center center">
-                    <span translate="JSCRIPTY.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="project"
-                md-select-id="id"
-                ng-repeat="project in vm.projects.rows"
-              >
-                <td md-cell ng-if="project.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{project.name}}"
-                    ng-src="api/users/{{project.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!project.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{project.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(project, ev) : vm.createOrEditProject($event, project)"
-                  md-cell
-                  class="id"
-                >
-                  {{project.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(project, ev) : vm.createOrEditProject($event, project)"
-                  md-cell
-                  class="name"
-                >
-                  {{project.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(project, ev) : vm.createOrEditProject($event, project)"
-                  md-cell
-                  class="description"
-                >
-                  {{project.description}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(project, ev) : vm.createOrEditProject($event, project)"
-                  md-cell
-                  class="createdAt"
-                >
-                  {{project.createdAt | date:'medium' }}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="JSCRIPTY.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(project, $event    )"
-                          translate="JSCRIPTY.EDIT_PROJECT"
-                        >
-                          Edit Project
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.clonedialog(project, $event    )"
-                          translate="JSCRIPTY.CLONE_PROJECT"
-                        >
-                          clone Project
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.sessionsgoto(project, $event    )"
-                          translate="JSCRIPTY.SESSIONS_PROJECT"
-                        >
-                          Sessions Project
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.deleteconfirm(project, $event    )"
-                          translate="JSCRIPTY.DELETE_PROJECT"
-                        >
-                          Delete Project
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'JSCRIPTY.PAGE' | translate}}:', rowsPerPage: '{{'JSCRIPTY.ROWSPERPAGE' | translate}}:', of: '{{'JSCRIPTY.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.projects.count}}"
-          md-on-paginate="vm.getProjects"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / PROJECT TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD PROJECT BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-project-button"
-    ng-click="vm.createOrEditProject($event)"
-    aria-label="add project"
-    translate
-    translate-attr-aria-label="JSCRIPTY.ADD_PROJECT"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD PROJECT BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/jscripty/views/projects/projects.html/projects.html b/public/src/js/modules/main/apps/jscripty/views/projects/projects.html/projects.html
new file mode 100644
index 0000000..899b077
--- /dev/null
+++ b/public/src/js/modules/main/apps/jscripty/views/projects/projects.html/projects.html
@@ -0,0 +1,331 @@
+<div
+  id="projects"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-script" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="JSCRIPTY.PROJECTS">Projects</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="JSCRIPTY.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedProjects.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedProjects =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="JSCRIPTY.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-projects-count">
+          <span>{{vm.selectedProjects.length}}</span>
+          <span translate="JSCRIPTY.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="JSCRIPTY.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllProjects()"
+                translate="JSCRIPTY.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectProjects()"
+                translate="JSCRIPTY.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedProjects"
+          csv-label="true"
+          filename="projects.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedProjects($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="JSCRIPTY.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- PROJECT TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedProjects"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getProjects"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">
+                  {{ 'JSCRIPTY.ID' | translate }}
+                </th>
+                <th md-column md-order-by="name">
+                  {{ 'JSCRIPTY.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'JSCRIPTY.DESCRIPTION' | translate }}
+                </th>
+                <th md-column md-order-by="createdAt">
+                  {{ 'JSCRIPTY.CREATED_AT' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.projects.rows.length">
+                <td md-cell colspan="5">
+                  <div layout="row" layout-align="center center">
+                    <span translate="JSCRIPTY.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="project"
+                md-select-id="id"
+                ng-repeat="project in vm.projects.rows"
+              >
+                <td md-cell ng-if="project.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{project.name}}"
+                    ng-src="api/users/{{project.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!project.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{project.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(project, ev) : vm.createOrEditProject($event, project)"
+                  md-cell
+                  class="id"
+                >
+                  {{project.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(project, ev) : vm.createOrEditProject($event, project)"
+                  md-cell
+                  class="name"
+                >
+                  {{project.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(project, ev) : vm.createOrEditProject($event, project)"
+                  md-cell
+                  class="description"
+                >
+                  {{project.description}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(project, ev) : vm.createOrEditProject($event, project)"
+                  md-cell
+                  class="createdAt"
+                >
+                  {{project.createdAt | date:'medium' }}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="JSCRIPTY.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(project, $event    )"
+                          translate="JSCRIPTY.EDIT_PROJECT"
+                        >
+                          Edit Project
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.clonedialog(project, $event    )"
+                          translate="JSCRIPTY.CLONE_PROJECT"
+                        >
+                          clone Project
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.sessionsgoto(project, $event    )"
+                          translate="JSCRIPTY.SESSIONS_PROJECT"
+                        >
+                          Sessions Project
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.deleteconfirm(project, $event    )"
+                          translate="JSCRIPTY.DELETE_PROJECT"
+                        >
+                          Delete Project
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'JSCRIPTY.PAGE' | translate}}:', rowsPerPage: '{{'JSCRIPTY.ROWSPERPAGE' | translate}}:', of: '{{'JSCRIPTY.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.projects.count}}"
+          md-on-paginate="vm.getProjects"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / PROJECT TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD PROJECT BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-project-button"
+    ng-click="vm.createOrEditProject($event)"
+    aria-label="add project"
+    translate
+    translate-attr-aria-label="JSCRIPTY.ADD_PROJECT"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD PROJECT BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/mail/views/mailAccounts/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 2fbcb8d..0000000
--- a/public/src/js/modules/main/apps/mail/views/mailAccounts/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,419 +0,0 @@
-<md-dialog class="mailAccount-dialog" aria-label="New MailAccount">
-  <form name="mailAccountForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="MAIL.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.mailAccount.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="mailAccountForm['name'].$error"
-          ng-show="mailAccountForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="MAIL.KEY">key</label>
-        <input
-          type="text"
-          name="key"
-          ng-model="vm.mailAccount.key"
-          md-maxlength="5"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="mailAccountForm['key'].$error"
-          ng-show="mailAccountForm['key'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.KEY_REQUIRED"
-              >key field is required</span
-            >
-          </div>
-          <div ng-message="md-maxlength">
-            <span
-              translate="MAIL.ERRORS.KEY_MAX_LENGTH"
-              translate-values="{max: 5}"
-              >key must have a maximum length equal to 5</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="MAIL.EMAIL_ADDRESS">Email_Address</label>
-        <input
-          type="email"
-          name="email"
-          ng-model="vm.mailAccount.email"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="mailAccountForm['email'].$error"
-          ng-show="mailAccountForm['email'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.EMAIL_ADDRESS_REQUIRED"
-              >Email_Address field is required</span
-            >
-          </div>
-          <div ng-message="email">
-            <span translate="MAIL.ERRORS.EMAIL_ADDRESS_MUST_VALID"
-              >Email_Address must be a valid e-mail address</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="MAIL.LIST">List</label>
-        <md-select name="ListId" ng-model="vm.mailAccount.ListId" required>
-          <md-option
-            ng-value="ListId.id"
-            ng-repeat="ListId in vm.lists"
-            ng-disabled="ListId.canSelect === false"
-            >{{ ListId.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="mailAccountForm['ListId'].$error"
-          ng-show="mailAccountForm['ListId'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.LIST_REQUIRED"
-              >List field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <md-switch ng-model="vm.mailAccount.active" aria-label="Active"
-          ><span translate="MAIL.ACTIVE">Active</span></md-switch
-        >
-      </md-input-container>
-      <md-input-container ng-if="vm.newMailAccount" class="md-block">
-        <label translate="MAIL.SERVICE">Service</label>
-        <md-select name="cservice" ng-model="vm.mailAccount.cservice" required>
-          <md-option ng-value="null">Custom</md-option>
-          <md-option ng-value="'gmail'">Gmail</md-option>
-          <md-option ng-value="'hotmail'">Hotmail</md-option>
-          <md-option ng-value="'yahoo'">Yahoo</md-option>
-          <md-option ng-value="'outlook365'">Outlook365</md-option>
-        </md-select>
-        <div
-          ng-messages="mailAccountForm['cservice'].$error"
-          ng-show="mailAccountForm['cservice'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.SERVICE_REQUIRED"
-              >Service field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="(vm.newMailAccount && vm.mailAccount.cservice == null) || (vm.newMailAccount == undefined && vm.mailAccount.Imap.service == null)"
-        class="md-block"
-      >
-        <label translate="MAIL.IMAP_HOST">IMAP_Host</label>
-        <input
-          type="text"
-          name="Imap.host"
-          ng-model="vm.mailAccount.Imap.host"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="mailAccountForm['Imap.host'].$error"
-          ng-show="mailAccountForm['Imap.host'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.IMAP_HOST_REQUIRED"
-              >IMAP_Host field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="(vm.newMailAccount && vm.mailAccount.cservice == null) || (vm.newMailAccount == undefined && vm.mailAccount.Imap.service == null)"
-        class="md-block"
-      >
-        <label translate="MAIL.IMAP_PORT">IMAP_Port</label>
-        <input
-          type="number"
-          name="Imap.port"
-          ng-model="vm.mailAccount.Imap.port"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="mailAccountForm['Imap.port'].$error"
-          ng-show="mailAccountForm['Imap.port'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.IMAP_PORT_REQUIRED"
-              >IMAP_Port field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="(vm.newMailAccount && vm.mailAccount.cservice == null) || (vm.newMailAccount == undefined && vm.mailAccount.Smtp.service == null)"
-        class="md-block"
-      >
-        <label translate="MAIL.SMTP_HOST">SMTP_Host</label>
-        <input
-          type="text"
-          name="Smtp.host"
-          ng-model="vm.mailAccount.Smtp.host"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="mailAccountForm['Smtp.host'].$error"
-          ng-show="mailAccountForm['Smtp.host'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.SMTP_HOST_REQUIRED"
-              >SMTP_Host field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="(vm.newMailAccount && vm.mailAccount.cservice == null) || (vm.newMailAccount == undefined && vm.mailAccount.Smtp.service == null)"
-        class="md-block"
-      >
-        <label translate="MAIL.SMTP_PORT">SMTP_Port</label>
-        <input
-          type="number"
-          name="Smtp.port"
-          ng-model="vm.mailAccount.Smtp.port"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="mailAccountForm['Smtp.port'].$error"
-          ng-show="mailAccountForm['Smtp.port'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.SMTP_PORT_REQUIRED"
-              >SMTP_Port field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.mailAccount.cservice !== undefined && vm.mailAccount.cservice == null && vm.newMailAccount"
-        class="md-block"
-      >
-        <md-switch
-          ng-model="vm.mailAccount.cauthentication"
-          aria-label="Authentication"
-          ><span translate="MAIL.AUTHENTICATION"
-            >Authentication</span
-          ></md-switch
-        >
-      </md-input-container>
-      <md-input-container
-        ng-if="(vm.mailAccount.cauthentication == true || vm.mailAccount.cservice != null) && vm.newMailAccount"
-        class="md-block"
-      >
-        <label translate="MAIL.USERNAME">Username</label>
-        <input
-          type="text"
-          name="cuser"
-          ng-model="vm.mailAccount.cuser"
-          ng-required="true"
-        />
-
-        <div class="hint"><span translate="MAIL.HELP.USERNAME"></span></div>
-        <div
-          ng-messages="mailAccountForm['cuser'].$error"
-          ng-show="mailAccountForm['cuser'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.USERNAME_REQUIRED"
-              >Username field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        class="md-block"
-        ng-if="(vm.mailAccount.cauthentication == true || vm.mailAccount.cservice != null) && vm.newMailAccount"
-      >
-        <label translate="MAIL.PASSWORD">Password</label>
-        <input
-          type="password"
-          name="cpassword"
-          ng-model="vm.mailAccount.cpassword"
-          placeholder="Password"
-          translate
-          translate-attr-placeholder="MAIL.PASSWORD"
-          required
-        />
-        <div class="hint"><span translate="MAIL.HELP.PASSWORD"></span></div>
-        <div ng-messages="mailAccountForm['cpassword'].$error" role="alert">
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.PASSWORD_REQUIRED"
-              >Password field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span translate="MAIL.ERRORS.SECURE_PASSWORD_PATTERN"
-              >Must contain at least 8 characters, with a minimum of 1 lowercase
-              letter, 1 uppercase letter, 1 numeric character and 1 special
-              character ~!?*@#$%^&-_=+[{]}.</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <md-input-container class="md-block">
-        <label translate="MAIL.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.mailAccount.description"
-        />
-
-        <div
-          ng-messages="mailAccountForm['description'].$error"
-          ng-show="mailAccountForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newMailAccount"
-          ng-click="vm.saveMailAccount()"
-          class="send-button md-accent md-raised"
-          ng-disabled="mailAccountForm.$invalid || mailAccountForm.$pristine"
-          aria-label="SAVE"
-          translate="MAIL.SAVE"
-          translate-attr-aria-label="MAIL.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newMailAccount"
-          ng-click="vm.addNewMailAccount()"
-          class="send-button md-accent md-raised"
-          ng-disabled="mailAccountForm.$invalid"
-          aria-label="ADD"
-          translate="MAIL.ADD_MAILACCOUNT"
-          translate-attr-aria-label="MAIL.ADD_MAILACCOUNT"
-        >
-          ADD MAILACCOUNT
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newMailAccount"
-          ng-click="vm.deleteMailAccount($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="MAIL.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="MAIL.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/mail/views/mailAccounts/create/dialog.html/dialog.html
new file mode 100644
index 0000000..2fbcb8d
--- /dev/null
+++ b/public/src/js/modules/main/apps/mail/views/mailAccounts/create/dialog.html/dialog.html
@@ -0,0 +1,419 @@
+<md-dialog class="mailAccount-dialog" aria-label="New MailAccount">
+  <form name="mailAccountForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="MAIL.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.mailAccount.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="mailAccountForm['name'].$error"
+          ng-show="mailAccountForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="MAIL.KEY">key</label>
+        <input
+          type="text"
+          name="key"
+          ng-model="vm.mailAccount.key"
+          md-maxlength="5"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="mailAccountForm['key'].$error"
+          ng-show="mailAccountForm['key'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.KEY_REQUIRED"
+              >key field is required</span
+            >
+          </div>
+          <div ng-message="md-maxlength">
+            <span
+              translate="MAIL.ERRORS.KEY_MAX_LENGTH"
+              translate-values="{max: 5}"
+              >key must have a maximum length equal to 5</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="MAIL.EMAIL_ADDRESS">Email_Address</label>
+        <input
+          type="email"
+          name="email"
+          ng-model="vm.mailAccount.email"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="mailAccountForm['email'].$error"
+          ng-show="mailAccountForm['email'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.EMAIL_ADDRESS_REQUIRED"
+              >Email_Address field is required</span
+            >
+          </div>
+          <div ng-message="email">
+            <span translate="MAIL.ERRORS.EMAIL_ADDRESS_MUST_VALID"
+              >Email_Address must be a valid e-mail address</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="MAIL.LIST">List</label>
+        <md-select name="ListId" ng-model="vm.mailAccount.ListId" required>
+          <md-option
+            ng-value="ListId.id"
+            ng-repeat="ListId in vm.lists"
+            ng-disabled="ListId.canSelect === false"
+            >{{ ListId.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="mailAccountForm['ListId'].$error"
+          ng-show="mailAccountForm['ListId'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.LIST_REQUIRED"
+              >List field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <md-switch ng-model="vm.mailAccount.active" aria-label="Active"
+          ><span translate="MAIL.ACTIVE">Active</span></md-switch
+        >
+      </md-input-container>
+      <md-input-container ng-if="vm.newMailAccount" class="md-block">
+        <label translate="MAIL.SERVICE">Service</label>
+        <md-select name="cservice" ng-model="vm.mailAccount.cservice" required>
+          <md-option ng-value="null">Custom</md-option>
+          <md-option ng-value="'gmail'">Gmail</md-option>
+          <md-option ng-value="'hotmail'">Hotmail</md-option>
+          <md-option ng-value="'yahoo'">Yahoo</md-option>
+          <md-option ng-value="'outlook365'">Outlook365</md-option>
+        </md-select>
+        <div
+          ng-messages="mailAccountForm['cservice'].$error"
+          ng-show="mailAccountForm['cservice'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.SERVICE_REQUIRED"
+              >Service field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="(vm.newMailAccount && vm.mailAccount.cservice == null) || (vm.newMailAccount == undefined && vm.mailAccount.Imap.service == null)"
+        class="md-block"
+      >
+        <label translate="MAIL.IMAP_HOST">IMAP_Host</label>
+        <input
+          type="text"
+          name="Imap.host"
+          ng-model="vm.mailAccount.Imap.host"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="mailAccountForm['Imap.host'].$error"
+          ng-show="mailAccountForm['Imap.host'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.IMAP_HOST_REQUIRED"
+              >IMAP_Host field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="(vm.newMailAccount && vm.mailAccount.cservice == null) || (vm.newMailAccount == undefined && vm.mailAccount.Imap.service == null)"
+        class="md-block"
+      >
+        <label translate="MAIL.IMAP_PORT">IMAP_Port</label>
+        <input
+          type="number"
+          name="Imap.port"
+          ng-model="vm.mailAccount.Imap.port"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="mailAccountForm['Imap.port'].$error"
+          ng-show="mailAccountForm['Imap.port'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.IMAP_PORT_REQUIRED"
+              >IMAP_Port field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="(vm.newMailAccount && vm.mailAccount.cservice == null) || (vm.newMailAccount == undefined && vm.mailAccount.Smtp.service == null)"
+        class="md-block"
+      >
+        <label translate="MAIL.SMTP_HOST">SMTP_Host</label>
+        <input
+          type="text"
+          name="Smtp.host"
+          ng-model="vm.mailAccount.Smtp.host"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="mailAccountForm['Smtp.host'].$error"
+          ng-show="mailAccountForm['Smtp.host'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.SMTP_HOST_REQUIRED"
+              >SMTP_Host field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="(vm.newMailAccount && vm.mailAccount.cservice == null) || (vm.newMailAccount == undefined && vm.mailAccount.Smtp.service == null)"
+        class="md-block"
+      >
+        <label translate="MAIL.SMTP_PORT">SMTP_Port</label>
+        <input
+          type="number"
+          name="Smtp.port"
+          ng-model="vm.mailAccount.Smtp.port"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="mailAccountForm['Smtp.port'].$error"
+          ng-show="mailAccountForm['Smtp.port'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.SMTP_PORT_REQUIRED"
+              >SMTP_Port field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.mailAccount.cservice !== undefined && vm.mailAccount.cservice == null && vm.newMailAccount"
+        class="md-block"
+      >
+        <md-switch
+          ng-model="vm.mailAccount.cauthentication"
+          aria-label="Authentication"
+          ><span translate="MAIL.AUTHENTICATION"
+            >Authentication</span
+          ></md-switch
+        >
+      </md-input-container>
+      <md-input-container
+        ng-if="(vm.mailAccount.cauthentication == true || vm.mailAccount.cservice != null) && vm.newMailAccount"
+        class="md-block"
+      >
+        <label translate="MAIL.USERNAME">Username</label>
+        <input
+          type="text"
+          name="cuser"
+          ng-model="vm.mailAccount.cuser"
+          ng-required="true"
+        />
+
+        <div class="hint"><span translate="MAIL.HELP.USERNAME"></span></div>
+        <div
+          ng-messages="mailAccountForm['cuser'].$error"
+          ng-show="mailAccountForm['cuser'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.USERNAME_REQUIRED"
+              >Username field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        class="md-block"
+        ng-if="(vm.mailAccount.cauthentication == true || vm.mailAccount.cservice != null) && vm.newMailAccount"
+      >
+        <label translate="MAIL.PASSWORD">Password</label>
+        <input
+          type="password"
+          name="cpassword"
+          ng-model="vm.mailAccount.cpassword"
+          placeholder="Password"
+          translate
+          translate-attr-placeholder="MAIL.PASSWORD"
+          required
+        />
+        <div class="hint"><span translate="MAIL.HELP.PASSWORD"></span></div>
+        <div ng-messages="mailAccountForm['cpassword'].$error" role="alert">
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.PASSWORD_REQUIRED"
+              >Password field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span translate="MAIL.ERRORS.SECURE_PASSWORD_PATTERN"
+              >Must contain at least 8 characters, with a minimum of 1 lowercase
+              letter, 1 uppercase letter, 1 numeric character and 1 special
+              character ~!?*@#$%^&-_=+[{]}.</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <md-input-container class="md-block">
+        <label translate="MAIL.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.mailAccount.description"
+        />
+
+        <div
+          ng-messages="mailAccountForm['description'].$error"
+          ng-show="mailAccountForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newMailAccount"
+          ng-click="vm.saveMailAccount()"
+          class="send-button md-accent md-raised"
+          ng-disabled="mailAccountForm.$invalid || mailAccountForm.$pristine"
+          aria-label="SAVE"
+          translate="MAIL.SAVE"
+          translate-attr-aria-label="MAIL.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newMailAccount"
+          ng-click="vm.addNewMailAccount()"
+          class="send-button md-accent md-raised"
+          ng-disabled="mailAccountForm.$invalid"
+          aria-label="ADD"
+          translate="MAIL.ADD_MAILACCOUNT"
+          translate-attr-aria-label="MAIL.ADD_MAILACCOUNT"
+        >
+          ADD MAILACCOUNT
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newMailAccount"
+          ng-click="vm.deleteMailAccount($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="MAIL.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="MAIL.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/agentadd/agentadd.html/agentadd-[chunkhash].html b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
deleted file mode 100644
index 7dcef73..0000000
--- a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
+++ /dev/null
@@ -1,44 +0,0 @@
-<md-dialog
-  class="mailAccount-dialog"
-  aria-label="mailAccount"
-  ng-init="vm.onInit()"
->
-  <form name="mailAccountForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="MAIL.AGENTADD_MAILACCOUNT">Add Agent to mailAccount</h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <ms-dual-multiselect
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveAgents()"
-        class="send-button md-accent md-raised"
-        ng-disabled="!vm.pendingChanges"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/agentadd/agentadd.html/agentadd.html b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/agentadd/agentadd.html/agentadd.html
new file mode 100644
index 0000000..7dcef73
--- /dev/null
+++ b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/agentadd/agentadd.html/agentadd.html
@@ -0,0 +1,44 @@
+<md-dialog
+  class="mailAccount-dialog"
+  aria-label="mailAccount"
+  ng-init="vm.onInit()"
+>
+  <form name="mailAccountForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="MAIL.AGENTADD_MAILACCOUNT">Add Agent to mailAccount</h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <ms-dual-multiselect
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveAgents()"
+        class="send-button md-accent md-raised"
+        ng-disabled="!vm.pendingChanges"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/agent/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/agent/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 08895f4..0000000
--- a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/agent/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,148 +0,0 @@
-<md-dialog class="mailAccount-dialog" aria-label="New MailAccount">
-  <form name="mailAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="MAIL.AGENT">Agent</label>
-        <md-select
-          name="agent"
-          ng-model="vm.agent.agent"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="agent.name"
-            ng-repeat="agent in vm.agents"
-            ng-disabled="agent.canSelect === false"
-            >{{ agent.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="mailAccountFormApp['agent'].$error"
-          ng-show="mailAccountFormApp['agent'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.AGENT_REQUIRED"
-              >Agent field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="MAIL.TIMEOUT">Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.agent.timeout"
-          min="0"
-          max="2147483"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="mailAccountFormApp['timeout'].$error"
-          ng-show="mailAccountFormApp['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.TIMEOUT_REQUIRED"
-              >Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="MAIL.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-          <div ng-message="max">
-            <span translate="MAIL.ERRORS.TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>2147483</span>
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveMailAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="mailAccountFormApp.$invalid || mailAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="MAIL.SAVE"
-          translate-attr-aria-label="MAIL.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/agent/dialog.html/dialog.html b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/agent/dialog.html/dialog.html
new file mode 100644
index 0000000..08895f4
--- /dev/null
+++ b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/agent/dialog.html/dialog.html
@@ -0,0 +1,148 @@
+<md-dialog class="mailAccount-dialog" aria-label="New MailAccount">
+  <form name="mailAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="MAIL.AGENT">Agent</label>
+        <md-select
+          name="agent"
+          ng-model="vm.agent.agent"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="agent.name"
+            ng-repeat="agent in vm.agents"
+            ng-disabled="agent.canSelect === false"
+            >{{ agent.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="mailAccountFormApp['agent'].$error"
+          ng-show="mailAccountFormApp['agent'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.AGENT_REQUIRED"
+              >Agent field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="MAIL.TIMEOUT">Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.agent.timeout"
+          min="0"
+          max="2147483"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="mailAccountFormApp['timeout'].$error"
+          ng-show="mailAccountFormApp['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.TIMEOUT_REQUIRED"
+              >Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="MAIL.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+          <div ng-message="max">
+            <span translate="MAIL.ERRORS.TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>2147483</span>
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveMailAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="mailAccountFormApp.$invalid || mailAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="MAIL.SAVE"
+          translate-attr-aria-label="MAIL.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/autoreply/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/autoreply/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 2108e94..0000000
--- a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/autoreply/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,115 +0,0 @@
-<md-dialog class="mailAccount-dialog" aria-label="New MailAccount">
-  <form name="mailAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="MAIL.TIMES">times</label>
-        <md-select
-          name="times"
-          ng-model="vm.autoreply.times"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="1">One Time</md-option>
-          <md-option ng-value="0">Always</md-option>
-        </md-select>
-        <div
-          ng-messages="mailAccountFormApp['times'].$error"
-          ng-show="mailAccountFormApp['times'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.TIMES_REQUIRED"
-              >times field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <div class="md-block">
-        <label class="md-caption grey-fg" translate="MAIL.TEXT">Text</label>
-        <textarea
-          aria-label="Text text"
-          ng-model="vm.autoreply.text"
-        ></textarea>
-      </div>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveMailAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="mailAccountFormApp.$invalid || mailAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="MAIL.SAVE"
-          translate-attr-aria-label="MAIL.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/autoreply/dialog.html/dialog.html b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/autoreply/dialog.html/dialog.html
new file mode 100644
index 0000000..2108e94
--- /dev/null
+++ b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/autoreply/dialog.html/dialog.html
@@ -0,0 +1,115 @@
+<md-dialog class="mailAccount-dialog" aria-label="New MailAccount">
+  <form name="mailAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="MAIL.TIMES">times</label>
+        <md-select
+          name="times"
+          ng-model="vm.autoreply.times"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="1">One Time</md-option>
+          <md-option ng-value="0">Always</md-option>
+        </md-select>
+        <div
+          ng-messages="mailAccountFormApp['times'].$error"
+          ng-show="mailAccountFormApp['times'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.TIMES_REQUIRED"
+              >times field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <div class="md-block">
+        <label class="md-caption grey-fg" translate="MAIL.TEXT">Text</label>
+        <textarea
+          aria-label="Text text"
+          ng-model="vm.autoreply.text"
+        ></textarea>
+      </div>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveMailAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="mailAccountFormApp.$invalid || mailAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="MAIL.SAVE"
+          translate-attr-aria-label="MAIL.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/close/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/close/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index c1e8fc9..0000000
--- a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/close/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,106 +0,0 @@
-<md-dialog class="mailAccount-dialog" aria-label="New MailAccount">
-  <form name="mailAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="MAIL.DISPOSITION">Disposition</label>
-        <input
-          type="text"
-          name="disposition"
-          ng-model="vm.close.disposition"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="mailAccountFormApp['disposition'].$error"
-          ng-show="mailAccountFormApp['disposition'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.DISPOSITION_REQUIRED"
-              >Disposition field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveMailAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="mailAccountFormApp.$invalid || mailAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="MAIL.SAVE"
-          translate-attr-aria-label="MAIL.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/close/dialog.html/dialog.html b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/close/dialog.html/dialog.html
new file mode 100644
index 0000000..c1e8fc9
--- /dev/null
+++ b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/close/dialog.html/dialog.html
@@ -0,0 +1,106 @@
+<md-dialog class="mailAccount-dialog" aria-label="New MailAccount">
+  <form name="mailAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="MAIL.DISPOSITION">Disposition</label>
+        <input
+          type="text"
+          name="disposition"
+          ng-model="vm.close.disposition"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="mailAccountFormApp['disposition'].$error"
+          ng-show="mailAccountFormApp['disposition'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.DISPOSITION_REQUIRED"
+              >Disposition field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveMailAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="mailAccountFormApp.$invalid || mailAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="MAIL.SAVE"
+          translate-attr-aria-label="MAIL.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/gotoif/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/gotoif/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index fa4ab00..0000000
--- a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/gotoif/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,166 +0,0 @@
-<md-dialog class="mailAccount-dialog" aria-label="New MailAccount">
-  <form name="mailAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="MAIL.CONDITION">Condition</label>
-        <input
-          type="text"
-          name="condition"
-          ng-model="vm.gotoif.condition"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="mailAccountFormApp['condition'].$error"
-          ng-show="mailAccountFormApp['condition'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.CONDITION_REQUIRED"
-              >Condition field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="MAIL.TRUEPRIORITY">truepriority</label>
-        <input
-          type="number"
-          name="truepriority"
-          ng-model="vm.gotoif.truepriority"
-          min="1"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="mailAccountFormApp['truepriority'].$error"
-          ng-show="mailAccountFormApp['truepriority'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.TRUEPRIORITY_REQUIRED"
-              >truepriority field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="MAIL.ERRORS.TRUEPRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >truepriority must be a valid greater or equal than</span
-            >
-            <span>1</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="MAIL.FALSEPRIORITY">falsepriority</label>
-        <input
-          type="number"
-          name="falsepriority"
-          ng-model="vm.gotoif.falsepriority"
-          min="1"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="mailAccountFormApp['falsepriority'].$error"
-          ng-show="mailAccountFormApp['falsepriority'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.FALSEPRIORITY_REQUIRED"
-              >falsepriority field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="MAIL.ERRORS.FALSEPRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >falsepriority must be a valid greater or equal than</span
-            >
-            <span>1</span>
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveMailAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="mailAccountFormApp.$invalid || mailAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="MAIL.SAVE"
-          translate-attr-aria-label="MAIL.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/gotoif/dialog.html/dialog.html b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/gotoif/dialog.html/dialog.html
new file mode 100644
index 0000000..fa4ab00
--- /dev/null
+++ b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/gotoif/dialog.html/dialog.html
@@ -0,0 +1,166 @@
+<md-dialog class="mailAccount-dialog" aria-label="New MailAccount">
+  <form name="mailAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="MAIL.CONDITION">Condition</label>
+        <input
+          type="text"
+          name="condition"
+          ng-model="vm.gotoif.condition"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="mailAccountFormApp['condition'].$error"
+          ng-show="mailAccountFormApp['condition'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.CONDITION_REQUIRED"
+              >Condition field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="MAIL.TRUEPRIORITY">truepriority</label>
+        <input
+          type="number"
+          name="truepriority"
+          ng-model="vm.gotoif.truepriority"
+          min="1"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="mailAccountFormApp['truepriority'].$error"
+          ng-show="mailAccountFormApp['truepriority'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.TRUEPRIORITY_REQUIRED"
+              >truepriority field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="MAIL.ERRORS.TRUEPRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >truepriority must be a valid greater or equal than</span
+            >
+            <span>1</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="MAIL.FALSEPRIORITY">falsepriority</label>
+        <input
+          type="number"
+          name="falsepriority"
+          ng-model="vm.gotoif.falsepriority"
+          min="1"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="mailAccountFormApp['falsepriority'].$error"
+          ng-show="mailAccountFormApp['falsepriority'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.FALSEPRIORITY_REQUIRED"
+              >falsepriority field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="MAIL.ERRORS.FALSEPRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >falsepriority must be a valid greater or equal than</span
+            >
+            <span>1</span>
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveMailAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="mailAccountFormApp.$invalid || mailAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="MAIL.SAVE"
+          translate-attr-aria-label="MAIL.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/gotop/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/gotop/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 8b1c70f..0000000
--- a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/gotop/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,114 +0,0 @@
-<md-dialog class="mailAccount-dialog" aria-label="New MailAccount">
-  <form name="mailAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="MAIL.PRIORITY">Priority</label>
-        <input
-          type="number"
-          name="priority"
-          ng-model="vm.gotop.priority"
-          min="0"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="mailAccountFormApp['priority'].$error"
-          ng-show="mailAccountFormApp['priority'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.PRIORITY_REQUIRED"
-              >Priority field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="MAIL.ERRORS.PRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Priority must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveMailAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="mailAccountFormApp.$invalid || mailAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="MAIL.SAVE"
-          translate-attr-aria-label="MAIL.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/gotop/dialog.html/dialog.html b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/gotop/dialog.html/dialog.html
new file mode 100644
index 0000000..8b1c70f
--- /dev/null
+++ b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/gotop/dialog.html/dialog.html
@@ -0,0 +1,114 @@
+<md-dialog class="mailAccount-dialog" aria-label="New MailAccount">
+  <form name="mailAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="MAIL.PRIORITY">Priority</label>
+        <input
+          type="number"
+          name="priority"
+          ng-model="vm.gotop.priority"
+          min="0"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="mailAccountFormApp['priority'].$error"
+          ng-show="mailAccountFormApp['priority'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.PRIORITY_REQUIRED"
+              >Priority field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="MAIL.ERRORS.PRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Priority must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveMailAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="mailAccountFormApp.$invalid || mailAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="MAIL.SAVE"
+          translate-attr-aria-label="MAIL.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/interval/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/interval/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index ca0ed91..0000000
--- a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/interval/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,313 +0,0 @@
-<md-dialog class="inboundroute-dialog" aria-label="New Interval">
-  <form name="intervalForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <md-input-container class="md-block">
-        <label translate="TOOLS.TYPE">Type</label>
-        <md-select
-          ng-model="vm.type"
-          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="type" ng-repeat="type in vm.types"
-            >{{ type | ucfirst }}</md-option
-          >
-        </md-select>
-      </md-input-container>
-
-      <md-input-container class="md-block" ng-if="vm.type === 'list'">
-        <label translate="TOOLS.INTERVALS">Intervals</label>
-        <md-select
-          ng-model="vm.interval.IntervalId"
-          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="interval.id" ng-repeat="interval in vm.intervals"
-            >{{ interval.name }}</md-option
-          >
-        </md-select>
-      </md-input-container>
-
-      <!-- TIMERANGE START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.TIME_RANGE"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <div class="md-block" flex>
-          <mdp-time-picker
-            name="timeRangeFrom"
-            mdp-placeholder="FROM"
-            ng-model="vm.timeRangeFrom"
-            mdp-format="HH:mm"
-            mdp-auto-switch="true"
-            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <div
-              ng-messages="intervalForm.timeRangeFrom.$error"
-              ng-show="intervalForm.timeRangeFrom.$touched"
-              role="alert"
-            >
-              <div ng-message="format">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_FROM_INVALID"
-                  >Time Range From field is invalid</span
-                >
-              </div>
-            </div>
-          </mdp-time-picker>
-        </div>
-        <div class="md-block" flex ng-if="vm.timeRangeFrom">
-          <mdp-time-picker
-            name="timeRangeTo"
-            mdp-placeholder="TO*"
-            ng-model="vm.timeRangeTo"
-            mdp-format="HH:mm"
-            mdp-auto-switch="true"
-            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-            required
-          >
-            <div
-              ng-messages="intervalForm.timeRangeTo.$error"
-              ng-show="intervalForm.timeRangeTo.$invalid"
-              role="alert"
-            >
-              <div ng-message="format">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_INVALID"
-                  >Time Range To field is invalid</span
-                >
-              </div>
-              <div ng-message="required">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_REQUIRED"
-                  >Time Range To field is required</span
-                >
-              </div>
-            </div>
-          </mdp-time-picker>
-        </div>
-      </div>
-      <!-- TIMERANGE END -->
-
-      <!-- DAYSOFWEEK START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.WEEK_DAYS"
-        >Week Days</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.dayOfWeekFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
-              ><span translate="TOOLS.{{day.value | uppercase}}"
-                >{{ day.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container flex class="md-block" ng-if="vm.dayOfWeekFrom">
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="dayOfWeekTo"
-            ng-model="vm.dayOfWeekTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
-              ><span translate="TOOLS.{{day.value | uppercase}}"
-                >{{ day.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.dayOfWeekTo.$error"
-            ng-show="intervalForm.dayOfWeekTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- DAYSOFWEEK END -->
-
-      <!-- MONTHDAY START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTH_DAYS"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex layout="column" class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.monthDayFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
-              >{{ month }}</md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container
-          flex
-          layout="column"
-          class="md-block"
-          ng-if="vm.monthDayFrom"
-        >
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="monthDayTo"
-            ng-model="vm.monthDayTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
-              >{{ month }}</md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.monthDayTo.$error"
-            ng-show="intervalForm.monthDayTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- MONTHDAY END -->
-
-      <!-- MONTH START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTHS"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex layout="column" class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.monthFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
-              ><span translate="TOOLS.{{month.value | uppercase}}"
-                >{{ month.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container
-          flex
-          layout="column"
-          class="md-block"
-          ng-if="vm.monthFrom"
-        >
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="monthTo"
-            ng-model="vm.monthTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
-              ><span translate="TOOLS.{{month.value | uppercase}}"
-                >{{ month.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.monthTo.$error"
-            ng-show="intervalForm.monthTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- MONTH END -->
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="!vm.newInterval && vm.crudPermissions.canEdit"
-          ng-click="vm.saveInterval()"
-          class="send-button md-accent md-raised"
-          ng-disabled="intervalForm.$invalid || intervalForm.$pristine"
-          aria-label="SAVE"
-          translate="TOOLS.SAVE"
-          translate-attr-aria-label="TOOLS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.newInterval && vm.crudPermissions.canEdit"
-          ng-click="vm.addNewInterval()"
-          class="send-button md-accent md-raised"
-          ng-disabled="intervalForm.$invalid"
-          aria-label="ADD"
-          translate="TOOLS.ADD_INTERVAL"
-          translate-attr-aria-label="TOOLS.ADD_INTERVAL"
-        >
-          ADD INTERVAL
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/interval/dialog.html/dialog.html b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/interval/dialog.html/dialog.html
new file mode 100644
index 0000000..ca0ed91
--- /dev/null
+++ b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/interval/dialog.html/dialog.html
@@ -0,0 +1,313 @@
+<md-dialog class="inboundroute-dialog" aria-label="New Interval">
+  <form name="intervalForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <md-input-container class="md-block">
+        <label translate="TOOLS.TYPE">Type</label>
+        <md-select
+          ng-model="vm.type"
+          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="type" ng-repeat="type in vm.types"
+            >{{ type | ucfirst }}</md-option
+          >
+        </md-select>
+      </md-input-container>
+
+      <md-input-container class="md-block" ng-if="vm.type === 'list'">
+        <label translate="TOOLS.INTERVALS">Intervals</label>
+        <md-select
+          ng-model="vm.interval.IntervalId"
+          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="interval.id" ng-repeat="interval in vm.intervals"
+            >{{ interval.name }}</md-option
+          >
+        </md-select>
+      </md-input-container>
+
+      <!-- TIMERANGE START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.TIME_RANGE"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <div class="md-block" flex>
+          <mdp-time-picker
+            name="timeRangeFrom"
+            mdp-placeholder="FROM"
+            ng-model="vm.timeRangeFrom"
+            mdp-format="HH:mm"
+            mdp-auto-switch="true"
+            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <div
+              ng-messages="intervalForm.timeRangeFrom.$error"
+              ng-show="intervalForm.timeRangeFrom.$touched"
+              role="alert"
+            >
+              <div ng-message="format">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_FROM_INVALID"
+                  >Time Range From field is invalid</span
+                >
+              </div>
+            </div>
+          </mdp-time-picker>
+        </div>
+        <div class="md-block" flex ng-if="vm.timeRangeFrom">
+          <mdp-time-picker
+            name="timeRangeTo"
+            mdp-placeholder="TO*"
+            ng-model="vm.timeRangeTo"
+            mdp-format="HH:mm"
+            mdp-auto-switch="true"
+            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+            required
+          >
+            <div
+              ng-messages="intervalForm.timeRangeTo.$error"
+              ng-show="intervalForm.timeRangeTo.$invalid"
+              role="alert"
+            >
+              <div ng-message="format">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_INVALID"
+                  >Time Range To field is invalid</span
+                >
+              </div>
+              <div ng-message="required">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_REQUIRED"
+                  >Time Range To field is required</span
+                >
+              </div>
+            </div>
+          </mdp-time-picker>
+        </div>
+      </div>
+      <!-- TIMERANGE END -->
+
+      <!-- DAYSOFWEEK START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.WEEK_DAYS"
+        >Week Days</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.dayOfWeekFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
+              ><span translate="TOOLS.{{day.value | uppercase}}"
+                >{{ day.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container flex class="md-block" ng-if="vm.dayOfWeekFrom">
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="dayOfWeekTo"
+            ng-model="vm.dayOfWeekTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
+              ><span translate="TOOLS.{{day.value | uppercase}}"
+                >{{ day.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.dayOfWeekTo.$error"
+            ng-show="intervalForm.dayOfWeekTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- DAYSOFWEEK END -->
+
+      <!-- MONTHDAY START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTH_DAYS"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex layout="column" class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.monthDayFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
+              >{{ month }}</md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container
+          flex
+          layout="column"
+          class="md-block"
+          ng-if="vm.monthDayFrom"
+        >
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="monthDayTo"
+            ng-model="vm.monthDayTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
+              >{{ month }}</md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.monthDayTo.$error"
+            ng-show="intervalForm.monthDayTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- MONTHDAY END -->
+
+      <!-- MONTH START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTHS"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex layout="column" class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.monthFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
+              ><span translate="TOOLS.{{month.value | uppercase}}"
+                >{{ month.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container
+          flex
+          layout="column"
+          class="md-block"
+          ng-if="vm.monthFrom"
+        >
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="monthTo"
+            ng-model="vm.monthTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
+              ><span translate="TOOLS.{{month.value | uppercase}}"
+                >{{ month.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.monthTo.$error"
+            ng-show="intervalForm.monthTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- MONTH END -->
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="!vm.newInterval && vm.crudPermissions.canEdit"
+          ng-click="vm.saveInterval()"
+          class="send-button md-accent md-raised"
+          ng-disabled="intervalForm.$invalid || intervalForm.$pristine"
+          aria-label="SAVE"
+          translate="TOOLS.SAVE"
+          translate-attr-aria-label="TOOLS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.newInterval && vm.crudPermissions.canEdit"
+          ng-click="vm.addNewInterval()"
+          class="send-button md-accent md-raised"
+          ng-disabled="intervalForm.$invalid"
+          aria-label="ADD"
+          translate="TOOLS.ADD_INTERVAL"
+          translate-attr-aria-label="TOOLS.ADD_INTERVAL"
+        >
+          ADD INTERVAL
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/noop/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/noop/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index cbf4392..0000000
--- a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/noop/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,105 +0,0 @@
-<md-dialog class="mailAccount-dialog" aria-label="New MailAccount">
-  <form name="mailAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="MAIL.VALUE">Value</label>
-        <input
-          type="text"
-          name="value"
-          ng-model="vm.noop.value"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="mailAccountFormApp['value'].$error"
-          ng-show="mailAccountFormApp['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.VALUE_REQUIRED"
-              >Value field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveMailAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="mailAccountFormApp.$invalid || mailAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="MAIL.SAVE"
-          translate-attr-aria-label="MAIL.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/noop/dialog.html/dialog.html b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/noop/dialog.html/dialog.html
new file mode 100644
index 0000000..cbf4392
--- /dev/null
+++ b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/noop/dialog.html/dialog.html
@@ -0,0 +1,105 @@
+<md-dialog class="mailAccount-dialog" aria-label="New MailAccount">
+  <form name="mailAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="MAIL.VALUE">Value</label>
+        <input
+          type="text"
+          name="value"
+          ng-model="vm.noop.value"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="mailAccountFormApp['value'].$error"
+          ng-show="mailAccountFormApp['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.VALUE_REQUIRED"
+              >Value field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveMailAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="mailAccountFormApp.$invalid || mailAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="MAIL.SAVE"
+          translate-attr-aria-label="MAIL.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/queue/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/queue/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 9f8b441..0000000
--- a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/queue/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,148 +0,0 @@
-<md-dialog class="mailAccount-dialog" aria-label="New MailAccount">
-  <form name="mailAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="MAIL.QUEUE">Queue</label>
-        <md-select
-          name="queue"
-          ng-model="vm.queue.queue"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="queue.name"
-            ng-repeat="queue in vm.queues"
-            ng-disabled="queue.canSelect === false"
-            >{{ queue.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="mailAccountFormApp['queue'].$error"
-          ng-show="mailAccountFormApp['queue'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.QUEUE_REQUIRED"
-              >Queue field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="MAIL.TIMEOUT">Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.queue.timeout"
-          min="0"
-          max="2147483"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="mailAccountFormApp['timeout'].$error"
-          ng-show="mailAccountFormApp['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.TIMEOUT_REQUIRED"
-              >Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="MAIL.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-          <div ng-message="max">
-            <span translate="MAIL.ERRORS.TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>2147483</span>
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveMailAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="mailAccountFormApp.$invalid || mailAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="MAIL.SAVE"
-          translate-attr-aria-label="MAIL.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/queue/dialog.html/dialog.html b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/queue/dialog.html/dialog.html
new file mode 100644
index 0000000..9f8b441
--- /dev/null
+++ b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/queue/dialog.html/dialog.html
@@ -0,0 +1,148 @@
+<md-dialog class="mailAccount-dialog" aria-label="New MailAccount">
+  <form name="mailAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="MAIL.QUEUE">Queue</label>
+        <md-select
+          name="queue"
+          ng-model="vm.queue.queue"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="queue.name"
+            ng-repeat="queue in vm.queues"
+            ng-disabled="queue.canSelect === false"
+            >{{ queue.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="mailAccountFormApp['queue'].$error"
+          ng-show="mailAccountFormApp['queue'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.QUEUE_REQUIRED"
+              >Queue field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="MAIL.TIMEOUT">Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.queue.timeout"
+          min="0"
+          max="2147483"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="mailAccountFormApp['timeout'].$error"
+          ng-show="mailAccountFormApp['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.TIMEOUT_REQUIRED"
+              >Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="MAIL.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+          <div ng-message="max">
+            <span translate="MAIL.ERRORS.TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>2147483</span>
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveMailAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="mailAccountFormApp.$invalid || mailAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="MAIL.SAVE"
+          translate-attr-aria-label="MAIL.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/system/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/system/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 7b798e2..0000000
--- a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/system/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,133 +0,0 @@
-<md-dialog class="mailAccount-dialog" aria-label="New MailAccount">
-  <form name="mailAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="MAIL.COMMAND">Command</label>
-        <input
-          type="text"
-          name="command"
-          ng-model="vm.system.command"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="mailAccountFormApp['command'].$error"
-          ng-show="mailAccountFormApp['command'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.COMMAND_REQUIRED"
-              >Command field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="MAIL.VARIABLE">Variable</label>
-        <md-select
-          name="variable"
-          ng-model="vm.system.variable"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="''">None</md-option>
-          <md-option
-            ng-value="variable.name"
-            ng-repeat="variable in vm.variables"
-            ng-disabled="variable.canSelect === false"
-            >{{ variable.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="mailAccountFormApp['variable'].$error"
-          ng-show="mailAccountFormApp['variable'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.VARIABLE_REQUIRED"
-              >Variable field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveMailAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="mailAccountFormApp.$invalid || mailAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="MAIL.SAVE"
-          translate-attr-aria-label="MAIL.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/system/dialog.html/dialog.html b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/system/dialog.html/dialog.html
new file mode 100644
index 0000000..7b798e2
--- /dev/null
+++ b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/system/dialog.html/dialog.html
@@ -0,0 +1,133 @@
+<md-dialog class="mailAccount-dialog" aria-label="New MailAccount">
+  <form name="mailAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="MAIL.COMMAND">Command</label>
+        <input
+          type="text"
+          name="command"
+          ng-model="vm.system.command"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="mailAccountFormApp['command'].$error"
+          ng-show="mailAccountFormApp['command'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.COMMAND_REQUIRED"
+              >Command field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="MAIL.VARIABLE">Variable</label>
+        <md-select
+          name="variable"
+          ng-model="vm.system.variable"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="''">None</md-option>
+          <md-option
+            ng-value="variable.name"
+            ng-repeat="variable in vm.variables"
+            ng-disabled="variable.canSelect === false"
+            >{{ variable.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="mailAccountFormApp['variable'].$error"
+          ng-show="mailAccountFormApp['variable'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.VARIABLE_REQUIRED"
+              >Variable field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveMailAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="mailAccountFormApp.$invalid || mailAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="MAIL.SAVE"
+          translate-attr-aria-label="MAIL.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/tag/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/tag/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 5fb1c94..0000000
--- a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/tag/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,111 +0,0 @@
-<md-dialog class="mailAccount-dialog" aria-label="New MailAccount">
-  <form name="mailAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="MAIL.TAG">Tag</label>
-        <md-select
-          name="tag"
-          ng-model="vm.tag.tag"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="tag.name"
-            ng-repeat="tag in vm.tags"
-            ng-disabled="tag.canSelect === false"
-            >{{ tag.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="mailAccountFormApp['tag'].$error"
-          ng-show="mailAccountFormApp['tag'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.TAG_REQUIRED"
-              >Tag field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveMailAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="mailAccountFormApp.$invalid || mailAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="MAIL.SAVE"
-          translate-attr-aria-label="MAIL.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/tag/dialog.html/dialog.html b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/tag/dialog.html/dialog.html
new file mode 100644
index 0000000..5fb1c94
--- /dev/null
+++ b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/apps/tag/dialog.html/dialog.html
@@ -0,0 +1,111 @@
+<md-dialog class="mailAccount-dialog" aria-label="New MailAccount">
+  <form name="mailAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="MAIL.TAG">Tag</label>
+        <md-select
+          name="tag"
+          ng-model="vm.tag.tag"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="tag.name"
+            ng-repeat="tag in vm.tags"
+            ng-disabled="tag.canSelect === false"
+            >{{ tag.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="mailAccountFormApp['tag'].$error"
+          ng-show="mailAccountFormApp['tag'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.TAG_REQUIRED"
+              >Tag field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveMailAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="mailAccountFormApp.$invalid || mailAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="MAIL.SAVE"
+          translate-attr-aria-label="MAIL.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/mailCannedAnswers/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/mailCannedAnswers/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 609b5c4..0000000
--- a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/mailCannedAnswers/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,161 +0,0 @@
-<md-dialog class="mailCannedAnswer-dialog" aria-label="New MailCannedAnswer">
-  <form name="mailCannedAnswerForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="MAIL.KEY">Key</label>
-        <input
-          type=""
-          name="key"
-          ng-model="vm.mailCannedAnswer.key"
-          md-maxlength="255"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="mailCannedAnswerForm['key'].$error"
-          ng-show="mailCannedAnswerForm['key'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.KEY_REQUIRED"
-              >Key field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <div class="md-block">
-        <label class="md-caption grey-fg" translate="MAIL.VALUE">Value</label>
-        <textarea
-          aria-label="Value value"
-          ng-model="vm.mailCannedAnswer.value"
-        ></textarea>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="MAIL.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.mailCannedAnswer.description"
-        />
-
-        <div
-          ng-messages="mailCannedAnswerForm['description'].$error"
-          ng-show="mailCannedAnswerForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newMailCannedAnswer"
-          ng-click="vm.saveMailCannedAnswer()"
-          class="send-button md-accent md-raised"
-          ng-disabled="mailCannedAnswerForm.$invalid || mailCannedAnswerForm.$pristine"
-          aria-label="SAVE"
-          translate="MAIL.SAVE"
-          translate-attr-aria-label="MAIL.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newMailCannedAnswer"
-          ng-click="vm.addNewMailCannedAnswer()"
-          class="send-button md-accent md-raised"
-          ng-disabled="mailCannedAnswerForm.$invalid"
-          aria-label="ADD"
-          translate="MAIL.ADD_MAILCANNEDANSWER"
-          translate-attr-aria-label="MAIL.ADD_MAILCANNEDANSWER"
-        >
-          ADD MAILCANNEDANSWER
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newMailCannedAnswer"
-          ng-click="vm.deleteMailCannedAnswer($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="MAIL.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="MAIL.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/mailCannedAnswers/dialog.html/dialog.html b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/mailCannedAnswers/dialog.html/dialog.html
new file mode 100644
index 0000000..609b5c4
--- /dev/null
+++ b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/mailCannedAnswers/dialog.html/dialog.html
@@ -0,0 +1,161 @@
+<md-dialog class="mailCannedAnswer-dialog" aria-label="New MailCannedAnswer">
+  <form name="mailCannedAnswerForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="MAIL.KEY">Key</label>
+        <input
+          type=""
+          name="key"
+          ng-model="vm.mailCannedAnswer.key"
+          md-maxlength="255"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="mailCannedAnswerForm['key'].$error"
+          ng-show="mailCannedAnswerForm['key'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.KEY_REQUIRED"
+              >Key field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <div class="md-block">
+        <label class="md-caption grey-fg" translate="MAIL.VALUE">Value</label>
+        <textarea
+          aria-label="Value value"
+          ng-model="vm.mailCannedAnswer.value"
+        ></textarea>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="MAIL.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.mailCannedAnswer.description"
+        />
+
+        <div
+          ng-messages="mailCannedAnswerForm['description'].$error"
+          ng-show="mailCannedAnswerForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newMailCannedAnswer"
+          ng-click="vm.saveMailCannedAnswer()"
+          class="send-button md-accent md-raised"
+          ng-disabled="mailCannedAnswerForm.$invalid || mailCannedAnswerForm.$pristine"
+          aria-label="SAVE"
+          translate="MAIL.SAVE"
+          translate-attr-aria-label="MAIL.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newMailCannedAnswer"
+          ng-click="vm.addNewMailCannedAnswer()"
+          class="send-button md-accent md-raised"
+          ng-disabled="mailCannedAnswerForm.$invalid"
+          aria-label="ADD"
+          translate="MAIL.ADD_MAILCANNEDANSWER"
+          translate-attr-aria-label="MAIL.ADD_MAILCANNEDANSWER"
+        >
+          ADD MAILCANNEDANSWER
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newMailCannedAnswer"
+          ng-click="vm.deleteMailCannedAnswer($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="MAIL.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="MAIL.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index 6c46091..0000000
--- a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,2131 +0,0 @@
-<div id="mail-mailAccount" class="page-layout simple tabbed" layout="column">
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-mailAccounts-button md-icon-button"
-        aria-label="Go to mailAccounts"
-        ng-click="vm.gotoMailAccounts()"
-        translate
-        translate-attr-aria-label="MAIL.GO_TO_MAILACCOUNTS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="mailAccount-image" hide-xs>
-          <img ng-src="assets/images/business/mailAccounts.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.mailAccount.id}}
-            <span ng-if="vm.mailAccount.name">{{vm.mailAccount.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="MAIL.CREATED_AT"></span>
-            <span>{{vm.mailAccount.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.gotogoto(vm.mailAccount, $event)"
-        class="md-fab md-warn md-icon-button"
-        aria-label="goto"
-      >
-        <md-tooltip><span translate="MAIL.GOTO_MAILACCOUNT"></span></md-tooltip>
-        <md-icon md-font-icon="icon-cast"></md-icon>
-      </md-button>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.agentadddialog(vm.mailAccount, $event)"
-        class="md-fab md-warn md-icon-button"
-        aria-label="agentadd"
-      >
-        <md-tooltip
-          ><span translate="MAIL.AGENTADD_MAILACCOUNT"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
-      </md-button>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveMailAccount()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (notificationForm.$invalid) || (transferForm.$invalid) || (imapForm.$invalid) || (smtpForm.$invalid) || (dispositionForm.$invalid) || (mailDispositionsForm.$invalid) || (mailCannedAnswersForm.$invalid) || (actionsForm.$invalid) || (interactionsForm.$invalid)"
-        translate="MAIL.SAVE"
-        translate-attr-aria-label="MAIL.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="MAIL.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="mailAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MAIL.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MAIL.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.mailAccount.name"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MAIL.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MAIL.KEY">key</label>
-                <input
-                  type="text"
-                  name="key"
-                  ng-model="vm.mailAccount.key"
-                  md-maxlength="5"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['key'].$error"
-                  ng-show="generalForm['key'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MAIL.ERRORS.KEY_REQUIRED"
-                      >key field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="MAIL.ERRORS.KEY_MAX_LENGTH"
-                      translate-values="{max: 5}"
-                      >key must have a maximum length equal to 5</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MAIL.EMAIL_ADDRESS">Email_Address</label>
-                <input
-                  type="email"
-                  name="email"
-                  ng-model="vm.mailAccount.email"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['email'].$error"
-                  ng-show="generalForm['email'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MAIL.ERRORS.EMAIL_ADDRESS_REQUIRED"
-                      >Email_Address field is required</span
-                    >
-                  </div>
-                  <div ng-message="email">
-                    <span translate="MAIL.ERRORS.EMAIL_ADDRESS_MUST_VALID"
-                      >Email_Address must be a valid e-mail address</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MAIL.LIST">List</label>
-                <md-select
-                  name="ListId"
-                  ng-model="vm.mailAccount.ListId"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="ListId.id"
-                    ng-repeat="ListId in vm.lists"
-                    ng-disabled="ListId.canSelect === false"
-                    >{{ ListId.name }}</md-option
-                  >
-                </md-select>
-                <div
-                  ng-messages="generalForm['ListId'].$error"
-                  ng-show="generalForm['ListId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MAIL.ERRORS.LIST_REQUIRED"
-                      >List field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.mailAccount.active"
-                  aria-label="Active"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="MAIL.ACTIVE">Active</span></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MAIL.FONT_FAMILY">Font_Family</label>
-                <ms-font-family
-                  name="fontFamily"
-                  ng-model="vm.mailAccount.fontFamily"
-                  required
-                ></ms-font-family>
-                <div class="hint">
-                  <span translate="MAIL.HELP.FONT_FAMILY"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['fontFamily'].$error"
-                  ng-show="generalForm[fontFamily].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MAIL.ERRORS.FONT_FAMILY_REQUIRED"
-                      >Font_Family field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MAIL.FONT_SIZE">Font_Size</label>
-                <input
-                  type="number"
-                  name="fontSize"
-                  ng-model="vm.mailAccount.fontSize"
-                  min="8"
-                  max="72"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MAIL.HELP.FONT_SIZE"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['fontSize'].$error"
-                  ng-show="generalForm['fontSize'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MAIL.ERRORS.FONT_SIZE_REQUIRED"
-                      >Font_Size field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MAIL.ERRORS.FONT_SIZE_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >Font_Size must be a valid greater or equal than</span
-                    >
-                    <span>8</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MAIL.ERRORS.FONT_SIZE_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >Font_Size must be a valid greater or equal than</span
-                    >
-                    <span>72</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <div class="md-block">
-                <label class="md-caption grey-fg" translate="MAIL.TEMPLATE"
-                  >Template</label
-                >
-                <textarea
-                  aria-label="Template template"
-                  ckeditor="{ skin: 'office2013', language: 'en', allowedContent: true, extraPlugins: 'font,colorbutton,autoembed,autocorrect,googlethisterm,pastebase64', toolbarGroups: [{ name: 'styles', groups: ['styles'] }, { name: 'clipboard', groups: ['undo'] }, { name: 'colors', groups: ['colors'] }, { name: 'basicstyles', groups: ['basicstyles'] }, { name: 'paragraph', groups: ['list', 'indent', 'align'] }, { name: 'mode' }], autocorrect_enabled: true, disableNativeSpellChecker: false, fontSize_sizes: '8/8pt;9/9pt;10/10pt;11/11pt;12/12pt;14/14pt;16/16pt;18/18pt;20/20pt;22/22pt;24/24pt;26/26pt;28/28pt;36/36pt;48/48pt;72/72pt',  removePlugins: 'magicline' }"
-                  ng-model="vm.mailAccount.template"
-                ></textarea>
-              </div>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.mailAccount.markAsUnread"
-                  aria-label="mark_as_unread"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="MAIL.MARK_AS_UNREAD"
-                    >mark_as_unread</span
-                  ></md-switch
-                >
-
-                <div class="hint">
-                  <span translate="MAIL.HELP.MARK_AS_UNREAD"></span>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MAIL.WAITFORTHEASSIGNEDAGENT"
-                  >WaitForTheAssignedAgent</label
-                >
-                <input
-                  type="number"
-                  name="waitForTheAssignedAgent"
-                  ng-model="vm.mailAccount.waitForTheAssignedAgent"
-                  min="1"
-                  max="2147483"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['waitForTheAssignedAgent'].$error"
-                  ng-show="generalForm['waitForTheAssignedAgent'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MAIL.ERRORS.WAITFORTHEASSIGNEDAGENT_REQUIRED"
-                      >WaitForTheAssignedAgent field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MAIL.ERRORS.WAITFORTHEASSIGNEDAGENT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >WaitForTheAssignedAgent must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MAIL.ERRORS.WAITFORTHEASSIGNEDAGENT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >WaitForTheAssignedAgent must be a valid greater or equal
-                      than</span
-                    >
-                    <span>2147483</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MAIL.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.mailAccount.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MAIL.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="mailAccount-detail-form-container notification md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MAIL.NOTIFICATION">
-                NOTIFICATION
-              </div>
-            </div>
-            <form name="notificationForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.mailAccount.notificationSound"
-                  aria-label="notificationSound"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="MAIL.NOTIFICATIONSOUND"
-                    >notificationSound</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.mailAccount.notificationShake"
-                  aria-label="notificationShake"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="MAIL.NOTIFICATIONSHAKE"
-                    >notificationShake</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <div class="md-block">
-                <label
-                  class="md-caption grey-fg"
-                  translate="MAIL.NOTIFICATIONTEMPLATE"
-                  >notificationTemplate</label
-                >
-                <textarea
-                  aria-label="notificationTemplate notificationTemplate"
-                  ckeditor="{ skin: 'office2013', language: 'en', allowedContent: true, extraPlugins: 'font,colorbutton,autoembed,autocorrect,googlethisterm,pastebase64', toolbarGroups: [{ name: 'styles', groups: ['styles'] }, { name: 'clipboard', groups: ['undo'] }, { name: 'colors', groups: ['colors'] }, { name: 'basicstyles', groups: ['basicstyles'] }, { name: 'paragraph', groups: ['list', 'indent', 'align'] }, { name: 'mode' }], autocorrect_enabled: true, disableNativeSpellChecker: false, fontSize_sizes: '8/8pt;9/9pt;10/10pt;11/11pt;12/12pt;14/14pt;16/16pt;18/18pt;20/20pt;22/22pt;24/24pt;26/26pt;28/28pt;36/36pt;48/48pt;72/72pt',  removePlugins: 'magicline' }"
-                  ng-model="vm.mailAccount.notificationTemplate"
-                ></textarea>
-              </div>
-            </form>
-          </div>
-          <div
-            class="mailAccount-detail-form-container transfer md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MAIL.TRANSFER">
-                TRANSFER
-              </div>
-            </div>
-            <form name="transferForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.mailAccount.queueTransfer"
-                  aria-label="queueTransfer"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="MAIL.QUEUETRANSFER"
-                    >queueTransfer</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.mailAccount.queueTransfer == true"
-                class="md-block"
-              >
-                <label translate="MAIL.QUEUETRANSFERTIMEOUT"
-                  >queueTransferTimeout</label
-                >
-                <input
-                  type="number"
-                  name="queueTransferTimeout"
-                  ng-model="vm.mailAccount.queueTransferTimeout"
-                  min="1"
-                  max="2147483"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="transferForm['queueTransferTimeout'].$error"
-                  ng-show="transferForm['queueTransferTimeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MAIL.ERRORS.QUEUETRANSFERTIMEOUT_REQUIRED"
-                      >queueTransferTimeout field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MAIL.ERRORS.QUEUETRANSFERTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >queueTransferTimeout must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MAIL.ERRORS.QUEUETRANSFERTIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >queueTransferTimeout must be a valid greater or equal
-                      than</span
-                    >
-                    <span>2147483</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.mailAccount.agentTransfer"
-                  aria-label="agentTransfer"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="MAIL.AGENTTRANSFER"
-                    >agentTransfer</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.mailAccount.agentTransfer == true"
-                class="md-block"
-              >
-                <label translate="MAIL.AGENTTRANSFERTIMEOUT"
-                  >agentTransferTimeout</label
-                >
-                <input
-                  type="number"
-                  name="agentTransferTimeout"
-                  ng-model="vm.mailAccount.agentTransferTimeout"
-                  min="1"
-                  max="2147483"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="transferForm['agentTransferTimeout'].$error"
-                  ng-show="transferForm['agentTransferTimeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MAIL.ERRORS.AGENTTRANSFERTIMEOUT_REQUIRED"
-                      >agentTransferTimeout field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MAIL.ERRORS.AGENTTRANSFERTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >agentTransferTimeout must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MAIL.ERRORS.AGENTTRANSFERTIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >agentTransferTimeout must be a valid greater or equal
-                      than</span
-                    >
-                    <span>2147483</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="MAIL.IMAP">IMAP</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="mailAccount-detail-form-container imap md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MAIL.IMAP">IMAP</div>
-            </div>
-            <form name="imapForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MAIL.SERVICE">Service</label>
-                <md-select
-                  name="Imap.service"
-                  ng-model="vm.mailAccount.Imap.service"
-                  autofocus
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="null">Custom</md-option>
-                  <md-option ng-value="'gmail'">Gmail</md-option>
-                  <md-option ng-value="'hotmail'">Hotmail</md-option>
-                  <md-option ng-value="'yahoo'">Yahoo</md-option>
-                  <md-option ng-value="'outlook365'">Outlook365</md-option>
-                </md-select>
-                <div
-                  ng-messages="imapForm['Imap.service'].$error"
-                  ng-show="imapForm['Imap.service'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MAIL.ERRORS.SERVICE_REQUIRED"
-                      >Service field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="(vm.newMailAccount && vm.mailAccount.cservice == null) || (vm.newMailAccount == undefined && vm.mailAccount.Imap.service == null)"
-                class="md-block"
-              >
-                <label translate="MAIL.IMAP_HOST">IMAP_Host</label>
-                <input
-                  type="text"
-                  name="Imap.host"
-                  ng-model="vm.mailAccount.Imap.host"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="imapForm['Imap.host'].$error"
-                  ng-show="imapForm['Imap.host'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MAIL.ERRORS.IMAP_HOST_REQUIRED"
-                      >IMAP_Host field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="(vm.newMailAccount && vm.mailAccount.cservice == null) || (vm.newMailAccount == undefined && vm.mailAccount.Imap.service == null)"
-                class="md-block"
-              >
-                <label translate="MAIL.IMAP_PORT">IMAP_Port</label>
-                <input
-                  type="number"
-                  name="Imap.port"
-                  ng-model="vm.mailAccount.Imap.port"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="imapForm['Imap.port'].$error"
-                  ng-show="imapForm['Imap.port'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MAIL.ERRORS.IMAP_PORT_REQUIRED"
-                      >IMAP_Port field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.mailAccount.Imap.tls"
-                  aria-label="ssl"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="MAIL.SSL">ssl</span></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.mailAccount.Imap.service == null"
-                class="md-block"
-              >
-                <md-switch
-                  ng-model="vm.mailAccount.Imap.authentication"
-                  aria-label="Authentication"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="MAIL.AUTHENTICATION"
-                    >Authentication</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.mailAccount.Imap.authentication == true || vm.mailAccount.Imap.service != null"
-                class="md-block"
-              >
-                <label translate="MAIL.USERNAME">Username</label>
-                <input
-                  type="text"
-                  name="Imap.user"
-                  ng-model="vm.mailAccount.Imap.user"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MAIL.HELP.USERNAME"></span>
-                </div>
-                <div
-                  ng-messages="imapForm['Imap.user'].$error"
-                  ng-show="imapForm['Imap.user'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MAIL.ERRORS.USERNAME_REQUIRED"
-                      >Username field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                class="md-block"
-                ng-if="vm.mailAccount.Imap.authentication == true || vm.mailAccount.Imap.service != null"
-              >
-                <label translate="MAIL.PASSWORD">Password</label>
-                <input
-                  type="password"
-                  name="Imap.password"
-                  ng-model="vm.mailAccount.Imap.password"
-                  placeholder="Password"
-                  translate
-                  translate-attr-placeholder="MAIL.PASSWORD"
-                  required
-                />
-                <div class="hint">
-                  <span translate="MAIL.HELP.PASSWORD"></span>
-                </div>
-                <div
-                  ng-messages="imapForm['Imap.password'].$error"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MAIL.ERRORS.PASSWORD_REQUIRED"
-                      >Password field is required</span
-                    >
-                  </div>
-                  <div ng-message="pattern">
-                    <span translate="MAIL.ERRORS.SECURE_PASSWORD_PATTERN"
-                      >Must contain at least 8 characters, with a minimum of 1
-                      lowercase letter, 1 uppercase letter, 1 numeric character
-                      and 1 special character ~!?*@#$%^&-_=+[{]}.</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-
-              <md-input-container class="md-block">
-                <label translate="MAIL.MAILBOX">mailbox</label>
-                <input
-                  type="text"
-                  name="Imap.mailbox"
-                  ng-model="vm.mailAccount.Imap.mailbox"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="imapForm['Imap.mailbox'].$error"
-                  ng-show="imapForm['Imap.mailbox'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MAIL.ERRORS.MAILBOX_REQUIRED"
-                      >mailbox field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MAIL.CONNTIMEOUT">connTimeout</label>
-                <input
-                  type="number"
-                  name="Imap.connTimeout"
-                  ng-model="vm.mailAccount.Imap.connTimeout"
-                  min="1"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="imapForm['Imap.connTimeout'].$error"
-                  ng-show="imapForm['Imap.connTimeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MAIL.ERRORS.CONNTIMEOUT_REQUIRED"
-                      >connTimeout field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MAIL.ERRORS.CONNTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >connTimeout must be a valid greater or equal than</span
-                    >
-                    <span>1</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MAIL.AUTHTIMEOUT">authTimeout</label>
-                <input
-                  type="number"
-                  name="Imap.authTimeout"
-                  ng-model="vm.mailAccount.Imap.authTimeout"
-                  min="1"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="imapForm['Imap.authTimeout'].$error"
-                  ng-show="imapForm['Imap.authTimeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MAIL.ERRORS.AUTHTIMEOUT_REQUIRED"
-                      >authTimeout field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MAIL.ERRORS.AUTHTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >authTimeout must be a valid greater or equal than</span
-                    >
-                    <span>1</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="MAIL.SMTP">SMTP</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="mailAccount-detail-form-container smtp md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MAIL.SMTP">SMTP</div>
-            </div>
-            <form name="smtpForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MAIL.SERVICE">Service</label>
-                <md-select
-                  name="Smtp.service"
-                  ng-model="vm.mailAccount.Smtp.service"
-                  autofocus
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="null">Custom</md-option>
-                  <md-option ng-value="'gmail'">Gmail</md-option>
-                  <md-option ng-value="'hotmail'">Hotmail</md-option>
-                  <md-option ng-value="'yahoo'">Yahoo</md-option>
-                  <md-option ng-value="'outlook365'">Outlook365</md-option>
-                </md-select>
-                <div
-                  ng-messages="smtpForm['Smtp.service'].$error"
-                  ng-show="smtpForm['Smtp.service'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MAIL.ERRORS.SERVICE_REQUIRED"
-                      >Service field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="(vm.newMailAccount && vm.mailAccount.cservice == null) || (vm.newMailAccount == undefined && vm.mailAccount.Smtp.service == null)"
-                class="md-block"
-              >
-                <label translate="MAIL.SMTP_HOST">SMTP_Host</label>
-                <input
-                  type="text"
-                  name="Smtp.host"
-                  ng-model="vm.mailAccount.Smtp.host"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="smtpForm['Smtp.host'].$error"
-                  ng-show="smtpForm['Smtp.host'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MAIL.ERRORS.SMTP_HOST_REQUIRED"
-                      >SMTP_Host field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="(vm.newMailAccount && vm.mailAccount.cservice == null) || (vm.newMailAccount == undefined && vm.mailAccount.Smtp.service == null)"
-                class="md-block"
-              >
-                <label translate="MAIL.SMTP_PORT">SMTP_Port</label>
-                <input
-                  type="number"
-                  name="Smtp.port"
-                  ng-model="vm.mailAccount.Smtp.port"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="smtpForm['Smtp.port'].$error"
-                  ng-show="smtpForm['Smtp.port'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MAIL.ERRORS.SMTP_PORT_REQUIRED"
-                      >SMTP_Port field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.mailAccount.Smtp.service == null"
-                class="md-block"
-              >
-                <md-switch
-                  ng-model="vm.mailAccount.Smtp.secure"
-                  aria-label="Secure"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="MAIL.SECURE">Secure</span></md-switch
-                >
-
-                <div class="hint">
-                  <span translate="MAIL.HELP.SECURE"></span>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.mailAccount.Smtp.service == null"
-                class="md-block"
-              >
-                <md-switch
-                  ng-model="vm.mailAccount.Smtp.authentication"
-                  aria-label="Authentication"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="MAIL.AUTHENTICATION"
-                    >Authentication</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.mailAccount.Smtp.authentication == true || vm.mailAccount.Smtp.service != null"
-                class="md-block"
-              >
-                <label translate="MAIL.USERNAME">Username</label>
-                <input
-                  type="text"
-                  name="Smtp.user"
-                  ng-model="vm.mailAccount.Smtp.user"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MAIL.HELP.USERNAME"></span>
-                </div>
-                <div
-                  ng-messages="smtpForm['Smtp.user'].$error"
-                  ng-show="smtpForm['Smtp.user'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MAIL.ERRORS.USERNAME_REQUIRED"
-                      >Username field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                class="md-block"
-                ng-if="vm.mailAccount.Smtp.authentication == true || vm.mailAccount.Smtp.service != null"
-              >
-                <label translate="MAIL.PASSWORD">Password</label>
-                <input
-                  type="password"
-                  name="Smtp.pass"
-                  ng-model="vm.mailAccount.Smtp.pass"
-                  placeholder="Password"
-                  translate
-                  translate-attr-placeholder="MAIL.PASSWORD"
-                  required
-                />
-                <div class="hint">
-                  <span translate="MAIL.HELP.PASSWORD"></span>
-                </div>
-                <div ng-messages="smtpForm['Smtp.pass'].$error" role="alert">
-                  <div ng-message="required">
-                    <span translate="MAIL.ERRORS.PASSWORD_REQUIRED"
-                      >Password field is required</span
-                    >
-                  </div>
-                  <div ng-message="pattern">
-                    <span translate="MAIL.ERRORS.SECURE_PASSWORD_PATTERN"
-                      >Must contain at least 8 characters, with a minimum of 1
-                      lowercase letter, 1 uppercase letter, 1 numeric character
-                      and 1 special character ~!?*@#$%^&-_=+[{]}.</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="MAIL.ADVANCED">ADVANCED</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="mailAccount-detail-form-container disposition md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MAIL.DISPOSITION">
-                DISPOSITION
-              </div>
-            </div>
-            <form name="dispositionForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.mailAccount.mandatoryDisposition"
-                  aria-label="MandatoryDisposition"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="MAIL.MANDATORYDISPOSITION"
-                    >MandatoryDisposition</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.mailAccount.mandatoryDisposition"
-                class="md-block"
-              >
-                <label translate="MAIL.MANDATORYDISPOSITIONPAUSEID"
-                  >MandatoryDispositionPauseId</label
-                >
-                <md-select
-                  name="mandatoryDispositionPauseId"
-                  ng-model="vm.mailAccount.mandatoryDispositionPauseId"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="mandatoryDispositionPauseId.id"
-                    ng-repeat="mandatoryDispositionPauseId in vm.pauses"
-                    ng-disabled="mandatoryDispositionPauseId.canSelect === false"
-                    >{{ mandatoryDispositionPauseId.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span
-                    translate="MAIL.HELP.MANDATORYDISPOSITIONPAUSEID"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="dispositionForm['mandatoryDispositionPauseId'].$error"
-                  ng-show="dispositionForm['mandatoryDispositionPauseId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MAIL.ERRORS.MANDATORYDISPOSITIONPAUSEID_REQUIRED"
-                      >MandatoryDispositionPauseId field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="MAIL.DISPOSITIONS">DISPOSITIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            ng-controller="MailAccountDispositionsController as vm_dc"
-            ng-init="vm_dc.init(vm.mailAccount, vm.crudPermissions)"
-          >
-            <div layout="row">
-              <div class="column" flex="20">
-                <md-card class="mt-0">
-                  <md-card-content>
-                    <button
-                      layout-align="center center"
-                      md-mini-fab
-                      ng-click="vm_dc.query.level = null; vm_dc.getDispositions()"
-                    >
-                      <div layout="row" layout-align="start center">
-                        <md-icon md-font-icon="icon-refresh"></md-icon>
-                        <span class="ph-5"
-                          >{{ 'TOOLS.ALL_DISPOSITIONS' | translate }}</span
-                        >
-                      </div>
-                    </button>
-                  </md-card-content>
-                </md-card>
-                <md-card>
-                  <md-card-content>
-                    <md-input-container class="md-block" flex-gt-sm="">
-                      <label translate="TOOLS.SELECT_LEVEL"
-                        >Select a level</label
-                      >
-                      <md-select
-                        placeholder="{{ 'TOOLS.SELECT_LEVEL' | translate }}"
-                        ng-model="vm_dc.query.level"
-                        ng-change="vm_dc.getDispositions()"
-                      >
-                        <md-option ng-value="null"
-                          ><em translate="TOOLS.ALL">All</em></md-option
-                        >
-                        <md-option
-                          ng-value="key"
-                          ng-repeat="(key, value) in vm_dc.levels"
-                          >{{ value }}</md-option
-                        >
-                      </md-select>
-                    </md-input-container>
-                  </md-card-content>
-                </md-card>
-              </div>
-              <div
-                class="mailAccount-detail-form-container maildispositions md-background-bg md-whiteframe-1dp"
-                flex="80"
-              >
-                <md-toolbar
-                  class="md-table-toolbar md-default"
-                  ng-hide="vm_dc.selectedMailAccountDispositions.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead" translate="MAIL.DISPOSITIONS"
-                      >Dispositions</span
-                    >
-                    <ms-search-bar
-                      on-search="vm_dc.query.filter = query"
-                      on-collapse="vm_dc.query.filter = undefined"
-                      debounce="300"
-                      direction="down"
-                    ></ms-search-bar>
-                    <div flex></div>
-                    <md-button
-                      ng-if="vm_dc.crudPermissions.canEdit"
-                      class="md-icon-button"
-                      ng-click="vm_dc.createOrEditDisposition($event)"
-                      aria-label="Add mail dispositions"
-                      translate
-                      translate-attr-label="MAIL.ADD_DISPOSITION"
-                    >
-                      <md-icon md-font-icon="icon-plus"></md-icon>
-                    </md-button>
-                  </div>
-                </md-toolbar>
-                <md-toolbar
-                  class="md-table-toolbar md-accent"
-                  ng-show="vm_dc.selectedDispositions.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead"
-                      >{{vm_dc.selectedDispositions.length}}
-                      {{vm_dc.selectedDispositions.length > 1 ? 'items' :
-                      'item'}} selected</span
-                    >
-                    <div flex></div>
-                    <button
-                      class="md-icon-button"
-                      ng-csv="vm_dc.exportSelectedDispositions"
-                      csv-label="true"
-                      filename="mailAccounts.csv"
-                    >
-                      <md-icon md-font-icon="icon-file-excel"></md-icon>
-                    </button>
-                    <md-button
-                      ng-if="vm_dc.crudPermissions.canDelete"
-                      class="md-icon-button"
-                      ng-click="vm_dc.deleteSelectedDispositions($event)"
-                      aria-label="delete selected"
-                      translate
-                      translate-attr-label="MAIL.DELETE_SELECTED"
-                    >
-                      <md-icon md-font-icon="icon-delete"></md-icon>
-                    </md-button>
-                  </div>
-                </md-toolbar>
-                <md-table-container>
-                  <table
-                    md-table
-                    md-row-select
-                    multiple
-                    ng-model="vm_dc.selectedDispositions"
-                    md-progress="vm_dc.promise"
-                  >
-                    <thead
-                      md-head
-                      md-order="vm_dc.query.sort"
-                      md-on-reorder="vm_dc.getDispositions"
-                    >
-                      <tr md-row>
-                        <th md-column md-order-by="id">
-                          {{ 'MAIL.ID' | translate }}
-                        </th>
-                        <th md-column md-order-by="level">
-                          {{ 'TOOLS.LEVEL' | translate }}
-                        </th>
-                        <th md-column md-order-by="name">
-                          {{ 'MAIL.NAME' | translate }}
-                        </th>
-                        <th md-column md-order-by="description">
-                          {{ 'MAIL.DESCRIPTION' | translate }}
-                        </th>
-                        <th md-column width="10px"></th>
-                      </tr>
-                    </thead>
-                    <tbody md-body>
-                      <tr md-row ng-hide="vm_dc.dispositions.rows.length">
-                        <td md-cell colspan="5">
-                          <div layout="row" layout-align="center center">
-                            <span translate="MAIL.NO_AVAILABLE_INFO"
-                              >No Available Info</span
-                            >
-                          </div>
-                        </td>
-                      </tr>
-                      <tr
-                        md-row
-                        md-select="disposition"
-                        md-select-id="id"
-                        ng-repeat="disposition in vm_dc.dispositions.rows"
-                      >
-                        <td
-                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                          md-cell
-                          class="id"
-                        >
-                          {{disposition.id}}
-                        </td>
-                        <td
-                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                          md-cell
-                          class="level"
-                        >
-                          {{ vm_dc.levels[disposition.level] }}
-                        </td>
-                        <td
-                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                          md-cell
-                          class="name"
-                        >
-                          {{disposition.name}}
-                        </td>
-                        <td
-                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                          md-cell
-                          class="description"
-                        >
-                          {{disposition.description}}
-                        </td>
-                        <td
-                          md-cell
-                          class="actions"
-                          ng-if="!vm_dc.crudPermissions.readOnly"
-                        >
-                          <md-menu>
-                            <md-button
-                              class="md-icon-button"
-                              aria-label="More"
-                              translate
-                              translate-attr-aria-label="MAIL.MORE"
-                              ng-click="$mdOpenMenu($event)"
-                            >
-                              <md-icon
-                                md-font-icon="icon-dots-vertical"
-                              ></md-icon>
-                            </md-button>
-                            <md-menu-content width="3">
-                              <!-- SUBACTIONS -->
-                              <!-- ACTIONS -->
-                              <md-menu-item
-                                ng-if="vm_dc.crudPermissions.canEdit"
-                              >
-                                <md-button
-                                  ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                                  translate="TOOLS.EDIT_DISPOSITION"
-                                >
-                                  Edit Disposition
-                                </md-button>
-                              </md-menu-item>
-                              <!-- SUBACTIONS -->
-                              <!-- ACTIONS -->
-                              <md-menu-item
-                                ng-if="vm_dc.crudPermissions.canDelete"
-                              >
-                                <md-button
-                                  ng-click="vm_dc.deleteConfirm(disposition, $event)"
-                                  translate="TOOLS.DELETE_DISPOSITION"
-                                >
-                                  Delete Disposition
-                                </md-button>
-                              </md-menu-item>
-                            </md-menu-content>
-                          </md-menu>
-                        </td>
-                      </tr>
-                    </tbody>
-                  </table>
-                </md-table-container>
-                <md-table-pagination
-                  md-label="{page: '{{'MAIL.PAGE' | translate}}:', rowsPerPage: '{{'MAIL.ROWSPERPAGE' | translate}}:', of: '{{'MAIL.OF' | translate}}'}"
-                  md-limit="vm_dc.query.limit"
-                  md-limit-options="[10, 15, 20, 50, 100, 250]"
-                  md-page="vm_dc.query.page"
-                  md-total="{{vm_dc.dispositions.count}}"
-                  md-on-paginate="vm_dc.getDispositions"
-                  md-page-select
-                >
-                </md-table-pagination>
-              </div>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="MAIL.CANNEDANSWERS">CANNEDANSWERS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="mailAccount-detail-form-container mailcannedanswers md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="MailAccountMailCannedAnswersController as vm_dc"
-              ng-init="vm_dc.init(vm.mailAccount, vm.crudPermissions)"
-            >
-              <md-toolbar
-                class="md-table-toolbar md-default"
-                ng-hide="vm_dc.selectedMailAccountMailCannedAnswers.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead" translate="MAIL.MAILCANNEDANSWERS"
-                    >MailCannedAnswers</span
-                  >
-                  <ms-search-bar
-                    on-search="vm_dc.query.filter = query"
-                    on-collapse="vm_dc.query.filter = undefined"
-                    debounce="300"
-                    direction="down"
-                  ></ms-search-bar>
-                  <div flex></div>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canEdit"
-                    class="md-icon-button"
-                    ng-click="vm_dc.createOrEditMailAccountMailCannedAnswer($event)"
-                    aria-label="add mailCannedAnswer"
-                    translate
-                    translate-attr-label="MAIL.ADD_MAILCANNEDANSWER"
-                  >
-                    <md-icon md-font-icon="icon-plus"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-toolbar
-                class="md-table-toolbar md-accent"
-                ng-show="vm_dc.selectedMailAccountMailCannedAnswers.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead"
-                    >{{vm_dc.selectedMailAccountMailCannedAnswers.length}}
-                    {{vm_dc.selectedMailAccountMailCannedAnswers.length > 1 ?
-                    'items' : 'item'}} selected</span
-                  >
-                  <div flex></div>
-                  <button
-                    class="md-icon-button"
-                    ng-csv="vm_dc.exportSelectedMailAccountMailCannedAnswers"
-                    csv-label="true"
-                    filename="mailAccounts.csv"
-                  >
-                    <md-icon md-font-icon="icon-file-excel"></md-icon>
-                  </button>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canDelete"
-                    class="md-icon-button"
-                    ng-click="vm_dc.deleteSelectedMailAccountMailCannedAnswers($event)"
-                    aria-label="delete selected"
-                    translate
-                    translate-attr-label="MAIL.DELETE_SELECTED"
-                  >
-                    <md-icon md-font-icon="icon-delete"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-table-container class="font-size-12">
-                <table
-                  md-table
-                  md-row-select
-                  multiple
-                  ng-model="vm_dc.selectedMailAccountMailCannedAnswers"
-                  md-progress="vm_dc.promise"
-                >
-                  <thead
-                    md-head
-                    md-order="vm_dc.query.sort"
-                    md-on-reorder="vm_dc.getMailAccountMailCannedAnswers"
-                  >
-                    <tr md-row>
-                      <th md-column md-order-by="id">
-                        {{ 'MAIL.ID' | translate }}
-                      </th>
-                      <th md-column md-order-by="key">
-                        {{ 'MAIL.KEY' | translate }}
-                      </th>
-                      <th md-column md-order-by="value">
-                        {{ 'MAIL.VALUE' | translate }}
-                      </th>
-                      <th md-column md-order-by="description">
-                        {{ 'MAIL.DESCRIPTION' | translate }}
-                      </th>
-                      <th md-column md-order-by="createdAt">
-                        {{ 'MAIL.CREATED_AT' | translate }}
-                      </th>
-                      <th md-column width="10px"></th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr
-                      md-row
-                      md-select="mailCannedAnswer"
-                      md-select-id="id"
-                      ng-repeat="mailCannedAnswer in vm_dc.mailAccountMailCannedAnswers.rows"
-                    >
-                      <td
-                        ng-click="vm_dc.createOrEditMailAccountMailCannedAnswer($event, mailCannedAnswer)"
-                        md-cell
-                      >
-                        {{mailCannedAnswer.id}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditMailAccountMailCannedAnswer($event, mailCannedAnswer)"
-                        md-cell
-                      >
-                        {{mailCannedAnswer.key}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditMailAccountMailCannedAnswer($event, mailCannedAnswer)"
-                        md-cell
-                      >
-                        {{mailCannedAnswer.value | htmlToPlaintext }}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditMailAccountMailCannedAnswer($event, mailCannedAnswer)"
-                        md-cell
-                      >
-                        {{mailCannedAnswer.description}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditMailAccountMailCannedAnswer($event, mailCannedAnswer)"
-                        md-cell
-                      >
-                        {{ mailCannedAnswer.createdAt | formatdate }}
-                      </td>
-                      <td
-                        md-cell
-                        class="actions"
-                        ng-if="!vm_dc.crudPermissions.readOnly"
-                      >
-                        <md-menu>
-                          <md-button
-                            class="md-icon-button"
-                            aria-label="More"
-                            translate
-                            translate-attr-aria-label="MAIL.MORE"
-                            ng-click="$mdOpenMenu($event)"
-                          >
-                            <md-icon
-                              md-font-icon="icon-dots-vertical"
-                            ></md-icon>
-                          </md-button>
-
-                          <md-menu-content width="3">
-                            <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
-                              <md-button
-                                ng-click="vm_dc.createOrEditMailAccountMailCannedAnswer($event, mailCannedAnswer)"
-                                translate="MAIL.EDIT_MAILCANNEDANSWER"
-                              >
-                                Edit MailCannedAnswer
-                              </md-button>
-                            </md-menu-item>
-                            <md-menu-item
-                              ng-if="vm_dc.crudPermissions.canDelete"
-                            >
-                              <md-button
-                                ng-click="vm_dc.deleteConfirm(mailCannedAnswer, $event)"
-                                translate="MAIL.DELETE_MAILCANNEDANSWER"
-                              >
-                                Delete MailCannedAnswer
-                              </md-button>
-                            </md-menu-item>
-                          </md-menu-content>
-                        </md-menu>
-                      </td>
-                    </tr>
-                    <tr
-                      md-row
-                      ng-if="!vm_dc.mailAccountMailCannedAnswers.rows.length"
-                    >
-                      <td md-cell colspan="7">
-                        <div layout="row" layout-align="center center">
-                          <span
-                            class="text-boxed-light"
-                            translate="MAIL.NO_MAILCANNEDANSWER_AVAILABLE"
-                            >No mailcannedanswer available</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-              <md-table-pagination
-                md-label="{page: '{{'MAIL.PAGE' | translate}}:', rowsPerPage: '{{'MAIL.ROWSPERPAGE' | translate}}:', of: '{{'MAIL.OF' | translate}}'}"
-                md-limit="vm_dc.query.limit"
-                md-limit-options="[10, 15, 20, 50, 100, 250]"
-                md-page="vm_dc.query.page"
-                md-total="{{vm_dc.mailAccountMailCannedAnswers.count}}"
-                md-on-paginate="vm_dc.getMailAccountMailCannedAnswers"
-                md-page-select
-              ></md-table-pagination>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="MAIL.ACTIONS">ACTIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="mailAccount-detail-form-container actions md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="MailAccountActionsController as vm_ac"
-              ng-init="vm_ac.init(vm.mailAccount, vm.crudPermissions)"
-              class="content"
-              md-background-bg
-              layout="row"
-              layout-align="start start"
-            >
-              <!-- SIDENAV -->
-              <div
-                class="navigation-simple sidenav main-sidenav md-background-bg md-whiteframe-1dp"
-                ms-scroll
-                layout="column"
-                flex="20"
-                ng-if="vm_ac.crudPermissions.canEdit"
-              >
-                <!-- SIDENAV CONTENT -->
-                <md-list class="no-padding">
-                  <md-subheader class="md-no-sticky">
-                    <span translate="VOICE.APPLICATIONS_LIST">
-                      Applications List
-                    </span>
-                  </md-subheader>
-                </md-list>
-                <md-divider></md-divider>
-                <md-list ng-sortable="vm_ac.list">
-                  <md-list-item class="handle" ng-repeat="a in vm_ac.apps">
-                    <md-icon md-font-icon="{{a.icon}}" class="s16"></md-icon>
-                    <p
-                      class="text-truncate"
-                      translate="MAIL.{{(a.alias || a.appType) | uppercase}}"
-                    >
-                      {{a.alias || a.appType}}
-                    </p>
-                  </md-list-item>
-                </md-list>
-                <!-- / SIDENAV CONTENT -->
-              </div>
-              <!-- / SIDENAV -->
-              <div flex></div>
-              <!-- MAIN -->
-              <div
-                class="main scrollable md-background-bg md-whiteframe-1dp"
-                ms-scroll
-                layout="column"
-                flex="{{vm_ac.crudPermissions.canEdit ? 75 : 100}}"
-              >
-                <md-toolbar
-                  class="md-table-toolbar md-default"
-                  ng-hide="vm_ac.selectedMailAccountApps.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead">Drag & Drop Routing</span>
-                    <div flex></div>
-                    <ms-search-bar
-                      on-search="vm_ac.query.filter = query"
-                      on-collapse="vm_ac.query.filter = undefined"
-                      debounce="300"
-                    ></ms-search-bar>
-                  </div>
-                </md-toolbar>
-                <md-toolbar
-                  class="md-table-toolbar md-accent"
-                  ng-show="vm_ac.selectedMailAccountApps.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead"
-                      >{{vm_ac.selectedMailAccountApps.length}}
-                      {{vm_ac.selectedMailAccountApps.length > 1 ? 'items' :
-                      'item'}} selected</span
-                    >
-                    <div flex></div>
-                    <md-button
-                      ng-if="vm_ac.crudPermissions.canDelete"
-                      class="md-icon-button"
-                      ng-click="vm_ac.deleteSelectedMailAccountApps($event)"
-                      aria-label="delete selected"
-                      translate
-                      translate-attr-label="MAIL.DELETE_SELECTED"
-                    >
-                      <md-icon md-font-icon="icon-delete"></md-icon>
-                    </md-button>
-                  </div>
-                </md-toolbar>
-
-                <!-- QUEUES TABLE -->
-                <md-table-container>
-                  <table
-                    md-table
-                    md-row-select
-                    multiple
-                    ng-model="vm_ac.selectedMailAccountApps"
-                  >
-                    <thead md-head>
-                      <tr md-row>
-                        <th md-column width="10px"></th>
-                        <th md-column width="10px">
-                          <span translate="VOICE.PRIORITY">Priority</span>
-                        </th>
-                        <th md-column>
-                          <span>Type</span>
-                        </th>
-                        <th md-column>
-                          <span>Appdata</span>
-                        </th>
-                        <th md-column>
-                          <span>Interval</span>
-                        </th>
-                        <th md-column width="10px"></th>
-                        <th md-column width="10px"></th>
-                      </tr>
-                    </thead>
-                    <tbody md-body ng-sortable="vm_ac.applications">
-                      <tr
-                        md-row
-                        md-select="app"
-                        md-select-id="id"
-                        ng-repeat="app in vm_ac.mailAccountApps.rows | filter: vm_ac.query.filter"
-                      >
-                        <td md-cell>
-                          <md-icon
-                            md-font-icon="icon-drag-vertical"
-                            class="s16 handle"
-                          ></md-icon>
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editMailAccountApp($event, $index)"
-                        >
-                          <span>{{app.priority}}</span>
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editMailAccountApp($event, $index)"
-                        >
-                          {{app.app.toLowerCase() === 'agi' ? 'Cally-Square' :
-                          app.app | ucfirst}}<span
-                            ng-if="app.appType.toLowerCase() === 'custom'"
-                            >*</span
-                          >
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editMailAccountApp($event, $index)"
-                        >
-                          <span class="text-truncate" style="width: 200px"
-                            >{{app.appdata}}</span
-                          >
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editInterval($event, $index)"
-                        >
-                          {{app.IntervalId ? 'From List' : app.interval}}
-                        </td>
-                        <td md-cell>
-                          <md-button
-                            ng-click="vm_ac.editInterval($event, $index)"
-                            class="md-icon-button"
-                            aria-label="Interval"
-                          >
-                            <md-icon md-font-icon="icon-timer"></md-icon>
-                            <md-tooltip>
-                              {{app.IntervalId ? 'From List' : (app.interval ===
-                              '*,*,*,*' ? 'Always' : 'Custom')}}
-                            </md-tooltip>
-                          </md-button>
-                        </td>
-                        <td
-                          md-cell
-                          class="actions"
-                          ng-if="!vm_ac.crudPermissions.readOnly"
-                        >
-                          <md-menu>
-                            <md-button
-                              class="md-icon-button"
-                              aria-label="More"
-                              translate
-                              translate-attr-aria-label="VOICE.MORE"
-                              ng-click="$mdOpenMenu($event)"
-                            >
-                              <md-icon
-                                md-font-icon="icon-dots-vertical"
-                              ></md-icon>
-                            </md-button>
-
-                            <md-menu-content width="3">
-                              <md-menu-item
-                                ng-if="vm_ac.crudPermissions.canEdit"
-                              >
-                                <md-button
-                                  ng-click="vm_ac.editMailAccountApp($event, $index)"
-                                  translate="VOICE.EDIT_APP"
-                                >
-                                  Edit App
-                                </md-button>
-                              </md-menu-item>
-                              <md-menu-item
-                                ng-if="vm_ac.crudPermissions.canEdit"
-                              >
-                                <md-button
-                                  ng-click="vm_ac.editInterval($event, $index)"
-                                  translate="VOICE.EDIT_INTERVAL"
-                                >
-                                  Edit Interval
-                                </md-button>
-                              </md-menu-item>
-                              <md-menu-item
-                                ng-if="vm_ac.crudPermissions.canDelete"
-                              >
-                                <md-button
-                                  ng-click="vm_ac.deleteConfirm(app, $index, $event)"
-                                  translate="VOICE.DELETE_APP"
-                                >
-                                  Delete App
-                                </md-button>
-                              </md-menu-item>
-                            </md-menu-content>
-                          </md-menu>
-                        </td>
-                      </tr>
-                      <tr md-row ng-hide="vm_ac.mailAccountApps.rows.length">
-                        <td md-cell colspan="7">
-                          <span
-                            class="text-boxed-light"
-                            translate="VOICE.NO_APPS_AVAILABLE"
-                            >No apps available</span
-                          >
-                        </td>
-                      </tr>
-                    </tbody>
-                  </table>
-                </md-table-container>
-                <!-- / QUEUES TABLE -->
-
-                <!-- NO RESULTS -->
-
-                <!-- / NO RESULTS -->
-              </div>
-              <!-- / MAIN -->
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="MAIL.INTERACTIONS">INTERACTIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="mailAccount-detail-form-container interactions md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="MailAccountInteractionsController as vm_dc"
-              ng-init="vm_dc.init(vm.mailAccount, vm.crudPermissions)"
-            >
-              <md-toolbar
-                class="md-table-toolbar md-default"
-                ng-hide="vm_dc.selectedMailAccountInteractions.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead" translate="MAIL.INTERACTIONS"
-                    >Interactions</span
-                  >
-                  <ms-search-bar
-                    on-search="vm_dc.query.filter = query"
-                    on-collapse="vm_dc.query.filter = undefined"
-                    debounce="300"
-                    direction="down"
-                  ></ms-search-bar>
-                  <div flex></div>
-                  <ms-quick-filter
-                    filters="vm_dc.quickFilters"
-                    query="vm_dc.query"
-                    search="vm_dc.getMailAccountInteractions()"
-                  ></ms-quick-filter>
-                  <div layout="column">
-                    <md-button
-                      class="md-icon-button advanced-search"
-                      ng-class="{ 'md-fab md-mini md-accent-bg': vm_dc.query.search }"
-                      aria-label="Filter"
-                      translate
-                      translate-attr-aria-label="DASHBOARDS.FILTER"
-                      ng-click="vm_dc.openAdvancedSearch()"
-                    >
-                      <md-icon
-                        md-font-icon="{{ vm_dc.query.search ? 'icon-filter' : 'icon-filter-outline' }}"
-                        ng-class="{ 'blink': vm_dc.query.search }"
-                      ></md-icon>
-                    </md-button>
-                  </div>
-                  <md-button
-                    class="md-icon-button"
-                    ng-click="vm_dc.getMailAccountInteractions()"
-                    aria-label="refresh Interactions"
-                    translate
-                    translate-attr-label="MAIL.REFRESH_INTERACTIONS"
-                  >
-                    <md-icon md-font-icon="icon-refresh"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-toolbar
-                class="md-table-toolbar md-accent"
-                ng-show="vm_dc.selectedMailAccountInteractions.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead"
-                    >{{vm_dc.selectedMailAccountInteractions.length}}
-                    {{vm_dc.selectedMailAccountInteractions.length > 1 ? 'items'
-                    : 'item'}} selected</span
-                  >
-                  <div flex></div>
-                  <button
-                    class="md-icon-button"
-                    ng-csv="vm_dc.exportSelectedMailAccountInteractions"
-                    csv-label="true"
-                    filename="mailAccounts.csv"
-                  >
-                    <md-icon md-font-icon="icon-file-excel"></md-icon>
-                  </button>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canDelete"
-                    class="md-icon-button"
-                    ng-click="vm_dc.deleteSelectedMailAccountInteractions($event)"
-                    aria-label="delete selected"
-                    translate
-                    translate-attr-label="MAIL.DELETE_SELECTED"
-                  >
-                    <md-icon md-font-icon="icon-delete"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-table-container class="font-size-12">
-                <table
-                  md-table
-                  md-row-select
-                  multiple
-                  ng-model="vm_dc.selectedMailAccountInteractions"
-                  md-progress="vm_dc.promise"
-                >
-                  <thead
-                    md-head
-                    md-order="vm_dc.query.sort"
-                    md-on-reorder="vm_dc.getMailAccountInteractions"
-                  >
-                    <tr md-row>
-                      <th md-column md-order-by="id">
-                        {{ 'MAIL.ID' | translate }}
-                      </th>
-                      <th md-column class="no-padding">
-                        <md-icon md-font-icon="icon-eye" class="s16"></md-icon>
-                      </th>
-                      <th md-column class="no-padding"></th>
-                      <th md-column class="no-padding"></th>
-                      <th md-column>{{ 'MAIL.CONTACT' | translate }}</th>
-                      <th md-column md-order-by="subject">
-                        {{ 'MAIL.SUBJECT' | translate }}
-                      </th>
-                      <th md-column md-order-by="createdAt">
-                        {{ 'MAIL.STARTEDAT' | translate }}
-                      </th>
-                      <th md-column md-order-by="lastMsgAt">
-                        {{ 'MAIL.LASTMESSAGE' | translate }}
-                      </th>
-                      <th md-column md-order-by="closed">
-                        {{ 'MAIL.STATUS' | translate }}
-                      </th>
-                      <th md-column>{{ 'MAIL.AGENT' | translate }}</th>
-                      <th md-column md-order-by="tag">
-                        {{ 'MAIL.TAGS' | translate }}
-                      </th>
-                      <th md-column width="10px"></th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr
-                      md-row
-                      md-select="interaction"
-                      md-select-id="id"
-                      ng-repeat="interaction in vm_dc.mailAccountInteractions.rows"
-                      ng-class="{'text-bold text-italic': interaction.unreadMessages > 0}"
-                    >
-                      <td md-cell>{{interaction.id}}</td>
-                      <td md-cell class="no-padding">
-                        <div
-                          ng-if="!interaction.closed && interaction.Users.length"
-                        >
-                          <md-icon
-                            md-font-icon="icon-eye"
-                            class="s16"
-                          ></md-icon>
-                          <md-tooltip>
-                            <span ng-repeat="user in interaction.Users"
-                              >{{ user.fullname | translate }}
-                              <span ng-if="!$last">, </span>
-                            </span>
-                          </md-tooltip>
-                        </div>
-                      </td>
-                      <td md-cell class="no-padding">
-                        <div
-                          ng-if="interaction.unreadMessages > 0"
-                          layout="row"
-                          layout-align="start center"
-                        >
-                          <span
-                            class="badge white-fg md-primary-bg"
-                            layout-margin
-                            >{{ interaction.unreadMessages}}</span
-                          >
-                        </div>
-                      </td>
-                      <td md-cell class="no-padding">
-                        <div ng-if="interaction.attach">
-                          <md-icon
-                            md-font-icon="icon-paperclip"
-                            class="s16"
-                          ></md-icon>
-                        </div>
-                      </td>
-                      <td md-cell>
-                        <div layout="column" layout-align="start start">
-                          <span
-                            class="font-size-12 text-truncate contact-text"
-                            ng-class="{'margin-bottom-0' : interaction.contactInfo}"
-                            layout-margin
-                            >{{ interaction.contactName }}</span
-                          >
-                          <span
-                            ng-if="interaction.contactInfo"
-                            class="font-size-12 text-truncate contact-text margin-top-0"
-                            layout-margin
-                            >{{ interaction.contactInfo }}</span
-                          >
-                        </div>
-                      </td>
-                      <td md-cell>
-                        <div class="width-300">
-                          <span class="text-truncate font-size-12">
-                            {{interaction.subject}}
-                          </span>
-                        </div>
-                      </td>
-                      <td md-cell>{{ interaction.createdAt | formatdate }}</td>
-                      <td md-cell>
-                        <div layout="row">
-                          <span>
-                            <md-icon
-                              md-font-icon="{{interaction.lastMsgDirection == 'in' ? 'icon-arrow-down-bold blue-grey-800-fg' : 'icon-arrow-up-bold blue-grey-300-fg'}}"
-                            ></md-icon>
-                          </span>
-                          <div layout="column" layout-align="center center">
-                            <span class="text-truncate"
-                              >{{ interaction.lastMsgAt | formatdate }}</span
-                            >
-                          </div>
-                        </div>
-                      </td>
-                      <td md-cell>
-                        <span ng-if="interaction.closed === 0" class="green-fg">
-                          {{ 'MAIL.OPENED' | translate }}
-                          <span ng-if="interaction.substatus">
-                            - {{ interaction.substatus }}
-                          </span>
-                        </span>
-                        <span ng-if="interaction.closed === 1" class="red-fg">
-                          {{ 'MAIL.CLOSED' | translate }}
-                          <span ng-if="interaction.disposition">
-                            - {{ interaction.thirdDisposition ||
-                            interaction.secondDisposition ||
-                            interaction.disposition }}
-                          </span>
-                          <md-tooltip class="multiline">
-                            <div layout="column">
-                              <div layout="column">
-                                <span
-                                  >{{ 'DASHBOARDS.CLOSED_AT' |
-                                  translate}}:</span
-                                >
-                                <span class="text-bold"
-                                  >{{ interaction.closedAt | formatdate }}</span
-                                >
-                              </div>
-                              <div
-                                ng-if="interaction.disposition"
-                                layout="column"
-                              >
-                                <span
-                                  >{{ 'DASHBOARDS.DISPOSITION' |
-                                  translate}}:</span
-                                >
-                                <span class="text-bold"
-                                  >{{ interaction.disposition }}</span
-                                >
-                              </div>
-                              <div
-                                ng-if="interaction.secondDisposition"
-                                layout="column"
-                              >
-                                <span
-                                  >{{ 'DASHBOARDS.SECOND_LEVEL_DISPOSITION' |
-                                  translate}}:</span
-                                >
-                                <span class="text-bold"
-                                  >{{ interaction.secondDisposition }}</span
-                                >
-                              </div>
-                              <div
-                                ng-if="interaction.thirdDisposition"
-                                layout="column"
-                              >
-                                <span
-                                  >{{ 'DASHBOARDS.THIRD_LEVEL_DISPOSITION' |
-                                  translate}}:</span
-                                >
-                                <span class="text-bold"
-                                  >{{ interaction.thirdDisposition }}</span
-                                >
-                              </div>
-                            </div>
-                          </md-tooltip>
-                        </span>
-                      </td>
-
-                      <td md-cell>{{interaction.Owner.name}}</td>
-                      <td md-cell>
-                        <div ng-if="interaction.Tags.length">
-                          <md-tooltip md-direction="left" layout="row">
-                            <span ng-repeat="tag in interaction.Tags"
-                              >{{tag.name}}<span ng-if="!$last">, </span></span
-                            >
-                          </md-tooltip>
-                          <md-icon
-                            md-font-icon="icon-tag"
-                            ng-style="{'color': interaction.Tags.length == 1 && interaction.Tags[0].color }"
-                          >
-                          </md-icon>
-                        </div>
-                      </td>
-                      <td md-cell class="actions">
-                        <md-menu>
-                          <md-button
-                            class="md-icon-button"
-                            aria-label="More"
-                            translate
-                            translate-attr-aria-label="MAIL.MORE"
-                            ng-click="$mdOpenMenu($event)"
-                          >
-                            <md-icon
-                              md-font-icon="icon-dots-vertical"
-                            ></md-icon>
-                          </md-button>
-
-                          <md-menu-content width="3">
-                            <md-menu-item>
-                              <md-button
-                                ng-click="vm_dc.spymailInteraction($event, interaction)"
-                                translate="MAIL.SPYINTERACTION"
-                              >
-                                Spy Interaction
-                              </md-button>
-                            </md-menu-item>
-                            <md-menu-item>
-                              <md-button
-                                class="md-primary"
-                                ng-click="vm_dc.mailInteractionDownload(interaction, $event, true)"
-                                translate="MAIL.DOWNLOAD_WITH_ATTACHMENTS"
-                              >
-                                Download with attachments
-                              </md-button>
-                            </md-menu-item>
-                            <md-menu-item>
-                              <md-button
-                                class="md-primary"
-                                ng-click="vm_dc.mailInteractionDownload(interaction, $event)"
-                                translate="MAIL.DOWNLOAD_WITHOUT_ATTACHMENTS"
-                              >
-                                Download without attachments
-                              </md-button>
-                            </md-menu-item>
-                            <md-menu-item
-                              ng-if="vm_dc.crudPermissions.canDelete"
-                            >
-                              <md-button
-                                ng-click="vm_dc.deleteConfirm(interaction, $event)"
-                                translate="MAIL.DELETE_INTERACTION"
-                              >
-                                Delete Interaction
-                              </md-button>
-                            </md-menu-item>
-                          </md-menu-content>
-                        </md-menu>
-                      </td>
-                    </tr>
-                    <tr
-                      md-row
-                      ng-if="!vm_dc.mailAccountInteractions.rows.length"
-                    >
-                      <td md-cell colspan="13">
-                        <div layout="row" layout-align="center center">
-                          <span
-                            class="text-boxed-light"
-                            translate="MAIL.NO_INTERACTION_AVAILABLE"
-                            >No interaction available</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-              <md-table-pagination
-                md-label="{page: '{{'MAIL.PAGE' | translate}}:', rowsPerPage: '{{'MAIL.ROWSPERPAGE' | translate}}:', of: '{{'MAIL.OF' | translate}}'}"
-                md-limit="vm_dc.query.limit"
-                md-limit-options="[10, 15, 20, 50, 100, 250]"
-                md-page="vm_dc.query.page"
-                md-total="{{vm_dc.mailAccountInteractions.count}}"
-                md-on-paginate="vm_dc.getMailAccountInteractions"
-                md-page-select
-              ></md-table-pagination>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/view.html/view.html b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/view.html/view.html
new file mode 100644
index 0000000..6c46091
--- /dev/null
+++ b/public/src/js/modules/main/apps/mail/views/mailAccounts/edit/view.html/view.html
@@ -0,0 +1,2131 @@
+<div id="mail-mailAccount" class="page-layout simple tabbed" layout="column">
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-mailAccounts-button md-icon-button"
+        aria-label="Go to mailAccounts"
+        ng-click="vm.gotoMailAccounts()"
+        translate
+        translate-attr-aria-label="MAIL.GO_TO_MAILACCOUNTS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="mailAccount-image" hide-xs>
+          <img ng-src="assets/images/business/mailAccounts.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.mailAccount.id}}
+            <span ng-if="vm.mailAccount.name">{{vm.mailAccount.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="MAIL.CREATED_AT"></span>
+            <span>{{vm.mailAccount.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.gotogoto(vm.mailAccount, $event)"
+        class="md-fab md-warn md-icon-button"
+        aria-label="goto"
+      >
+        <md-tooltip><span translate="MAIL.GOTO_MAILACCOUNT"></span></md-tooltip>
+        <md-icon md-font-icon="icon-cast"></md-icon>
+      </md-button>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.agentadddialog(vm.mailAccount, $event)"
+        class="md-fab md-warn md-icon-button"
+        aria-label="agentadd"
+      >
+        <md-tooltip
+          ><span translate="MAIL.AGENTADD_MAILACCOUNT"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
+      </md-button>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveMailAccount()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (notificationForm.$invalid) || (transferForm.$invalid) || (imapForm.$invalid) || (smtpForm.$invalid) || (dispositionForm.$invalid) || (mailDispositionsForm.$invalid) || (mailCannedAnswersForm.$invalid) || (actionsForm.$invalid) || (interactionsForm.$invalid)"
+        translate="MAIL.SAVE"
+        translate-attr-aria-label="MAIL.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="MAIL.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="mailAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MAIL.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MAIL.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.mailAccount.name"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MAIL.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MAIL.KEY">key</label>
+                <input
+                  type="text"
+                  name="key"
+                  ng-model="vm.mailAccount.key"
+                  md-maxlength="5"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['key'].$error"
+                  ng-show="generalForm['key'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MAIL.ERRORS.KEY_REQUIRED"
+                      >key field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="MAIL.ERRORS.KEY_MAX_LENGTH"
+                      translate-values="{max: 5}"
+                      >key must have a maximum length equal to 5</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MAIL.EMAIL_ADDRESS">Email_Address</label>
+                <input
+                  type="email"
+                  name="email"
+                  ng-model="vm.mailAccount.email"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['email'].$error"
+                  ng-show="generalForm['email'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MAIL.ERRORS.EMAIL_ADDRESS_REQUIRED"
+                      >Email_Address field is required</span
+                    >
+                  </div>
+                  <div ng-message="email">
+                    <span translate="MAIL.ERRORS.EMAIL_ADDRESS_MUST_VALID"
+                      >Email_Address must be a valid e-mail address</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MAIL.LIST">List</label>
+                <md-select
+                  name="ListId"
+                  ng-model="vm.mailAccount.ListId"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="ListId.id"
+                    ng-repeat="ListId in vm.lists"
+                    ng-disabled="ListId.canSelect === false"
+                    >{{ ListId.name }}</md-option
+                  >
+                </md-select>
+                <div
+                  ng-messages="generalForm['ListId'].$error"
+                  ng-show="generalForm['ListId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MAIL.ERRORS.LIST_REQUIRED"
+                      >List field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.mailAccount.active"
+                  aria-label="Active"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="MAIL.ACTIVE">Active</span></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MAIL.FONT_FAMILY">Font_Family</label>
+                <ms-font-family
+                  name="fontFamily"
+                  ng-model="vm.mailAccount.fontFamily"
+                  required
+                ></ms-font-family>
+                <div class="hint">
+                  <span translate="MAIL.HELP.FONT_FAMILY"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['fontFamily'].$error"
+                  ng-show="generalForm[fontFamily].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MAIL.ERRORS.FONT_FAMILY_REQUIRED"
+                      >Font_Family field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MAIL.FONT_SIZE">Font_Size</label>
+                <input
+                  type="number"
+                  name="fontSize"
+                  ng-model="vm.mailAccount.fontSize"
+                  min="8"
+                  max="72"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MAIL.HELP.FONT_SIZE"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['fontSize'].$error"
+                  ng-show="generalForm['fontSize'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MAIL.ERRORS.FONT_SIZE_REQUIRED"
+                      >Font_Size field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MAIL.ERRORS.FONT_SIZE_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >Font_Size must be a valid greater or equal than</span
+                    >
+                    <span>8</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MAIL.ERRORS.FONT_SIZE_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >Font_Size must be a valid greater or equal than</span
+                    >
+                    <span>72</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <div class="md-block">
+                <label class="md-caption grey-fg" translate="MAIL.TEMPLATE"
+                  >Template</label
+                >
+                <textarea
+                  aria-label="Template template"
+                  ckeditor="{ skin: 'office2013', language: 'en', allowedContent: true, extraPlugins: 'font,colorbutton,autoembed,autocorrect,googlethisterm,pastebase64', toolbarGroups: [{ name: 'styles', groups: ['styles'] }, { name: 'clipboard', groups: ['undo'] }, { name: 'colors', groups: ['colors'] }, { name: 'basicstyles', groups: ['basicstyles'] }, { name: 'paragraph', groups: ['list', 'indent', 'align'] }, { name: 'mode' }], autocorrect_enabled: true, disableNativeSpellChecker: false, fontSize_sizes: '8/8pt;9/9pt;10/10pt;11/11pt;12/12pt;14/14pt;16/16pt;18/18pt;20/20pt;22/22pt;24/24pt;26/26pt;28/28pt;36/36pt;48/48pt;72/72pt',  removePlugins: 'magicline' }"
+                  ng-model="vm.mailAccount.template"
+                ></textarea>
+              </div>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.mailAccount.markAsUnread"
+                  aria-label="mark_as_unread"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="MAIL.MARK_AS_UNREAD"
+                    >mark_as_unread</span
+                  ></md-switch
+                >
+
+                <div class="hint">
+                  <span translate="MAIL.HELP.MARK_AS_UNREAD"></span>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MAIL.WAITFORTHEASSIGNEDAGENT"
+                  >WaitForTheAssignedAgent</label
+                >
+                <input
+                  type="number"
+                  name="waitForTheAssignedAgent"
+                  ng-model="vm.mailAccount.waitForTheAssignedAgent"
+                  min="1"
+                  max="2147483"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['waitForTheAssignedAgent'].$error"
+                  ng-show="generalForm['waitForTheAssignedAgent'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MAIL.ERRORS.WAITFORTHEASSIGNEDAGENT_REQUIRED"
+                      >WaitForTheAssignedAgent field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MAIL.ERRORS.WAITFORTHEASSIGNEDAGENT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >WaitForTheAssignedAgent must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MAIL.ERRORS.WAITFORTHEASSIGNEDAGENT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >WaitForTheAssignedAgent must be a valid greater or equal
+                      than</span
+                    >
+                    <span>2147483</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MAIL.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.mailAccount.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MAIL.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="mailAccount-detail-form-container notification md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MAIL.NOTIFICATION">
+                NOTIFICATION
+              </div>
+            </div>
+            <form name="notificationForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.mailAccount.notificationSound"
+                  aria-label="notificationSound"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="MAIL.NOTIFICATIONSOUND"
+                    >notificationSound</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.mailAccount.notificationShake"
+                  aria-label="notificationShake"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="MAIL.NOTIFICATIONSHAKE"
+                    >notificationShake</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <div class="md-block">
+                <label
+                  class="md-caption grey-fg"
+                  translate="MAIL.NOTIFICATIONTEMPLATE"
+                  >notificationTemplate</label
+                >
+                <textarea
+                  aria-label="notificationTemplate notificationTemplate"
+                  ckeditor="{ skin: 'office2013', language: 'en', allowedContent: true, extraPlugins: 'font,colorbutton,autoembed,autocorrect,googlethisterm,pastebase64', toolbarGroups: [{ name: 'styles', groups: ['styles'] }, { name: 'clipboard', groups: ['undo'] }, { name: 'colors', groups: ['colors'] }, { name: 'basicstyles', groups: ['basicstyles'] }, { name: 'paragraph', groups: ['list', 'indent', 'align'] }, { name: 'mode' }], autocorrect_enabled: true, disableNativeSpellChecker: false, fontSize_sizes: '8/8pt;9/9pt;10/10pt;11/11pt;12/12pt;14/14pt;16/16pt;18/18pt;20/20pt;22/22pt;24/24pt;26/26pt;28/28pt;36/36pt;48/48pt;72/72pt',  removePlugins: 'magicline' }"
+                  ng-model="vm.mailAccount.notificationTemplate"
+                ></textarea>
+              </div>
+            </form>
+          </div>
+          <div
+            class="mailAccount-detail-form-container transfer md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MAIL.TRANSFER">
+                TRANSFER
+              </div>
+            </div>
+            <form name="transferForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.mailAccount.queueTransfer"
+                  aria-label="queueTransfer"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="MAIL.QUEUETRANSFER"
+                    >queueTransfer</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.mailAccount.queueTransfer == true"
+                class="md-block"
+              >
+                <label translate="MAIL.QUEUETRANSFERTIMEOUT"
+                  >queueTransferTimeout</label
+                >
+                <input
+                  type="number"
+                  name="queueTransferTimeout"
+                  ng-model="vm.mailAccount.queueTransferTimeout"
+                  min="1"
+                  max="2147483"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="transferForm['queueTransferTimeout'].$error"
+                  ng-show="transferForm['queueTransferTimeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MAIL.ERRORS.QUEUETRANSFERTIMEOUT_REQUIRED"
+                      >queueTransferTimeout field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MAIL.ERRORS.QUEUETRANSFERTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >queueTransferTimeout must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MAIL.ERRORS.QUEUETRANSFERTIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >queueTransferTimeout must be a valid greater or equal
+                      than</span
+                    >
+                    <span>2147483</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.mailAccount.agentTransfer"
+                  aria-label="agentTransfer"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="MAIL.AGENTTRANSFER"
+                    >agentTransfer</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.mailAccount.agentTransfer == true"
+                class="md-block"
+              >
+                <label translate="MAIL.AGENTTRANSFERTIMEOUT"
+                  >agentTransferTimeout</label
+                >
+                <input
+                  type="number"
+                  name="agentTransferTimeout"
+                  ng-model="vm.mailAccount.agentTransferTimeout"
+                  min="1"
+                  max="2147483"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="transferForm['agentTransferTimeout'].$error"
+                  ng-show="transferForm['agentTransferTimeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MAIL.ERRORS.AGENTTRANSFERTIMEOUT_REQUIRED"
+                      >agentTransferTimeout field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MAIL.ERRORS.AGENTTRANSFERTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >agentTransferTimeout must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MAIL.ERRORS.AGENTTRANSFERTIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >agentTransferTimeout must be a valid greater or equal
+                      than</span
+                    >
+                    <span>2147483</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="MAIL.IMAP">IMAP</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="mailAccount-detail-form-container imap md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MAIL.IMAP">IMAP</div>
+            </div>
+            <form name="imapForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MAIL.SERVICE">Service</label>
+                <md-select
+                  name="Imap.service"
+                  ng-model="vm.mailAccount.Imap.service"
+                  autofocus
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="null">Custom</md-option>
+                  <md-option ng-value="'gmail'">Gmail</md-option>
+                  <md-option ng-value="'hotmail'">Hotmail</md-option>
+                  <md-option ng-value="'yahoo'">Yahoo</md-option>
+                  <md-option ng-value="'outlook365'">Outlook365</md-option>
+                </md-select>
+                <div
+                  ng-messages="imapForm['Imap.service'].$error"
+                  ng-show="imapForm['Imap.service'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MAIL.ERRORS.SERVICE_REQUIRED"
+                      >Service field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="(vm.newMailAccount && vm.mailAccount.cservice == null) || (vm.newMailAccount == undefined && vm.mailAccount.Imap.service == null)"
+                class="md-block"
+              >
+                <label translate="MAIL.IMAP_HOST">IMAP_Host</label>
+                <input
+                  type="text"
+                  name="Imap.host"
+                  ng-model="vm.mailAccount.Imap.host"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="imapForm['Imap.host'].$error"
+                  ng-show="imapForm['Imap.host'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MAIL.ERRORS.IMAP_HOST_REQUIRED"
+                      >IMAP_Host field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="(vm.newMailAccount && vm.mailAccount.cservice == null) || (vm.newMailAccount == undefined && vm.mailAccount.Imap.service == null)"
+                class="md-block"
+              >
+                <label translate="MAIL.IMAP_PORT">IMAP_Port</label>
+                <input
+                  type="number"
+                  name="Imap.port"
+                  ng-model="vm.mailAccount.Imap.port"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="imapForm['Imap.port'].$error"
+                  ng-show="imapForm['Imap.port'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MAIL.ERRORS.IMAP_PORT_REQUIRED"
+                      >IMAP_Port field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.mailAccount.Imap.tls"
+                  aria-label="ssl"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="MAIL.SSL">ssl</span></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.mailAccount.Imap.service == null"
+                class="md-block"
+              >
+                <md-switch
+                  ng-model="vm.mailAccount.Imap.authentication"
+                  aria-label="Authentication"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="MAIL.AUTHENTICATION"
+                    >Authentication</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.mailAccount.Imap.authentication == true || vm.mailAccount.Imap.service != null"
+                class="md-block"
+              >
+                <label translate="MAIL.USERNAME">Username</label>
+                <input
+                  type="text"
+                  name="Imap.user"
+                  ng-model="vm.mailAccount.Imap.user"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MAIL.HELP.USERNAME"></span>
+                </div>
+                <div
+                  ng-messages="imapForm['Imap.user'].$error"
+                  ng-show="imapForm['Imap.user'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MAIL.ERRORS.USERNAME_REQUIRED"
+                      >Username field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                class="md-block"
+                ng-if="vm.mailAccount.Imap.authentication == true || vm.mailAccount.Imap.service != null"
+              >
+                <label translate="MAIL.PASSWORD">Password</label>
+                <input
+                  type="password"
+                  name="Imap.password"
+                  ng-model="vm.mailAccount.Imap.password"
+                  placeholder="Password"
+                  translate
+                  translate-attr-placeholder="MAIL.PASSWORD"
+                  required
+                />
+                <div class="hint">
+                  <span translate="MAIL.HELP.PASSWORD"></span>
+                </div>
+                <div
+                  ng-messages="imapForm['Imap.password'].$error"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MAIL.ERRORS.PASSWORD_REQUIRED"
+                      >Password field is required</span
+                    >
+                  </div>
+                  <div ng-message="pattern">
+                    <span translate="MAIL.ERRORS.SECURE_PASSWORD_PATTERN"
+                      >Must contain at least 8 characters, with a minimum of 1
+                      lowercase letter, 1 uppercase letter, 1 numeric character
+                      and 1 special character ~!?*@#$%^&-_=+[{]}.</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+
+              <md-input-container class="md-block">
+                <label translate="MAIL.MAILBOX">mailbox</label>
+                <input
+                  type="text"
+                  name="Imap.mailbox"
+                  ng-model="vm.mailAccount.Imap.mailbox"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="imapForm['Imap.mailbox'].$error"
+                  ng-show="imapForm['Imap.mailbox'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MAIL.ERRORS.MAILBOX_REQUIRED"
+                      >mailbox field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MAIL.CONNTIMEOUT">connTimeout</label>
+                <input
+                  type="number"
+                  name="Imap.connTimeout"
+                  ng-model="vm.mailAccount.Imap.connTimeout"
+                  min="1"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="imapForm['Imap.connTimeout'].$error"
+                  ng-show="imapForm['Imap.connTimeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MAIL.ERRORS.CONNTIMEOUT_REQUIRED"
+                      >connTimeout field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MAIL.ERRORS.CONNTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >connTimeout must be a valid greater or equal than</span
+                    >
+                    <span>1</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MAIL.AUTHTIMEOUT">authTimeout</label>
+                <input
+                  type="number"
+                  name="Imap.authTimeout"
+                  ng-model="vm.mailAccount.Imap.authTimeout"
+                  min="1"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="imapForm['Imap.authTimeout'].$error"
+                  ng-show="imapForm['Imap.authTimeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MAIL.ERRORS.AUTHTIMEOUT_REQUIRED"
+                      >authTimeout field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MAIL.ERRORS.AUTHTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >authTimeout must be a valid greater or equal than</span
+                    >
+                    <span>1</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="MAIL.SMTP">SMTP</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="mailAccount-detail-form-container smtp md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MAIL.SMTP">SMTP</div>
+            </div>
+            <form name="smtpForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MAIL.SERVICE">Service</label>
+                <md-select
+                  name="Smtp.service"
+                  ng-model="vm.mailAccount.Smtp.service"
+                  autofocus
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="null">Custom</md-option>
+                  <md-option ng-value="'gmail'">Gmail</md-option>
+                  <md-option ng-value="'hotmail'">Hotmail</md-option>
+                  <md-option ng-value="'yahoo'">Yahoo</md-option>
+                  <md-option ng-value="'outlook365'">Outlook365</md-option>
+                </md-select>
+                <div
+                  ng-messages="smtpForm['Smtp.service'].$error"
+                  ng-show="smtpForm['Smtp.service'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MAIL.ERRORS.SERVICE_REQUIRED"
+                      >Service field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="(vm.newMailAccount && vm.mailAccount.cservice == null) || (vm.newMailAccount == undefined && vm.mailAccount.Smtp.service == null)"
+                class="md-block"
+              >
+                <label translate="MAIL.SMTP_HOST">SMTP_Host</label>
+                <input
+                  type="text"
+                  name="Smtp.host"
+                  ng-model="vm.mailAccount.Smtp.host"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="smtpForm['Smtp.host'].$error"
+                  ng-show="smtpForm['Smtp.host'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MAIL.ERRORS.SMTP_HOST_REQUIRED"
+                      >SMTP_Host field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="(vm.newMailAccount && vm.mailAccount.cservice == null) || (vm.newMailAccount == undefined && vm.mailAccount.Smtp.service == null)"
+                class="md-block"
+              >
+                <label translate="MAIL.SMTP_PORT">SMTP_Port</label>
+                <input
+                  type="number"
+                  name="Smtp.port"
+                  ng-model="vm.mailAccount.Smtp.port"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="smtpForm['Smtp.port'].$error"
+                  ng-show="smtpForm['Smtp.port'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MAIL.ERRORS.SMTP_PORT_REQUIRED"
+                      >SMTP_Port field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.mailAccount.Smtp.service == null"
+                class="md-block"
+              >
+                <md-switch
+                  ng-model="vm.mailAccount.Smtp.secure"
+                  aria-label="Secure"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="MAIL.SECURE">Secure</span></md-switch
+                >
+
+                <div class="hint">
+                  <span translate="MAIL.HELP.SECURE"></span>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.mailAccount.Smtp.service == null"
+                class="md-block"
+              >
+                <md-switch
+                  ng-model="vm.mailAccount.Smtp.authentication"
+                  aria-label="Authentication"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="MAIL.AUTHENTICATION"
+                    >Authentication</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.mailAccount.Smtp.authentication == true || vm.mailAccount.Smtp.service != null"
+                class="md-block"
+              >
+                <label translate="MAIL.USERNAME">Username</label>
+                <input
+                  type="text"
+                  name="Smtp.user"
+                  ng-model="vm.mailAccount.Smtp.user"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MAIL.HELP.USERNAME"></span>
+                </div>
+                <div
+                  ng-messages="smtpForm['Smtp.user'].$error"
+                  ng-show="smtpForm['Smtp.user'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MAIL.ERRORS.USERNAME_REQUIRED"
+                      >Username field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                class="md-block"
+                ng-if="vm.mailAccount.Smtp.authentication == true || vm.mailAccount.Smtp.service != null"
+              >
+                <label translate="MAIL.PASSWORD">Password</label>
+                <input
+                  type="password"
+                  name="Smtp.pass"
+                  ng-model="vm.mailAccount.Smtp.pass"
+                  placeholder="Password"
+                  translate
+                  translate-attr-placeholder="MAIL.PASSWORD"
+                  required
+                />
+                <div class="hint">
+                  <span translate="MAIL.HELP.PASSWORD"></span>
+                </div>
+                <div ng-messages="smtpForm['Smtp.pass'].$error" role="alert">
+                  <div ng-message="required">
+                    <span translate="MAIL.ERRORS.PASSWORD_REQUIRED"
+                      >Password field is required</span
+                    >
+                  </div>
+                  <div ng-message="pattern">
+                    <span translate="MAIL.ERRORS.SECURE_PASSWORD_PATTERN"
+                      >Must contain at least 8 characters, with a minimum of 1
+                      lowercase letter, 1 uppercase letter, 1 numeric character
+                      and 1 special character ~!?*@#$%^&-_=+[{]}.</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="MAIL.ADVANCED">ADVANCED</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="mailAccount-detail-form-container disposition md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MAIL.DISPOSITION">
+                DISPOSITION
+              </div>
+            </div>
+            <form name="dispositionForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.mailAccount.mandatoryDisposition"
+                  aria-label="MandatoryDisposition"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="MAIL.MANDATORYDISPOSITION"
+                    >MandatoryDisposition</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.mailAccount.mandatoryDisposition"
+                class="md-block"
+              >
+                <label translate="MAIL.MANDATORYDISPOSITIONPAUSEID"
+                  >MandatoryDispositionPauseId</label
+                >
+                <md-select
+                  name="mandatoryDispositionPauseId"
+                  ng-model="vm.mailAccount.mandatoryDispositionPauseId"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="mandatoryDispositionPauseId.id"
+                    ng-repeat="mandatoryDispositionPauseId in vm.pauses"
+                    ng-disabled="mandatoryDispositionPauseId.canSelect === false"
+                    >{{ mandatoryDispositionPauseId.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span
+                    translate="MAIL.HELP.MANDATORYDISPOSITIONPAUSEID"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="dispositionForm['mandatoryDispositionPauseId'].$error"
+                  ng-show="dispositionForm['mandatoryDispositionPauseId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MAIL.ERRORS.MANDATORYDISPOSITIONPAUSEID_REQUIRED"
+                      >MandatoryDispositionPauseId field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="MAIL.DISPOSITIONS">DISPOSITIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            ng-controller="MailAccountDispositionsController as vm_dc"
+            ng-init="vm_dc.init(vm.mailAccount, vm.crudPermissions)"
+          >
+            <div layout="row">
+              <div class="column" flex="20">
+                <md-card class="mt-0">
+                  <md-card-content>
+                    <button
+                      layout-align="center center"
+                      md-mini-fab
+                      ng-click="vm_dc.query.level = null; vm_dc.getDispositions()"
+                    >
+                      <div layout="row" layout-align="start center">
+                        <md-icon md-font-icon="icon-refresh"></md-icon>
+                        <span class="ph-5"
+                          >{{ 'TOOLS.ALL_DISPOSITIONS' | translate }}</span
+                        >
+                      </div>
+                    </button>
+                  </md-card-content>
+                </md-card>
+                <md-card>
+                  <md-card-content>
+                    <md-input-container class="md-block" flex-gt-sm="">
+                      <label translate="TOOLS.SELECT_LEVEL"
+                        >Select a level</label
+                      >
+                      <md-select
+                        placeholder="{{ 'TOOLS.SELECT_LEVEL' | translate }}"
+                        ng-model="vm_dc.query.level"
+                        ng-change="vm_dc.getDispositions()"
+                      >
+                        <md-option ng-value="null"
+                          ><em translate="TOOLS.ALL">All</em></md-option
+                        >
+                        <md-option
+                          ng-value="key"
+                          ng-repeat="(key, value) in vm_dc.levels"
+                          >{{ value }}</md-option
+                        >
+                      </md-select>
+                    </md-input-container>
+                  </md-card-content>
+                </md-card>
+              </div>
+              <div
+                class="mailAccount-detail-form-container maildispositions md-background-bg md-whiteframe-1dp"
+                flex="80"
+              >
+                <md-toolbar
+                  class="md-table-toolbar md-default"
+                  ng-hide="vm_dc.selectedMailAccountDispositions.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead" translate="MAIL.DISPOSITIONS"
+                      >Dispositions</span
+                    >
+                    <ms-search-bar
+                      on-search="vm_dc.query.filter = query"
+                      on-collapse="vm_dc.query.filter = undefined"
+                      debounce="300"
+                      direction="down"
+                    ></ms-search-bar>
+                    <div flex></div>
+                    <md-button
+                      ng-if="vm_dc.crudPermissions.canEdit"
+                      class="md-icon-button"
+                      ng-click="vm_dc.createOrEditDisposition($event)"
+                      aria-label="Add mail dispositions"
+                      translate
+                      translate-attr-label="MAIL.ADD_DISPOSITION"
+                    >
+                      <md-icon md-font-icon="icon-plus"></md-icon>
+                    </md-button>
+                  </div>
+                </md-toolbar>
+                <md-toolbar
+                  class="md-table-toolbar md-accent"
+                  ng-show="vm_dc.selectedDispositions.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead"
+                      >{{vm_dc.selectedDispositions.length}}
+                      {{vm_dc.selectedDispositions.length > 1 ? 'items' :
+                      'item'}} selected</span
+                    >
+                    <div flex></div>
+                    <button
+                      class="md-icon-button"
+                      ng-csv="vm_dc.exportSelectedDispositions"
+                      csv-label="true"
+                      filename="mailAccounts.csv"
+                    >
+                      <md-icon md-font-icon="icon-file-excel"></md-icon>
+                    </button>
+                    <md-button
+                      ng-if="vm_dc.crudPermissions.canDelete"
+                      class="md-icon-button"
+                      ng-click="vm_dc.deleteSelectedDispositions($event)"
+                      aria-label="delete selected"
+                      translate
+                      translate-attr-label="MAIL.DELETE_SELECTED"
+                    >
+                      <md-icon md-font-icon="icon-delete"></md-icon>
+                    </md-button>
+                  </div>
+                </md-toolbar>
+                <md-table-container>
+                  <table
+                    md-table
+                    md-row-select
+                    multiple
+                    ng-model="vm_dc.selectedDispositions"
+                    md-progress="vm_dc.promise"
+                  >
+                    <thead
+                      md-head
+                      md-order="vm_dc.query.sort"
+                      md-on-reorder="vm_dc.getDispositions"
+                    >
+                      <tr md-row>
+                        <th md-column md-order-by="id">
+                          {{ 'MAIL.ID' | translate }}
+                        </th>
+                        <th md-column md-order-by="level">
+                          {{ 'TOOLS.LEVEL' | translate }}
+                        </th>
+                        <th md-column md-order-by="name">
+                          {{ 'MAIL.NAME' | translate }}
+                        </th>
+                        <th md-column md-order-by="description">
+                          {{ 'MAIL.DESCRIPTION' | translate }}
+                        </th>
+                        <th md-column width="10px"></th>
+                      </tr>
+                    </thead>
+                    <tbody md-body>
+                      <tr md-row ng-hide="vm_dc.dispositions.rows.length">
+                        <td md-cell colspan="5">
+                          <div layout="row" layout-align="center center">
+                            <span translate="MAIL.NO_AVAILABLE_INFO"
+                              >No Available Info</span
+                            >
+                          </div>
+                        </td>
+                      </tr>
+                      <tr
+                        md-row
+                        md-select="disposition"
+                        md-select-id="id"
+                        ng-repeat="disposition in vm_dc.dispositions.rows"
+                      >
+                        <td
+                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                          md-cell
+                          class="id"
+                        >
+                          {{disposition.id}}
+                        </td>
+                        <td
+                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                          md-cell
+                          class="level"
+                        >
+                          {{ vm_dc.levels[disposition.level] }}
+                        </td>
+                        <td
+                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                          md-cell
+                          class="name"
+                        >
+                          {{disposition.name}}
+                        </td>
+                        <td
+                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                          md-cell
+                          class="description"
+                        >
+                          {{disposition.description}}
+                        </td>
+                        <td
+                          md-cell
+                          class="actions"
+                          ng-if="!vm_dc.crudPermissions.readOnly"
+                        >
+                          <md-menu>
+                            <md-button
+                              class="md-icon-button"
+                              aria-label="More"
+                              translate
+                              translate-attr-aria-label="MAIL.MORE"
+                              ng-click="$mdOpenMenu($event)"
+                            >
+                              <md-icon
+                                md-font-icon="icon-dots-vertical"
+                              ></md-icon>
+                            </md-button>
+                            <md-menu-content width="3">
+                              <!-- SUBACTIONS -->
+                              <!-- ACTIONS -->
+                              <md-menu-item
+                                ng-if="vm_dc.crudPermissions.canEdit"
+                              >
+                                <md-button
+                                  ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                                  translate="TOOLS.EDIT_DISPOSITION"
+                                >
+                                  Edit Disposition
+                                </md-button>
+                              </md-menu-item>
+                              <!-- SUBACTIONS -->
+                              <!-- ACTIONS -->
+                              <md-menu-item
+                                ng-if="vm_dc.crudPermissions.canDelete"
+                              >
+                                <md-button
+                                  ng-click="vm_dc.deleteConfirm(disposition, $event)"
+                                  translate="TOOLS.DELETE_DISPOSITION"
+                                >
+                                  Delete Disposition
+                                </md-button>
+                              </md-menu-item>
+                            </md-menu-content>
+                          </md-menu>
+                        </td>
+                      </tr>
+                    </tbody>
+                  </table>
+                </md-table-container>
+                <md-table-pagination
+                  md-label="{page: '{{'MAIL.PAGE' | translate}}:', rowsPerPage: '{{'MAIL.ROWSPERPAGE' | translate}}:', of: '{{'MAIL.OF' | translate}}'}"
+                  md-limit="vm_dc.query.limit"
+                  md-limit-options="[10, 15, 20, 50, 100, 250]"
+                  md-page="vm_dc.query.page"
+                  md-total="{{vm_dc.dispositions.count}}"
+                  md-on-paginate="vm_dc.getDispositions"
+                  md-page-select
+                >
+                </md-table-pagination>
+              </div>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="MAIL.CANNEDANSWERS">CANNEDANSWERS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="mailAccount-detail-form-container mailcannedanswers md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="MailAccountMailCannedAnswersController as vm_dc"
+              ng-init="vm_dc.init(vm.mailAccount, vm.crudPermissions)"
+            >
+              <md-toolbar
+                class="md-table-toolbar md-default"
+                ng-hide="vm_dc.selectedMailAccountMailCannedAnswers.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead" translate="MAIL.MAILCANNEDANSWERS"
+                    >MailCannedAnswers</span
+                  >
+                  <ms-search-bar
+                    on-search="vm_dc.query.filter = query"
+                    on-collapse="vm_dc.query.filter = undefined"
+                    debounce="300"
+                    direction="down"
+                  ></ms-search-bar>
+                  <div flex></div>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canEdit"
+                    class="md-icon-button"
+                    ng-click="vm_dc.createOrEditMailAccountMailCannedAnswer($event)"
+                    aria-label="add mailCannedAnswer"
+                    translate
+                    translate-attr-label="MAIL.ADD_MAILCANNEDANSWER"
+                  >
+                    <md-icon md-font-icon="icon-plus"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-toolbar
+                class="md-table-toolbar md-accent"
+                ng-show="vm_dc.selectedMailAccountMailCannedAnswers.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead"
+                    >{{vm_dc.selectedMailAccountMailCannedAnswers.length}}
+                    {{vm_dc.selectedMailAccountMailCannedAnswers.length > 1 ?
+                    'items' : 'item'}} selected</span
+                  >
+                  <div flex></div>
+                  <button
+                    class="md-icon-button"
+                    ng-csv="vm_dc.exportSelectedMailAccountMailCannedAnswers"
+                    csv-label="true"
+                    filename="mailAccounts.csv"
+                  >
+                    <md-icon md-font-icon="icon-file-excel"></md-icon>
+                  </button>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canDelete"
+                    class="md-icon-button"
+                    ng-click="vm_dc.deleteSelectedMailAccountMailCannedAnswers($event)"
+                    aria-label="delete selected"
+                    translate
+                    translate-attr-label="MAIL.DELETE_SELECTED"
+                  >
+                    <md-icon md-font-icon="icon-delete"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-table-container class="font-size-12">
+                <table
+                  md-table
+                  md-row-select
+                  multiple
+                  ng-model="vm_dc.selectedMailAccountMailCannedAnswers"
+                  md-progress="vm_dc.promise"
+                >
+                  <thead
+                    md-head
+                    md-order="vm_dc.query.sort"
+                    md-on-reorder="vm_dc.getMailAccountMailCannedAnswers"
+                  >
+                    <tr md-row>
+                      <th md-column md-order-by="id">
+                        {{ 'MAIL.ID' | translate }}
+                      </th>
+                      <th md-column md-order-by="key">
+                        {{ 'MAIL.KEY' | translate }}
+                      </th>
+                      <th md-column md-order-by="value">
+                        {{ 'MAIL.VALUE' | translate }}
+                      </th>
+                      <th md-column md-order-by="description">
+                        {{ 'MAIL.DESCRIPTION' | translate }}
+                      </th>
+                      <th md-column md-order-by="createdAt">
+                        {{ 'MAIL.CREATED_AT' | translate }}
+                      </th>
+                      <th md-column width="10px"></th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr
+                      md-row
+                      md-select="mailCannedAnswer"
+                      md-select-id="id"
+                      ng-repeat="mailCannedAnswer in vm_dc.mailAccountMailCannedAnswers.rows"
+                    >
+                      <td
+                        ng-click="vm_dc.createOrEditMailAccountMailCannedAnswer($event, mailCannedAnswer)"
+                        md-cell
+                      >
+                        {{mailCannedAnswer.id}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditMailAccountMailCannedAnswer($event, mailCannedAnswer)"
+                        md-cell
+                      >
+                        {{mailCannedAnswer.key}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditMailAccountMailCannedAnswer($event, mailCannedAnswer)"
+                        md-cell
+                      >
+                        {{mailCannedAnswer.value | htmlToPlaintext }}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditMailAccountMailCannedAnswer($event, mailCannedAnswer)"
+                        md-cell
+                      >
+                        {{mailCannedAnswer.description}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditMailAccountMailCannedAnswer($event, mailCannedAnswer)"
+                        md-cell
+                      >
+                        {{ mailCannedAnswer.createdAt | formatdate }}
+                      </td>
+                      <td
+                        md-cell
+                        class="actions"
+                        ng-if="!vm_dc.crudPermissions.readOnly"
+                      >
+                        <md-menu>
+                          <md-button
+                            class="md-icon-button"
+                            aria-label="More"
+                            translate
+                            translate-attr-aria-label="MAIL.MORE"
+                            ng-click="$mdOpenMenu($event)"
+                          >
+                            <md-icon
+                              md-font-icon="icon-dots-vertical"
+                            ></md-icon>
+                          </md-button>
+
+                          <md-menu-content width="3">
+                            <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
+                              <md-button
+                                ng-click="vm_dc.createOrEditMailAccountMailCannedAnswer($event, mailCannedAnswer)"
+                                translate="MAIL.EDIT_MAILCANNEDANSWER"
+                              >
+                                Edit MailCannedAnswer
+                              </md-button>
+                            </md-menu-item>
+                            <md-menu-item
+                              ng-if="vm_dc.crudPermissions.canDelete"
+                            >
+                              <md-button
+                                ng-click="vm_dc.deleteConfirm(mailCannedAnswer, $event)"
+                                translate="MAIL.DELETE_MAILCANNEDANSWER"
+                              >
+                                Delete MailCannedAnswer
+                              </md-button>
+                            </md-menu-item>
+                          </md-menu-content>
+                        </md-menu>
+                      </td>
+                    </tr>
+                    <tr
+                      md-row
+                      ng-if="!vm_dc.mailAccountMailCannedAnswers.rows.length"
+                    >
+                      <td md-cell colspan="7">
+                        <div layout="row" layout-align="center center">
+                          <span
+                            class="text-boxed-light"
+                            translate="MAIL.NO_MAILCANNEDANSWER_AVAILABLE"
+                            >No mailcannedanswer available</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+              <md-table-pagination
+                md-label="{page: '{{'MAIL.PAGE' | translate}}:', rowsPerPage: '{{'MAIL.ROWSPERPAGE' | translate}}:', of: '{{'MAIL.OF' | translate}}'}"
+                md-limit="vm_dc.query.limit"
+                md-limit-options="[10, 15, 20, 50, 100, 250]"
+                md-page="vm_dc.query.page"
+                md-total="{{vm_dc.mailAccountMailCannedAnswers.count}}"
+                md-on-paginate="vm_dc.getMailAccountMailCannedAnswers"
+                md-page-select
+              ></md-table-pagination>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="MAIL.ACTIONS">ACTIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="mailAccount-detail-form-container actions md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="MailAccountActionsController as vm_ac"
+              ng-init="vm_ac.init(vm.mailAccount, vm.crudPermissions)"
+              class="content"
+              md-background-bg
+              layout="row"
+              layout-align="start start"
+            >
+              <!-- SIDENAV -->
+              <div
+                class="navigation-simple sidenav main-sidenav md-background-bg md-whiteframe-1dp"
+                ms-scroll
+                layout="column"
+                flex="20"
+                ng-if="vm_ac.crudPermissions.canEdit"
+              >
+                <!-- SIDENAV CONTENT -->
+                <md-list class="no-padding">
+                  <md-subheader class="md-no-sticky">
+                    <span translate="VOICE.APPLICATIONS_LIST">
+                      Applications List
+                    </span>
+                  </md-subheader>
+                </md-list>
+                <md-divider></md-divider>
+                <md-list ng-sortable="vm_ac.list">
+                  <md-list-item class="handle" ng-repeat="a in vm_ac.apps">
+                    <md-icon md-font-icon="{{a.icon}}" class="s16"></md-icon>
+                    <p
+                      class="text-truncate"
+                      translate="MAIL.{{(a.alias || a.appType) | uppercase}}"
+                    >
+                      {{a.alias || a.appType}}
+                    </p>
+                  </md-list-item>
+                </md-list>
+                <!-- / SIDENAV CONTENT -->
+              </div>
+              <!-- / SIDENAV -->
+              <div flex></div>
+              <!-- MAIN -->
+              <div
+                class="main scrollable md-background-bg md-whiteframe-1dp"
+                ms-scroll
+                layout="column"
+                flex="{{vm_ac.crudPermissions.canEdit ? 75 : 100}}"
+              >
+                <md-toolbar
+                  class="md-table-toolbar md-default"
+                  ng-hide="vm_ac.selectedMailAccountApps.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead">Drag & Drop Routing</span>
+                    <div flex></div>
+                    <ms-search-bar
+                      on-search="vm_ac.query.filter = query"
+                      on-collapse="vm_ac.query.filter = undefined"
+                      debounce="300"
+                    ></ms-search-bar>
+                  </div>
+                </md-toolbar>
+                <md-toolbar
+                  class="md-table-toolbar md-accent"
+                  ng-show="vm_ac.selectedMailAccountApps.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead"
+                      >{{vm_ac.selectedMailAccountApps.length}}
+                      {{vm_ac.selectedMailAccountApps.length > 1 ? 'items' :
+                      'item'}} selected</span
+                    >
+                    <div flex></div>
+                    <md-button
+                      ng-if="vm_ac.crudPermissions.canDelete"
+                      class="md-icon-button"
+                      ng-click="vm_ac.deleteSelectedMailAccountApps($event)"
+                      aria-label="delete selected"
+                      translate
+                      translate-attr-label="MAIL.DELETE_SELECTED"
+                    >
+                      <md-icon md-font-icon="icon-delete"></md-icon>
+                    </md-button>
+                  </div>
+                </md-toolbar>
+
+                <!-- QUEUES TABLE -->
+                <md-table-container>
+                  <table
+                    md-table
+                    md-row-select
+                    multiple
+                    ng-model="vm_ac.selectedMailAccountApps"
+                  >
+                    <thead md-head>
+                      <tr md-row>
+                        <th md-column width="10px"></th>
+                        <th md-column width="10px">
+                          <span translate="VOICE.PRIORITY">Priority</span>
+                        </th>
+                        <th md-column>
+                          <span>Type</span>
+                        </th>
+                        <th md-column>
+                          <span>Appdata</span>
+                        </th>
+                        <th md-column>
+                          <span>Interval</span>
+                        </th>
+                        <th md-column width="10px"></th>
+                        <th md-column width="10px"></th>
+                      </tr>
+                    </thead>
+                    <tbody md-body ng-sortable="vm_ac.applications">
+                      <tr
+                        md-row
+                        md-select="app"
+                        md-select-id="id"
+                        ng-repeat="app in vm_ac.mailAccountApps.rows | filter: vm_ac.query.filter"
+                      >
+                        <td md-cell>
+                          <md-icon
+                            md-font-icon="icon-drag-vertical"
+                            class="s16 handle"
+                          ></md-icon>
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editMailAccountApp($event, $index)"
+                        >
+                          <span>{{app.priority}}</span>
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editMailAccountApp($event, $index)"
+                        >
+                          {{app.app.toLowerCase() === 'agi' ? 'Cally-Square' :
+                          app.app | ucfirst}}<span
+                            ng-if="app.appType.toLowerCase() === 'custom'"
+                            >*</span
+                          >
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editMailAccountApp($event, $index)"
+                        >
+                          <span class="text-truncate" style="width: 200px"
+                            >{{app.appdata}}</span
+                          >
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editInterval($event, $index)"
+                        >
+                          {{app.IntervalId ? 'From List' : app.interval}}
+                        </td>
+                        <td md-cell>
+                          <md-button
+                            ng-click="vm_ac.editInterval($event, $index)"
+                            class="md-icon-button"
+                            aria-label="Interval"
+                          >
+                            <md-icon md-font-icon="icon-timer"></md-icon>
+                            <md-tooltip>
+                              {{app.IntervalId ? 'From List' : (app.interval ===
+                              '*,*,*,*' ? 'Always' : 'Custom')}}
+                            </md-tooltip>
+                          </md-button>
+                        </td>
+                        <td
+                          md-cell
+                          class="actions"
+                          ng-if="!vm_ac.crudPermissions.readOnly"
+                        >
+                          <md-menu>
+                            <md-button
+                              class="md-icon-button"
+                              aria-label="More"
+                              translate
+                              translate-attr-aria-label="VOICE.MORE"
+                              ng-click="$mdOpenMenu($event)"
+                            >
+                              <md-icon
+                                md-font-icon="icon-dots-vertical"
+                              ></md-icon>
+                            </md-button>
+
+                            <md-menu-content width="3">
+                              <md-menu-item
+                                ng-if="vm_ac.crudPermissions.canEdit"
+                              >
+                                <md-button
+                                  ng-click="vm_ac.editMailAccountApp($event, $index)"
+                                  translate="VOICE.EDIT_APP"
+                                >
+                                  Edit App
+                                </md-button>
+                              </md-menu-item>
+                              <md-menu-item
+                                ng-if="vm_ac.crudPermissions.canEdit"
+                              >
+                                <md-button
+                                  ng-click="vm_ac.editInterval($event, $index)"
+                                  translate="VOICE.EDIT_INTERVAL"
+                                >
+                                  Edit Interval
+                                </md-button>
+                              </md-menu-item>
+                              <md-menu-item
+                                ng-if="vm_ac.crudPermissions.canDelete"
+                              >
+                                <md-button
+                                  ng-click="vm_ac.deleteConfirm(app, $index, $event)"
+                                  translate="VOICE.DELETE_APP"
+                                >
+                                  Delete App
+                                </md-button>
+                              </md-menu-item>
+                            </md-menu-content>
+                          </md-menu>
+                        </td>
+                      </tr>
+                      <tr md-row ng-hide="vm_ac.mailAccountApps.rows.length">
+                        <td md-cell colspan="7">
+                          <span
+                            class="text-boxed-light"
+                            translate="VOICE.NO_APPS_AVAILABLE"
+                            >No apps available</span
+                          >
+                        </td>
+                      </tr>
+                    </tbody>
+                  </table>
+                </md-table-container>
+                <!-- / QUEUES TABLE -->
+
+                <!-- NO RESULTS -->
+
+                <!-- / NO RESULTS -->
+              </div>
+              <!-- / MAIN -->
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="MAIL.INTERACTIONS">INTERACTIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="mailAccount-detail-form-container interactions md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="MailAccountInteractionsController as vm_dc"
+              ng-init="vm_dc.init(vm.mailAccount, vm.crudPermissions)"
+            >
+              <md-toolbar
+                class="md-table-toolbar md-default"
+                ng-hide="vm_dc.selectedMailAccountInteractions.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead" translate="MAIL.INTERACTIONS"
+                    >Interactions</span
+                  >
+                  <ms-search-bar
+                    on-search="vm_dc.query.filter = query"
+                    on-collapse="vm_dc.query.filter = undefined"
+                    debounce="300"
+                    direction="down"
+                  ></ms-search-bar>
+                  <div flex></div>
+                  <ms-quick-filter
+                    filters="vm_dc.quickFilters"
+                    query="vm_dc.query"
+                    search="vm_dc.getMailAccountInteractions()"
+                  ></ms-quick-filter>
+                  <div layout="column">
+                    <md-button
+                      class="md-icon-button advanced-search"
+                      ng-class="{ 'md-fab md-mini md-accent-bg': vm_dc.query.search }"
+                      aria-label="Filter"
+                      translate
+                      translate-attr-aria-label="DASHBOARDS.FILTER"
+                      ng-click="vm_dc.openAdvancedSearch()"
+                    >
+                      <md-icon
+                        md-font-icon="{{ vm_dc.query.search ? 'icon-filter' : 'icon-filter-outline' }}"
+                        ng-class="{ 'blink': vm_dc.query.search }"
+                      ></md-icon>
+                    </md-button>
+                  </div>
+                  <md-button
+                    class="md-icon-button"
+                    ng-click="vm_dc.getMailAccountInteractions()"
+                    aria-label="refresh Interactions"
+                    translate
+                    translate-attr-label="MAIL.REFRESH_INTERACTIONS"
+                  >
+                    <md-icon md-font-icon="icon-refresh"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-toolbar
+                class="md-table-toolbar md-accent"
+                ng-show="vm_dc.selectedMailAccountInteractions.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead"
+                    >{{vm_dc.selectedMailAccountInteractions.length}}
+                    {{vm_dc.selectedMailAccountInteractions.length > 1 ? 'items'
+                    : 'item'}} selected</span
+                  >
+                  <div flex></div>
+                  <button
+                    class="md-icon-button"
+                    ng-csv="vm_dc.exportSelectedMailAccountInteractions"
+                    csv-label="true"
+                    filename="mailAccounts.csv"
+                  >
+                    <md-icon md-font-icon="icon-file-excel"></md-icon>
+                  </button>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canDelete"
+                    class="md-icon-button"
+                    ng-click="vm_dc.deleteSelectedMailAccountInteractions($event)"
+                    aria-label="delete selected"
+                    translate
+                    translate-attr-label="MAIL.DELETE_SELECTED"
+                  >
+                    <md-icon md-font-icon="icon-delete"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-table-container class="font-size-12">
+                <table
+                  md-table
+                  md-row-select
+                  multiple
+                  ng-model="vm_dc.selectedMailAccountInteractions"
+                  md-progress="vm_dc.promise"
+                >
+                  <thead
+                    md-head
+                    md-order="vm_dc.query.sort"
+                    md-on-reorder="vm_dc.getMailAccountInteractions"
+                  >
+                    <tr md-row>
+                      <th md-column md-order-by="id">
+                        {{ 'MAIL.ID' | translate }}
+                      </th>
+                      <th md-column class="no-padding">
+                        <md-icon md-font-icon="icon-eye" class="s16"></md-icon>
+                      </th>
+                      <th md-column class="no-padding"></th>
+                      <th md-column class="no-padding"></th>
+                      <th md-column>{{ 'MAIL.CONTACT' | translate }}</th>
+                      <th md-column md-order-by="subject">
+                        {{ 'MAIL.SUBJECT' | translate }}
+                      </th>
+                      <th md-column md-order-by="createdAt">
+                        {{ 'MAIL.STARTEDAT' | translate }}
+                      </th>
+                      <th md-column md-order-by="lastMsgAt">
+                        {{ 'MAIL.LASTMESSAGE' | translate }}
+                      </th>
+                      <th md-column md-order-by="closed">
+                        {{ 'MAIL.STATUS' | translate }}
+                      </th>
+                      <th md-column>{{ 'MAIL.AGENT' | translate }}</th>
+                      <th md-column md-order-by="tag">
+                        {{ 'MAIL.TAGS' | translate }}
+                      </th>
+                      <th md-column width="10px"></th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr
+                      md-row
+                      md-select="interaction"
+                      md-select-id="id"
+                      ng-repeat="interaction in vm_dc.mailAccountInteractions.rows"
+                      ng-class="{'text-bold text-italic': interaction.unreadMessages > 0}"
+                    >
+                      <td md-cell>{{interaction.id}}</td>
+                      <td md-cell class="no-padding">
+                        <div
+                          ng-if="!interaction.closed && interaction.Users.length"
+                        >
+                          <md-icon
+                            md-font-icon="icon-eye"
+                            class="s16"
+                          ></md-icon>
+                          <md-tooltip>
+                            <span ng-repeat="user in interaction.Users"
+                              >{{ user.fullname | translate }}
+                              <span ng-if="!$last">, </span>
+                            </span>
+                          </md-tooltip>
+                        </div>
+                      </td>
+                      <td md-cell class="no-padding">
+                        <div
+                          ng-if="interaction.unreadMessages > 0"
+                          layout="row"
+                          layout-align="start center"
+                        >
+                          <span
+                            class="badge white-fg md-primary-bg"
+                            layout-margin
+                            >{{ interaction.unreadMessages}}</span
+                          >
+                        </div>
+                      </td>
+                      <td md-cell class="no-padding">
+                        <div ng-if="interaction.attach">
+                          <md-icon
+                            md-font-icon="icon-paperclip"
+                            class="s16"
+                          ></md-icon>
+                        </div>
+                      </td>
+                      <td md-cell>
+                        <div layout="column" layout-align="start start">
+                          <span
+                            class="font-size-12 text-truncate contact-text"
+                            ng-class="{'margin-bottom-0' : interaction.contactInfo}"
+                            layout-margin
+                            >{{ interaction.contactName }}</span
+                          >
+                          <span
+                            ng-if="interaction.contactInfo"
+                            class="font-size-12 text-truncate contact-text margin-top-0"
+                            layout-margin
+                            >{{ interaction.contactInfo }}</span
+                          >
+                        </div>
+                      </td>
+                      <td md-cell>
+                        <div class="width-300">
+                          <span class="text-truncate font-size-12">
+                            {{interaction.subject}}
+                          </span>
+                        </div>
+                      </td>
+                      <td md-cell>{{ interaction.createdAt | formatdate }}</td>
+                      <td md-cell>
+                        <div layout="row">
+                          <span>
+                            <md-icon
+                              md-font-icon="{{interaction.lastMsgDirection == 'in' ? 'icon-arrow-down-bold blue-grey-800-fg' : 'icon-arrow-up-bold blue-grey-300-fg'}}"
+                            ></md-icon>
+                          </span>
+                          <div layout="column" layout-align="center center">
+                            <span class="text-truncate"
+                              >{{ interaction.lastMsgAt | formatdate }}</span
+                            >
+                          </div>
+                        </div>
+                      </td>
+                      <td md-cell>
+                        <span ng-if="interaction.closed === 0" class="green-fg">
+                          {{ 'MAIL.OPENED' | translate }}
+                          <span ng-if="interaction.substatus">
+                            - {{ interaction.substatus }}
+                          </span>
+                        </span>
+                        <span ng-if="interaction.closed === 1" class="red-fg">
+                          {{ 'MAIL.CLOSED' | translate }}
+                          <span ng-if="interaction.disposition">
+                            - {{ interaction.thirdDisposition ||
+                            interaction.secondDisposition ||
+                            interaction.disposition }}
+                          </span>
+                          <md-tooltip class="multiline">
+                            <div layout="column">
+                              <div layout="column">
+                                <span
+                                  >{{ 'DASHBOARDS.CLOSED_AT' |
+                                  translate}}:</span
+                                >
+                                <span class="text-bold"
+                                  >{{ interaction.closedAt | formatdate }}</span
+                                >
+                              </div>
+                              <div
+                                ng-if="interaction.disposition"
+                                layout="column"
+                              >
+                                <span
+                                  >{{ 'DASHBOARDS.DISPOSITION' |
+                                  translate}}:</span
+                                >
+                                <span class="text-bold"
+                                  >{{ interaction.disposition }}</span
+                                >
+                              </div>
+                              <div
+                                ng-if="interaction.secondDisposition"
+                                layout="column"
+                              >
+                                <span
+                                  >{{ 'DASHBOARDS.SECOND_LEVEL_DISPOSITION' |
+                                  translate}}:</span
+                                >
+                                <span class="text-bold"
+                                  >{{ interaction.secondDisposition }}</span
+                                >
+                              </div>
+                              <div
+                                ng-if="interaction.thirdDisposition"
+                                layout="column"
+                              >
+                                <span
+                                  >{{ 'DASHBOARDS.THIRD_LEVEL_DISPOSITION' |
+                                  translate}}:</span
+                                >
+                                <span class="text-bold"
+                                  >{{ interaction.thirdDisposition }}</span
+                                >
+                              </div>
+                            </div>
+                          </md-tooltip>
+                        </span>
+                      </td>
+
+                      <td md-cell>{{interaction.Owner.name}}</td>
+                      <td md-cell>
+                        <div ng-if="interaction.Tags.length">
+                          <md-tooltip md-direction="left" layout="row">
+                            <span ng-repeat="tag in interaction.Tags"
+                              >{{tag.name}}<span ng-if="!$last">, </span></span
+                            >
+                          </md-tooltip>
+                          <md-icon
+                            md-font-icon="icon-tag"
+                            ng-style="{'color': interaction.Tags.length == 1 && interaction.Tags[0].color }"
+                          >
+                          </md-icon>
+                        </div>
+                      </td>
+                      <td md-cell class="actions">
+                        <md-menu>
+                          <md-button
+                            class="md-icon-button"
+                            aria-label="More"
+                            translate
+                            translate-attr-aria-label="MAIL.MORE"
+                            ng-click="$mdOpenMenu($event)"
+                          >
+                            <md-icon
+                              md-font-icon="icon-dots-vertical"
+                            ></md-icon>
+                          </md-button>
+
+                          <md-menu-content width="3">
+                            <md-menu-item>
+                              <md-button
+                                ng-click="vm_dc.spymailInteraction($event, interaction)"
+                                translate="MAIL.SPYINTERACTION"
+                              >
+                                Spy Interaction
+                              </md-button>
+                            </md-menu-item>
+                            <md-menu-item>
+                              <md-button
+                                class="md-primary"
+                                ng-click="vm_dc.mailInteractionDownload(interaction, $event, true)"
+                                translate="MAIL.DOWNLOAD_WITH_ATTACHMENTS"
+                              >
+                                Download with attachments
+                              </md-button>
+                            </md-menu-item>
+                            <md-menu-item>
+                              <md-button
+                                class="md-primary"
+                                ng-click="vm_dc.mailInteractionDownload(interaction, $event)"
+                                translate="MAIL.DOWNLOAD_WITHOUT_ATTACHMENTS"
+                              >
+                                Download without attachments
+                              </md-button>
+                            </md-menu-item>
+                            <md-menu-item
+                              ng-if="vm_dc.crudPermissions.canDelete"
+                            >
+                              <md-button
+                                ng-click="vm_dc.deleteConfirm(interaction, $event)"
+                                translate="MAIL.DELETE_INTERACTION"
+                              >
+                                Delete Interaction
+                              </md-button>
+                            </md-menu-item>
+                          </md-menu-content>
+                        </md-menu>
+                      </td>
+                    </tr>
+                    <tr
+                      md-row
+                      ng-if="!vm_dc.mailAccountInteractions.rows.length"
+                    >
+                      <td md-cell colspan="13">
+                        <div layout="row" layout-align="center center">
+                          <span
+                            class="text-boxed-light"
+                            translate="MAIL.NO_INTERACTION_AVAILABLE"
+                            >No interaction available</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+              <md-table-pagination
+                md-label="{page: '{{'MAIL.PAGE' | translate}}:', rowsPerPage: '{{'MAIL.ROWSPERPAGE' | translate}}:', of: '{{'MAIL.OF' | translate}}'}"
+                md-limit="vm_dc.query.limit"
+                md-limit-options="[10, 15, 20, 50, 100, 250]"
+                md-page="vm_dc.query.page"
+                md-total="{{vm_dc.mailAccountInteractions.count}}"
+                md-on-paginate="vm_dc.getMailAccountInteractions"
+                md-page-select
+              ></md-table-pagination>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/mailAccounts.html/mailAccounts-[chunkhash].html b/public/src/js/modules/main/apps/mail/views/mailAccounts/mailAccounts.html/mailAccounts-[chunkhash].html
deleted file mode 100644
index 8ec6b38..0000000
--- a/public/src/js/modules/main/apps/mail/views/mailAccounts/mailAccounts.html/mailAccounts-[chunkhash].html
+++ /dev/null
@@ -1,380 +0,0 @@
-<div
-  id="mailAccounts"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-email" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="MAIL.MAILACCOUNTS"
-          >MailAccounts</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="MAIL.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedMailAccounts.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedMailAccounts =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="MAIL.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-mailAccounts-count">
-          <span>{{vm.selectedMailAccounts.length}}</span>
-          <span translate="MAIL.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="MAIL.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllMailAccounts()"
-                translate="MAIL.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectMailAccounts()"
-                translate="MAIL.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedMailAccounts"
-          csv-label="true"
-          filename="mailAccounts.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedMailAccounts($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="MAIL.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- MAILACCOUNT TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedMailAccounts"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getMailAccounts"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'MAIL.ID' | translate }}</th>
-                <th md-column md-order-by="name">
-                  {{ 'MAIL.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="key">
-                  {{ 'MAIL.KEY' | translate }}
-                </th>
-                <th md-column md-order-by="email">
-                  {{ 'MAIL.EMAIL_ADDRESS' | translate }}
-                </th>
-                <th md-column md-order-by="active">
-                  {{ 'MAIL.ACTIVE' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'MAIL.DESCRIPTION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.mailAccounts.rows.length">
-                <td md-cell colspan="7">
-                  <div layout="row" layout-align="center center">
-                    <span translate="MAIL.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="mailAccount"
-                md-select-id="id"
-                ng-repeat="mailAccount in vm.mailAccounts.rows"
-              >
-                <td md-cell ng-if="mailAccount.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{mailAccount.name}}"
-                    ng-src="api/users/{{mailAccount.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!mailAccount.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{mailAccount.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(mailAccount, ev) : vm.createOrEditMailAccount($event, mailAccount)"
-                  md-cell
-                  class="id"
-                >
-                  {{mailAccount.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(mailAccount, ev) : vm.createOrEditMailAccount($event, mailAccount)"
-                  md-cell
-                  class="name"
-                >
-                  {{mailAccount.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(mailAccount, ev) : vm.createOrEditMailAccount($event, mailAccount)"
-                  md-cell
-                  class="key"
-                >
-                  {{mailAccount.key}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(mailAccount, ev) : vm.createOrEditMailAccount($event, mailAccount)"
-                  md-cell
-                  class="email"
-                >
-                  {{mailAccount.email}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(mailAccount, ev) : vm.createOrEditMailAccount($event, mailAccount)"
-                  md-cell
-                  class="active"
-                >
-                  <md-icon
-                    md-colors="{color: {{mailAccount.active ? '\'green\'' : '\'grey\''}}}"
-                    md-font-icon="{{mailAccount.active ? 'icon-check' : 'icon-close'}}"
-                  ></md-icon>
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(mailAccount, ev) : vm.createOrEditMailAccount($event, mailAccount)"
-                  md-cell
-                  class="description"
-                >
-                  {{mailAccount.description}}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="MAIL.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(mailAccount, $event    )"
-                          translate="MAIL.EDIT_MAILACCOUNT"
-                        >
-                          Edit MailAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.verifysmtpverifysmtp(mailAccount, $event    )"
-                          translate="MAIL.VERIFYSMTP_MAILACCOUNT"
-                        >
-                          verifysmtp MailAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.interactionsgoto(mailAccount, $event    )"
-                          translate="MAIL.INTERACTIONS_MAILACCOUNT"
-                        >
-                          Interactions MailAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.gotorealtimegoto(mailAccount, $event    )"
-                          translate="MAIL.GOTOREALTIME_MAILACCOUNT"
-                        >
-                          goToRealtime MailAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.agentadddialog(mailAccount, $event    )"
-                          translate="MAIL.AGENTADD_MAILACCOUNT"
-                        >
-                          AgentAdd MailAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(mailAccount, $event    )"
-                          translate="MAIL.DELETE_MAILACCOUNT"
-                        >
-                          Delete MailAccount
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'MAIL.PAGE' | translate}}:', rowsPerPage: '{{'MAIL.ROWSPERPAGE' | translate}}:', of: '{{'MAIL.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.mailAccounts.count}}"
-          md-on-paginate="vm.getMailAccounts"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / MAILACCOUNT TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD MAILACCOUNT BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-mailAccount-button"
-    ng-click="vm.createOrEditMailAccount($event)"
-    aria-label="add mailAccount"
-    translate
-    translate-attr-aria-label="MAIL.ADD_MAILACCOUNT"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD MAILACCOUNT BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/mail/views/mailAccounts/mailAccounts.html/mailAccounts.html b/public/src/js/modules/main/apps/mail/views/mailAccounts/mailAccounts.html/mailAccounts.html
new file mode 100644
index 0000000..8ec6b38
--- /dev/null
+++ b/public/src/js/modules/main/apps/mail/views/mailAccounts/mailAccounts.html/mailAccounts.html
@@ -0,0 +1,380 @@
+<div
+  id="mailAccounts"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-email" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="MAIL.MAILACCOUNTS"
+          >MailAccounts</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="MAIL.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedMailAccounts.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedMailAccounts =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="MAIL.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-mailAccounts-count">
+          <span>{{vm.selectedMailAccounts.length}}</span>
+          <span translate="MAIL.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="MAIL.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllMailAccounts()"
+                translate="MAIL.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectMailAccounts()"
+                translate="MAIL.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedMailAccounts"
+          csv-label="true"
+          filename="mailAccounts.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedMailAccounts($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="MAIL.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- MAILACCOUNT TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedMailAccounts"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getMailAccounts"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'MAIL.ID' | translate }}</th>
+                <th md-column md-order-by="name">
+                  {{ 'MAIL.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="key">
+                  {{ 'MAIL.KEY' | translate }}
+                </th>
+                <th md-column md-order-by="email">
+                  {{ 'MAIL.EMAIL_ADDRESS' | translate }}
+                </th>
+                <th md-column md-order-by="active">
+                  {{ 'MAIL.ACTIVE' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'MAIL.DESCRIPTION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.mailAccounts.rows.length">
+                <td md-cell colspan="7">
+                  <div layout="row" layout-align="center center">
+                    <span translate="MAIL.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="mailAccount"
+                md-select-id="id"
+                ng-repeat="mailAccount in vm.mailAccounts.rows"
+              >
+                <td md-cell ng-if="mailAccount.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{mailAccount.name}}"
+                    ng-src="api/users/{{mailAccount.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!mailAccount.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{mailAccount.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(mailAccount, ev) : vm.createOrEditMailAccount($event, mailAccount)"
+                  md-cell
+                  class="id"
+                >
+                  {{mailAccount.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(mailAccount, ev) : vm.createOrEditMailAccount($event, mailAccount)"
+                  md-cell
+                  class="name"
+                >
+                  {{mailAccount.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(mailAccount, ev) : vm.createOrEditMailAccount($event, mailAccount)"
+                  md-cell
+                  class="key"
+                >
+                  {{mailAccount.key}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(mailAccount, ev) : vm.createOrEditMailAccount($event, mailAccount)"
+                  md-cell
+                  class="email"
+                >
+                  {{mailAccount.email}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(mailAccount, ev) : vm.createOrEditMailAccount($event, mailAccount)"
+                  md-cell
+                  class="active"
+                >
+                  <md-icon
+                    md-colors="{color: {{mailAccount.active ? '\'green\'' : '\'grey\''}}}"
+                    md-font-icon="{{mailAccount.active ? 'icon-check' : 'icon-close'}}"
+                  ></md-icon>
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(mailAccount, ev) : vm.createOrEditMailAccount($event, mailAccount)"
+                  md-cell
+                  class="description"
+                >
+                  {{mailAccount.description}}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="MAIL.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(mailAccount, $event    )"
+                          translate="MAIL.EDIT_MAILACCOUNT"
+                        >
+                          Edit MailAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.verifysmtpverifysmtp(mailAccount, $event    )"
+                          translate="MAIL.VERIFYSMTP_MAILACCOUNT"
+                        >
+                          verifysmtp MailAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.interactionsgoto(mailAccount, $event    )"
+                          translate="MAIL.INTERACTIONS_MAILACCOUNT"
+                        >
+                          Interactions MailAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.gotorealtimegoto(mailAccount, $event    )"
+                          translate="MAIL.GOTOREALTIME_MAILACCOUNT"
+                        >
+                          goToRealtime MailAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.agentadddialog(mailAccount, $event    )"
+                          translate="MAIL.AGENTADD_MAILACCOUNT"
+                        >
+                          AgentAdd MailAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(mailAccount, $event    )"
+                          translate="MAIL.DELETE_MAILACCOUNT"
+                        >
+                          Delete MailAccount
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'MAIL.PAGE' | translate}}:', rowsPerPage: '{{'MAIL.ROWSPERPAGE' | translate}}:', of: '{{'MAIL.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.mailAccounts.count}}"
+          md-on-paginate="vm.getMailAccounts"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / MAILACCOUNT TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD MAILACCOUNT BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-mailAccount-button"
+    ng-click="vm.createOrEditMailAccount($event)"
+    aria-label="add mailAccount"
+    translate
+    translate-attr-aria-label="MAIL.ADD_MAILACCOUNT"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD MAILACCOUNT BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/mail/views/mailQueues/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/mail/views/mailQueues/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 54d0ad6..0000000
--- a/public/src/js/modules/main/apps/mail/views/mailQueues/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,217 +0,0 @@
-<md-dialog class="mailQueue-dialog" aria-label="New MailQueue">
-  <form name="mailQueueForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="MAIL.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.mailQueue.name"
-          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.newMailQueue"
-        />
-
-        <div class="hint"><span translate="MAIL.HELP.NAME"></span></div>
-        <div
-          ng-messages="mailQueueForm['name'].$error"
-          ng-show="mailQueueForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span
-              translate="MAIL.ERRORS.NAME_MUST_VALID_PATTERN"
-              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-              >Name must be valid pattern
-            </span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="MAIL.STRATEGY">Strategy</label>
-        <md-select name="strategy" ng-model="vm.mailQueue.strategy" required>
-          <md-option ng-value="'beepall'">Beepall</md-option>
-          <md-option ng-value="'rrmemory'">RR Memory</md-option>
-        </md-select>
-        <div
-          ng-messages="mailQueueForm['strategy'].$error"
-          ng-show="mailQueueForm['strategy'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.STRATEGY_REQUIRED"
-              >Strategy field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="MAIL.AGENT_TIMEOUT">Agent_Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.mailQueue.timeout"
-          min="1"
-          max="2147483"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="mailQueueForm['timeout'].$error"
-          ng-show="mailQueueForm['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.AGENT_TIMEOUT_REQUIRED"
-              >Agent_Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="MAIL.ERRORS.AGENT_TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Agent_Timeout must be a valid greater or equal than</span
-            >
-            <span>1</span>
-          </div>
-          <div ng-message="max">
-            <span
-              translate="MAIL.ERRORS.AGENT_TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-              >Agent_Timeout must be a valid greater or equal than</span
-            >
-            <span>2147483</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="MAIL.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.mailQueue.description"
-        />
-
-        <div
-          ng-messages="mailQueueForm['description'].$error"
-          ng-show="mailQueueForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newMailQueue"
-          ng-click="vm.saveMailQueue()"
-          class="send-button md-accent md-raised"
-          ng-disabled="mailQueueForm.$invalid || mailQueueForm.$pristine"
-          aria-label="SAVE"
-          translate="MAIL.SAVE"
-          translate-attr-aria-label="MAIL.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newMailQueue"
-          ng-click="vm.addNewMailQueue()"
-          class="send-button md-accent md-raised"
-          ng-disabled="mailQueueForm.$invalid"
-          aria-label="ADD"
-          translate="MAIL.ADD_MAILQUEUE"
-          translate-attr-aria-label="MAIL.ADD_MAILQUEUE"
-        >
-          ADD MAILQUEUE
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newMailQueue"
-          ng-click="vm.deleteMailQueue($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="MAIL.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="MAIL.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailQueues/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/mail/views/mailQueues/create/dialog.html/dialog.html
new file mode 100644
index 0000000..54d0ad6
--- /dev/null
+++ b/public/src/js/modules/main/apps/mail/views/mailQueues/create/dialog.html/dialog.html
@@ -0,0 +1,217 @@
+<md-dialog class="mailQueue-dialog" aria-label="New MailQueue">
+  <form name="mailQueueForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="MAIL.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.mailQueue.name"
+          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.newMailQueue"
+        />
+
+        <div class="hint"><span translate="MAIL.HELP.NAME"></span></div>
+        <div
+          ng-messages="mailQueueForm['name'].$error"
+          ng-show="mailQueueForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span
+              translate="MAIL.ERRORS.NAME_MUST_VALID_PATTERN"
+              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+              >Name must be valid pattern
+            </span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="MAIL.STRATEGY">Strategy</label>
+        <md-select name="strategy" ng-model="vm.mailQueue.strategy" required>
+          <md-option ng-value="'beepall'">Beepall</md-option>
+          <md-option ng-value="'rrmemory'">RR Memory</md-option>
+        </md-select>
+        <div
+          ng-messages="mailQueueForm['strategy'].$error"
+          ng-show="mailQueueForm['strategy'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.STRATEGY_REQUIRED"
+              >Strategy field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="MAIL.AGENT_TIMEOUT">Agent_Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.mailQueue.timeout"
+          min="1"
+          max="2147483"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="mailQueueForm['timeout'].$error"
+          ng-show="mailQueueForm['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.AGENT_TIMEOUT_REQUIRED"
+              >Agent_Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="MAIL.ERRORS.AGENT_TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Agent_Timeout must be a valid greater or equal than</span
+            >
+            <span>1</span>
+          </div>
+          <div ng-message="max">
+            <span
+              translate="MAIL.ERRORS.AGENT_TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+              >Agent_Timeout must be a valid greater or equal than</span
+            >
+            <span>2147483</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="MAIL.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.mailQueue.description"
+        />
+
+        <div
+          ng-messages="mailQueueForm['description'].$error"
+          ng-show="mailQueueForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newMailQueue"
+          ng-click="vm.saveMailQueue()"
+          class="send-button md-accent md-raised"
+          ng-disabled="mailQueueForm.$invalid || mailQueueForm.$pristine"
+          aria-label="SAVE"
+          translate="MAIL.SAVE"
+          translate-attr-aria-label="MAIL.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newMailQueue"
+          ng-click="vm.addNewMailQueue()"
+          class="send-button md-accent md-raised"
+          ng-disabled="mailQueueForm.$invalid"
+          aria-label="ADD"
+          translate="MAIL.ADD_MAILQUEUE"
+          translate-attr-aria-label="MAIL.ADD_MAILQUEUE"
+        >
+          ADD MAILQUEUE
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newMailQueue"
+          ng-click="vm.deleteMailQueue($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="MAIL.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="MAIL.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailQueues/edit/agentadd/agentadd.html/agentadd-[chunkhash].html b/public/src/js/modules/main/apps/mail/views/mailQueues/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
deleted file mode 100644
index 3563019..0000000
--- a/public/src/js/modules/main/apps/mail/views/mailQueues/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
+++ /dev/null
@@ -1,44 +0,0 @@
-<md-dialog
-  class="mailQueue-dialog"
-  aria-label="mailQueue"
-  ng-init="vm.onInit()"
->
-  <form name="mailQueueForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="MAIL.AGENTADD_MAILQUEUE">Add Agent to mailQueue</h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <ms-dual-multiselect
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveAgents()"
-        class="send-button md-accent md-raised"
-        ng-disabled="!vm.pendingChanges"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailQueues/edit/agentadd/agentadd.html/agentadd.html b/public/src/js/modules/main/apps/mail/views/mailQueues/edit/agentadd/agentadd.html/agentadd.html
new file mode 100644
index 0000000..3563019
--- /dev/null
+++ b/public/src/js/modules/main/apps/mail/views/mailQueues/edit/agentadd/agentadd.html/agentadd.html
@@ -0,0 +1,44 @@
+<md-dialog
+  class="mailQueue-dialog"
+  aria-label="mailQueue"
+  ng-init="vm.onInit()"
+>
+  <form name="mailQueueForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="MAIL.AGENTADD_MAILQUEUE">Add Agent to mailQueue</h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <ms-dual-multiselect
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveAgents()"
+        class="send-button md-accent md-raised"
+        ng-disabled="!vm.pendingChanges"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailQueues/edit/teamadd/teamadd.html/teamadd-[chunkhash].html b/public/src/js/modules/main/apps/mail/views/mailQueues/edit/teamadd/teamadd.html/teamadd-[chunkhash].html
deleted file mode 100644
index 6ece5ef..0000000
--- a/public/src/js/modules/main/apps/mail/views/mailQueues/edit/teamadd/teamadd.html/teamadd-[chunkhash].html
+++ /dev/null
@@ -1,44 +0,0 @@
-<md-dialog
-  class="mailQueue-dialog"
-  aria-label="mailQueue"
-  ng-init="vm.onInit()"
->
-  <form name="mailQueueForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="MAIL.TEAMS_ASSOCIATION">Teams Association</h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <ms-dual-multiselect
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveTeams()"
-        ng-disabled="!vm.pendingChanges"
-        class="send-button md-accent md-raised"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailQueues/edit/teamadd/teamadd.html/teamadd.html b/public/src/js/modules/main/apps/mail/views/mailQueues/edit/teamadd/teamadd.html/teamadd.html
new file mode 100644
index 0000000..6ece5ef
--- /dev/null
+++ b/public/src/js/modules/main/apps/mail/views/mailQueues/edit/teamadd/teamadd.html/teamadd.html
@@ -0,0 +1,44 @@
+<md-dialog
+  class="mailQueue-dialog"
+  aria-label="mailQueue"
+  ng-init="vm.onInit()"
+>
+  <form name="mailQueueForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="MAIL.TEAMS_ASSOCIATION">Teams Association</h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <ms-dual-multiselect
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveTeams()"
+        ng-disabled="!vm.pendingChanges"
+        class="send-button md-accent md-raised"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailQueues/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/mail/views/mailQueues/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index cc15df1..0000000
--- a/public/src/js/modules/main/apps/mail/views/mailQueues/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,218 +0,0 @@
-<div id="mail-mailQueue" class="page-layout simple tabbed" layout="column">
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-mailQueues-button md-icon-button"
-        aria-label="Go to mailQueues"
-        ng-click="vm.gotoMailQueues()"
-        translate
-        translate-attr-aria-label="MAIL.GO_TO_MAILQUEUES"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="mailQueue-image" hide-xs>
-          <img ng-src="assets/images/business/mailQueues.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.mailQueue.id}}
-            <span ng-if="vm.mailQueue.name">{{vm.mailQueue.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="MAIL.CREATED_AT"></span>
-            <span>{{vm.mailQueue.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.teamadddialog(vm.mailQueue, $event)"
-        class="md-fab md-orange-500-bg md-icon-button"
-        aria-label="teamadd"
-      >
-        <md-tooltip
-          ><span translate="MAIL.TEAMADD_MAILQUEUE"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
-      </md-button>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.agentadddialog(vm.mailQueue, $event)"
-        class="md-fab md-purple-500-bg md-icon-button"
-        aria-label="agentadd"
-      >
-        <md-tooltip
-          ><span translate="MAIL.AGENTADD_MAILQUEUE"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-account-plus"></md-icon>
-      </md-button>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveMailQueue()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid)"
-        translate="MAIL.SAVE"
-        translate-attr-aria-label="MAIL.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="MAIL.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="mailQueue-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MAIL.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MAIL.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.mailQueue.name"
-                  ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-                  ng-required="true"
-                  autofocus
-                  disabled
-                />
-
-                <div class="hint"><span translate="MAIL.HELP.NAME"></span></div>
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MAIL.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                  <div ng-message="pattern">
-                    <span
-                      translate="MAIL.ERRORS.NAME_MUST_VALID_PATTERN"
-                      translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-                      >Name must be valid pattern
-                    </span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MAIL.STRATEGY">Strategy</label>
-                <md-select
-                  name="strategy"
-                  ng-model="vm.mailQueue.strategy"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'beepall'">Beepall</md-option>
-                  <md-option ng-value="'rrmemory'">RR Memory</md-option>
-                </md-select>
-                <div
-                  ng-messages="generalForm['strategy'].$error"
-                  ng-show="generalForm['strategy'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MAIL.ERRORS.STRATEGY_REQUIRED"
-                      >Strategy field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MAIL.AGENT_TIMEOUT">Agent_Timeout</label>
-                <input
-                  type="number"
-                  name="timeout"
-                  ng-model="vm.mailQueue.timeout"
-                  min="1"
-                  max="2147483"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['timeout'].$error"
-                  ng-show="generalForm['timeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MAIL.ERRORS.AGENT_TIMEOUT_REQUIRED"
-                      >Agent_Timeout field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MAIL.ERRORS.AGENT_TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >Agent_Timeout must be a valid greater or equal than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MAIL.ERRORS.AGENT_TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >Agent_Timeout must be a valid greater or equal than</span
-                    >
-                    <span>2147483</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MAIL.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.mailQueue.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MAIL.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/mail/views/mailQueues/edit/view.html/view.html b/public/src/js/modules/main/apps/mail/views/mailQueues/edit/view.html/view.html
new file mode 100644
index 0000000..cc15df1
--- /dev/null
+++ b/public/src/js/modules/main/apps/mail/views/mailQueues/edit/view.html/view.html
@@ -0,0 +1,218 @@
+<div id="mail-mailQueue" class="page-layout simple tabbed" layout="column">
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-mailQueues-button md-icon-button"
+        aria-label="Go to mailQueues"
+        ng-click="vm.gotoMailQueues()"
+        translate
+        translate-attr-aria-label="MAIL.GO_TO_MAILQUEUES"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="mailQueue-image" hide-xs>
+          <img ng-src="assets/images/business/mailQueues.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.mailQueue.id}}
+            <span ng-if="vm.mailQueue.name">{{vm.mailQueue.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="MAIL.CREATED_AT"></span>
+            <span>{{vm.mailQueue.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.teamadddialog(vm.mailQueue, $event)"
+        class="md-fab md-orange-500-bg md-icon-button"
+        aria-label="teamadd"
+      >
+        <md-tooltip
+          ><span translate="MAIL.TEAMADD_MAILQUEUE"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
+      </md-button>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.agentadddialog(vm.mailQueue, $event)"
+        class="md-fab md-purple-500-bg md-icon-button"
+        aria-label="agentadd"
+      >
+        <md-tooltip
+          ><span translate="MAIL.AGENTADD_MAILQUEUE"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-account-plus"></md-icon>
+      </md-button>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveMailQueue()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid)"
+        translate="MAIL.SAVE"
+        translate-attr-aria-label="MAIL.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="MAIL.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="mailQueue-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MAIL.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MAIL.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.mailQueue.name"
+                  ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+                  ng-required="true"
+                  autofocus
+                  disabled
+                />
+
+                <div class="hint"><span translate="MAIL.HELP.NAME"></span></div>
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MAIL.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                  <div ng-message="pattern">
+                    <span
+                      translate="MAIL.ERRORS.NAME_MUST_VALID_PATTERN"
+                      translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+                      >Name must be valid pattern
+                    </span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MAIL.STRATEGY">Strategy</label>
+                <md-select
+                  name="strategy"
+                  ng-model="vm.mailQueue.strategy"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'beepall'">Beepall</md-option>
+                  <md-option ng-value="'rrmemory'">RR Memory</md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['strategy'].$error"
+                  ng-show="generalForm['strategy'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MAIL.ERRORS.STRATEGY_REQUIRED"
+                      >Strategy field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MAIL.AGENT_TIMEOUT">Agent_Timeout</label>
+                <input
+                  type="number"
+                  name="timeout"
+                  ng-model="vm.mailQueue.timeout"
+                  min="1"
+                  max="2147483"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['timeout'].$error"
+                  ng-show="generalForm['timeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MAIL.ERRORS.AGENT_TIMEOUT_REQUIRED"
+                      >Agent_Timeout field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MAIL.ERRORS.AGENT_TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >Agent_Timeout must be a valid greater or equal than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MAIL.ERRORS.AGENT_TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >Agent_Timeout must be a valid greater or equal than</span
+                    >
+                    <span>2147483</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MAIL.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.mailQueue.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MAIL.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/mail/views/mailQueues/mailQueues.html/mailQueues-[chunkhash].html b/public/src/js/modules/main/apps/mail/views/mailQueues/mailQueues.html/mailQueues-[chunkhash].html
deleted file mode 100644
index 62146b2..0000000
--- a/public/src/js/modules/main/apps/mail/views/mailQueues/mailQueues.html/mailQueues-[chunkhash].html
+++ /dev/null
@@ -1,332 +0,0 @@
-<div
-  id="mailQueues"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-email" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="MAIL.MAILQUEUES">MailQueues</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="MAIL.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedMailQueues.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedMailQueues =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="MAIL.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-mailQueues-count">
-          <span>{{vm.selectedMailQueues.length}}</span>
-          <span translate="MAIL.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="MAIL.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllMailQueues()"
-                translate="MAIL.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectMailQueues()"
-                translate="MAIL.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedMailQueues"
-          csv-label="true"
-          filename="mailQueues.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedMailQueues($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="MAIL.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- MAILQUEUE TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedMailQueues"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getMailQueues"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'MAIL.ID' | translate }}</th>
-                <th md-column md-order-by="name">
-                  {{ 'MAIL.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="strategy">
-                  {{ 'MAIL.STRATEGY' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.mailQueues.rows.length">
-                <td md-cell colspan="4">
-                  <div layout="row" layout-align="center center">
-                    <span translate="MAIL.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="mailQueue"
-                md-select-id="id"
-                ng-repeat="mailQueue in vm.mailQueues.rows"
-              >
-                <td md-cell ng-if="mailQueue.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{mailQueue.name}}"
-                    ng-src="api/users/{{mailQueue.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!mailQueue.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{mailQueue.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(mailQueue, ev) : vm.createOrEditMailQueue($event, mailQueue)"
-                  md-cell
-                  class="id"
-                >
-                  {{mailQueue.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(mailQueue, ev) : vm.createOrEditMailQueue($event, mailQueue)"
-                  md-cell
-                  class="name"
-                >
-                  {{mailQueue.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(mailQueue, ev) : vm.createOrEditMailQueue($event, mailQueue)"
-                  md-cell
-                  class="strategy"
-                >
-                  {{ vm.arraystrategy[mailQueue.strategy].option }}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="MAIL.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(mailQueue, $event    )"
-                          translate="MAIL.EDIT_MAILQUEUE"
-                        >
-                          Edit MailQueue
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.teamadddialog(mailQueue, $event    )"
-                          translate="MAIL.TEAMADD_MAILQUEUE"
-                        >
-                          teamadd MailQueue
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.agentadddialog(mailQueue, $event    )"
-                          translate="MAIL.AGENTADD_MAILQUEUE"
-                        >
-                          agentadd MailQueue
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(mailQueue, $event    )"
-                          translate="MAIL.DELETE_MAILQUEUE"
-                        >
-                          Delete MailQueue
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.gotorealtimegoto(mailQueue, $event    )"
-                          translate="MAIL.GOTOREALTIME_MAILQUEUE"
-                        >
-                          goToRealtime MailQueue
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'MAIL.PAGE' | translate}}:', rowsPerPage: '{{'MAIL.ROWSPERPAGE' | translate}}:', of: '{{'MAIL.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.mailQueues.count}}"
-          md-on-paginate="vm.getMailQueues"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / MAILQUEUE TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD MAILQUEUE BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-mailQueue-button"
-    ng-click="vm.createOrEditMailQueue($event)"
-    aria-label="add mailQueue"
-    translate
-    translate-attr-aria-label="MAIL.ADD_MAILQUEUE"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD MAILQUEUE BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/mail/views/mailQueues/mailQueues.html/mailQueues.html b/public/src/js/modules/main/apps/mail/views/mailQueues/mailQueues.html/mailQueues.html
new file mode 100644
index 0000000..62146b2
--- /dev/null
+++ b/public/src/js/modules/main/apps/mail/views/mailQueues/mailQueues.html/mailQueues.html
@@ -0,0 +1,332 @@
+<div
+  id="mailQueues"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-email" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="MAIL.MAILQUEUES">MailQueues</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="MAIL.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedMailQueues.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedMailQueues =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="MAIL.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-mailQueues-count">
+          <span>{{vm.selectedMailQueues.length}}</span>
+          <span translate="MAIL.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="MAIL.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllMailQueues()"
+                translate="MAIL.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectMailQueues()"
+                translate="MAIL.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedMailQueues"
+          csv-label="true"
+          filename="mailQueues.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedMailQueues($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="MAIL.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- MAILQUEUE TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedMailQueues"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getMailQueues"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'MAIL.ID' | translate }}</th>
+                <th md-column md-order-by="name">
+                  {{ 'MAIL.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="strategy">
+                  {{ 'MAIL.STRATEGY' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.mailQueues.rows.length">
+                <td md-cell colspan="4">
+                  <div layout="row" layout-align="center center">
+                    <span translate="MAIL.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="mailQueue"
+                md-select-id="id"
+                ng-repeat="mailQueue in vm.mailQueues.rows"
+              >
+                <td md-cell ng-if="mailQueue.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{mailQueue.name}}"
+                    ng-src="api/users/{{mailQueue.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!mailQueue.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{mailQueue.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(mailQueue, ev) : vm.createOrEditMailQueue($event, mailQueue)"
+                  md-cell
+                  class="id"
+                >
+                  {{mailQueue.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(mailQueue, ev) : vm.createOrEditMailQueue($event, mailQueue)"
+                  md-cell
+                  class="name"
+                >
+                  {{mailQueue.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(mailQueue, ev) : vm.createOrEditMailQueue($event, mailQueue)"
+                  md-cell
+                  class="strategy"
+                >
+                  {{ vm.arraystrategy[mailQueue.strategy].option }}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="MAIL.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(mailQueue, $event    )"
+                          translate="MAIL.EDIT_MAILQUEUE"
+                        >
+                          Edit MailQueue
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.teamadddialog(mailQueue, $event    )"
+                          translate="MAIL.TEAMADD_MAILQUEUE"
+                        >
+                          teamadd MailQueue
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.agentadddialog(mailQueue, $event    )"
+                          translate="MAIL.AGENTADD_MAILQUEUE"
+                        >
+                          agentadd MailQueue
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(mailQueue, $event    )"
+                          translate="MAIL.DELETE_MAILQUEUE"
+                        >
+                          Delete MailQueue
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.gotorealtimegoto(mailQueue, $event    )"
+                          translate="MAIL.GOTOREALTIME_MAILQUEUE"
+                        >
+                          goToRealtime MailQueue
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'MAIL.PAGE' | translate}}:', rowsPerPage: '{{'MAIL.ROWSPERPAGE' | translate}}:', of: '{{'MAIL.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.mailQueues.count}}"
+          md-on-paginate="vm.getMailQueues"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / MAILQUEUE TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD MAILQUEUE BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-mailQueue-button"
+    ng-click="vm.createOrEditMailQueue($event)"
+    aria-label="add mailQueue"
+    translate
+    translate-attr-aria-label="MAIL.ADD_MAILQUEUE"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD MAILQUEUE BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/mail/views/mailSubtatuses/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/mail/views/mailSubtatuses/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 09e0a9b..0000000
--- a/public/src/js/modules/main/apps/mail/views/mailSubtatuses/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,152 +0,0 @@
-<md-dialog class="mailSubstatus-dialog" aria-label="New MailSubstatus">
-  <form name="mailSubstatusForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="MAIL.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.mailSubstatus.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="mailSubstatusForm['name'].$error"
-          ng-show="mailSubstatusForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="MAIL.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.mailSubstatus.description"
-        />
-
-        <div
-          ng-messages="mailSubstatusForm['description'].$error"
-          ng-show="mailSubstatusForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MAIL.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newMailSubstatus"
-          ng-click="vm.saveMailSubstatus()"
-          class="send-button md-accent md-raised"
-          ng-disabled="mailSubstatusForm.$invalid || mailSubstatusForm.$pristine"
-          aria-label="SAVE"
-          translate="MAIL.SAVE"
-          translate-attr-aria-label="MAIL.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newMailSubstatus"
-          ng-click="vm.addNewMailSubstatus()"
-          class="send-button md-accent md-raised"
-          ng-disabled="mailSubstatusForm.$invalid"
-          aria-label="ADD"
-          translate="MAIL.ADD_MAILSUBSTATUS"
-          translate-attr-aria-label="MAIL.ADD_MAILSUBSTATUS"
-        >
-          ADD MAILSUBSTATUS
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newMailSubstatus"
-          ng-click="vm.deleteMailSubstatus($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="MAIL.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="MAIL.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailSubtatuses/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/mail/views/mailSubtatuses/create/dialog.html/dialog.html
new file mode 100644
index 0000000..09e0a9b
--- /dev/null
+++ b/public/src/js/modules/main/apps/mail/views/mailSubtatuses/create/dialog.html/dialog.html
@@ -0,0 +1,152 @@
+<md-dialog class="mailSubstatus-dialog" aria-label="New MailSubstatus">
+  <form name="mailSubstatusForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="MAIL.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.mailSubstatus.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="mailSubstatusForm['name'].$error"
+          ng-show="mailSubstatusForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="MAIL.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.mailSubstatus.description"
+        />
+
+        <div
+          ng-messages="mailSubstatusForm['description'].$error"
+          ng-show="mailSubstatusForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MAIL.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newMailSubstatus"
+          ng-click="vm.saveMailSubstatus()"
+          class="send-button md-accent md-raised"
+          ng-disabled="mailSubstatusForm.$invalid || mailSubstatusForm.$pristine"
+          aria-label="SAVE"
+          translate="MAIL.SAVE"
+          translate-attr-aria-label="MAIL.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newMailSubstatus"
+          ng-click="vm.addNewMailSubstatus()"
+          class="send-button md-accent md-raised"
+          ng-disabled="mailSubstatusForm.$invalid"
+          aria-label="ADD"
+          translate="MAIL.ADD_MAILSUBSTATUS"
+          translate-attr-aria-label="MAIL.ADD_MAILSUBSTATUS"
+        >
+          ADD MAILSUBSTATUS
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newMailSubstatus"
+          ng-click="vm.deleteMailSubstatus($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="MAIL.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="MAIL.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/mail/views/mailSubtatuses/mailSubtatuses.html/mailSubtatuses-[chunkhash].html b/public/src/js/modules/main/apps/mail/views/mailSubtatuses/mailSubtatuses.html/mailSubtatuses-[chunkhash].html
deleted file mode 100644
index b912c60..0000000
--- a/public/src/js/modules/main/apps/mail/views/mailSubtatuses/mailSubtatuses.html/mailSubtatuses-[chunkhash].html
+++ /dev/null
@@ -1,299 +0,0 @@
-<div
-  id="mailSubtatuses"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-email" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="MAIL.MAILSUBSTATUSES"
-          >MailSubstatuses</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="MAIL.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedMailSubstatuses.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedMailSubstatuses =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="MAIL.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-mailSubtatuses-count">
-          <span>{{vm.selectedMailSubstatuses.length}}</span>
-          <span translate="MAIL.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="MAIL.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllMailSubstatuses()"
-                translate="MAIL.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectMailSubstatuses()"
-                translate="MAIL.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedMailSubstatuses"
-          csv-label="true"
-          filename="mailSubtatuses.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedMailSubstatuses($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="MAIL.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- MAILSUBSTATUS TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedMailSubstatuses"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getMailSubstatuses"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'MAIL.ID' | translate }}</th>
-                <th md-column md-order-by="name">
-                  {{ 'MAIL.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'MAIL.DESCRIPTION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.mailSubtatuses.rows.length">
-                <td md-cell colspan="4">
-                  <div layout="row" layout-align="center center">
-                    <span translate="MAIL.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="mailSubstatus"
-                md-select-id="id"
-                ng-repeat="mailSubstatus in vm.mailSubtatuses.rows"
-              >
-                <td md-cell ng-if="mailSubstatus.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{mailSubstatus.name}}"
-                    ng-src="api/users/{{mailSubstatus.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!mailSubstatus.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{mailSubstatus.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.createOrEditMailSubstatus($event, mailSubstatus)"
-                  md-cell
-                  class="id"
-                >
-                  {{mailSubstatus.id}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditMailSubstatus($event, mailSubstatus)"
-                  md-cell
-                  class="name"
-                >
-                  {{mailSubstatus.name}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditMailSubstatus($event, mailSubstatus)"
-                  md-cell
-                  class="description"
-                >
-                  {{mailSubstatus.description}}
-                </td>
-
-                <td
-                  md-cell
-                  class="actions"
-                  ng-if="!vm.crudPermissions.readOnly"
-                >
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="MAIL.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editdialog(mailSubstatus, $event    )"
-                          translate="MAIL.EDIT_MAILSUBSTATUS"
-                        >
-                          Edit MailSubstatus
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(mailSubstatus, $event    )"
-                          translate="MAIL.DELETE_MAILSUBSTATUS"
-                        >
-                          Delete MailSubstatus
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'MAIL.PAGE' | translate}}:', rowsPerPage: '{{'MAIL.ROWSPERPAGE' | translate}}:', of: '{{'MAIL.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.mailSubtatuses.count}}"
-          md-on-paginate="vm.getMailSubstatuses"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / MAILSUBSTATUS TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD MAILSUBSTATUS BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-mailSubstatus-button"
-    ng-click="vm.createOrEditMailSubstatus($event)"
-    aria-label="add mailSubstatus"
-    translate
-    translate-attr-aria-label="MAIL.ADD_MAILSUBSTATUS"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD MAILSUBSTATUS BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/mail/views/mailSubtatuses/mailSubtatuses.html/mailSubtatuses.html b/public/src/js/modules/main/apps/mail/views/mailSubtatuses/mailSubtatuses.html/mailSubtatuses.html
new file mode 100644
index 0000000..b912c60
--- /dev/null
+++ b/public/src/js/modules/main/apps/mail/views/mailSubtatuses/mailSubtatuses.html/mailSubtatuses.html
@@ -0,0 +1,299 @@
+<div
+  id="mailSubtatuses"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-email" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="MAIL.MAILSUBSTATUSES"
+          >MailSubstatuses</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="MAIL.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedMailSubstatuses.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedMailSubstatuses =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="MAIL.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-mailSubtatuses-count">
+          <span>{{vm.selectedMailSubstatuses.length}}</span>
+          <span translate="MAIL.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="MAIL.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllMailSubstatuses()"
+                translate="MAIL.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectMailSubstatuses()"
+                translate="MAIL.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedMailSubstatuses"
+          csv-label="true"
+          filename="mailSubtatuses.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedMailSubstatuses($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="MAIL.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- MAILSUBSTATUS TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedMailSubstatuses"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getMailSubstatuses"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'MAIL.ID' | translate }}</th>
+                <th md-column md-order-by="name">
+                  {{ 'MAIL.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'MAIL.DESCRIPTION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.mailSubtatuses.rows.length">
+                <td md-cell colspan="4">
+                  <div layout="row" layout-align="center center">
+                    <span translate="MAIL.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="mailSubstatus"
+                md-select-id="id"
+                ng-repeat="mailSubstatus in vm.mailSubtatuses.rows"
+              >
+                <td md-cell ng-if="mailSubstatus.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{mailSubstatus.name}}"
+                    ng-src="api/users/{{mailSubstatus.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!mailSubstatus.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{mailSubstatus.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.createOrEditMailSubstatus($event, mailSubstatus)"
+                  md-cell
+                  class="id"
+                >
+                  {{mailSubstatus.id}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditMailSubstatus($event, mailSubstatus)"
+                  md-cell
+                  class="name"
+                >
+                  {{mailSubstatus.name}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditMailSubstatus($event, mailSubstatus)"
+                  md-cell
+                  class="description"
+                >
+                  {{mailSubstatus.description}}
+                </td>
+
+                <td
+                  md-cell
+                  class="actions"
+                  ng-if="!vm.crudPermissions.readOnly"
+                >
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="MAIL.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editdialog(mailSubstatus, $event    )"
+                          translate="MAIL.EDIT_MAILSUBSTATUS"
+                        >
+                          Edit MailSubstatus
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(mailSubstatus, $event    )"
+                          translate="MAIL.DELETE_MAILSUBSTATUS"
+                        >
+                          Delete MailSubstatus
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'MAIL.PAGE' | translate}}:', rowsPerPage: '{{'MAIL.ROWSPERPAGE' | translate}}:', of: '{{'MAIL.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.mailSubtatuses.count}}"
+          md-on-paginate="vm.getMailSubstatuses"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / MAILSUBSTATUS TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD MAILSUBSTATUS BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-mailSubstatus-button"
+    ng-click="vm.createOrEditMailSubstatus($event)"
+    aria-label="add mailSubstatus"
+    translate
+    translate-attr-aria-label="MAIL.ADD_MAILSUBSTATUS"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD MAILSUBSTATUS BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/mail/views/realtime/accounts/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/mail/views/realtime/accounts/view.html/view-[chunkhash].html
deleted file mode 100644
index fa2d1e6..0000000
--- a/public/src/js/modules/main/apps/mail/views/realtime/accounts/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,190 +0,0 @@
-<!-- MAIN -->
-<md-toolbar class="md-table-toolbar md-default">
-  <div class="md-toolbar-tools">
-    <span class="md-subhead" translate="MAIL.ACCOUNTS">Accounts</span>
-    <div flex></div>
-    <ms-search-bar
-      on-search="vm.query.filter = query;"
-      on-collapse="vm.query.filter = undefined;"
-      debounce="300"
-    ></ms-search-bar>
-  </div>
-</md-toolbar>
-
-<!-- AGENT TABLE -->
-<md-table-container>
-  <table md-table multiple md-progress="vm.promise">
-    <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getMailAccounts">
-      <tr md-row>
-        <th md-column md-order-by="name">{{ 'MAIL.NAME' | translate }}</th>
-        <th md-column>{{ 'MAIL.KEY' | translate }}</th>
-        <th md-column>{{ 'MAIL.TOTAL' | translate }}</th>
-        <th md-column>{{ 'MAIL.IN' | translate }}</th>
-        <th md-column>{{ 'MAIL.OUT' | translate }}</th>
-        <th md-column>{{ 'MAIL.IMAP_STATUS' | translate }}</th>
-        <th md-column>{{ 'MAIL.SMTP_STATUS' | translate }}</th>
-        <th md-column width="10px"></th>
-      </tr>
-    </thead>
-    <tbody md-body>
-      <tr md-row ng-hide="vm.mailAccounts">
-        <td md-cell colspan="4">
-          <div layout="row" layout-align="center center">
-            <span translate="MAIL.NO_AVAILABLE_INFO">No Available Info</span>
-          </div>
-        </td>
-      </tr>
-      <tr
-        md-row
-        md-select="vm.mailAccounts[value]"
-        md-select-id="id"
-        ng-repeat="(id, value) in vm.order"
-      >
-        <td md-cell>{{vm.mailAccounts[value].name}}</td>
-        <td md-cell>{{vm.mailAccounts[value].key}}</td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{(vm.mailAccounts[value].in || 0) + (vm.mailAccounts[value].out ||
-            0)}}</span
-          >
-        </td>
-        <td md-cell>
-          <div layout="row">
-            <span
-              ><md-icon md-font-icon="icon-arrow-down-bold blue-fg"></md-icon
-            ></span>
-            <span class="md-capture blue-fg"
-              >{{vm.mailAccounts[value].in || 0}}</span
-            >
-            <span class="text-boxed" ng-if="mailAccount.in"
-              >{{vm.mailAccounts[value].lastIn ? (vm.mailAccounts[value].lastIn
-              | date: 'shortTime') : ''}}</span
-            >
-          </div>
-        </td>
-        <td md-cell>
-          <div layout="row">
-            <span
-              ><md-icon md-font-icon="icon-arrow-up-bold green-fg"></md-icon
-            ></span>
-            <span class="md-capture green-fg"
-              >{{vm.mailAccounts[value].out || 0}}</span
-            >
-            <span class="text-boxed" ng-if="mailAccount.out"
-              >{{vm.mailAccounts[value].lastOut ?
-              (vm.mailAccounts[value].lastOut | date: 'shortTime') : ''}}</span
-            >
-          </div>
-        </td>
-        <td md-cell>
-          <div layout="row" layout-align="start center">
-            <div layout="column" layout-align="center center">
-              <md-button class="md-icon-button" aria-label="Status">
-                <md-tooltip
-                  >{{vm.mailAccounts[value].Imap.messageStatus}}</md-tooltip
-                >
-                <div ng-switch="vm.mailAccounts[value].Imap.status">
-                  <md-icon
-                    ng-switch-when="error"
-                    md-font-icon="icon-alert yellow-fg"
-                  ></md-icon>
-                  <md-icon
-                    ng-switch-when="disabled"
-                    md-font-icon="icon-close grey-fg"
-                  ></md-icon>
-                  <md-icon
-                    ng-switch-default
-                    md-font-icon="icon-checkbox-marked-circle-outline green-fg"
-                  ></md-icon>
-                </div>
-              </md-button>
-              <span class="md-caption grey-fg"
-                >{{ ('MAIL.' + vm.mailAccounts[value].Imap.status.toUpperCase())
-                | translate}}</span
-              >
-            </div>
-            <span class="text-boxed" ng-if="vm.mailAccounts[value].active"
-              >{{vm.mailAccounts[value].Imap.lastSync | date:
-              'shortTime'}}</span
-            >
-          </div>
-        </td>
-        <td md-cell>
-          <div
-            layout="row"
-            layout-align="start center"
-            ng-if="vm.mailAccounts[value].Smtp.status"
-          >
-            <div layout="column" layout-align="center center">
-              <md-button class="md-icon-button" aria-label="Status">
-                <md-tooltip
-                  >{{vm.mailAccounts[value].Smtp.messageStatus}}</md-tooltip
-                >
-                <md-icon
-                  md-font-icon="{{ vm.mailAccounts[value].Smtp.status == 'error' ? 'icon-alert yellow-fg' : 'icon-checkbox-marked-circle-outline green-fg'}}"
-                ></md-icon>
-              </md-button>
-              <span class="md-caption grey-fg"
-                >{{ ('MAIL.' + vm.mailAccounts[value].Smtp.status.toUpperCase())
-                | translate}}</span
-              >
-            </div>
-            <span class="text-boxed"
-              >{{vm.mailAccounts[value].Smtp.lastSync | date:
-              'shortTime'}}</span
-            >
-          </div>
-          <span
-            class="md-caption grey-fg"
-            ng-if="!vm.mailAccounts[value].Smtp.status"
-            >{{ 'MAIL.NEVER_VERIFIED' | translate }}</span
-          >
-        </td>
-        <td md-cell class="actions">
-          <md-menu>
-            <md-button
-              class="md-icon-button"
-              aria-label="More"
-              translate
-              translate-attr-aria-label="STAFF.MORE"
-              ng-click="$mdMenu.open($event)"
-            >
-              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-            </md-button>
-
-            <md-menu-content width="4">
-              <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                <md-button
-                  ng-click="vm.goToMailAccount($event, vm.mailAccounts[value])"
-                  translate="MAIL.EDIT_ACCOUNT"
-                >
-                  Edit Account
-                </md-button>
-              </md-menu-item>
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.verifySmtp($event, vm.mailAccounts[value])"
-                  translate="MAIL.VERIFY_SMTP"
-                >
-                  Verify Smtp
-                </md-button>
-              </md-menu-item>
-            </md-menu-content>
-          </md-menu>
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</md-table-container>
-
-<md-table-pagination
-  md-label="{page: '{{'MAIL.PAGE' | translate}}:', rowsPerPage: '{{'MAIL.ROWSPERPAGE' | translate}}:', of: '{{'MAIL.OF' | translate}}'}"
-  md-limit="vm.query.limit"
-  md-limit-options="[10, 15, 20, 50, 100, 250]"
-  md-page="vm.query.page"
-  md-total="{{vm.count}}"
-  md-on-paginate="vm.getmailAccounts"
-  md-page-select
-></md-table-pagination>
-<!-- / AGENT TABLE -->
-<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/mail/views/realtime/accounts/view.html/view.html b/public/src/js/modules/main/apps/mail/views/realtime/accounts/view.html/view.html
new file mode 100644
index 0000000..fa2d1e6
--- /dev/null
+++ b/public/src/js/modules/main/apps/mail/views/realtime/accounts/view.html/view.html
@@ -0,0 +1,190 @@
+<!-- MAIN -->
+<md-toolbar class="md-table-toolbar md-default">
+  <div class="md-toolbar-tools">
+    <span class="md-subhead" translate="MAIL.ACCOUNTS">Accounts</span>
+    <div flex></div>
+    <ms-search-bar
+      on-search="vm.query.filter = query;"
+      on-collapse="vm.query.filter = undefined;"
+      debounce="300"
+    ></ms-search-bar>
+  </div>
+</md-toolbar>
+
+<!-- AGENT TABLE -->
+<md-table-container>
+  <table md-table multiple md-progress="vm.promise">
+    <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getMailAccounts">
+      <tr md-row>
+        <th md-column md-order-by="name">{{ 'MAIL.NAME' | translate }}</th>
+        <th md-column>{{ 'MAIL.KEY' | translate }}</th>
+        <th md-column>{{ 'MAIL.TOTAL' | translate }}</th>
+        <th md-column>{{ 'MAIL.IN' | translate }}</th>
+        <th md-column>{{ 'MAIL.OUT' | translate }}</th>
+        <th md-column>{{ 'MAIL.IMAP_STATUS' | translate }}</th>
+        <th md-column>{{ 'MAIL.SMTP_STATUS' | translate }}</th>
+        <th md-column width="10px"></th>
+      </tr>
+    </thead>
+    <tbody md-body>
+      <tr md-row ng-hide="vm.mailAccounts">
+        <td md-cell colspan="4">
+          <div layout="row" layout-align="center center">
+            <span translate="MAIL.NO_AVAILABLE_INFO">No Available Info</span>
+          </div>
+        </td>
+      </tr>
+      <tr
+        md-row
+        md-select="vm.mailAccounts[value]"
+        md-select-id="id"
+        ng-repeat="(id, value) in vm.order"
+      >
+        <td md-cell>{{vm.mailAccounts[value].name}}</td>
+        <td md-cell>{{vm.mailAccounts[value].key}}</td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{(vm.mailAccounts[value].in || 0) + (vm.mailAccounts[value].out ||
+            0)}}</span
+          >
+        </td>
+        <td md-cell>
+          <div layout="row">
+            <span
+              ><md-icon md-font-icon="icon-arrow-down-bold blue-fg"></md-icon
+            ></span>
+            <span class="md-capture blue-fg"
+              >{{vm.mailAccounts[value].in || 0}}</span
+            >
+            <span class="text-boxed" ng-if="mailAccount.in"
+              >{{vm.mailAccounts[value].lastIn ? (vm.mailAccounts[value].lastIn
+              | date: 'shortTime') : ''}}</span
+            >
+          </div>
+        </td>
+        <td md-cell>
+          <div layout="row">
+            <span
+              ><md-icon md-font-icon="icon-arrow-up-bold green-fg"></md-icon
+            ></span>
+            <span class="md-capture green-fg"
+              >{{vm.mailAccounts[value].out || 0}}</span
+            >
+            <span class="text-boxed" ng-if="mailAccount.out"
+              >{{vm.mailAccounts[value].lastOut ?
+              (vm.mailAccounts[value].lastOut | date: 'shortTime') : ''}}</span
+            >
+          </div>
+        </td>
+        <td md-cell>
+          <div layout="row" layout-align="start center">
+            <div layout="column" layout-align="center center">
+              <md-button class="md-icon-button" aria-label="Status">
+                <md-tooltip
+                  >{{vm.mailAccounts[value].Imap.messageStatus}}</md-tooltip
+                >
+                <div ng-switch="vm.mailAccounts[value].Imap.status">
+                  <md-icon
+                    ng-switch-when="error"
+                    md-font-icon="icon-alert yellow-fg"
+                  ></md-icon>
+                  <md-icon
+                    ng-switch-when="disabled"
+                    md-font-icon="icon-close grey-fg"
+                  ></md-icon>
+                  <md-icon
+                    ng-switch-default
+                    md-font-icon="icon-checkbox-marked-circle-outline green-fg"
+                  ></md-icon>
+                </div>
+              </md-button>
+              <span class="md-caption grey-fg"
+                >{{ ('MAIL.' + vm.mailAccounts[value].Imap.status.toUpperCase())
+                | translate}}</span
+              >
+            </div>
+            <span class="text-boxed" ng-if="vm.mailAccounts[value].active"
+              >{{vm.mailAccounts[value].Imap.lastSync | date:
+              'shortTime'}}</span
+            >
+          </div>
+        </td>
+        <td md-cell>
+          <div
+            layout="row"
+            layout-align="start center"
+            ng-if="vm.mailAccounts[value].Smtp.status"
+          >
+            <div layout="column" layout-align="center center">
+              <md-button class="md-icon-button" aria-label="Status">
+                <md-tooltip
+                  >{{vm.mailAccounts[value].Smtp.messageStatus}}</md-tooltip
+                >
+                <md-icon
+                  md-font-icon="{{ vm.mailAccounts[value].Smtp.status == 'error' ? 'icon-alert yellow-fg' : 'icon-checkbox-marked-circle-outline green-fg'}}"
+                ></md-icon>
+              </md-button>
+              <span class="md-caption grey-fg"
+                >{{ ('MAIL.' + vm.mailAccounts[value].Smtp.status.toUpperCase())
+                | translate}}</span
+              >
+            </div>
+            <span class="text-boxed"
+              >{{vm.mailAccounts[value].Smtp.lastSync | date:
+              'shortTime'}}</span
+            >
+          </div>
+          <span
+            class="md-caption grey-fg"
+            ng-if="!vm.mailAccounts[value].Smtp.status"
+            >{{ 'MAIL.NEVER_VERIFIED' | translate }}</span
+          >
+        </td>
+        <td md-cell class="actions">
+          <md-menu>
+            <md-button
+              class="md-icon-button"
+              aria-label="More"
+              translate
+              translate-attr-aria-label="STAFF.MORE"
+              ng-click="$mdMenu.open($event)"
+            >
+              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+            </md-button>
+
+            <md-menu-content width="4">
+              <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                <md-button
+                  ng-click="vm.goToMailAccount($event, vm.mailAccounts[value])"
+                  translate="MAIL.EDIT_ACCOUNT"
+                >
+                  Edit Account
+                </md-button>
+              </md-menu-item>
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.verifySmtp($event, vm.mailAccounts[value])"
+                  translate="MAIL.VERIFY_SMTP"
+                >
+                  Verify Smtp
+                </md-button>
+              </md-menu-item>
+            </md-menu-content>
+          </md-menu>
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</md-table-container>
+
+<md-table-pagination
+  md-label="{page: '{{'MAIL.PAGE' | translate}}:', rowsPerPage: '{{'MAIL.ROWSPERPAGE' | translate}}:', of: '{{'MAIL.OF' | translate}}'}"
+  md-limit="vm.query.limit"
+  md-limit-options="[10, 15, 20, 50, 100, 250]"
+  md-page="vm.query.page"
+  md-total="{{vm.count}}"
+  md-on-paginate="vm.getmailAccounts"
+  md-page-select
+></md-table-pagination>
+<!-- / AGENT TABLE -->
+<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/mail/views/realtime/agents/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/mail/views/realtime/agents/view.html/view-[chunkhash].html
deleted file mode 100644
index 6db5898..0000000
--- a/public/src/js/modules/main/apps/mail/views/realtime/agents/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,517 +0,0 @@
-<!-- MAIN -->
-<md-toolbar class="md-table-toolbar md-default">
-  <div class="md-toolbar-tools">
-    <span class="md-subhead" translate="MAIL.AGENTS">Agents</span>
-    <div flex></div>
-    <ms-search-bar
-      on-search="vm.query.filter = query; vm.onInit()"
-      on-collapse="vm.query.filter = undefined; vm.onInit()"
-      debounce="300"
-    ></ms-search-bar>
-    <md-select
-      ng-model="vm.query.globalStatusFilter"
-      class="md-caption"
-      ng-change="vm.query.pauseTypeFilter = ''; vm.onInit()"
-    >
-      <md-option ng-value="''">{{ 'MAIL.ALL' | translate }}</md-option>
-      <md-option value="pause">{{ 'MAIL.PAUSE' | translate }}</md-option>
-      <md-option value="*pause"
-        >{{ 'MAIL.PARTIALPAUSE' | translate }}</md-option
-      >
-      <md-option value="busy">{{ 'MAIL.BUSY' | translate }}</md-option>
-      <md-option value="idle">{{ 'MAIL.IDLE' | translate }}</md-option>
-    </md-select>
-
-    <md-select
-      ng-if="vm.isPause(vm.query.globalStatusFilter)"
-      ng-model="vm.query.pauseTypeFilter"
-      class="md-caption"
-      ng-change="vm.onInit()"
-    >
-      <md-option ng-value="''">All</md-option>
-      <md-option value="DEFAULT PAUSE">DEFAULT PAUSE</md-option>
-      <md-option value="ACW">ACW</md-option>
-      <md-option value="LOGININPAUSE">LOGININPAUSE</md-option>
-      <md-option value="Auto-Pause">AUTOPAUSE</md-option>
-      <md-option ng-value="pause.name" ng-repeat="pause in vm.pauses.rows"
-        >{{pause.name}}</md-option
-      >
-    </md-select>
-  </div>
-</md-toolbar>
-
-<!-- AGENT TABLE -->
-<md-table-container>
-  <table md-table multiple md-progress="vm.promise">
-    <thead md-head md-order="vm.query.order" md-on-reorder="vm.onInit">
-      <tr md-row border="1">
-        <th class="bv text-center" colspan="5">
-          {{ 'MAIL.AGENT' | translate }}
-        </th>
-        <th class="bv bl text-center" colspan="2">
-          {{ 'VOICE.VOICE' | translate }}
-        </th>
-        <th ng-if="vm.license.chat" class="bv bl text-center" colspan="2">
-          {{ 'CHAT.CHAT' | translate }}
-        </th>
-        <th ng-if="vm.license.mail" class="bv bl text-center" colspan="2">
-          {{ 'MAIL.MAIL' | translate }}
-        </th>
-        <th ng-if="vm.license.messaging" class="bv bl text-center" colspan="2">
-          {{ 'SMS.SMS' | translate }}
-        </th>
-        <th
-          ng-if="vm.license.openchannel"
-          class="bv bl text-center"
-          colspan="2"
-        >
-          {{ 'OPENCHANNEL.OPENCHANNEL' | translate }}
-        </th>
-        <th ng-if="vm.license.fax" class="bv bl text-center" colspan="2">
-          {{ 'FAX.FAX' | translate }}
-        </th>
-        <th ng-if="vm.license.whatsapp" class="bv bl text-center" colspan="2">
-          {{ 'WHATSAPP.WHATSAPP' | translate }}
-        </th>
-        <th width="10px" class="bt bl" rowspan="2"></th>
-      </tr>
-      <tr md-row>
-        <th class="bl" colspan="2" md-column md-order-by="fullname">
-          {{ 'MAIL.NAME' | translate }}
-        </th>
-        <th class="bl custom-column" md-column md-order-by="globalStatus">
-          {{ 'MAIL.STATUS' | translate }}
-        </th>
-        <th class="bl custom-column" md-column md-order-by="lastLoginAt">
-          {{ 'MAIL.LOGIN_TIME' | translate }}
-        </th>
-        <th class="bl custom-column" md-column md-order-by="lastPauseAt">
-          {{ 'MAIL.PAUSE_TIME' | translate }}
-        </th>
-
-        <th class="bl custom-column">{{ 'VOICE.STATUS' | translate }}</th>
-        <th class="bl custom-column">Info</th>
-
-        <th ng-if="vm.license.chat" class="bl text-center">
-          {{ 'CHAT.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.chat" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'CHAT.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.mail" class="bl text-center">
-          {{ 'MAIL.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.mail" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'MAIL.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.messaging" class="bl text-center">
-          {{ 'SMS.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.messaging" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'SMS.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.openchannel" class="bl text-center">
-          {{ 'OPENCHANNEL.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.openchannel" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'OPENCHANNEL.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.fax" class="bl text-center">
-          {{ 'FAX.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.fax" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'FAX.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.whatsapp" class="bl text-center">
-          {{ 'WHATSAPP.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.whatsapp" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'WHATSAPP.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-      </tr>
-    </thead>
-    <tbody md-body>
-      <tr md-row ng-hide="vm.order.length">
-        <td md-cell colspan="19">
-          <div layout="row" layout-align="center center">
-            <span>{{ 'MAIL.NO_AGENT_ONLINE' | translate }}</span>
-          </div>
-        </td>
-      </tr>
-      <tr
-        md-select="vm.agents[value]"
-        md-select-id="id"
-        ng-repeat="(id, value) in vm.order"
-      >
-        <td class="bt padding-5">
-          <div layout="row" layout-align="start center">
-            <img
-              class="avatar"
-              ng-src="{{vm.agents[value].userpic && 'api/users/'+vm.agents[value].id+'/avatar' || 'assets/images/avatars/profile.png'}}"
-            />
-            <div layout="column">
-              <span>{{vm.agents[value].fullname}}</span>
-              <span>{{vm.agents[value].internal}}</span>
-            </div>
-          </div>
-        </td>
-        <td class="bt padding-5">
-          <div
-            layout="row"
-            layout-align="start center"
-            ng-if="vm.license.screenrecording && (vm.agents[value].phoneBarEnableScreenRecordingByAgent || vm.agents[value].phoneBarEnableAutomaticScreenRecording)"
-          >
-            <div class="column" ng-if="vm.agents[value].screenrecording">
-              <span>
-                <md-icon
-                  md-font-icon="icon-camcorder-box"
-                  style="color: green; font-size: 36px"
-                  aria-label="icon-camcorder-box26"
-                >
-                  <md-tooltip>
-                    {{ 'MAIL.TOOLTIP_SCREENRECORDING_ON' | translate }}
-                  </md-tooltip>
-                </md-icon>
-              </span>
-            </div>
-            <div class="column" ng-if="!vm.agents[value].screenrecording">
-              <span>
-                <md-icon
-                  md-font-icon="icon-camcorder-box"
-                  style="color: gray"
-                  aria-label="icon-camcorder-box26"
-                >
-                  <md-tooltip>
-                    {{ 'MAIL.TOOLTIP_SCREENRECORDING_OFF' | translate }}
-                  </md-tooltip>
-                </md-icon>
-              </span>
-            </div>
-          </div>
-        </td>
-
-        <td class="bt">
-          <span
-            class="text-boxed md-background-bg bl bt padding-5"
-            ng-class="{'idle':'lime-300-bg','busy':'indigo-100-bg','*pause':'amber-50-bg','pause':'amber-200-bg'}[vm.agents[value].globalStatus]"
-            >{{ vm.isPause(vm.agents[value].globalStatus) ? '' :
-            vm.agents[value].globalStatus | uppercase }} {{
-            vm.isPause(vm.agents[value].globalStatus) ?
-            (vm.isPartialPause(vm.agents[value].globalStatus) ?
-            '*'+vm.agents[value].pauseType || 'DEFAULT PAUSE' :
-            vm.agents[value].pauseType || 'DEFAULT PAUSE') : ''}}</span
-          >
-        </td>
-        <td class="bt custom-column">
-          <timer start-time="vm.agents[value].lastLoginAt" interval="1000"
-            >{{ days > 0 ? days + 'd' : '' }}
-            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
-          >
-        </td>
-        <td class="bt custom-column">
-          <timer
-            ng-if="vm.isPause(vm.agents[value].globalStatus) || vm.isPartialPause(vm.agents[value].globalStatus)"
-            start-time="vm.agents[value].lastPauseAt"
-            interval="1000"
-            >{{ days > 0 ? days + 'd' : '' }}
-            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
-          >
-        </td>
-        <td class="bt bl">
-          <div layout="row">
-            <span
-              ng-if="!vm.agents[value].onhold"
-              class="text-boxed md-background-bg bl bt padding-5"
-              ng-class="{'idle':'lime-300-bg','talking':'indigo-100-bg','ringing':'orange-400-bg','pause':'amber-200-bg'}[vm.agents[value].voiceStatus]"
-              >{{ vm.agents[value].voiceStatus | uppercase }}</span
-            >
-            <span
-              ng-if="vm.agents[value].onhold"
-              class="text-boxed md-background-bg bl bt padding-5 orange-400-bg"
-              >ONHOLD</span
-            >
-          </div>
-        </td>
-        <td class="bt bl">
-          <div layout="column">
-            <span
-              ng-if="vm.agents[value].queue"
-              class="padding-5"
-              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
-              >{{ vm.agents[value].queue }}</span
-            >
-            <span
-              ng-if="vm.agents[value].destconnectedlinenum"
-              class="padding-5"
-              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
-              >{{ vm.agents[value].destconnectedlinenum }}</span
-            >
-            <span
-              class="padding-5"
-              ng-if="vm.agents[value].queue || vm.agents[value].destconnectedlinenum"
-            >
-              <timer
-                start-time="vm.agents[value].voiceStatusTime"
-                interval="1000"
-                ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
-              >
-                {{hhours}}:{{mminutes}}:{{sseconds}}</timer
-              >
-            </span>
-          </div>
-        </td>
-
-        <td class="bt bl" ng-if="vm.license.chat">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].chatStatus]"
-                >{{ vm.agents[value].chatStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          md-number
-          class="bt text-center font-size-20"
-          ng-if="vm.license.chat"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].chatStatus]"
-        >
-          {{ vm.agents[value].chatCurrentCapacity }}
-        </td>
-
-        <td class="bl bt" ng-if="vm.license.mail">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].mailStatus]"
-                >{{ vm.agents[value].mailStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.mail"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].mailStatus]"
-        >
-          {{ vm.agents[value].mailCurrentCapacity }}
-        </td>
-
-        <td class="bl bt" ng-if="vm.license.messaging">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].smsStatus]"
-                >{{ vm.agents[value].smsStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.messaging"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].smsStatus]"
-        >
-          {{ vm.agents[value].smsCurrentCapacity }}
-        </td>
-
-        <td class="bt bl" ng-if="vm.license.openchannel">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].openchannelStatus]"
-                >{{ vm.agents[value].openchannelStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.openchannel"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].openchannelStatus]"
-        >
-          {{ vm.agents[value].openchannelCurrentCapacity }}
-        </td>
-
-        <td class="bt bl" ng-if="vm.license.fax">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].faxStatus]"
-                >{{ vm.agents[value].faxStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.fax"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].faxStatus]"
-        >
-          {{ vm.agents[value].faxCurrentCapacity }}
-        </td>
-
-        <td class="bl bt" ng-if="vm.license.whatsapp">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].whatsappStatus]"
-                >{{ vm.agents[value].whatsappStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.whatsapp"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].whatsappStatus]"
-        >
-          {{ vm.agents[value].whatsappCurrentCapacity }}
-        </td>
-
-        <td
-          class="bl bt padding-5 text-center"
-          ng-if="vm.crudPermissions.canEdit"
-        >
-          <md-menu>
-            <md-button
-              class="md-icon-button"
-              aria-label="More"
-              translate
-              translate-attr-aria-label="STAFF.MORE"
-              ng-click="$mdMenu.open($event)"
-            >
-              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-            </md-button>
-
-            <md-menu-content width="4">
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.logout(vm.agents[value], $event)"
-                  translate="MAIL.LOGOUT"
-                >
-                  Logout
-                </md-button>
-              </md-menu-item>
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.queueAdd(vm.agents[value], $event)"
-                  translate="MAIL.AGENTADD_QUEUE"
-                >
-                  Add Agent In Queue
-                </md-button>
-              </md-menu-item>
-
-              <md-menu-item
-                ng-if="vm.license.screenrecording && vm.agents[value].phoneBarEnableScreenRecordingByAgent"
-              >
-                <md-menu>
-                  <md-button
-                    ng-click="$mdMenu.open()"
-                    class="text-capitalize"
-                    translate="MAIL.SCREENRECORDING"
-                    >Screen Recording
-                  </md-button>
-                  <md-menu-content>
-                    <md-menu-item ng-if="!vm.agents[value].screenrecording">
-                      <md-button
-                        ng-click="vm.screenRecording(vm.agents[value], true)"
-                        ><em translate="MAIL.START_SCREENRECORDING"
-                          >Start Screen Recording</em
-                        ></md-button
-                      >
-                    </md-menu-item>
-                    <md-menu-item ng-if="vm.agents[value].screenrecording">
-                      <md-button
-                        ng-click="vm.screenRecording(vm.agents[value], false)"
-                        ><em translate="MAIL.STOP_SCREENRECORDING"
-                          >Stop Screen Recording</em
-                        ></md-button
-                      >
-                    </md-menu-item>
-                  </md-menu-content>
-                </md-menu>
-              </md-menu-item>
-
-              <md-menu-item>
-                <md-menu>
-                  <md-button
-                    ng-click="$mdMenu.open()"
-                    class="text-capitalize"
-                    translate="MAIL.PAUSE"
-                    >Pause</md-button
-                  >
-                  <md-menu-content>
-                    <md-menu-item>
-                      <md-button
-                        ng-disabled=" vm.agents[value].voicePause && 'DEFAULT PAUSE' === vm.agents[value].pauseType"
-                        ng-click="vm.pause(vm.agents[value])"
-                        ><em translate="MAIL.DEFAULT_PAUSE"
-                          >Default Pause</em
-                        ></md-button
-                      >
-                    </md-menu-item>
-                    <md-menu-item
-                      ng-if="vm.pauses.rows.length"
-                      ng-repeat="pause in vm.pauses.rows"
-                    >
-                      <md-button
-                        ng-disabled="vm.agents[value].voicePause && pause.name === vm.agents[value].pauseType"
-                        ng-click="vm.pause(vm.agents[value], pause.name)"
-                        >{{pause.name}}
-                      </md-button>
-                    </md-menu-item>
-                  </md-menu-content>
-                </md-menu>
-              </md-menu-item>
-              <md-menu-item ng-if="vm.isPause(vm.agents[value].globalStatus)">
-                <md-button
-                  ng-click="vm.unPause(vm.agents[value])"
-                  translate="MAIL.UNPAUSE"
-                >
-                  Unpause
-                </md-button>
-              </md-menu-item>
-            </md-menu-content>
-          </md-menu>
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</md-table-container>
-
-<md-table-pagination
-  md-label="{page: '{{'MAIL.PAGE' | translate}}:', rowsPerPage: '{{'MAIL.ROWSPERPAGE' | translate}}:', of: '{{'MAIL.OF' | translate}}'}"
-  md-limit="vm.query.limit"
-  md-limit-options="[10, 15, 20, 50, 100, 250]"
-  md-page="vm.query.page"
-  md-total="{{vm.filteredAgents.length}}"
-  md-on-paginate="vm.onInit"
-  md-page-select
-></md-table-pagination>
-<!-- / AGENT TABLE -->
-<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/mail/views/realtime/agents/view.html/view.html b/public/src/js/modules/main/apps/mail/views/realtime/agents/view.html/view.html
new file mode 100644
index 0000000..6db5898
--- /dev/null
+++ b/public/src/js/modules/main/apps/mail/views/realtime/agents/view.html/view.html
@@ -0,0 +1,517 @@
+<!-- MAIN -->
+<md-toolbar class="md-table-toolbar md-default">
+  <div class="md-toolbar-tools">
+    <span class="md-subhead" translate="MAIL.AGENTS">Agents</span>
+    <div flex></div>
+    <ms-search-bar
+      on-search="vm.query.filter = query; vm.onInit()"
+      on-collapse="vm.query.filter = undefined; vm.onInit()"
+      debounce="300"
+    ></ms-search-bar>
+    <md-select
+      ng-model="vm.query.globalStatusFilter"
+      class="md-caption"
+      ng-change="vm.query.pauseTypeFilter = ''; vm.onInit()"
+    >
+      <md-option ng-value="''">{{ 'MAIL.ALL' | translate }}</md-option>
+      <md-option value="pause">{{ 'MAIL.PAUSE' | translate }}</md-option>
+      <md-option value="*pause"
+        >{{ 'MAIL.PARTIALPAUSE' | translate }}</md-option
+      >
+      <md-option value="busy">{{ 'MAIL.BUSY' | translate }}</md-option>
+      <md-option value="idle">{{ 'MAIL.IDLE' | translate }}</md-option>
+    </md-select>
+
+    <md-select
+      ng-if="vm.isPause(vm.query.globalStatusFilter)"
+      ng-model="vm.query.pauseTypeFilter"
+      class="md-caption"
+      ng-change="vm.onInit()"
+    >
+      <md-option ng-value="''">All</md-option>
+      <md-option value="DEFAULT PAUSE">DEFAULT PAUSE</md-option>
+      <md-option value="ACW">ACW</md-option>
+      <md-option value="LOGININPAUSE">LOGININPAUSE</md-option>
+      <md-option value="Auto-Pause">AUTOPAUSE</md-option>
+      <md-option ng-value="pause.name" ng-repeat="pause in vm.pauses.rows"
+        >{{pause.name}}</md-option
+      >
+    </md-select>
+  </div>
+</md-toolbar>
+
+<!-- AGENT TABLE -->
+<md-table-container>
+  <table md-table multiple md-progress="vm.promise">
+    <thead md-head md-order="vm.query.order" md-on-reorder="vm.onInit">
+      <tr md-row border="1">
+        <th class="bv text-center" colspan="5">
+          {{ 'MAIL.AGENT' | translate }}
+        </th>
+        <th class="bv bl text-center" colspan="2">
+          {{ 'VOICE.VOICE' | translate }}
+        </th>
+        <th ng-if="vm.license.chat" class="bv bl text-center" colspan="2">
+          {{ 'CHAT.CHAT' | translate }}
+        </th>
+        <th ng-if="vm.license.mail" class="bv bl text-center" colspan="2">
+          {{ 'MAIL.MAIL' | translate }}
+        </th>
+        <th ng-if="vm.license.messaging" class="bv bl text-center" colspan="2">
+          {{ 'SMS.SMS' | translate }}
+        </th>
+        <th
+          ng-if="vm.license.openchannel"
+          class="bv bl text-center"
+          colspan="2"
+        >
+          {{ 'OPENCHANNEL.OPENCHANNEL' | translate }}
+        </th>
+        <th ng-if="vm.license.fax" class="bv bl text-center" colspan="2">
+          {{ 'FAX.FAX' | translate }}
+        </th>
+        <th ng-if="vm.license.whatsapp" class="bv bl text-center" colspan="2">
+          {{ 'WHATSAPP.WHATSAPP' | translate }}
+        </th>
+        <th width="10px" class="bt bl" rowspan="2"></th>
+      </tr>
+      <tr md-row>
+        <th class="bl" colspan="2" md-column md-order-by="fullname">
+          {{ 'MAIL.NAME' | translate }}
+        </th>
+        <th class="bl custom-column" md-column md-order-by="globalStatus">
+          {{ 'MAIL.STATUS' | translate }}
+        </th>
+        <th class="bl custom-column" md-column md-order-by="lastLoginAt">
+          {{ 'MAIL.LOGIN_TIME' | translate }}
+        </th>
+        <th class="bl custom-column" md-column md-order-by="lastPauseAt">
+          {{ 'MAIL.PAUSE_TIME' | translate }}
+        </th>
+
+        <th class="bl custom-column">{{ 'VOICE.STATUS' | translate }}</th>
+        <th class="bl custom-column">Info</th>
+
+        <th ng-if="vm.license.chat" class="bl text-center">
+          {{ 'CHAT.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.chat" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'CHAT.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.mail" class="bl text-center">
+          {{ 'MAIL.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.mail" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'MAIL.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.messaging" class="bl text-center">
+          {{ 'SMS.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.messaging" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'SMS.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.openchannel" class="bl text-center">
+          {{ 'OPENCHANNEL.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.openchannel" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'OPENCHANNEL.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.fax" class="bl text-center">
+          {{ 'FAX.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.fax" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'FAX.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.whatsapp" class="bl text-center">
+          {{ 'WHATSAPP.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.whatsapp" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'WHATSAPP.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+      </tr>
+    </thead>
+    <tbody md-body>
+      <tr md-row ng-hide="vm.order.length">
+        <td md-cell colspan="19">
+          <div layout="row" layout-align="center center">
+            <span>{{ 'MAIL.NO_AGENT_ONLINE' | translate }}</span>
+          </div>
+        </td>
+      </tr>
+      <tr
+        md-select="vm.agents[value]"
+        md-select-id="id"
+        ng-repeat="(id, value) in vm.order"
+      >
+        <td class="bt padding-5">
+          <div layout="row" layout-align="start center">
+            <img
+              class="avatar"
+              ng-src="{{vm.agents[value].userpic && 'api/users/'+vm.agents[value].id+'/avatar' || 'assets/images/avatars/profile.png'}}"
+            />
+            <div layout="column">
+              <span>{{vm.agents[value].fullname}}</span>
+              <span>{{vm.agents[value].internal}}</span>
+            </div>
+          </div>
+        </td>
+        <td class="bt padding-5">
+          <div
+            layout="row"
+            layout-align="start center"
+            ng-if="vm.license.screenrecording && (vm.agents[value].phoneBarEnableScreenRecordingByAgent || vm.agents[value].phoneBarEnableAutomaticScreenRecording)"
+          >
+            <div class="column" ng-if="vm.agents[value].screenrecording">
+              <span>
+                <md-icon
+                  md-font-icon="icon-camcorder-box"
+                  style="color: green; font-size: 36px"
+                  aria-label="icon-camcorder-box26"
+                >
+                  <md-tooltip>
+                    {{ 'MAIL.TOOLTIP_SCREENRECORDING_ON' | translate }}
+                  </md-tooltip>
+                </md-icon>
+              </span>
+            </div>
+            <div class="column" ng-if="!vm.agents[value].screenrecording">
+              <span>
+                <md-icon
+                  md-font-icon="icon-camcorder-box"
+                  style="color: gray"
+                  aria-label="icon-camcorder-box26"
+                >
+                  <md-tooltip>
+                    {{ 'MAIL.TOOLTIP_SCREENRECORDING_OFF' | translate }}
+                  </md-tooltip>
+                </md-icon>
+              </span>
+            </div>
+          </div>
+        </td>
+
+        <td class="bt">
+          <span
+            class="text-boxed md-background-bg bl bt padding-5"
+            ng-class="{'idle':'lime-300-bg','busy':'indigo-100-bg','*pause':'amber-50-bg','pause':'amber-200-bg'}[vm.agents[value].globalStatus]"
+            >{{ vm.isPause(vm.agents[value].globalStatus) ? '' :
+            vm.agents[value].globalStatus | uppercase }} {{
+            vm.isPause(vm.agents[value].globalStatus) ?
+            (vm.isPartialPause(vm.agents[value].globalStatus) ?
+            '*'+vm.agents[value].pauseType || 'DEFAULT PAUSE' :
+            vm.agents[value].pauseType || 'DEFAULT PAUSE') : ''}}</span
+          >
+        </td>
+        <td class="bt custom-column">
+          <timer start-time="vm.agents[value].lastLoginAt" interval="1000"
+            >{{ days > 0 ? days + 'd' : '' }}
+            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
+          >
+        </td>
+        <td class="bt custom-column">
+          <timer
+            ng-if="vm.isPause(vm.agents[value].globalStatus) || vm.isPartialPause(vm.agents[value].globalStatus)"
+            start-time="vm.agents[value].lastPauseAt"
+            interval="1000"
+            >{{ days > 0 ? days + 'd' : '' }}
+            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
+          >
+        </td>
+        <td class="bt bl">
+          <div layout="row">
+            <span
+              ng-if="!vm.agents[value].onhold"
+              class="text-boxed md-background-bg bl bt padding-5"
+              ng-class="{'idle':'lime-300-bg','talking':'indigo-100-bg','ringing':'orange-400-bg','pause':'amber-200-bg'}[vm.agents[value].voiceStatus]"
+              >{{ vm.agents[value].voiceStatus | uppercase }}</span
+            >
+            <span
+              ng-if="vm.agents[value].onhold"
+              class="text-boxed md-background-bg bl bt padding-5 orange-400-bg"
+              >ONHOLD</span
+            >
+          </div>
+        </td>
+        <td class="bt bl">
+          <div layout="column">
+            <span
+              ng-if="vm.agents[value].queue"
+              class="padding-5"
+              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
+              >{{ vm.agents[value].queue }}</span
+            >
+            <span
+              ng-if="vm.agents[value].destconnectedlinenum"
+              class="padding-5"
+              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
+              >{{ vm.agents[value].destconnectedlinenum }}</span
+            >
+            <span
+              class="padding-5"
+              ng-if="vm.agents[value].queue || vm.agents[value].destconnectedlinenum"
+            >
+              <timer
+                start-time="vm.agents[value].voiceStatusTime"
+                interval="1000"
+                ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
+              >
+                {{hhours}}:{{mminutes}}:{{sseconds}}</timer
+              >
+            </span>
+          </div>
+        </td>
+
+        <td class="bt bl" ng-if="vm.license.chat">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].chatStatus]"
+                >{{ vm.agents[value].chatStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          md-number
+          class="bt text-center font-size-20"
+          ng-if="vm.license.chat"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].chatStatus]"
+        >
+          {{ vm.agents[value].chatCurrentCapacity }}
+        </td>
+
+        <td class="bl bt" ng-if="vm.license.mail">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].mailStatus]"
+                >{{ vm.agents[value].mailStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.mail"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].mailStatus]"
+        >
+          {{ vm.agents[value].mailCurrentCapacity }}
+        </td>
+
+        <td class="bl bt" ng-if="vm.license.messaging">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].smsStatus]"
+                >{{ vm.agents[value].smsStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.messaging"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].smsStatus]"
+        >
+          {{ vm.agents[value].smsCurrentCapacity }}
+        </td>
+
+        <td class="bt bl" ng-if="vm.license.openchannel">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].openchannelStatus]"
+                >{{ vm.agents[value].openchannelStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.openchannel"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].openchannelStatus]"
+        >
+          {{ vm.agents[value].openchannelCurrentCapacity }}
+        </td>
+
+        <td class="bt bl" ng-if="vm.license.fax">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].faxStatus]"
+                >{{ vm.agents[value].faxStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.fax"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].faxStatus]"
+        >
+          {{ vm.agents[value].faxCurrentCapacity }}
+        </td>
+
+        <td class="bl bt" ng-if="vm.license.whatsapp">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].whatsappStatus]"
+                >{{ vm.agents[value].whatsappStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.whatsapp"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].whatsappStatus]"
+        >
+          {{ vm.agents[value].whatsappCurrentCapacity }}
+        </td>
+
+        <td
+          class="bl bt padding-5 text-center"
+          ng-if="vm.crudPermissions.canEdit"
+        >
+          <md-menu>
+            <md-button
+              class="md-icon-button"
+              aria-label="More"
+              translate
+              translate-attr-aria-label="STAFF.MORE"
+              ng-click="$mdMenu.open($event)"
+            >
+              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+            </md-button>
+
+            <md-menu-content width="4">
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.logout(vm.agents[value], $event)"
+                  translate="MAIL.LOGOUT"
+                >
+                  Logout
+                </md-button>
+              </md-menu-item>
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.queueAdd(vm.agents[value], $event)"
+                  translate="MAIL.AGENTADD_QUEUE"
+                >
+                  Add Agent In Queue
+                </md-button>
+              </md-menu-item>
+
+              <md-menu-item
+                ng-if="vm.license.screenrecording && vm.agents[value].phoneBarEnableScreenRecordingByAgent"
+              >
+                <md-menu>
+                  <md-button
+                    ng-click="$mdMenu.open()"
+                    class="text-capitalize"
+                    translate="MAIL.SCREENRECORDING"
+                    >Screen Recording
+                  </md-button>
+                  <md-menu-content>
+                    <md-menu-item ng-if="!vm.agents[value].screenrecording">
+                      <md-button
+                        ng-click="vm.screenRecording(vm.agents[value], true)"
+                        ><em translate="MAIL.START_SCREENRECORDING"
+                          >Start Screen Recording</em
+                        ></md-button
+                      >
+                    </md-menu-item>
+                    <md-menu-item ng-if="vm.agents[value].screenrecording">
+                      <md-button
+                        ng-click="vm.screenRecording(vm.agents[value], false)"
+                        ><em translate="MAIL.STOP_SCREENRECORDING"
+                          >Stop Screen Recording</em
+                        ></md-button
+                      >
+                    </md-menu-item>
+                  </md-menu-content>
+                </md-menu>
+              </md-menu-item>
+
+              <md-menu-item>
+                <md-menu>
+                  <md-button
+                    ng-click="$mdMenu.open()"
+                    class="text-capitalize"
+                    translate="MAIL.PAUSE"
+                    >Pause</md-button
+                  >
+                  <md-menu-content>
+                    <md-menu-item>
+                      <md-button
+                        ng-disabled=" vm.agents[value].voicePause && 'DEFAULT PAUSE' === vm.agents[value].pauseType"
+                        ng-click="vm.pause(vm.agents[value])"
+                        ><em translate="MAIL.DEFAULT_PAUSE"
+                          >Default Pause</em
+                        ></md-button
+                      >
+                    </md-menu-item>
+                    <md-menu-item
+                      ng-if="vm.pauses.rows.length"
+                      ng-repeat="pause in vm.pauses.rows"
+                    >
+                      <md-button
+                        ng-disabled="vm.agents[value].voicePause && pause.name === vm.agents[value].pauseType"
+                        ng-click="vm.pause(vm.agents[value], pause.name)"
+                        >{{pause.name}}
+                      </md-button>
+                    </md-menu-item>
+                  </md-menu-content>
+                </md-menu>
+              </md-menu-item>
+              <md-menu-item ng-if="vm.isPause(vm.agents[value].globalStatus)">
+                <md-button
+                  ng-click="vm.unPause(vm.agents[value])"
+                  translate="MAIL.UNPAUSE"
+                >
+                  Unpause
+                </md-button>
+              </md-menu-item>
+            </md-menu-content>
+          </md-menu>
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</md-table-container>
+
+<md-table-pagination
+  md-label="{page: '{{'MAIL.PAGE' | translate}}:', rowsPerPage: '{{'MAIL.ROWSPERPAGE' | translate}}:', of: '{{'MAIL.OF' | translate}}'}"
+  md-limit="vm.query.limit"
+  md-limit-options="[10, 15, 20, 50, 100, 250]"
+  md-page="vm.query.page"
+  md-total="{{vm.filteredAgents.length}}"
+  md-on-paginate="vm.onInit"
+  md-page-select
+></md-table-pagination>
+<!-- / AGENT TABLE -->
+<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/mail/views/realtime/queues/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/mail/views/realtime/queues/view.html/view-[chunkhash].html
deleted file mode 100644
index 275d902..0000000
--- a/public/src/js/modules/main/apps/mail/views/realtime/queues/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,110 +0,0 @@
-<!-- MAIN -->
-<md-toolbar class="md-table-toolbar md-default">
-  <div class="md-toolbar-tools">
-    <span class="md-subhead" translate="MAIL.QUEUES">Queues</span>
-    <div flex></div>
-    <ms-search-bar
-      on-search="vm.query.filter = query;"
-      on-collapse="vm.query.filter = undefined;"
-      debounce="300"
-    ></ms-search-bar>
-  </div>
-</md-toolbar>
-
-<!-- QUEUE TABLE -->
-<md-table-container>
-  <table md-table multiple md-progress="vm.promise">
-    <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getQueues">
-      <tr md-row>
-        <th md-column md-order-by="name">{{ 'MAIL.NAME' | translate }}</th>
-        <th md-column>{{ 'MAIL.LOGGED_IN' | translate }}</th>
-        <th md-column>{{ 'MAIL.PAUSED' | translate }}</th>
-        <th md-column>{{ 'MAIL.READY' | translate }}</th>
-        <th md-column>{{ 'MAIL.WAITING' | translate }}</th>
-        <th md-column width="10px"></th>
-      </tr>
-    </thead>
-    <tbody md-body>
-      <tr md-row ng-hide="vm.queues">
-        <td md-cell colspan="7">
-          <div layout="row" layout-align="center center">
-            <span translate="MAIL.NO_AVAILABLE_INFO">No Available Info</span>
-          </div>
-        </td>
-      </tr>
-      <tr
-        md-row
-        md-select="vm.queues[value]"
-        md-select-id="id"
-        ng-repeat="(id, value) in vm.order"
-      >
-        <td md-cell>{{vm.queues[value].name}}</td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{vm.queues[value].loggedInDb || 0}} ({{vm.queues[value].loggedIn
-            || 0}})</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{vm.queues[value].paused || 0}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-16 grey-fg"
-            >{{vm.queues[value].available || 0}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{vm.queues[value].waiting || 0}}</span
-          >
-        </td>
-        <td md-cell class="actions" ng-if="vm.crudPermissions.canEdit">
-          <md-menu>
-            <md-button
-              class="md-icon-button"
-              aria-label="More"
-              translate
-              translate-attr-aria-label="MAIL.MORE"
-              ng-click="$mdMenu.open($event)"
-            >
-              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-            </md-button>
-
-            <md-menu-content width="3">
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.createOrEditMailQueue($event, vm.queues[value])"
-                  translate="MAIL.EDIT_QUEUE"
-                >
-                  Edit Queue
-                </md-button>
-              </md-menu-item>
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.agentAdd($event, vm.queues[value])"
-                  translate="MAIL.AGENTSADD_QUEUE"
-                >
-                  Add Agents to queue
-                </md-button>
-              </md-menu-item>
-            </md-menu-content>
-          </md-menu>
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</md-table-container>
-
-<md-table-pagination
-  md-label="{page: '{{'MAIL.PAGE' | translate}}:', rowsPerPage: '{{'MAIL.ROWSPERPAGE' | translate}}:', of: '{{'MAIL.OF' | translate}}'}"
-  md-limit="vm.query.limit"
-  md-limit-options="[10, 15, 20, 50, 100, 250]"
-  md-page="vm.query.page"
-  md-total="{{vm.count}}"
-  md-on-paginate="vm.getQueues"
-  md-page-select
-></md-table-pagination>
-<!-- / QUEUE TABLE -->
-<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/mail/views/realtime/queues/view.html/view.html b/public/src/js/modules/main/apps/mail/views/realtime/queues/view.html/view.html
new file mode 100644
index 0000000..275d902
--- /dev/null
+++ b/public/src/js/modules/main/apps/mail/views/realtime/queues/view.html/view.html
@@ -0,0 +1,110 @@
+<!-- MAIN -->
+<md-toolbar class="md-table-toolbar md-default">
+  <div class="md-toolbar-tools">
+    <span class="md-subhead" translate="MAIL.QUEUES">Queues</span>
+    <div flex></div>
+    <ms-search-bar
+      on-search="vm.query.filter = query;"
+      on-collapse="vm.query.filter = undefined;"
+      debounce="300"
+    ></ms-search-bar>
+  </div>
+</md-toolbar>
+
+<!-- QUEUE TABLE -->
+<md-table-container>
+  <table md-table multiple md-progress="vm.promise">
+    <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getQueues">
+      <tr md-row>
+        <th md-column md-order-by="name">{{ 'MAIL.NAME' | translate }}</th>
+        <th md-column>{{ 'MAIL.LOGGED_IN' | translate }}</th>
+        <th md-column>{{ 'MAIL.PAUSED' | translate }}</th>
+        <th md-column>{{ 'MAIL.READY' | translate }}</th>
+        <th md-column>{{ 'MAIL.WAITING' | translate }}</th>
+        <th md-column width="10px"></th>
+      </tr>
+    </thead>
+    <tbody md-body>
+      <tr md-row ng-hide="vm.queues">
+        <td md-cell colspan="7">
+          <div layout="row" layout-align="center center">
+            <span translate="MAIL.NO_AVAILABLE_INFO">No Available Info</span>
+          </div>
+        </td>
+      </tr>
+      <tr
+        md-row
+        md-select="vm.queues[value]"
+        md-select-id="id"
+        ng-repeat="(id, value) in vm.order"
+      >
+        <td md-cell>{{vm.queues[value].name}}</td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{vm.queues[value].loggedInDb || 0}} ({{vm.queues[value].loggedIn
+            || 0}})</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{vm.queues[value].paused || 0}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-16 grey-fg"
+            >{{vm.queues[value].available || 0}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{vm.queues[value].waiting || 0}}</span
+          >
+        </td>
+        <td md-cell class="actions" ng-if="vm.crudPermissions.canEdit">
+          <md-menu>
+            <md-button
+              class="md-icon-button"
+              aria-label="More"
+              translate
+              translate-attr-aria-label="MAIL.MORE"
+              ng-click="$mdMenu.open($event)"
+            >
+              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+            </md-button>
+
+            <md-menu-content width="3">
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.createOrEditMailQueue($event, vm.queues[value])"
+                  translate="MAIL.EDIT_QUEUE"
+                >
+                  Edit Queue
+                </md-button>
+              </md-menu-item>
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.agentAdd($event, vm.queues[value])"
+                  translate="MAIL.AGENTSADD_QUEUE"
+                >
+                  Add Agents to queue
+                </md-button>
+              </md-menu-item>
+            </md-menu-content>
+          </md-menu>
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</md-table-container>
+
+<md-table-pagination
+  md-label="{page: '{{'MAIL.PAGE' | translate}}:', rowsPerPage: '{{'MAIL.ROWSPERPAGE' | translate}}:', of: '{{'MAIL.OF' | translate}}'}"
+  md-limit="vm.query.limit"
+  md-limit-options="[10, 15, 20, 50, 100, 250]"
+  md-page="vm.query.page"
+  md-total="{{vm.count}}"
+  md-on-paginate="vm.getQueues"
+  md-page-select
+></md-table-pagination>
+<!-- / QUEUE TABLE -->
+<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/mail/views/realtime/realtime.html/realtime-[chunkhash].html b/public/src/js/modules/main/apps/mail/views/realtime/realtime.html/realtime-[chunkhash].html
deleted file mode 100644
index e56b30e..0000000
--- a/public/src/js/modules/main/apps/mail/views/realtime/realtime.html/realtime-[chunkhash].html
+++ /dev/null
@@ -1,31 +0,0 @@
-<div id="realtime" class="page-layout simple tabbed" layout="column" ng-cloak>
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="MAIL.AGENTS">Agents</span>
-        </md-tab-label>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="MAIL.QUEUES">Queues</span>
-        </md-tab-label>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="MAIL.ACCOUNTS">Accounts</span>
-        </md-tab-label>
-      </md-tab>
-    </md-tabs>
-
-    <md-card ui-view></md-card>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/mail/views/realtime/realtime.html/realtime.html b/public/src/js/modules/main/apps/mail/views/realtime/realtime.html/realtime.html
new file mode 100644
index 0000000..e56b30e
--- /dev/null
+++ b/public/src/js/modules/main/apps/mail/views/realtime/realtime.html/realtime.html
@@ -0,0 +1,31 @@
+<div id="realtime" class="page-layout simple tabbed" layout="column" ng-cloak>
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="MAIL.AGENTS">Agents</span>
+        </md-tab-label>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="MAIL.QUEUES">Queues</span>
+        </md-tab-label>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="MAIL.ACCOUNTS">Accounts</span>
+        </md-tab-label>
+      </md-tab>
+    </md-tabs>
+
+    <md-card ui-view></md-card>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/marketplace/views/plugins/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/marketplace/views/plugins/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index c9df8ba..0000000
--- a/public/src/js/modules/main/apps/marketplace/views/plugins/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,325 +0,0 @@
-<md-dialog class="plugin-dialog" aria-label="New Plugin">
-  <form name="pluginForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="MARKETPLACE.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.plugin.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="pluginForm['name'].$error"
-          ng-show="pluginForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MARKETPLACE.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="MARKETPLACE.TYPE">Type</label>
-        <input
-          type="text"
-          name="type"
-          ng-model="vm.plugin.type"
-          ng-disabled="!vm.newPlugin"
-        />
-
-        <div
-          ng-messages="pluginForm['type'].$error"
-          ng-show="pluginForm['type'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MARKETPLACE.ERRORS.TYPE_REQUIRED"
-              >Type field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <md-switch
-          ng-model="vm.plugin.active"
-          aria-label="Active"
-          ng-disabled="!vm.newPlugin"
-          ><span translate="MARKETPLACE.ACTIVE">Active</span></md-switch
-        >
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="MARKETPLACE.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.plugin.description"
-        />
-
-        <div
-          ng-messages="pluginForm['description'].$error"
-          ng-show="pluginForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MARKETPLACE.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="MARKETPLACE.ICON">Icon</label>
-        <input
-          type="text"
-          name="icon"
-          ng-model="vm.plugin.icon"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="pluginForm['icon'].$error"
-          ng-show="pluginForm['icon'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MARKETPLACE.ERRORS.ICON_REQUIRED"
-              >Icon field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="MARKETPLACE.SIDEBAR">Sidebar</label>
-        <md-select name="sidebar" ng-model="vm.plugin.sidebar" required>
-          <md-option ng-value="'always'">Always</md-option>
-          <md-option ng-value="'adminOnly'">Admin Only</md-option>
-          <md-option ng-value="'agentOnly'">Agent Only</md-option>
-          <md-option ng-value="'never'">Never</md-option>
-        </md-select>
-        <div
-          ng-messages="pluginForm['sidebar'].$error"
-          ng-show="pluginForm['sidebar'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MARKETPLACE.ERRORS.SIDEBAR_REQUIRED"
-              >Sidebar field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.plugin.sidebar === 'always' || vm.plugin.sidebar === 'adminOnly'"
-        class="md-block"
-      >
-        <label translate="MARKETPLACE.ADMINURL">AdminUrl</label>
-        <input type="text" name="adminUrl" ng-model="vm.plugin.adminUrl" />
-
-        <div
-          ng-messages="pluginForm['adminUrl'].$error"
-          ng-show="pluginForm['adminUrl'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MARKETPLACE.ERRORS.ADMINURL_REQUIRED"
-              >AdminUrl field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.plugin.sidebar === 'always' || vm.plugin.sidebar === 'agentOnly'"
-        class="md-block"
-      >
-        <label translate="MARKETPLACE.AGENTURL">AgentUrl</label>
-        <input type="text" name="agentUrl" ng-model="vm.plugin.agentUrl" />
-
-        <div
-          ng-messages="pluginForm['agentUrl'].$error"
-          ng-show="pluginForm['agentUrl'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MARKETPLACE.ERRORS.AGENTURL_REQUIRED"
-              >AgentUrl field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container ng-if="vm.plugin.type === 'script'" class="md-block">
-        <label translate="MARKETPLACE.SCRIPTNAME">ScriptName</label>
-        <input
-          type="text"
-          name="scriptName"
-          ng-model="vm.plugin.scriptName"
-          ng-disabled="!vm.newPlugin"
-        />
-
-        <div
-          ng-messages="pluginForm['scriptName'].$error"
-          ng-show="pluginForm['scriptName'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MARKETPLACE.ERRORS.SCRIPTNAME_REQUIRED"
-              >ScriptName field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container ng-if="vm.plugin.type === 'script'" class="md-block">
-        <label translate="MARKETPLACE.SCRIPTPATH">ScriptPath</label>
-        <input
-          type="text"
-          name="scriptPath"
-          ng-model="vm.plugin.scriptPath"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="pluginForm['scriptPath'].$error"
-          ng-show="pluginForm['scriptPath'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MARKETPLACE.ERRORS.SCRIPTPATH_REQUIRED"
-              >ScriptPath field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="MARKETPLACE.VERSION">Version</label>
-        <input
-          type="text"
-          name="version"
-          ng-model="vm.plugin.version"
-          ng-disabled="!vm.newPlugin"
-        />
-
-        <div
-          ng-messages="pluginForm['version'].$error"
-          ng-show="pluginForm['version'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MARKETPLACE.ERRORS.VERSION_REQUIRED"
-              >Version field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newPlugin"
-          ng-click="vm.savePlugin()"
-          class="send-button md-accent md-raised"
-          ng-disabled="pluginForm.$invalid || pluginForm.$pristine"
-          aria-label="SAVE"
-          translate="MARKETPLACE.SAVE"
-          translate-attr-aria-label="MARKETPLACE.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newPlugin"
-          ng-click="vm.addNewPlugin()"
-          class="send-button md-accent md-raised"
-          ng-disabled="pluginForm.$invalid"
-          aria-label="ADD"
-          translate="MARKETPLACE.ADD_PLUGIN"
-          translate-attr-aria-label="MARKETPLACE.ADD_PLUGIN"
-        >
-          ADD PLUGIN
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newPlugin"
-          ng-click="vm.deletePlugin($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="MARKETPLACE.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="MARKETPLACE.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/marketplace/views/plugins/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/marketplace/views/plugins/create/dialog.html/dialog.html
new file mode 100644
index 0000000..c9df8ba
--- /dev/null
+++ b/public/src/js/modules/main/apps/marketplace/views/plugins/create/dialog.html/dialog.html
@@ -0,0 +1,325 @@
+<md-dialog class="plugin-dialog" aria-label="New Plugin">
+  <form name="pluginForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="MARKETPLACE.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.plugin.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="pluginForm['name'].$error"
+          ng-show="pluginForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MARKETPLACE.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="MARKETPLACE.TYPE">Type</label>
+        <input
+          type="text"
+          name="type"
+          ng-model="vm.plugin.type"
+          ng-disabled="!vm.newPlugin"
+        />
+
+        <div
+          ng-messages="pluginForm['type'].$error"
+          ng-show="pluginForm['type'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MARKETPLACE.ERRORS.TYPE_REQUIRED"
+              >Type field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <md-switch
+          ng-model="vm.plugin.active"
+          aria-label="Active"
+          ng-disabled="!vm.newPlugin"
+          ><span translate="MARKETPLACE.ACTIVE">Active</span></md-switch
+        >
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="MARKETPLACE.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.plugin.description"
+        />
+
+        <div
+          ng-messages="pluginForm['description'].$error"
+          ng-show="pluginForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MARKETPLACE.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="MARKETPLACE.ICON">Icon</label>
+        <input
+          type="text"
+          name="icon"
+          ng-model="vm.plugin.icon"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="pluginForm['icon'].$error"
+          ng-show="pluginForm['icon'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MARKETPLACE.ERRORS.ICON_REQUIRED"
+              >Icon field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="MARKETPLACE.SIDEBAR">Sidebar</label>
+        <md-select name="sidebar" ng-model="vm.plugin.sidebar" required>
+          <md-option ng-value="'always'">Always</md-option>
+          <md-option ng-value="'adminOnly'">Admin Only</md-option>
+          <md-option ng-value="'agentOnly'">Agent Only</md-option>
+          <md-option ng-value="'never'">Never</md-option>
+        </md-select>
+        <div
+          ng-messages="pluginForm['sidebar'].$error"
+          ng-show="pluginForm['sidebar'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MARKETPLACE.ERRORS.SIDEBAR_REQUIRED"
+              >Sidebar field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.plugin.sidebar === 'always' || vm.plugin.sidebar === 'adminOnly'"
+        class="md-block"
+      >
+        <label translate="MARKETPLACE.ADMINURL">AdminUrl</label>
+        <input type="text" name="adminUrl" ng-model="vm.plugin.adminUrl" />
+
+        <div
+          ng-messages="pluginForm['adminUrl'].$error"
+          ng-show="pluginForm['adminUrl'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MARKETPLACE.ERRORS.ADMINURL_REQUIRED"
+              >AdminUrl field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.plugin.sidebar === 'always' || vm.plugin.sidebar === 'agentOnly'"
+        class="md-block"
+      >
+        <label translate="MARKETPLACE.AGENTURL">AgentUrl</label>
+        <input type="text" name="agentUrl" ng-model="vm.plugin.agentUrl" />
+
+        <div
+          ng-messages="pluginForm['agentUrl'].$error"
+          ng-show="pluginForm['agentUrl'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MARKETPLACE.ERRORS.AGENTURL_REQUIRED"
+              >AgentUrl field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container ng-if="vm.plugin.type === 'script'" class="md-block">
+        <label translate="MARKETPLACE.SCRIPTNAME">ScriptName</label>
+        <input
+          type="text"
+          name="scriptName"
+          ng-model="vm.plugin.scriptName"
+          ng-disabled="!vm.newPlugin"
+        />
+
+        <div
+          ng-messages="pluginForm['scriptName'].$error"
+          ng-show="pluginForm['scriptName'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MARKETPLACE.ERRORS.SCRIPTNAME_REQUIRED"
+              >ScriptName field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container ng-if="vm.plugin.type === 'script'" class="md-block">
+        <label translate="MARKETPLACE.SCRIPTPATH">ScriptPath</label>
+        <input
+          type="text"
+          name="scriptPath"
+          ng-model="vm.plugin.scriptPath"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="pluginForm['scriptPath'].$error"
+          ng-show="pluginForm['scriptPath'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MARKETPLACE.ERRORS.SCRIPTPATH_REQUIRED"
+              >ScriptPath field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="MARKETPLACE.VERSION">Version</label>
+        <input
+          type="text"
+          name="version"
+          ng-model="vm.plugin.version"
+          ng-disabled="!vm.newPlugin"
+        />
+
+        <div
+          ng-messages="pluginForm['version'].$error"
+          ng-show="pluginForm['version'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MARKETPLACE.ERRORS.VERSION_REQUIRED"
+              >Version field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newPlugin"
+          ng-click="vm.savePlugin()"
+          class="send-button md-accent md-raised"
+          ng-disabled="pluginForm.$invalid || pluginForm.$pristine"
+          aria-label="SAVE"
+          translate="MARKETPLACE.SAVE"
+          translate-attr-aria-label="MARKETPLACE.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newPlugin"
+          ng-click="vm.addNewPlugin()"
+          class="send-button md-accent md-raised"
+          ng-disabled="pluginForm.$invalid"
+          aria-label="ADD"
+          translate="MARKETPLACE.ADD_PLUGIN"
+          translate-attr-aria-label="MARKETPLACE.ADD_PLUGIN"
+        >
+          ADD PLUGIN
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newPlugin"
+          ng-click="vm.deletePlugin($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="MARKETPLACE.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="MARKETPLACE.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/marketplace/views/plugins/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/marketplace/views/plugins/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index e4863ab..0000000
--- a/public/src/js/modules/main/apps/marketplace/views/plugins/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,316 +0,0 @@
-<div id="marketplace-plugin" class="page-layout simple tabbed" layout="column">
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-plugins-button md-icon-button"
-        aria-label="Go to plugins"
-        ng-click="vm.gotoPlugins()"
-        translate
-        translate-attr-aria-label="MARKETPLACE.GO_TO_PLUGINS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="plugin-image" hide-xs>
-          <img ng-src="assets/images/business/plugins.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.plugin.id}}
-            <span ng-if="vm.plugin.name">{{vm.plugin.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="MARKETPLACE.CREATED_AT"></span>
-            <span>{{vm.plugin.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.savePlugin()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid)"
-        translate="MARKETPLACE.SAVE"
-        translate-attr-aria-label="MARKETPLACE.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="MARKETPLACE.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="plugin-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MARKETPLACE.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MARKETPLACE.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.plugin.name"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MARKETPLACE.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MARKETPLACE.TYPE">Type</label>
-                <input
-                  type="text"
-                  name="type"
-                  ng-model="vm.plugin.type"
-                  disabled
-                />
-
-                <div
-                  ng-messages="generalForm['type'].$error"
-                  ng-show="generalForm['type'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MARKETPLACE.ERRORS.TYPE_REQUIRED"
-                      >Type field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.plugin.active"
-                  aria-label="Active"
-                  ng-disabled="true"
-                  ><span translate="MARKETPLACE.ACTIVE">Active</span></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MARKETPLACE.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.plugin.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MARKETPLACE.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MARKETPLACE.ICON">Icon</label>
-                <input
-                  type="text"
-                  name="icon"
-                  ng-model="vm.plugin.icon"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['icon'].$error"
-                  ng-show="generalForm['icon'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MARKETPLACE.ERRORS.ICON_REQUIRED"
-                      >Icon field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MARKETPLACE.SIDEBAR">Sidebar</label>
-                <md-select
-                  name="sidebar"
-                  ng-model="vm.plugin.sidebar"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'always'">Always</md-option>
-                  <md-option ng-value="'adminOnly'">Admin Only</md-option>
-                  <md-option ng-value="'agentOnly'">Agent Only</md-option>
-                  <md-option ng-value="'never'">Never</md-option>
-                </md-select>
-                <div
-                  ng-messages="generalForm['sidebar'].$error"
-                  ng-show="generalForm['sidebar'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MARKETPLACE.ERRORS.SIDEBAR_REQUIRED"
-                      >Sidebar field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.plugin.sidebar === 'always' || vm.plugin.sidebar === 'adminOnly'"
-                class="md-block"
-              >
-                <label translate="MARKETPLACE.ADMINURL">AdminUrl</label>
-                <input
-                  type="text"
-                  name="adminUrl"
-                  ng-model="vm.plugin.adminUrl"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['adminUrl'].$error"
-                  ng-show="generalForm['adminUrl'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MARKETPLACE.ERRORS.ADMINURL_REQUIRED"
-                      >AdminUrl field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.plugin.sidebar === 'always' || vm.plugin.sidebar === 'agentOnly'"
-                class="md-block"
-              >
-                <label translate="MARKETPLACE.AGENTURL">AgentUrl</label>
-                <input
-                  type="text"
-                  name="agentUrl"
-                  ng-model="vm.plugin.agentUrl"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['agentUrl'].$error"
-                  ng-show="generalForm['agentUrl'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MARKETPLACE.ERRORS.AGENTURL_REQUIRED"
-                      >AgentUrl field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.plugin.type === 'script'"
-                class="md-block"
-              >
-                <label translate="MARKETPLACE.SCRIPTNAME">ScriptName</label>
-                <input
-                  type="text"
-                  name="scriptName"
-                  ng-model="vm.plugin.scriptName"
-                  disabled
-                />
-
-                <div
-                  ng-messages="generalForm['scriptName'].$error"
-                  ng-show="generalForm['scriptName'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MARKETPLACE.ERRORS.SCRIPTNAME_REQUIRED"
-                      >ScriptName field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.plugin.type === 'script'"
-                class="md-block"
-              >
-                <label translate="MARKETPLACE.SCRIPTPATH">ScriptPath</label>
-                <input
-                  type="text"
-                  name="scriptPath"
-                  ng-model="vm.plugin.scriptPath"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['scriptPath'].$error"
-                  ng-show="generalForm['scriptPath'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MARKETPLACE.ERRORS.SCRIPTPATH_REQUIRED"
-                      >ScriptPath field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MARKETPLACE.VERSION">Version</label>
-                <input
-                  type="text"
-                  name="version"
-                  ng-model="vm.plugin.version"
-                  disabled
-                />
-
-                <div
-                  ng-messages="generalForm['version'].$error"
-                  ng-show="generalForm['version'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MARKETPLACE.ERRORS.VERSION_REQUIRED"
-                      >Version field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/marketplace/views/plugins/edit/view.html/view.html b/public/src/js/modules/main/apps/marketplace/views/plugins/edit/view.html/view.html
new file mode 100644
index 0000000..e4863ab
--- /dev/null
+++ b/public/src/js/modules/main/apps/marketplace/views/plugins/edit/view.html/view.html
@@ -0,0 +1,316 @@
+<div id="marketplace-plugin" class="page-layout simple tabbed" layout="column">
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-plugins-button md-icon-button"
+        aria-label="Go to plugins"
+        ng-click="vm.gotoPlugins()"
+        translate
+        translate-attr-aria-label="MARKETPLACE.GO_TO_PLUGINS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="plugin-image" hide-xs>
+          <img ng-src="assets/images/business/plugins.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.plugin.id}}
+            <span ng-if="vm.plugin.name">{{vm.plugin.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="MARKETPLACE.CREATED_AT"></span>
+            <span>{{vm.plugin.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.savePlugin()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid)"
+        translate="MARKETPLACE.SAVE"
+        translate-attr-aria-label="MARKETPLACE.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="MARKETPLACE.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="plugin-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MARKETPLACE.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MARKETPLACE.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.plugin.name"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MARKETPLACE.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MARKETPLACE.TYPE">Type</label>
+                <input
+                  type="text"
+                  name="type"
+                  ng-model="vm.plugin.type"
+                  disabled
+                />
+
+                <div
+                  ng-messages="generalForm['type'].$error"
+                  ng-show="generalForm['type'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MARKETPLACE.ERRORS.TYPE_REQUIRED"
+                      >Type field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.plugin.active"
+                  aria-label="Active"
+                  ng-disabled="true"
+                  ><span translate="MARKETPLACE.ACTIVE">Active</span></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MARKETPLACE.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.plugin.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MARKETPLACE.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MARKETPLACE.ICON">Icon</label>
+                <input
+                  type="text"
+                  name="icon"
+                  ng-model="vm.plugin.icon"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['icon'].$error"
+                  ng-show="generalForm['icon'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MARKETPLACE.ERRORS.ICON_REQUIRED"
+                      >Icon field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MARKETPLACE.SIDEBAR">Sidebar</label>
+                <md-select
+                  name="sidebar"
+                  ng-model="vm.plugin.sidebar"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'always'">Always</md-option>
+                  <md-option ng-value="'adminOnly'">Admin Only</md-option>
+                  <md-option ng-value="'agentOnly'">Agent Only</md-option>
+                  <md-option ng-value="'never'">Never</md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['sidebar'].$error"
+                  ng-show="generalForm['sidebar'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MARKETPLACE.ERRORS.SIDEBAR_REQUIRED"
+                      >Sidebar field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.plugin.sidebar === 'always' || vm.plugin.sidebar === 'adminOnly'"
+                class="md-block"
+              >
+                <label translate="MARKETPLACE.ADMINURL">AdminUrl</label>
+                <input
+                  type="text"
+                  name="adminUrl"
+                  ng-model="vm.plugin.adminUrl"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['adminUrl'].$error"
+                  ng-show="generalForm['adminUrl'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MARKETPLACE.ERRORS.ADMINURL_REQUIRED"
+                      >AdminUrl field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.plugin.sidebar === 'always' || vm.plugin.sidebar === 'agentOnly'"
+                class="md-block"
+              >
+                <label translate="MARKETPLACE.AGENTURL">AgentUrl</label>
+                <input
+                  type="text"
+                  name="agentUrl"
+                  ng-model="vm.plugin.agentUrl"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['agentUrl'].$error"
+                  ng-show="generalForm['agentUrl'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MARKETPLACE.ERRORS.AGENTURL_REQUIRED"
+                      >AgentUrl field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.plugin.type === 'script'"
+                class="md-block"
+              >
+                <label translate="MARKETPLACE.SCRIPTNAME">ScriptName</label>
+                <input
+                  type="text"
+                  name="scriptName"
+                  ng-model="vm.plugin.scriptName"
+                  disabled
+                />
+
+                <div
+                  ng-messages="generalForm['scriptName'].$error"
+                  ng-show="generalForm['scriptName'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MARKETPLACE.ERRORS.SCRIPTNAME_REQUIRED"
+                      >ScriptName field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.plugin.type === 'script'"
+                class="md-block"
+              >
+                <label translate="MARKETPLACE.SCRIPTPATH">ScriptPath</label>
+                <input
+                  type="text"
+                  name="scriptPath"
+                  ng-model="vm.plugin.scriptPath"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['scriptPath'].$error"
+                  ng-show="generalForm['scriptPath'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MARKETPLACE.ERRORS.SCRIPTPATH_REQUIRED"
+                      >ScriptPath field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MARKETPLACE.VERSION">Version</label>
+                <input
+                  type="text"
+                  name="version"
+                  ng-model="vm.plugin.version"
+                  disabled
+                />
+
+                <div
+                  ng-messages="generalForm['version'].$error"
+                  ng-show="generalForm['version'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MARKETPLACE.ERRORS.VERSION_REQUIRED"
+                      >Version field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/marketplace/views/plugins/plugins.html/plugins-[chunkhash].html b/public/src/js/modules/main/apps/marketplace/views/plugins/plugins.html/plugins-[chunkhash].html
deleted file mode 100644
index 7879fbb..0000000
--- a/public/src/js/modules/main/apps/marketplace/views/plugins/plugins.html/plugins-[chunkhash].html
+++ /dev/null
@@ -1,407 +0,0 @@
-<div
-  id="plugins"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-cart" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="MARKETPLACE.PLUGINS">Plugins</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="MARKETPLACE.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedPlugins.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedPlugins =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="MARKETPLACE.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-plugins-count">
-          <span>{{vm.selectedPlugins.length}}</span>
-          <span translate="MARKETPLACE.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="MARKETPLACE.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllPlugins()"
-                translate="MARKETPLACE.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectPlugins()"
-                translate="MARKETPLACE.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedPlugins"
-          csv-label="true"
-          filename="plugins.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedPlugins($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="MARKETPLACE.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <div ng-if="vm.installing">
-        <md-card class="md-whiteframe-1dp padding-20" flex>
-          <div layout="column" layout-align="center center">
-            <span
-              class="md-title md-accent-fg padding-20 text-bold"
-              translate="MARKETPLACE.INSTALLING"
-              >Installing</span
-            >
-            <md-progress-linear
-              md-mode="indeterminate"
-              class="md-accent padding-20"
-            ></md-progress-linear>
-          </div>
-        </md-card>
-      </div>
-
-      <!-- PLUGIN TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedPlugins"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getPlugins"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="name">
-                  {{ 'MARKETPLACE.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="type">
-                  {{ 'MARKETPLACE.TYPE' | translate }}
-                </th>
-                <th md-column md-order-by="active">
-                  {{ 'MARKETPLACE.ACTIVE' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'MARKETPLACE.DESCRIPTION' | translate }}
-                </th>
-                <th md-column md-order-by="version">
-                  {{ 'MARKETPLACE.VERSION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.plugins.rows.length">
-                <td md-cell colspan="6">
-                  <div layout="row" layout-align="center center">
-                    <span translate="MARKETPLACE.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="plugin"
-                md-select-id="id"
-                ng-repeat="plugin in vm.plugins.rows"
-              >
-                <td md-cell ng-if="plugin.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{plugin.name}}"
-                    ng-src="api/users/{{plugin.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!plugin.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{plugin.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(plugin, ev) : vm.createOrEditPlugin($event, plugin)"
-                  md-cell
-                  class="name"
-                >
-                  {{plugin.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(plugin, ev) : vm.createOrEditPlugin($event, plugin)"
-                  md-cell
-                  class="type"
-                >
-                  {{plugin.type}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(plugin, ev) : vm.createOrEditPlugin($event, plugin)"
-                  md-cell
-                  class="active"
-                >
-                  <md-icon
-                    md-colors="{color: {{plugin.active ? '\'green\'' : '\'grey\''}}}"
-                    md-font-icon="{{plugin.active ? 'icon-check' : 'icon-close'}}"
-                  ></md-icon>
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(plugin, ev) : vm.createOrEditPlugin($event, plugin)"
-                  md-cell
-                  class="description"
-                >
-                  {{plugin.description}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(plugin, ev) : vm.createOrEditPlugin($event, plugin)"
-                  md-cell
-                  class="version"
-                >
-                  {{plugin.version}}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="MARKETPLACE.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item
-                        ng-if="vm.crudPermissions.canEdit && !plugin.active"
-                      >
-                        <md-button
-                          ng-click="vm.installplugin(plugin, $event    )"
-                          translate="MARKETPLACE.INSTALL_PLUGIN"
-                        >
-                          Install Plugin
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(plugin, $event    )"
-                          translate="MARKETPLACE.EDIT_PLUGIN"
-                        >
-                          Edit Plugin
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item
-                        ng-if="vm.crudPermissions.canEdit && plugin.active && plugin.type == 'script'"
-                      >
-                        <md-button
-                          ng-click="vm.stopplugin(plugin, $event    )"
-                          translate="MARKETPLACE.STOP_PLUGIN"
-                        >
-                          Stop Plugin
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item
-                        ng-if="vm.crudPermissions.canEdit && plugin.active && plugin.type == 'script'"
-                      >
-                        <md-button
-                          ng-click="vm.restartplugin(plugin, $event    )"
-                          translate="MARKETPLACE.RESTART_PLUGIN"
-                        >
-                          Restart Plugin
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.downloadfile2(plugin, $event  , 'plugins'   )"
-                          translate="MARKETPLACE.DOWNLOAD_PLUGIN"
-                        >
-                          Download Plugin
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item
-                        ng-if="vm.crudPermissions.canEdit && plugin.active"
-                      >
-                        <md-button
-                          ng-click="vm.uninstallplugin(plugin, $event    )"
-                          translate="MARKETPLACE.UNINSTALL_PLUGIN"
-                        >
-                          Uninstall Plugin
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(plugin, $event    )"
-                          translate="MARKETPLACE.DELETE_PLUGIN"
-                        >
-                          Delete Plugin
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'MARKETPLACE.PAGE' | translate}}:', rowsPerPage: '{{'MARKETPLACE.ROWSPERPAGE' | translate}}:', of: '{{'MARKETPLACE.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.plugins.count}}"
-          md-on-paginate="vm.getPlugins"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / PLUGIN TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- UPLOAD PLUGIN BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent upload-item-button"
-    id="upload-plugin-button"
-    ng-click="vm.uploadPlugin($event)"
-    aria-label="upload plugin"
-    translate
-    translate-attr-aria-label="MARKETPLACE.UPLOAD_PLUGIN"
-  >
-    <md-icon md-font-icon="icon-upload"></md-icon>
-  </md-button>
-  <!-- / UPLOAD PLUGIN BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/marketplace/views/plugins/plugins.html/plugins.html b/public/src/js/modules/main/apps/marketplace/views/plugins/plugins.html/plugins.html
new file mode 100644
index 0000000..7879fbb
--- /dev/null
+++ b/public/src/js/modules/main/apps/marketplace/views/plugins/plugins.html/plugins.html
@@ -0,0 +1,407 @@
+<div
+  id="plugins"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-cart" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="MARKETPLACE.PLUGINS">Plugins</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="MARKETPLACE.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedPlugins.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedPlugins =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="MARKETPLACE.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-plugins-count">
+          <span>{{vm.selectedPlugins.length}}</span>
+          <span translate="MARKETPLACE.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="MARKETPLACE.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllPlugins()"
+                translate="MARKETPLACE.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectPlugins()"
+                translate="MARKETPLACE.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedPlugins"
+          csv-label="true"
+          filename="plugins.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedPlugins($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="MARKETPLACE.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <div ng-if="vm.installing">
+        <md-card class="md-whiteframe-1dp padding-20" flex>
+          <div layout="column" layout-align="center center">
+            <span
+              class="md-title md-accent-fg padding-20 text-bold"
+              translate="MARKETPLACE.INSTALLING"
+              >Installing</span
+            >
+            <md-progress-linear
+              md-mode="indeterminate"
+              class="md-accent padding-20"
+            ></md-progress-linear>
+          </div>
+        </md-card>
+      </div>
+
+      <!-- PLUGIN TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedPlugins"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getPlugins"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="name">
+                  {{ 'MARKETPLACE.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="type">
+                  {{ 'MARKETPLACE.TYPE' | translate }}
+                </th>
+                <th md-column md-order-by="active">
+                  {{ 'MARKETPLACE.ACTIVE' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'MARKETPLACE.DESCRIPTION' | translate }}
+                </th>
+                <th md-column md-order-by="version">
+                  {{ 'MARKETPLACE.VERSION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.plugins.rows.length">
+                <td md-cell colspan="6">
+                  <div layout="row" layout-align="center center">
+                    <span translate="MARKETPLACE.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="plugin"
+                md-select-id="id"
+                ng-repeat="plugin in vm.plugins.rows"
+              >
+                <td md-cell ng-if="plugin.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{plugin.name}}"
+                    ng-src="api/users/{{plugin.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!plugin.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{plugin.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(plugin, ev) : vm.createOrEditPlugin($event, plugin)"
+                  md-cell
+                  class="name"
+                >
+                  {{plugin.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(plugin, ev) : vm.createOrEditPlugin($event, plugin)"
+                  md-cell
+                  class="type"
+                >
+                  {{plugin.type}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(plugin, ev) : vm.createOrEditPlugin($event, plugin)"
+                  md-cell
+                  class="active"
+                >
+                  <md-icon
+                    md-colors="{color: {{plugin.active ? '\'green\'' : '\'grey\''}}}"
+                    md-font-icon="{{plugin.active ? 'icon-check' : 'icon-close'}}"
+                  ></md-icon>
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(plugin, ev) : vm.createOrEditPlugin($event, plugin)"
+                  md-cell
+                  class="description"
+                >
+                  {{plugin.description}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(plugin, ev) : vm.createOrEditPlugin($event, plugin)"
+                  md-cell
+                  class="version"
+                >
+                  {{plugin.version}}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="MARKETPLACE.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item
+                        ng-if="vm.crudPermissions.canEdit && !plugin.active"
+                      >
+                        <md-button
+                          ng-click="vm.installplugin(plugin, $event    )"
+                          translate="MARKETPLACE.INSTALL_PLUGIN"
+                        >
+                          Install Plugin
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(plugin, $event    )"
+                          translate="MARKETPLACE.EDIT_PLUGIN"
+                        >
+                          Edit Plugin
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item
+                        ng-if="vm.crudPermissions.canEdit && plugin.active && plugin.type == 'script'"
+                      >
+                        <md-button
+                          ng-click="vm.stopplugin(plugin, $event    )"
+                          translate="MARKETPLACE.STOP_PLUGIN"
+                        >
+                          Stop Plugin
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item
+                        ng-if="vm.crudPermissions.canEdit && plugin.active && plugin.type == 'script'"
+                      >
+                        <md-button
+                          ng-click="vm.restartplugin(plugin, $event    )"
+                          translate="MARKETPLACE.RESTART_PLUGIN"
+                        >
+                          Restart Plugin
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.downloadfile2(plugin, $event  , 'plugins'   )"
+                          translate="MARKETPLACE.DOWNLOAD_PLUGIN"
+                        >
+                          Download Plugin
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item
+                        ng-if="vm.crudPermissions.canEdit && plugin.active"
+                      >
+                        <md-button
+                          ng-click="vm.uninstallplugin(plugin, $event    )"
+                          translate="MARKETPLACE.UNINSTALL_PLUGIN"
+                        >
+                          Uninstall Plugin
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(plugin, $event    )"
+                          translate="MARKETPLACE.DELETE_PLUGIN"
+                        >
+                          Delete Plugin
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'MARKETPLACE.PAGE' | translate}}:', rowsPerPage: '{{'MARKETPLACE.ROWSPERPAGE' | translate}}:', of: '{{'MARKETPLACE.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.plugins.count}}"
+          md-on-paginate="vm.getPlugins"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / PLUGIN TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- UPLOAD PLUGIN BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent upload-item-button"
+    id="upload-plugin-button"
+    ng-click="vm.uploadPlugin($event)"
+    aria-label="upload plugin"
+    translate
+    translate-attr-aria-label="MARKETPLACE.UPLOAD_PLUGIN"
+  >
+    <md-icon md-font-icon="icon-upload"></md-icon>
+  </md-button>
+  <!-- / UPLOAD PLUGIN BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/marketplace/views/plugins/upload/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/marketplace/views/plugins/upload/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 98af3ca..0000000
--- a/public/src/js/modules/main/apps/marketplace/views/plugins/upload/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,102 +0,0 @@
-<md-dialog class="upload-dialog" aria-label="Upload ">
-  <form name="uploadForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <div
-        id="plugin-uploader"
-        ng-hide="vm.uploadState == 'uploading'"
-        flow-init="vm.ngFlowOptions"
-        flow-name="vm.ngFlow.flow"
-        flow-files-submitted="vm.upload()"
-        flow-file-added="vm.fileAdded($file)"
-        flow-file-success="vm.fileSuccess($file, $message)"
-        flow-error="vm.uploadError($file, $message)"
-        flow-complete="vm.uploadComplete()"
-        flow-drop
-        flow-drag-enter="vm.dropping=true"
-        flow-drag-leave="vm.dropping=false"
-        ng-class="{'dropping':vm.dropping}"
-      >
-        <div
-          class="drop-text hint-text"
-          layout="row"
-          layout-align="center center"
-        >
-          <span translate="MARKETPLACE.DROP_TO_UPLOAD">Drop to upload</span>
-        </div>
-
-        <div class="upload-button" layout="column" layout-align="center center">
-          <md-button class="md-accent md-raised" flow-btn> Upload </md-button>
-          <span
-            class="secondary-text mt-8"
-            translate="MARKETPLACE.DROP_TO_UPLOAD_MESSAGE"
-            >You can also drop your file here to upload.</span
-          >
-        </div>
-      </div>
-
-      <div
-        layout="column"
-        layout-align="space-between center"
-        ng-show="vm.uploadState == 'uploading'"
-      >
-        <div>
-          <span translate="MARKETPLACE.UPLOADING">Uploading</span>
-          <span>{{vm.plugin.file.name}}</span>
-        </div>
-        <md-progress-linear md-mode="indeterminate"></md-progress-linear>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center"></div>
-      <div layout="row">
-        <md-button
-          ng-click="vm.closeDialog()"
-          ng-hide="vm.uploadState == 'uploading'"
-          class="md-accent md-raised"
-          aria-label="FINISH"
-          translate="MARKETPLACE.FINISH"
-          translate-attr-aria-label="MARKETPLACE.FINISH"
-        >
-          FINISH
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/marketplace/views/plugins/upload/dialog.html/dialog.html b/public/src/js/modules/main/apps/marketplace/views/plugins/upload/dialog.html/dialog.html
new file mode 100644
index 0000000..98af3ca
--- /dev/null
+++ b/public/src/js/modules/main/apps/marketplace/views/plugins/upload/dialog.html/dialog.html
@@ -0,0 +1,102 @@
+<md-dialog class="upload-dialog" aria-label="Upload ">
+  <form name="uploadForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <div
+        id="plugin-uploader"
+        ng-hide="vm.uploadState == 'uploading'"
+        flow-init="vm.ngFlowOptions"
+        flow-name="vm.ngFlow.flow"
+        flow-files-submitted="vm.upload()"
+        flow-file-added="vm.fileAdded($file)"
+        flow-file-success="vm.fileSuccess($file, $message)"
+        flow-error="vm.uploadError($file, $message)"
+        flow-complete="vm.uploadComplete()"
+        flow-drop
+        flow-drag-enter="vm.dropping=true"
+        flow-drag-leave="vm.dropping=false"
+        ng-class="{'dropping':vm.dropping}"
+      >
+        <div
+          class="drop-text hint-text"
+          layout="row"
+          layout-align="center center"
+        >
+          <span translate="MARKETPLACE.DROP_TO_UPLOAD">Drop to upload</span>
+        </div>
+
+        <div class="upload-button" layout="column" layout-align="center center">
+          <md-button class="md-accent md-raised" flow-btn> Upload </md-button>
+          <span
+            class="secondary-text mt-8"
+            translate="MARKETPLACE.DROP_TO_UPLOAD_MESSAGE"
+            >You can also drop your file here to upload.</span
+          >
+        </div>
+      </div>
+
+      <div
+        layout="column"
+        layout-align="space-between center"
+        ng-show="vm.uploadState == 'uploading'"
+      >
+        <div>
+          <span translate="MARKETPLACE.UPLOADING">Uploading</span>
+          <span>{{vm.plugin.file.name}}</span>
+        </div>
+        <md-progress-linear md-mode="indeterminate"></md-progress-linear>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center"></div>
+      <div layout="row">
+        <md-button
+          ng-click="vm.closeDialog()"
+          ng-hide="vm.uploadState == 'uploading'"
+          class="md-accent md-raised"
+          aria-label="FINISH"
+          translate="MARKETPLACE.FINISH"
+          translate-attr-aria-label="MARKETPLACE.FINISH"
+        >
+          FINISH
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 224e9c5..0000000
--- a/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,316 +0,0 @@
-<md-dialog class="ivrCampaign-dialog" aria-label="New IvrCampaign">
-  <form name="ivrCampaignForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="MOTIONDIALER.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.ivrCampaign.name"
-          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.newIvrCampaign"
-        />
-
-        <div class="hint"><span translate="MOTIONDIALER.HELP.NAME"></span></div>
-        <div
-          ng-messages="ivrCampaignForm['name'].$error"
-          ng-show="ivrCampaignForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MOTIONDIALER.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span
-              translate="MOTIONDIALER.ERRORS.NAME_MUST_VALID_PATTERN"
-              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-              >Name must be valid pattern
-            </span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <md-switch ng-model="vm.ivrCampaign.active" aria-label="Active"
-          ><span translate="MOTIONDIALER.ACTIVE">Active</span></md-switch
-        >
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="MOTIONDIALER.TRUNK">Trunk</label>
-        <md-select name="TrunkId" ng-model="vm.ivrCampaign.TrunkId" required>
-          <md-option
-            ng-value="TrunkId.id"
-            ng-repeat="TrunkId in vm.trunks"
-            ng-disabled="TrunkId.canSelect === false"
-            >{{ TrunkId.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="ivrCampaignForm['TrunkId'].$error"
-          ng-show="ivrCampaignForm['TrunkId'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MOTIONDIALER.ERRORS.TRUNK_REQUIRED"
-              >Trunk field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="MOTIONDIALER.INTERVAL">Interval</label>
-        <md-select
-          name="IntervalId"
-          ng-model="vm.ivrCampaign.IntervalId"
-          required
-        >
-          <md-option
-            ng-value="IntervalId.id"
-            ng-repeat="IntervalId in vm.interval"
-            ng-disabled="IntervalId.canSelect === false"
-            >{{ IntervalId.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="ivrCampaignForm['IntervalId'].$error"
-          ng-show="ivrCampaignForm['IntervalId'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MOTIONDIALER.ERRORS.INTERVAL_REQUIRED"
-              >Interval field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="MOTIONDIALER.CHECKDUPLICATE">CheckDuplicate</label>
-        <md-select
-          name="dialCheckDuplicateType"
-          ng-model="vm.ivrCampaign.dialCheckDuplicateType"
-          required
-        >
-          <md-option ng-value="'always'">
-            {{ 'MOTIONDIALER.ALWAYS' | translate }}
-          </md-option>
-
-          <md-option ng-value="'never'">
-            {{ 'MOTIONDIALER.NEVER' | translate }}
-          </md-option>
-
-          <md-option ng-value="'onlyIfOpen'">
-            {{ 'MOTIONDIALER.ONLY_IF_OPEN' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="ivrCampaignForm['dialCheckDuplicateType'].$error"
-          ng-show="ivrCampaignForm['dialCheckDuplicateType'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MOTIONDIALER.ERRORS.CHECKDUPLICATE_REQUIRED"
-              >CheckDuplicate field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="MOTIONDIALER.CALLYSQUAREPROJECT"
-          >CallySquareProject</label
-        >
-        <md-select
-          name="SquareProjectId"
-          ng-model="vm.ivrCampaign.SquareProjectId"
-          required
-        >
-          <md-option
-            ng-value="SquareProjectId.id"
-            ng-repeat="SquareProjectId in vm.projects"
-            ng-disabled="SquareProjectId.canSelect === false"
-            >{{ SquareProjectId.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="ivrCampaignForm['SquareProjectId'].$error"
-          ng-show="ivrCampaignForm['SquareProjectId'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MOTIONDIALER.ERRORS.CALLYSQUAREPROJECT_REQUIRED"
-              >CallySquareProject field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="MOTIONDIALER.CONCURRENTCALLS">ConcurrentCalls</label>
-        <input
-          type="number"
-          name="limitCalls"
-          ng-model="vm.ivrCampaign.limitCalls"
-          min="1"
-          max="200"
-          ng-required="true"
-        />
-
-        <div class="hint">
-          <span translate="MOTIONDIALER.HELP.CONCURRENTCALLS"></span>
-        </div>
-        <div
-          ng-messages="ivrCampaignForm['limitCalls'].$error"
-          ng-show="ivrCampaignForm['limitCalls'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MOTIONDIALER.ERRORS.CONCURRENTCALLS_REQUIRED"
-              >ConcurrentCalls field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="MOTIONDIALER.ERRORS.CONCURRENTCALLS_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >ConcurrentCalls must be a valid greater or equal than</span
-            >
-            <span>1</span>
-          </div>
-          <div ng-message="max">
-            <span
-              translate="MOTIONDIALER.ERRORS.CONCURRENTCALLS_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-              >ConcurrentCalls must be a valid greater or equal than</span
-            >
-            <span>200</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="MOTIONDIALER.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.ivrCampaign.description"
-        />
-
-        <div
-          ng-messages="ivrCampaignForm['description'].$error"
-          ng-show="ivrCampaignForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MOTIONDIALER.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newIvrCampaign"
-          ng-click="vm.saveIvrCampaign()"
-          class="send-button md-accent md-raised"
-          ng-disabled="ivrCampaignForm.$invalid || ivrCampaignForm.$pristine"
-          aria-label="SAVE"
-          translate="MOTIONDIALER.SAVE"
-          translate-attr-aria-label="MOTIONDIALER.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newIvrCampaign"
-          ng-click="vm.addNewIvrCampaign()"
-          class="send-button md-accent md-raised"
-          ng-disabled="ivrCampaignForm.$invalid"
-          aria-label="ADD"
-          translate="MOTIONDIALER.ADD_IVRCAMPAIGN"
-          translate-attr-aria-label="MOTIONDIALER.ADD_IVRCAMPAIGN"
-        >
-          ADD IVRCAMPAIGN
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newIvrCampaign"
-          ng-click="vm.deleteIvrCampaign($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="MOTIONDIALER.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="MOTIONDIALER.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/create/dialog.html/dialog.html
new file mode 100644
index 0000000..224e9c5
--- /dev/null
+++ b/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/create/dialog.html/dialog.html
@@ -0,0 +1,316 @@
+<md-dialog class="ivrCampaign-dialog" aria-label="New IvrCampaign">
+  <form name="ivrCampaignForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="MOTIONDIALER.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.ivrCampaign.name"
+          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.newIvrCampaign"
+        />
+
+        <div class="hint"><span translate="MOTIONDIALER.HELP.NAME"></span></div>
+        <div
+          ng-messages="ivrCampaignForm['name'].$error"
+          ng-show="ivrCampaignForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MOTIONDIALER.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span
+              translate="MOTIONDIALER.ERRORS.NAME_MUST_VALID_PATTERN"
+              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+              >Name must be valid pattern
+            </span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <md-switch ng-model="vm.ivrCampaign.active" aria-label="Active"
+          ><span translate="MOTIONDIALER.ACTIVE">Active</span></md-switch
+        >
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="MOTIONDIALER.TRUNK">Trunk</label>
+        <md-select name="TrunkId" ng-model="vm.ivrCampaign.TrunkId" required>
+          <md-option
+            ng-value="TrunkId.id"
+            ng-repeat="TrunkId in vm.trunks"
+            ng-disabled="TrunkId.canSelect === false"
+            >{{ TrunkId.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="ivrCampaignForm['TrunkId'].$error"
+          ng-show="ivrCampaignForm['TrunkId'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MOTIONDIALER.ERRORS.TRUNK_REQUIRED"
+              >Trunk field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="MOTIONDIALER.INTERVAL">Interval</label>
+        <md-select
+          name="IntervalId"
+          ng-model="vm.ivrCampaign.IntervalId"
+          required
+        >
+          <md-option
+            ng-value="IntervalId.id"
+            ng-repeat="IntervalId in vm.interval"
+            ng-disabled="IntervalId.canSelect === false"
+            >{{ IntervalId.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="ivrCampaignForm['IntervalId'].$error"
+          ng-show="ivrCampaignForm['IntervalId'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MOTIONDIALER.ERRORS.INTERVAL_REQUIRED"
+              >Interval field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="MOTIONDIALER.CHECKDUPLICATE">CheckDuplicate</label>
+        <md-select
+          name="dialCheckDuplicateType"
+          ng-model="vm.ivrCampaign.dialCheckDuplicateType"
+          required
+        >
+          <md-option ng-value="'always'">
+            {{ 'MOTIONDIALER.ALWAYS' | translate }}
+          </md-option>
+
+          <md-option ng-value="'never'">
+            {{ 'MOTIONDIALER.NEVER' | translate }}
+          </md-option>
+
+          <md-option ng-value="'onlyIfOpen'">
+            {{ 'MOTIONDIALER.ONLY_IF_OPEN' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="ivrCampaignForm['dialCheckDuplicateType'].$error"
+          ng-show="ivrCampaignForm['dialCheckDuplicateType'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MOTIONDIALER.ERRORS.CHECKDUPLICATE_REQUIRED"
+              >CheckDuplicate field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="MOTIONDIALER.CALLYSQUAREPROJECT"
+          >CallySquareProject</label
+        >
+        <md-select
+          name="SquareProjectId"
+          ng-model="vm.ivrCampaign.SquareProjectId"
+          required
+        >
+          <md-option
+            ng-value="SquareProjectId.id"
+            ng-repeat="SquareProjectId in vm.projects"
+            ng-disabled="SquareProjectId.canSelect === false"
+            >{{ SquareProjectId.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="ivrCampaignForm['SquareProjectId'].$error"
+          ng-show="ivrCampaignForm['SquareProjectId'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MOTIONDIALER.ERRORS.CALLYSQUAREPROJECT_REQUIRED"
+              >CallySquareProject field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="MOTIONDIALER.CONCURRENTCALLS">ConcurrentCalls</label>
+        <input
+          type="number"
+          name="limitCalls"
+          ng-model="vm.ivrCampaign.limitCalls"
+          min="1"
+          max="200"
+          ng-required="true"
+        />
+
+        <div class="hint">
+          <span translate="MOTIONDIALER.HELP.CONCURRENTCALLS"></span>
+        </div>
+        <div
+          ng-messages="ivrCampaignForm['limitCalls'].$error"
+          ng-show="ivrCampaignForm['limitCalls'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MOTIONDIALER.ERRORS.CONCURRENTCALLS_REQUIRED"
+              >ConcurrentCalls field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="MOTIONDIALER.ERRORS.CONCURRENTCALLS_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >ConcurrentCalls must be a valid greater or equal than</span
+            >
+            <span>1</span>
+          </div>
+          <div ng-message="max">
+            <span
+              translate="MOTIONDIALER.ERRORS.CONCURRENTCALLS_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+              >ConcurrentCalls must be a valid greater or equal than</span
+            >
+            <span>200</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="MOTIONDIALER.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.ivrCampaign.description"
+        />
+
+        <div
+          ng-messages="ivrCampaignForm['description'].$error"
+          ng-show="ivrCampaignForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MOTIONDIALER.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newIvrCampaign"
+          ng-click="vm.saveIvrCampaign()"
+          class="send-button md-accent md-raised"
+          ng-disabled="ivrCampaignForm.$invalid || ivrCampaignForm.$pristine"
+          aria-label="SAVE"
+          translate="MOTIONDIALER.SAVE"
+          translate-attr-aria-label="MOTIONDIALER.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newIvrCampaign"
+          ng-click="vm.addNewIvrCampaign()"
+          class="send-button md-accent md-raised"
+          ng-disabled="ivrCampaignForm.$invalid"
+          aria-label="ADD"
+          translate="MOTIONDIALER.ADD_IVRCAMPAIGN"
+          translate-attr-aria-label="MOTIONDIALER.ADD_IVRCAMPAIGN"
+        >
+          ADD IVRCAMPAIGN
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newIvrCampaign"
+          ng-click="vm.deleteIvrCampaign($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="MOTIONDIALER.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="MOTIONDIALER.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/blacklistadd/blacklistadd.html/blacklistadd-[chunkhash].html b/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/blacklistadd/blacklistadd.html/blacklistadd-[chunkhash].html
deleted file mode 100644
index e47c32e..0000000
--- a/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/blacklistadd/blacklistadd.html/blacklistadd-[chunkhash].html
+++ /dev/null
@@ -1,60 +0,0 @@
-<md-dialog
-  class="ivrCampaign-dialog"
-  aria-label="ivrCampaign"
-  ng-init="vm.onInit()"
->
-  <form name="ivrCampaignForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="MOTIONDIALER.BLACKLISTADD_IVRCAMPAIGN">
-          Add List in IVRCAMPAIGN
-        </h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <ms-dual-multiselect
-        ng-hide="vm.loading"
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-      <div
-        ng-hide="!vm.loading"
-        layout-fill
-        style="min-height: 397px"
-        layout="row"
-        layout-sm="column"
-        layout-align="center center"
-      >
-        <md-progress-circular
-          class="md-primary md-hue-1"
-          md-diameter="96"
-        ></md-progress-circular>
-      </div>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveLists()"
-        class="send-button md-accent md-raised"
-        ng-disabled="!vm.pendingChanges"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/blacklistadd/blacklistadd.html/blacklistadd.html b/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/blacklistadd/blacklistadd.html/blacklistadd.html
new file mode 100644
index 0000000..e47c32e
--- /dev/null
+++ b/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/blacklistadd/blacklistadd.html/blacklistadd.html
@@ -0,0 +1,60 @@
+<md-dialog
+  class="ivrCampaign-dialog"
+  aria-label="ivrCampaign"
+  ng-init="vm.onInit()"
+>
+  <form name="ivrCampaignForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="MOTIONDIALER.BLACKLISTADD_IVRCAMPAIGN">
+          Add List in IVRCAMPAIGN
+        </h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <ms-dual-multiselect
+        ng-hide="vm.loading"
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+      <div
+        ng-hide="!vm.loading"
+        layout-fill
+        style="min-height: 397px"
+        layout="row"
+        layout-sm="column"
+        layout-align="center center"
+      >
+        <md-progress-circular
+          class="md-primary md-hue-1"
+          md-diameter="96"
+        ></md-progress-circular>
+      </div>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveLists()"
+        class="send-button md-accent md-raised"
+        ng-disabled="!vm.pendingChanges"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/clone/clone.html/clone-[chunkhash].html b/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/clone/clone.html/clone-[chunkhash].html
deleted file mode 100644
index 8097b18..0000000
--- a/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/clone/clone.html/clone-[chunkhash].html
+++ /dev/null
@@ -1,109 +0,0 @@
-<md-dialog class="ivrCampaign-dialog" aria-label="Clone IvrCampaign">
-  <form name="ivrCampaignForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="MOTIONDIALER.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.ivrCampaign.name"
-          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.newIvrCampaign"
-        />
-
-        <div class="hint"><span translate="MOTIONDIALER.HELP.NAME"></span></div>
-        <div
-          ng-messages="ivrCampaignForm['name'].$error"
-          ng-show="ivrCampaignForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MOTIONDIALER.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span
-              translate="MOTIONDIALER.ERRORS.NAME_MUST_VALID_PATTERN"
-              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-              >Name must be valid pattern
-            </span>
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <md-button
-        type="submit"
-        ng-click="vm.cloneIvrCampaign()"
-        class="send-button md-accent md-raised"
-        ng-disabled="ivrCampaignForm.$invalid"
-        aria-label="CLONE"
-        translate="MOTIONDIALER.CLONE_IVRCAMPAIGN"
-        translate-attr-aria-label="MOTIONDIALER.CLONE_IVRCAMPAIGN"
-      >
-        CLONE IVRCAMPAIGN
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/clone/clone.html/clone.html b/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/clone/clone.html/clone.html
new file mode 100644
index 0000000..8097b18
--- /dev/null
+++ b/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/clone/clone.html/clone.html
@@ -0,0 +1,109 @@
+<md-dialog class="ivrCampaign-dialog" aria-label="Clone IvrCampaign">
+  <form name="ivrCampaignForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="MOTIONDIALER.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.ivrCampaign.name"
+          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.newIvrCampaign"
+        />
+
+        <div class="hint"><span translate="MOTIONDIALER.HELP.NAME"></span></div>
+        <div
+          ng-messages="ivrCampaignForm['name'].$error"
+          ng-show="ivrCampaignForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MOTIONDIALER.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span
+              translate="MOTIONDIALER.ERRORS.NAME_MUST_VALID_PATTERN"
+              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+              >Name must be valid pattern
+            </span>
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <md-button
+        type="submit"
+        ng-click="vm.cloneIvrCampaign()"
+        class="send-button md-accent md-raised"
+        ng-disabled="ivrCampaignForm.$invalid"
+        aria-label="CLONE"
+        translate="MOTIONDIALER.CLONE_IVRCAMPAIGN"
+        translate-attr-aria-label="MOTIONDIALER.CLONE_IVRCAMPAIGN"
+      >
+        CLONE IVRCAMPAIGN
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/hoppers/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/hoppers/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 68f0cb9..0000000
--- a/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/hoppers/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,196 +0,0 @@
-<md-dialog class="hopper-dialog" aria-label="New Hopper">
-  <form name="hopperForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <div class="md-block">
-        <label translate="MOTIONDIALER.SCHEDULEDAT">ScheduledAt</label>
-        <md-content layout="row" class="md-padding">
-          <div flex class="md-block">
-            <mdp-date-picker
-              mdp-open-on-click
-              name="scheduledatDate"
-              mdp-placeholder="Date"
-              mdp-format="YYYY-MM-DD"
-              ng-model="vm.hopper.scheduledat"
-              ng-init="vm.hopper.scheduledat = vm.getDateFromString(vm.hopper.scheduledat)"
-            >
-              <div
-                ng-messages="hopperForm.dateRangeFrom.$error"
-                ng-show="hopperForm.dateRangeFrom.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="MOTIONDIALER.ERRORS.DATE_REQUIRED"
-                    >Date is required</span
-                  >
-                </div>
-                <div ng-message="format">
-                  <span translate="MOTIONDIALER.ERRORS.DATE_INVALID"
-                    >Date is invalid</span
-                  >
-                </div>
-              </div>
-            </mdp-date-picker>
-          </div>
-          <div flex class="md-block">
-            <mdp-time-picker
-              mdp-open-on-click
-              name="scheduledatTime"
-              mdp-placeholder="Time"
-              mdp-format="HH:mm:ss"
-              mdp-auto-switch="true"
-              ng-model="vm.hopper.scheduledat"
-              ng-init="vm.hopper.scheduledat = vm.getDateFromString(vm.hopper.scheduledat)"
-            >
-              <div
-                ng-messages="hopperForm.timeRangeFrom.$error"
-                ng-show="hopperForm.timeRangeFrom.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="MOTIONDIALER.ERRORS.TIME_REQUIRED"
-                    >Time is required</span
-                  >
-                </div>
-                <div ng-message="format">
-                  <span translate="MOTIONDIALER.ERRORS.TIME_INVALID"
-                    >Time is invalid</span
-                  >
-                </div>
-              </div>
-            </mdp-time-picker>
-          </div>
-        </md-content>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="MOTIONDIALER.PRIORITY">Priority</label>
-        <md-select name="priority" ng-model="vm.hopper.priority">
-          <md-option ng-value="'4'">Highest</md-option>
-          <md-option ng-value="'3'">High</md-option>
-          <md-option ng-value="'2'">Medium</md-option>
-          <md-option ng-value="'1'">Low</md-option>
-          <md-option ng-value="'0'">Lowest</md-option>
-        </md-select>
-        <div class="hint">
-          <span translate="MOTIONDIALER.HELP.PRIORITY"></span>
-        </div>
-        <div
-          ng-messages="hopperForm['priority'].$error"
-          ng-show="hopperForm['priority'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MOTIONDIALER.ERRORS.PRIORITY_REQUIRED"
-              >Priority field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newHopper"
-          ng-click="vm.saveHopper()"
-          class="send-button md-accent md-raised"
-          ng-disabled="hopperForm.$invalid || hopperForm.$pristine"
-          aria-label="SAVE"
-          translate="MOTIONDIALER.SAVE"
-          translate-attr-aria-label="MOTIONDIALER.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newHopper"
-          ng-click="vm.addNewHopper()"
-          class="send-button md-accent md-raised"
-          ng-disabled="hopperForm.$invalid"
-          aria-label="ADD"
-          translate="MOTIONDIALER.ADD_HOPPER"
-          translate-attr-aria-label="MOTIONDIALER.ADD_HOPPER"
-        >
-          ADD HOPPER
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newHopper"
-          ng-click="vm.deleteHopper($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="MOTIONDIALER.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="MOTIONDIALER.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/hoppers/dialog.html/dialog.html b/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/hoppers/dialog.html/dialog.html
new file mode 100644
index 0000000..68f0cb9
--- /dev/null
+++ b/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/hoppers/dialog.html/dialog.html
@@ -0,0 +1,196 @@
+<md-dialog class="hopper-dialog" aria-label="New Hopper">
+  <form name="hopperForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <div class="md-block">
+        <label translate="MOTIONDIALER.SCHEDULEDAT">ScheduledAt</label>
+        <md-content layout="row" class="md-padding">
+          <div flex class="md-block">
+            <mdp-date-picker
+              mdp-open-on-click
+              name="scheduledatDate"
+              mdp-placeholder="Date"
+              mdp-format="YYYY-MM-DD"
+              ng-model="vm.hopper.scheduledat"
+              ng-init="vm.hopper.scheduledat = vm.getDateFromString(vm.hopper.scheduledat)"
+            >
+              <div
+                ng-messages="hopperForm.dateRangeFrom.$error"
+                ng-show="hopperForm.dateRangeFrom.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="MOTIONDIALER.ERRORS.DATE_REQUIRED"
+                    >Date is required</span
+                  >
+                </div>
+                <div ng-message="format">
+                  <span translate="MOTIONDIALER.ERRORS.DATE_INVALID"
+                    >Date is invalid</span
+                  >
+                </div>
+              </div>
+            </mdp-date-picker>
+          </div>
+          <div flex class="md-block">
+            <mdp-time-picker
+              mdp-open-on-click
+              name="scheduledatTime"
+              mdp-placeholder="Time"
+              mdp-format="HH:mm:ss"
+              mdp-auto-switch="true"
+              ng-model="vm.hopper.scheduledat"
+              ng-init="vm.hopper.scheduledat = vm.getDateFromString(vm.hopper.scheduledat)"
+            >
+              <div
+                ng-messages="hopperForm.timeRangeFrom.$error"
+                ng-show="hopperForm.timeRangeFrom.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="MOTIONDIALER.ERRORS.TIME_REQUIRED"
+                    >Time is required</span
+                  >
+                </div>
+                <div ng-message="format">
+                  <span translate="MOTIONDIALER.ERRORS.TIME_INVALID"
+                    >Time is invalid</span
+                  >
+                </div>
+              </div>
+            </mdp-time-picker>
+          </div>
+        </md-content>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="MOTIONDIALER.PRIORITY">Priority</label>
+        <md-select name="priority" ng-model="vm.hopper.priority">
+          <md-option ng-value="'4'">Highest</md-option>
+          <md-option ng-value="'3'">High</md-option>
+          <md-option ng-value="'2'">Medium</md-option>
+          <md-option ng-value="'1'">Low</md-option>
+          <md-option ng-value="'0'">Lowest</md-option>
+        </md-select>
+        <div class="hint">
+          <span translate="MOTIONDIALER.HELP.PRIORITY"></span>
+        </div>
+        <div
+          ng-messages="hopperForm['priority'].$error"
+          ng-show="hopperForm['priority'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MOTIONDIALER.ERRORS.PRIORITY_REQUIRED"
+              >Priority field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newHopper"
+          ng-click="vm.saveHopper()"
+          class="send-button md-accent md-raised"
+          ng-disabled="hopperForm.$invalid || hopperForm.$pristine"
+          aria-label="SAVE"
+          translate="MOTIONDIALER.SAVE"
+          translate-attr-aria-label="MOTIONDIALER.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newHopper"
+          ng-click="vm.addNewHopper()"
+          class="send-button md-accent md-raised"
+          ng-disabled="hopperForm.$invalid"
+          aria-label="ADD"
+          translate="MOTIONDIALER.ADD_HOPPER"
+          translate-attr-aria-label="MOTIONDIALER.ADD_HOPPER"
+        >
+          ADD HOPPER
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newHopper"
+          ng-click="vm.deleteHopper($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="MOTIONDIALER.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="MOTIONDIALER.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/listadd/listadd.html/listadd-[chunkhash].html b/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/listadd/listadd.html/listadd-[chunkhash].html
deleted file mode 100644
index 7cdefbf..0000000
--- a/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/listadd/listadd.html/listadd-[chunkhash].html
+++ /dev/null
@@ -1,60 +0,0 @@
-<md-dialog
-  class="ivrCampaign-dialog"
-  aria-label="ivrCampaign"
-  ng-init="vm.onInit()"
->
-  <form name="ivrCampaignForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="MOTIONDIALER.LISTADD_IVRCAMPAIGN">
-          Add List in IVRCAMPAIGN
-        </h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <ms-dual-multiselect
-        ng-hide="vm.loading"
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-      <div
-        ng-hide="!vm.loading"
-        layout-fill
-        style="min-height: 397px"
-        layout="row"
-        layout-sm="column"
-        layout-align="center center"
-      >
-        <md-progress-circular
-          class="md-primary md-hue-1"
-          md-diameter="96"
-        ></md-progress-circular>
-      </div>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveLists()"
-        class="send-button md-accent md-raised"
-        ng-disabled="!vm.pendingChanges"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/listadd/listadd.html/listadd.html b/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/listadd/listadd.html/listadd.html
new file mode 100644
index 0000000..7cdefbf
--- /dev/null
+++ b/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/listadd/listadd.html/listadd.html
@@ -0,0 +1,60 @@
+<md-dialog
+  class="ivrCampaign-dialog"
+  aria-label="ivrCampaign"
+  ng-init="vm.onInit()"
+>
+  <form name="ivrCampaignForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="MOTIONDIALER.LISTADD_IVRCAMPAIGN">
+          Add List in IVRCAMPAIGN
+        </h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <ms-dual-multiselect
+        ng-hide="vm.loading"
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+      <div
+        ng-hide="!vm.loading"
+        layout-fill
+        style="min-height: 397px"
+        layout="row"
+        layout-sm="column"
+        layout-align="center center"
+      >
+        <md-progress-circular
+          class="md-primary md-hue-1"
+          md-diameter="96"
+        ></md-progress-circular>
+      </div>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveLists()"
+        class="send-button md-accent md-raised"
+        ng-disabled="!vm.pendingChanges"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/resetlist/resetlist.html/resetlist-[chunkhash].html b/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/resetlist/resetlist.html/resetlist-[chunkhash].html
deleted file mode 100644
index 2f13ccd..0000000
--- a/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/resetlist/resetlist.html/resetlist-[chunkhash].html
+++ /dev/null
@@ -1,84 +0,0 @@
-<md-dialog class="queueCampaign-dialog" aria-label="queueCampaign">
-  <form name="queueCampaignForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="MOTIONDIALER.RESETLIST ">Reset List</h2>
-        <span flex></span>
-        <md-button
-          class="md-icon-button"
-          ng-disabled="vm.loading"
-          ng-click="vm.closeDialog()"
-        >
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content ng-hide="vm.loading">
-      <div layout="row" layout-wrap flex>
-        <div flex-xs flex="50">
-          <md-checkbox
-            aria-label="Select All"
-            ng-checked="vm.isChecked()"
-            md-indeterminate="vm.isIndeterminate()"
-            ng-click="vm.toggleAll()"
-          >
-            <span
-              ng-if="vm.isChecked()"
-              translate="MOTIONDIALER.UNSELECTALL"
-            ></span>
-            <span
-              ng-if="!vm.isChecked()"
-              translate="MOTIONDIALER.SELECTALL"
-            ></span>
-          </md-checkbox>
-        </div>
-        <div flex-xs flex="50"></div>
-        <div
-          flex="{{vm.items.length > 10 ? 50 : 100 }}"
-          ng-repeat="item in vm.items"
-        >
-          <md-checkbox
-            ng-checked="vm.exists(item, vm.selected)"
-            ng-click="vm.toggle(item, vm.selected)"
-          >
-            {{ item.name | limitTo:40 }}
-          </md-checkbox>
-        </div>
-      </div>
-    </md-dialog-content>
-    <md-dialog-actions
-      ng-hide="vm.loading"
-      layout="row"
-      layout-align="end center"
-    >
-      <div></div>
-      <md-button
-        type="submit"
-        ng-click="vm.listSelected()"
-        class="send-button md-accent md-raised"
-        ng-disabled="vm.loading"
-        aria-label="RESET"
-        translate="MOTIONDIALER.RESET"
-        translate-attr-aria-label="MOTIONDIALER.RESET"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-    <div
-      ng-hide="!vm.loading"
-      layout-fill
-      style="min-height: 397px"
-      layout="row"
-      layout-sm="column"
-      layout-align="center center"
-    >
-      <md-progress-circular
-        class="md-primary md-hue-1"
-        md-diameter="96"
-      ></md-progress-circular>
-    </div>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/resetlist/resetlist.html/resetlist.html b/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/resetlist/resetlist.html/resetlist.html
new file mode 100644
index 0000000..2f13ccd
--- /dev/null
+++ b/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/resetlist/resetlist.html/resetlist.html
@@ -0,0 +1,84 @@
+<md-dialog class="queueCampaign-dialog" aria-label="queueCampaign">
+  <form name="queueCampaignForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="MOTIONDIALER.RESETLIST ">Reset List</h2>
+        <span flex></span>
+        <md-button
+          class="md-icon-button"
+          ng-disabled="vm.loading"
+          ng-click="vm.closeDialog()"
+        >
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content ng-hide="vm.loading">
+      <div layout="row" layout-wrap flex>
+        <div flex-xs flex="50">
+          <md-checkbox
+            aria-label="Select All"
+            ng-checked="vm.isChecked()"
+            md-indeterminate="vm.isIndeterminate()"
+            ng-click="vm.toggleAll()"
+          >
+            <span
+              ng-if="vm.isChecked()"
+              translate="MOTIONDIALER.UNSELECTALL"
+            ></span>
+            <span
+              ng-if="!vm.isChecked()"
+              translate="MOTIONDIALER.SELECTALL"
+            ></span>
+          </md-checkbox>
+        </div>
+        <div flex-xs flex="50"></div>
+        <div
+          flex="{{vm.items.length > 10 ? 50 : 100 }}"
+          ng-repeat="item in vm.items"
+        >
+          <md-checkbox
+            ng-checked="vm.exists(item, vm.selected)"
+            ng-click="vm.toggle(item, vm.selected)"
+          >
+            {{ item.name | limitTo:40 }}
+          </md-checkbox>
+        </div>
+      </div>
+    </md-dialog-content>
+    <md-dialog-actions
+      ng-hide="vm.loading"
+      layout="row"
+      layout-align="end center"
+    >
+      <div></div>
+      <md-button
+        type="submit"
+        ng-click="vm.listSelected()"
+        class="send-button md-accent md-raised"
+        ng-disabled="vm.loading"
+        aria-label="RESET"
+        translate="MOTIONDIALER.RESET"
+        translate-attr-aria-label="MOTIONDIALER.RESET"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+    <div
+      ng-hide="!vm.loading"
+      layout-fill
+      style="min-height: 397px"
+      layout="row"
+      layout-sm="column"
+      layout-align="center center"
+    >
+      <md-progress-circular
+        class="md-primary md-hue-1"
+        md-diameter="96"
+      ></md-progress-circular>
+    </div>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index 791690e..0000000
--- a/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,3103 +0,0 @@
-<div
-  id="motiondialer-ivrCampaign"
-  class="page-layout simple tabbed"
-  layout="column"
->
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-ivrCampaigns-button md-icon-button"
-        aria-label="Go to ivrCampaigns"
-        ng-click="vm.gotoIvrCampaigns()"
-        translate
-        translate-attr-aria-label="MOTIONDIALER.GO_TO_IVRCAMPAIGNS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="ivrCampaign-image" hide-xs>
-          <img ng-src="assets/images/business/ivrCampaigns.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.ivrCampaign.id}}
-            <span ng-if="vm.ivrCampaign.name">{{vm.ivrCampaign.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="MOTIONDIALER.CREATED_AT"></span>
-            <span>{{vm.ivrCampaign.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div ng-cloak ng-if="vm.crudPermissions.canEdit">
-      <md-button
-        ng-click="vm.clonedialog(vm.ivrCampaign, $event)"
-        class="md-fab md-green-500-bg md-icon-button"
-        aria-label="clone"
-      >
-        <md-tooltip
-          ><span translate="MOTIONDIALER.CLONE_IVRCAMPAIGN"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-content-duplicate"></md-icon>
-      </md-button>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.listadddialog(vm.ivrCampaign, $event)"
-        class="md-fab md-green-500-bg md-icon-button"
-        aria-label="listadd"
-      >
-        <md-tooltip
-          ><span translate="MOTIONDIALER.LISTADD_IVRCAMPAIGN"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-format-list-numbers"></md-icon>
-      </md-button>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.blacklistadddialog(vm.ivrCampaign, $event)"
-        class="md-fab md-warn md-icon-button"
-        aria-label="blacklistadd"
-      >
-        <md-tooltip
-          ><span translate="MOTIONDIALER.BLACKLISTADD_IVRCAMPAIGN"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-block-helper"></md-icon>
-      </md-button>
-    </div>
-
-    <div ng-cloak ng-if="vm.crudPermissions.canEdit">
-      <md-button
-        ng-click="vm.resetlistdialog(vm.ivrCampaign, $event)"
-        class="md-fab md-warn md-icon-button"
-        aria-label="resetlist"
-      >
-        <md-tooltip
-          ><span translate="MOTIONDIALER.RESETLIST_IVRCAMPAIGN"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-restore"></md-icon>
-      </md-button>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.gotogoto(vm.ivrCampaign, $event)"
-        class="md-fab md-warn md-icon-button"
-        aria-label="goto"
-      >
-        <md-tooltip
-          ><span translate="MOTIONDIALER.GOTO_IVRCAMPAIGN"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-cast"></md-icon>
-      </md-button>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveIvrCampaign()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        translate="MOTIONDIALER.SAVE"
-        translate-attr-aria-label="MOTIONDIALER.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="MOTIONDIALER.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="ivrCampaign-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MOTIONDIALER.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.ivrCampaign.name"
-                  ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-                  ng-required="true"
-                  autofocus
-                  disabled
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.NAME"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                  <div ng-message="pattern">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.NAME_MUST_VALID_PATTERN"
-                      translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-                      >Name must be valid pattern
-                    </span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.ivrCampaign.active"
-                  aria-label="Active"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="MOTIONDIALER.ACTIVE"
-                    >Active</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.TRUNK">Trunk</label>
-                <md-select
-                  name="TrunkId"
-                  ng-model="vm.ivrCampaign.TrunkId"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="TrunkId.id"
-                    ng-repeat="TrunkId in vm.trunks"
-                    ng-disabled="TrunkId.canSelect === false"
-                    >{{ TrunkId.name }}</md-option
-                  >
-                </md-select>
-                <div
-                  ng-messages="generalForm['TrunkId'].$error"
-                  ng-show="generalForm['TrunkId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.TRUNK_REQUIRED"
-                      >Trunk field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.BACKUPTRUNK">BackupTrunk</label>
-                <md-select
-                  name="TrunkBackupId"
-                  ng-model="vm.ivrCampaign.TrunkBackupId"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="null">None</md-option>
-                  <md-option
-                    ng-value="TrunkBackupId.id"
-                    ng-repeat="TrunkBackupId in vm.trunks"
-                    ng-disabled="TrunkBackupId.canSelect === false"
-                    >{{ TrunkBackupId.name }}</md-option
-                  >
-                </md-select>
-                <div
-                  ng-messages="generalForm['TrunkBackupId'].$error"
-                  ng-show="generalForm['TrunkBackupId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.BACKUPTRUNK_REQUIRED"
-                      >BackupTrunk field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.INTERVAL">Interval</label>
-                <md-select
-                  name="IntervalId"
-                  ng-model="vm.ivrCampaign.IntervalId"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="IntervalId.id"
-                    ng-repeat="IntervalId in vm.interval"
-                    ng-disabled="IntervalId.canSelect === false"
-                    >{{ IntervalId.name }}</md-option
-                  >
-                </md-select>
-                <div
-                  ng-messages="generalForm['IntervalId'].$error"
-                  ng-show="generalForm['IntervalId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.INTERVAL_REQUIRED"
-                      >Interval field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.CHECKDUPLICATE"
-                  >CheckDuplicate</label
-                >
-                <md-select
-                  name="dialCheckDuplicateType"
-                  ng-model="vm.ivrCampaign.dialCheckDuplicateType"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'always'">
-                    {{ 'MOTIONDIALER.ALWAYS' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'never'">
-                    {{ 'MOTIONDIALER.NEVER' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'onlyIfOpen'">
-                    {{ 'MOTIONDIALER.ONLY_IF_OPEN' | translate }}
-                  </md-option>
-                </md-select>
-                <div
-                  ng-messages="generalForm['dialCheckDuplicateType'].$error"
-                  ng-show="generalForm['dialCheckDuplicateType'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.CHECKDUPLICATE_REQUIRED"
-                      >CheckDuplicate field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.CUTDIGIT">CutDigit</label>
-                <input
-                  type="number"
-                  name="dialCutDigit"
-                  ng-model="vm.ivrCampaign.dialCutDigit"
-                  min="0"
-                  max="15"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['dialCutDigit'].$error"
-                  ng-show="generalForm['dialCutDigit'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.CUTDIGIT_REQUIRED"
-                      >CutDigit field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.CUTDIGIT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >CutDigit must be a valid greater or equal than</span
-                    >
-                    <span>0</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.CUTDIGIT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >CutDigit must be a valid greater or equal than</span
-                    >
-                    <span>15</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.ivrCampaign.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="MOTIONDIALER.CAMPAIGN">CAMPAIGN</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="ivrCampaign-detail-form-container campaign md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MOTIONDIALER.CAMPAIGN">
-                CAMPAIGN
-              </div>
-            </div>
-            <form name="campaignForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.CALLYSQUAREPROJECT"
-                  >CallySquareProject</label
-                >
-                <md-select
-                  name="SquareProjectId"
-                  ng-model="vm.ivrCampaign.SquareProjectId"
-                  autofocus
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="SquareProjectId.id"
-                    ng-repeat="SquareProjectId in vm.projects"
-                    ng-disabled="SquareProjectId.canSelect === false"
-                    >{{ SquareProjectId.name }}</md-option
-                  >
-                </md-select>
-                <div
-                  ng-messages="campaignForm['SquareProjectId'].$error"
-                  ng-show="campaignForm['SquareProjectId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.CALLYSQUAREPROJECT_REQUIRED"
-                      >CallySquareProject field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.CONCURRENTCALLS"
-                  >ConcurrentCalls</label
-                >
-                <input
-                  type="number"
-                  name="limitCalls"
-                  ng-model="vm.ivrCampaign.limitCalls"
-                  min="1"
-                  max="200"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.CONCURRENTCALLS"></span>
-                </div>
-                <div
-                  ng-messages="campaignForm['limitCalls'].$error"
-                  ng-show="campaignForm['limitCalls'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.CONCURRENTCALLS_REQUIRED"
-                      >ConcurrentCalls field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.CONCURRENTCALLS_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >ConcurrentCalls must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.CONCURRENTCALLS_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >ConcurrentCalls must be a valid greater or equal
-                      than</span
-                    >
-                    <span>200</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="ivrCampaign-detail-form-container originate md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MOTIONDIALER.ORIGINATE">
-                ORIGINATE
-              </div>
-            </div>
-            <form name="originateForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.ORIGINATECALLERIDNAME"
-                  >OriginateCallerIdName</label
-                >
-                <input
-                  type="text"
-                  name="dialOriginateCallerIdName"
-                  ng-model="vm.ivrCampaign.dialOriginateCallerIdName"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.ORIGINATECALLERIDNAME"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="originateForm['dialOriginateCallerIdName'].$error"
-                  ng-show="originateForm['dialOriginateCallerIdName'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.ORIGINATECALLERIDNAME_REQUIRED"
-                      >OriginateCallerIdName field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.ORIGINATECALLERIDNUMBER"
-                  >OriginateCallerIdNumber</label
-                >
-                <input
-                  type="text"
-                  name="dialOriginateCallerIdNumber"
-                  ng-model="vm.ivrCampaign.dialOriginateCallerIdNumber"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.ORIGINATECALLERIDNUMBER"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="originateForm['dialOriginateCallerIdNumber'].$error"
-                  ng-show="originateForm['dialOriginateCallerIdNumber'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.ORIGINATECALLERIDNUMBER_REQUIRED"
-                      >OriginateCallerIdNumber field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.RANDOMLASTDIGITCALLERIDNUMBER"
-                  >RandomLastDigitCallerIdNumber</label
-                >
-                <input
-                  type="number"
-                  name="dialRandomLastDigitCallerIdNumber"
-                  ng-model="vm.ivrCampaign.dialRandomLastDigitCallerIdNumber"
-                  min="0"
-                  max="15"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.RANDOMLASTDIGITCALLERIDNUMBER"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="originateForm['dialRandomLastDigitCallerIdNumber'].$error"
-                  ng-show="originateForm['dialRandomLastDigitCallerIdNumber'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.RANDOMLASTDIGITCALLERIDNUMBER_REQUIRED"
-                      >RandomLastDigitCallerIdNumber field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.RANDOMLASTDIGITCALLERIDNUMBER_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >RandomLastDigitCallerIdNumber must be a valid greater or
-                      equal than</span
-                    >
-                    <span>0</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.RANDOMLASTDIGITCALLERIDNUMBER_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >RandomLastDigitCallerIdNumber must be a valid greater or
-                      equal than</span
-                    >
-                    <span>15</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.ORIGINATETIMEOUT"
-                  >OriginateTimeout</label
-                >
-                <input
-                  type="number"
-                  name="dialOriginateTimeout"
-                  ng-model="vm.ivrCampaign.dialOriginateTimeout"
-                  min="1"
-                  max="999"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.ORIGINATETIMEOUT"></span>
-                </div>
-                <div
-                  ng-messages="originateForm['dialOriginateTimeout'].$error"
-                  ng-show="originateForm['dialOriginateTimeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.ORIGINATETIMEOUT_REQUIRED"
-                      >OriginateTimeout field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.ORIGINATETIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >OriginateTimeout must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.ORIGINATETIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >OriginateTimeout must be a valid greater or equal
-                      than</span
-                    >
-                    <span>999</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.PREFIX">Prefix</label>
-                <input
-                  type="text"
-                  name="dialPrefix"
-                  ng-model="vm.ivrCampaign.dialPrefix"
-                  ng-pattern="/^\d+$/"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.PREFIX"></span>
-                </div>
-                <div
-                  ng-messages="originateForm['dialPrefix'].$error"
-                  ng-show="originateForm['dialPrefix'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.PREFIX_REQUIRED"
-                      >Prefix field is required</span
-                    >
-                  </div>
-                  <div ng-message="pattern">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.PREFIX_MUST_VALID_PATTERN"
-                      translate-values="{ regex: '/^\d+$/' }"
-                      >Prefix must be valid pattern
-                    </span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="MOTIONDIALER.RETRYANDFREQUENCY"
-            >RETRYANDFREQUENCY</span
-          >
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="ivrCampaign-detail-form-container global md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MOTIONDIALER.GLOBAL">
-                GLOBAL
-              </div>
-            </div>
-            <form name="globalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.GLOBALMAXRETRY"
-                  >GlobalMaxRetry</label
-                >
-                <input
-                  type="number"
-                  name="dialGlobalMaxRetry"
-                  ng-model="vm.ivrCampaign.dialGlobalMaxRetry"
-                  min="1"
-                  max="999"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.GLOBALMAXRETRY"></span>
-                </div>
-                <div
-                  ng-messages="globalForm['dialGlobalMaxRetry'].$error"
-                  ng-show="globalForm['dialGlobalMaxRetry'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.GLOBALMAXRETRY_REQUIRED"
-                      >GlobalMaxRetry field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.GLOBALMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >GlobalMaxRetry must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.GLOBALMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >GlobalMaxRetry must be a valid greater or equal
-                      than</span
-                    >
-                    <span>999</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="ivrCampaign-detail-form-container congestion md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div
-                class="h2 secondary-text"
-                translate="MOTIONDIALER.CONGESTION"
-              >
-                CONGESTION
-              </div>
-            </div>
-            <form name="congestionForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.CONGESTIONMAXRETRY"
-                  >CongestionMaxRetry</label
-                >
-                <input
-                  type="number"
-                  name="dialCongestionMaxRetry"
-                  ng-model="vm.ivrCampaign.dialCongestionMaxRetry"
-                  min="1"
-                  max="999"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.CONGESTIONMAXRETRY"></span>
-                </div>
-                <div
-                  ng-messages="congestionForm['dialCongestionMaxRetry'].$error"
-                  ng-show="congestionForm['dialCongestionMaxRetry'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.CONGESTIONMAXRETRY_REQUIRED"
-                      >CongestionMaxRetry field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.CONGESTIONMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >CongestionMaxRetry must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.CONGESTIONMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >CongestionMaxRetry must be a valid greater or equal
-                      than</span
-                    >
-                    <span>999</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.CONGESTIONRETRYTIME"
-                  >CongestionRetryTime</label
-                >
-                <input
-                  type="number"
-                  name="dialCongestionRetryFrequency"
-                  ng-model="vm.ivrCampaign.dialCongestionRetryFrequency"
-                  min="1"
-                  max="99999"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.CONGESTIONRETRYTIME"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="congestionForm['dialCongestionRetryFrequency'].$error"
-                  ng-show="congestionForm['dialCongestionRetryFrequency'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.CONGESTIONRETRYTIME_REQUIRED"
-                      >CongestionRetryTime field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.CONGESTIONRETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >CongestionRetryTime must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.CONGESTIONRETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >CongestionRetryTime must be a valid greater or equal
-                      than</span
-                    >
-                    <span>99999</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="ivrCampaign-detail-form-container busy md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MOTIONDIALER.BUSY">
-                BUSY
-              </div>
-            </div>
-            <form name="busyForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.BUSYMAXRETRY"
-                  >BusyMaxRetry</label
-                >
-                <input
-                  type="number"
-                  name="dialBusyMaxRetry"
-                  ng-model="vm.ivrCampaign.dialBusyMaxRetry"
-                  min="1"
-                  max="999"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.BUSYMAXRETRY"></span>
-                </div>
-                <div
-                  ng-messages="busyForm['dialBusyMaxRetry'].$error"
-                  ng-show="busyForm['dialBusyMaxRetry'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.BUSYMAXRETRY_REQUIRED"
-                      >BusyMaxRetry field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.BUSYMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >BusyMaxRetry must be a valid greater or equal than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.BUSYMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >BusyMaxRetry must be a valid greater or equal than</span
-                    >
-                    <span>999</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.BUSYRETRYTIME"
-                  >BusyRetryTime</label
-                >
-                <input
-                  type="number"
-                  name="dialBusyRetryFrequency"
-                  ng-model="vm.ivrCampaign.dialBusyRetryFrequency"
-                  min="1"
-                  max="99999"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.BUSYRETRYTIME"></span>
-                </div>
-                <div
-                  ng-messages="busyForm['dialBusyRetryFrequency'].$error"
-                  ng-show="busyForm['dialBusyRetryFrequency'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.BUSYRETRYTIME_REQUIRED"
-                      >BusyRetryTime field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.BUSYRETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >BusyRetryTime must be a valid greater or equal than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.BUSYRETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >BusyRetryTime must be a valid greater or equal than</span
-                    >
-                    <span>99999</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="ivrCampaign-detail-form-container noanswer md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MOTIONDIALER.NOANSWER">
-                NOANSWER
-              </div>
-            </div>
-            <form name="noanswerForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.NOANSWERMAXRETRY"
-                  >NoAnswerMaxRetry</label
-                >
-                <input
-                  type="number"
-                  name="dialNoAnswerMaxRetry"
-                  ng-model="vm.ivrCampaign.dialNoAnswerMaxRetry"
-                  min="1"
-                  max="999"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.NOANSWERMAXRETRY"></span>
-                </div>
-                <div
-                  ng-messages="noanswerForm['dialNoAnswerMaxRetry'].$error"
-                  ng-show="noanswerForm['dialNoAnswerMaxRetry'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.NOANSWERMAXRETRY_REQUIRED"
-                      >NoAnswerMaxRetry field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.NOANSWERMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >NoAnswerMaxRetry must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.NOANSWERMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >NoAnswerMaxRetry must be a valid greater or equal
-                      than</span
-                    >
-                    <span>999</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.NOANSWERRETRYTIME"
-                  >NoAnswerRetryTime</label
-                >
-                <input
-                  type="number"
-                  name="dialNoAnswerRetryFrequency"
-                  ng-model="vm.ivrCampaign.dialNoAnswerRetryFrequency"
-                  min="1"
-                  max="99999"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.NOANSWERRETRYTIME"></span>
-                </div>
-                <div
-                  ng-messages="noanswerForm['dialNoAnswerRetryFrequency'].$error"
-                  ng-show="noanswerForm['dialNoAnswerRetryFrequency'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.NOANSWERRETRYTIME_REQUIRED"
-                      >NoAnswerRetryTime field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.NOANSWERRETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >NoAnswerRetryTime must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.NOANSWERRETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >NoAnswerRetryTime must be a valid greater or equal
-                      than</span
-                    >
-                    <span>99999</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="ivrCampaign-detail-form-container nosuchnumber md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div
-                class="h2 secondary-text"
-                translate="MOTIONDIALER.NOSUCHNUMBER"
-              >
-                NOSUCHNUMBER
-              </div>
-            </div>
-            <form name="nosuchnumberForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.NOSUCHNUMBERMAXRETRY"
-                  >NoSuchNumberMaxRetry</label
-                >
-                <input
-                  type="number"
-                  name="dialNoSuchNumberMaxRetry"
-                  ng-model="vm.ivrCampaign.dialNoSuchNumberMaxRetry"
-                  min="1"
-                  max="999"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.NOSUCHNUMBERMAXRETRY"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="nosuchnumberForm['dialNoSuchNumberMaxRetry'].$error"
-                  ng-show="nosuchnumberForm['dialNoSuchNumberMaxRetry'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.NOSUCHNUMBERMAXRETRY_REQUIRED"
-                      >NoSuchNumberMaxRetry field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.NOSUCHNUMBERMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >NoSuchNumberMaxRetry must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.NOSUCHNUMBERMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >NoSuchNumberMaxRetry must be a valid greater or equal
-                      than</span
-                    >
-                    <span>999</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.NOSUCHNUMBERRETRYTIME"
-                  >NoSuchNumberRetryTime</label
-                >
-                <input
-                  type="number"
-                  name="dialNoSuchNumberRetryFrequency"
-                  ng-model="vm.ivrCampaign.dialNoSuchNumberRetryFrequency"
-                  min="1"
-                  max="99999"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.NOSUCHNUMBERRETRYTIME"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="nosuchnumberForm['dialNoSuchNumberRetryFrequency'].$error"
-                  ng-show="nosuchnumberForm['dialNoSuchNumberRetryFrequency'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.NOSUCHNUMBERRETRYTIME_REQUIRED"
-                      >NoSuchNumberRetryTime field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.NOSUCHNUMBERRETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >NoSuchNumberRetryTime must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.NOSUCHNUMBERRETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >NoSuchNumberRetryTime must be a valid greater or equal
-                      than</span
-                    >
-                    <span>99999</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="ivrCampaign-detail-form-container drop md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MOTIONDIALER.DROP">
-                DROP
-              </div>
-            </div>
-            <form name="dropForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.DROPMAXRETRY"
-                  >DropMaxRetry</label
-                >
-                <input
-                  type="number"
-                  name="dialDropMaxRetry"
-                  ng-model="vm.ivrCampaign.dialDropMaxRetry"
-                  min="1"
-                  max="999"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.DROPMAXRETRY"></span>
-                </div>
-                <div
-                  ng-messages="dropForm['dialDropMaxRetry'].$error"
-                  ng-show="dropForm['dialDropMaxRetry'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.DROPMAXRETRY_REQUIRED"
-                      >DropMaxRetry field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.DROPMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >DropMaxRetry must be a valid greater or equal than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.DROPMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >DropMaxRetry must be a valid greater or equal than</span
-                    >
-                    <span>999</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.DROPRETRYTIME"
-                  >DropRetryTime</label
-                >
-                <input
-                  type="number"
-                  name="dialDropRetryFrequency"
-                  ng-model="vm.ivrCampaign.dialDropRetryFrequency"
-                  min="1"
-                  max="99999"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.DROPRETRYTIME"></span>
-                </div>
-                <div
-                  ng-messages="dropForm['dialDropRetryFrequency'].$error"
-                  ng-show="dropForm['dialDropRetryFrequency'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.DROPRETRYTIME_REQUIRED"
-                      >DropRetryTime field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.DROPRETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >DropRetryTime must be a valid greater or equal than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.DROPRETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >DropRetryTime must be a valid greater or equal than</span
-                    >
-                    <span>99999</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="ivrCampaign-detail-form-container abandoned md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MOTIONDIALER.ABANDONED">
-                ABANDONED
-              </div>
-            </div>
-            <form name="abandonedForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.ABANDONEDMAXRETRY"
-                  >AbandonedMaxRetry</label
-                >
-                <input
-                  type="number"
-                  name="dialAbandonedMaxRetry"
-                  ng-model="vm.ivrCampaign.dialAbandonedMaxRetry"
-                  min="1"
-                  max="999"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.ABANDONEDMAXRETRY"></span>
-                </div>
-                <div
-                  ng-messages="abandonedForm['dialAbandonedMaxRetry'].$error"
-                  ng-show="abandonedForm['dialAbandonedMaxRetry'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.ABANDONEDMAXRETRY_REQUIRED"
-                      >AbandonedMaxRetry field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.ABANDONEDMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AbandonedMaxRetry must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.ABANDONEDMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >AbandonedMaxRetry must be a valid greater or equal
-                      than</span
-                    >
-                    <span>999</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.ABANDONEDRETRYTIME"
-                  >AbandonedRetryTime</label
-                >
-                <input
-                  type="number"
-                  name="dialAbandonedRetryFrequency"
-                  ng-model="vm.ivrCampaign.dialAbandonedRetryFrequency"
-                  min="1"
-                  max="99999"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.ABANDONEDRETRYTIME"></span>
-                </div>
-                <div
-                  ng-messages="abandonedForm['dialAbandonedRetryFrequency'].$error"
-                  ng-show="abandonedForm['dialAbandonedRetryFrequency'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.ABANDONEDRETRYTIME_REQUIRED"
-                      >AbandonedRetryTime field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.ABANDONEDRETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AbandonedRetryTime must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.ABANDONEDRETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >AbandonedRetryTime must be a valid greater or equal
-                      than</span
-                    >
-                    <span>99999</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="ivrCampaign-detail-form-container machine md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MOTIONDIALER.MACHINE">
-                MACHINE
-              </div>
-            </div>
-            <form name="machineForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.MACHINEMAXRETRY"
-                  >MachineMaxRetry</label
-                >
-                <input
-                  type="number"
-                  name="dialMachineMaxRetry"
-                  ng-model="vm.ivrCampaign.dialMachineMaxRetry"
-                  min="1"
-                  max="999"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.MACHINEMAXRETRY"></span>
-                </div>
-                <div
-                  ng-messages="machineForm['dialMachineMaxRetry'].$error"
-                  ng-show="machineForm['dialMachineMaxRetry'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.MACHINEMAXRETRY_REQUIRED"
-                      >MachineMaxRetry field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.MACHINEMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >MachineMaxRetry must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.MACHINEMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >MachineMaxRetry must be a valid greater or equal
-                      than</span
-                    >
-                    <span>999</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.MACHINERETRYTIME"
-                  >MachineRetryTime</label
-                >
-                <input
-                  type="number"
-                  name="dialMachineRetryFrequency"
-                  ng-model="vm.ivrCampaign.dialMachineRetryFrequency"
-                  min="1"
-                  max="99999"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.MACHINERETRYTIME"></span>
-                </div>
-                <div
-                  ng-messages="machineForm['dialMachineRetryFrequency'].$error"
-                  ng-show="machineForm['dialMachineRetryFrequency'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.MACHINERETRYTIME_REQUIRED"
-                      >MachineRetryTime field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.MACHINERETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >MachineRetryTime must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.MACHINERETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >MachineRetryTime must be a valid greater or equal
-                      than</span
-                    >
-                    <span>99999</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="ivrCampaign-detail-form-container agentreject md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div
-                class="h2 secondary-text"
-                translate="MOTIONDIALER.AGENTREJECT"
-              >
-                AGENTREJECT
-              </div>
-            </div>
-            <form name="agentrejectForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.AGENTREJECTMAXRETRY"
-                  >AgentRejectMaxRetry</label
-                >
-                <input
-                  type="number"
-                  name="dialAgentRejectMaxRetry"
-                  ng-model="vm.ivrCampaign.dialAgentRejectMaxRetry"
-                  min="1"
-                  max="999"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.AGENTREJECTMAXRETRY"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="agentrejectForm['dialAgentRejectMaxRetry'].$error"
-                  ng-show="agentrejectForm['dialAgentRejectMaxRetry'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AGENTREJECTMAXRETRY_REQUIRED"
-                      >AgentRejectMaxRetry field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AGENTREJECTMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AgentRejectMaxRetry must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AGENTREJECTMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >AgentRejectMaxRetry must be a valid greater or equal
-                      than</span
-                    >
-                    <span>999</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.AGENTREJECTRETRYTIME"
-                  >AgentRejectRetryTime</label
-                >
-                <input
-                  type="number"
-                  name="dialAgentRejectRetryFrequency"
-                  ng-model="vm.ivrCampaign.dialAgentRejectRetryFrequency"
-                  min="1"
-                  max="99999"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.AGENTREJECTRETRYTIME"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="agentrejectForm['dialAgentRejectRetryFrequency'].$error"
-                  ng-show="agentrejectForm['dialAgentRejectRetryFrequency'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AGENTREJECTRETRYTIME_REQUIRED"
-                      >AgentRejectRetryTime field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AGENTREJECTRETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AgentRejectRetryTime must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AGENTREJECTRETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >AgentRejectRetryTime must be a valid greater or equal
-                      than</span
-                    >
-                    <span>99999</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="MOTIONDIALER.ADVANCED">ADVANCED</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="ivrCampaign-detail-form-container advanced md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MOTIONDIALER.ADVANCED">
-                ADVANCED
-              </div>
-            </div>
-            <form name="advancedForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.DIALORDERBYSCHEDULEDAT"
-                  >DialOrderByScheduledAt</label
-                >
-                <md-select
-                  name="dialOrderByScheduledAt"
-                  ng-model="vm.ivrCampaign.dialOrderByScheduledAt"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'DESC'">
-                    {{ 'MOTIONDIALER.DESC' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'ASC'">
-                    {{ 'MOTIONDIALER.ASC' | translate }}
-                  </md-option>
-                </md-select>
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.DIALORDERBYSCHEDULEDAT"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['dialOrderByScheduledAt'].$error"
-                  ng-show="advancedForm['dialOrderByScheduledAt'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.DIALORDERBYSCHEDULEDAT_REQUIRED"
-                      >DialOrderByScheduledAt field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="ivrCampaign-detail-form-container globalinterval md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div
-                class="h2 secondary-text"
-                translate="MOTIONDIALER.GLOBALINTERVAL"
-              >
-                GLOBALINTERVAL
-              </div>
-            </div>
-            <form name="globalintervalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.GLOBALINTERVAL"
-                  >GlobalInterval</label
-                >
-                <input
-                  type="text"
-                  name="dialGlobalInterval"
-                  ng-model="vm.ivrCampaign.dialGlobalInterval"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.GLOBALINTERVAL"></span>
-                </div>
-                <div
-                  ng-messages="globalintervalForm['dialGlobalInterval'].$error"
-                  ng-show="globalintervalForm['dialGlobalInterval'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.GLOBALINTERVAL_REQUIRED"
-                      >GlobalInterval field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="ivrCampaign-detail-form-container timezone md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MOTIONDIALER.TIMEZONE">
-                TIMEZONE
-              </div>
-            </div>
-            <form name="timezoneForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.TIMEZONE">Timezone</label>
-                <ms-timezone
-                  name="dialTimezone"
-                  ng-model="vm.ivrCampaign.dialTimezone"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                ></ms-timezone>
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.TIMEZONE"></span>
-                </div>
-                <div
-                  ng-messages="timezoneForm['dialTimezone'].$error"
-                  ng-show="timezoneForm[dialTimezone].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.TIMEZONE_REQUIRED"
-                      >Timezone field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="ivrCampaign-detail-form-container amd md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MOTIONDIALER.AMD">
-                AMD
-              </div>
-            </div>
-            <form name="amdForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.ivrCampaign.dialAMDActive"
-                  aria-label="AMDActive"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="MOTIONDIALER.AMDACTIVE"
-                    >AMDActive</span
-                  ></md-switch
-                >
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.AMDACTIVE"></span>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.ivrCampaign.dialAMDActive"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.AMDINITIALSILENCE"
-                  >AMDInitialSilence</label
-                >
-                <input
-                  type="number"
-                  name="dialAMDInitialSilence"
-                  ng-model="vm.ivrCampaign.dialAMDInitialSilence"
-                  min="0"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.AMDINITIALSILENCE"></span>
-                </div>
-                <div
-                  ng-messages="amdForm['dialAMDInitialSilence'].$error"
-                  ng-show="amdForm['dialAMDInitialSilence'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDINITIALSILENCE_REQUIRED"
-                      >AMDInitialSilence field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDINITIALSILENCE_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AMDInitialSilence must be a valid greater or equal
-                      than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.ivrCampaign.dialAMDActive"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.AMDGREETING">AMDGreeting</label>
-                <input
-                  type="number"
-                  name="dialAMDGreeting"
-                  ng-model="vm.ivrCampaign.dialAMDGreeting"
-                  min="0"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.AMDGREETING"></span>
-                </div>
-                <div
-                  ng-messages="amdForm['dialAMDGreeting'].$error"
-                  ng-show="amdForm['dialAMDGreeting'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.AMDGREETING_REQUIRED"
-                      >AMDGreeting field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDGREETING_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AMDGreeting must be a valid greater or equal than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.ivrCampaign.dialAMDActive"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.AMDAFTERGREETINGSILENCE"
-                  >AMDAfterGreetingSilence</label
-                >
-                <input
-                  type="number"
-                  name="dialAMDAfterGreetingSilence"
-                  ng-model="vm.ivrCampaign.dialAMDAfterGreetingSilence"
-                  min="0"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.AMDAFTERGREETINGSILENCE"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="amdForm['dialAMDAfterGreetingSilence'].$error"
-                  ng-show="amdForm['dialAMDAfterGreetingSilence'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDAFTERGREETINGSILENCE_REQUIRED"
-                      >AMDAfterGreetingSilence field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDAFTERGREETINGSILENCE_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AMDAfterGreetingSilence must be a valid greater or equal
-                      than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.ivrCampaign.dialAMDActive"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.AMDTOTALANALYSISTIME"
-                  >AMDTotalAnalysisTime</label
-                >
-                <input
-                  type="number"
-                  name="dialAMDTotalAnalysisTime"
-                  ng-model="vm.ivrCampaign.dialAMDTotalAnalysisTime"
-                  min="0"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.AMDTOTALANALYSISTIME"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="amdForm['dialAMDTotalAnalysisTime'].$error"
-                  ng-show="amdForm['dialAMDTotalAnalysisTime'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDTOTALANALYSISTIME_REQUIRED"
-                      >AMDTotalAnalysisTime field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDTOTALANALYSISTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AMDTotalAnalysisTime must be a valid greater or equal
-                      than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.ivrCampaign.dialAMDActive"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.AMDMINWORDLENGTH"
-                  >AMDMinWordLength</label
-                >
-                <input
-                  type="number"
-                  name="dialAMDMinWordLength"
-                  ng-model="vm.ivrCampaign.dialAMDMinWordLength"
-                  min="0"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.AMDMINWORDLENGTH"></span>
-                </div>
-                <div
-                  ng-messages="amdForm['dialAMDMinWordLength'].$error"
-                  ng-show="amdForm['dialAMDMinWordLength'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDMINWORDLENGTH_REQUIRED"
-                      >AMDMinWordLength field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDMINWORDLENGTH_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AMDMinWordLength must be a valid greater or equal
-                      than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.ivrCampaign.dialAMDActive"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.AMDBETWEENWORDSSILENCE"
-                  >AMDBetweenWordsSilence</label
-                >
-                <input
-                  type="number"
-                  name="dialAMDBetweenWordsSilence"
-                  ng-model="vm.ivrCampaign.dialAMDBetweenWordsSilence"
-                  min="0"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.AMDBETWEENWORDSSILENCE"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="amdForm['dialAMDBetweenWordsSilence'].$error"
-                  ng-show="amdForm['dialAMDBetweenWordsSilence'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDBETWEENWORDSSILENCE_REQUIRED"
-                      >AMDBetweenWordsSilence field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDBETWEENWORDSSILENCE_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AMDBetweenWordsSilence must be a valid greater or equal
-                      than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.ivrCampaign.dialAMDActive"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.AMDMAXIMUMNUMBEROFWORDS"
-                  >AMDMaximumNumberOfWords</label
-                >
-                <input
-                  type="number"
-                  name="dialAMDMaximumNumberOfWords"
-                  ng-model="vm.ivrCampaign.dialAMDMaximumNumberOfWords"
-                  min="0"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.AMDMAXIMUMNUMBEROFWORDS"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="amdForm['dialAMDMaximumNumberOfWords'].$error"
-                  ng-show="amdForm['dialAMDMaximumNumberOfWords'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDMAXIMUMNUMBEROFWORDS_REQUIRED"
-                      >AMDMaximumNumberOfWords field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDMAXIMUMNUMBEROFWORDS_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AMDMaximumNumberOfWords must be a valid greater or equal
-                      than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.ivrCampaign.dialAMDActive"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.AMDSILENCETHRESHOLD"
-                  >AMDSilenceThreshold</label
-                >
-                <input
-                  type="number"
-                  name="dialAMDSilenceThreshold"
-                  ng-model="vm.ivrCampaign.dialAMDSilenceThreshold"
-                  min="0"
-                  max="32767"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.AMDSILENCETHRESHOLD"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="amdForm['dialAMDSilenceThreshold'].$error"
-                  ng-show="amdForm['dialAMDSilenceThreshold'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDSILENCETHRESHOLD_REQUIRED"
-                      >AMDSilenceThreshold field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDSILENCETHRESHOLD_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AMDSilenceThreshold must be a valid greater or equal
-                      than</span
-                    >
-                    <span>0</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDSILENCETHRESHOLD_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >AMDSilenceThreshold must be a valid greater or equal
-                      than</span
-                    >
-                    <span>32767</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.ivrCampaign.dialAMDActive"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.AMDMAXIMUMWORDLENGTH"
-                  >AMDMaximumWordLength</label
-                >
-                <input
-                  type="number"
-                  name="dialAMDMaximumWordLength"
-                  ng-model="vm.ivrCampaign.dialAMDMaximumWordLength"
-                  min="0"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.AMDMAXIMUMWORDLENGTH"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="amdForm['dialAMDMaximumWordLength'].$error"
-                  ng-show="amdForm['dialAMDMaximumWordLength'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDMAXIMUMWORDLENGTH_REQUIRED"
-                      >AMDMaximumWordLength field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDMAXIMUMWORDLENGTH_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AMDMaximumWordLength must be a valid greater or equal
-                      than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="MOTIONDIALER.HOPPERS">HOPPERS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="ivrCampaign-detail-form-container hopperstatistics md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="IvrCampaignHopperStatisticsController as vm_hs"
-              ng-init="vm_hs.init(vm.ivrCampaign)"
-            >
-              <md-toolbar class="md-table-toolbar md-default">
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead" translate="MOTIONDIALER.HOPPERWIDGET"
-                    >Hoppers</span
-                  >
-                  <div flex></div>
-                  <md-button
-                    class="md-icon-button"
-                    ng-click="vm_hs.init(vm.ivrCampaign)"
-                    aria-label="refresh Hopper"
-                    translate
-                    translate-attr-label="MOTIONDIALER.REFRESH_HOPPERS"
-                  >
-                    <md-icon md-font-icon="icon-refresh"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <!-- WIDGET GROUP -->
-              <div class="widget-group" layout="row" flex="100" layout-wrap>
-                <!-- WIDGET 1 -->
-                <ms-widget
-                  class="h-140"
-                  layout="column"
-                  flex="100"
-                  flex-gt-xs="50"
-                  flex-gt-md="25"
-                >
-                  <!-- Front -->
-                  <ms-widget-front class="p-16 white-bg" layout="row" flex>
-                    <div
-                      class="pt-8 pb-8"
-                      layout="column"
-                      layout-align="center center"
-                      flex
-                    >
-                      <div class="md-display-1 pb-8">
-                        {{(vm_hs.total || 0) + (vm_hs.closed || 0)}}
-                      </div>
-                      <div class="font-weight-500 secondary-text">
-                        {{ 'MOTIONDIALER.TOTAL' | translate }}
-                      </div>
-                    </div>
-                  </ms-widget-front>
-                  <!-- / Front -->
-                </ms-widget>
-                <!-- / WIDGET 1 -->
-
-                <!-- WIDGET 2 -->
-                <ms-widget
-                  class="h-140"
-                  layout="column"
-                  flex="100"
-                  flex-gt-xs="50"
-                  flex-gt-md="25"
-                >
-                  <!-- Front -->
-                  <ms-widget-front class="p-16 white-bg" layout="row" flex>
-                    <div
-                      class="pt-8 pb-8"
-                      layout="column"
-                      layout-align="center center"
-                      flex
-                    >
-                      <div class="md-display-1 pb-8">
-                        {{vm_hs.fresh || 0}} ({{vm_hs.total ? ((((vm_hs.fresh ||
-                        0) * 100)/((vm_hs.closed || 0) + (vm_hs.total || 0))) |
-                        number: 2) : 0}}%)
-                      </div>
-                      <div class="font-weight-500 secondary-text">
-                        {{ 'MOTIONDIALER.FRESH' | translate }}
-                      </div>
-                    </div>
-                  </ms-widget-front>
-                  <!-- / Front -->
-                </ms-widget>
-                <!-- / WIDGET 2 -->
-
-                <!-- WIDGET 3 -->
-                <ms-widget
-                  class="h-140"
-                  layout="column"
-                  flex="100"
-                  flex-gt-xs="50"
-                  flex-gt-md="25"
-                >
-                  <!-- Front -->
-                  <ms-widget-front class="p-16 white-bg" layout="row" flex>
-                    <div
-                      class="pt-8 pb-8"
-                      layout="column"
-                      layout-align="center center"
-                      flex
-                    >
-                      <div class="md-display-1 pb-8">
-                        {{vm_hs.total ? (vm_hs.total - (vm_hs.fresh || 0)) : 0}}
-                        ({{vm_hs.total ? ((((vm_hs.total - (vm_hs.fresh || 0)) *
-                        100)/((vm_hs.closed || 0) + (vm_hs.total || 0))) |
-                        number: 2) : 0}}%)
-                      </div>
-                      <div class="font-weight-500 secondary-text">
-                        {{ 'MOTIONDIALER.OPEN' | translate }}
-                      </div>
-                    </div>
-                  </ms-widget-front>
-                  <!-- / Front -->
-                </ms-widget>
-                <!-- / WIDGET 3 -->
-
-                <!-- WIDGET 3 -->
-                <ms-widget
-                  class="h-140"
-                  layout="column"
-                  flex="100"
-                  flex-gt-xs="50"
-                  flex-gt-md="25"
-                >
-                  <!-- Front -->
-                  <ms-widget-front class="p-16 white-bg" layout="row" flex>
-                    <div
-                      class="pt-8 pb-8"
-                      layout="column"
-                      layout-align="center center"
-                      flex
-                    >
-                      <div class="md-display-1 pb-8">
-                        {{vm_hs.closed ? (vm_hs.closed || 0) : 0}}
-                        ({{vm_hs.closed ? ((((vm_hs.closed) * 100)/(vm_hs.closed
-                        + (vm_hs.total || 0))) | number: 2) : 0}}%)
-                      </div>
-                      <div class="font-weight-500 secondary-text">
-                        {{ 'MOTIONDIALER.CLOSED' | translate }}
-                      </div>
-                    </div>
-                  </ms-widget-front>
-                  <!-- / Front -->
-                </ms-widget>
-                <!-- / WIDGET 3 -->
-              </div>
-              <!-- / WIDGET GROUP -->
-            </div>
-          </div>
-          <div
-            class="ivrCampaign-detail-form-container hoppers md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="IvrCampaignHoppersController as vm_dc"
-              ng-init="vm_dc.init(vm.ivrCampaign, vm.crudPermissions)"
-            >
-              <md-toolbar
-                class="md-table-toolbar md-default"
-                ng-hide="vm_dc.selectedIvrCampaignHoppers.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead" translate="MOTIONDIALER.HOPPERS"
-                    >Hoppers</span
-                  >
-                  <ms-search-bar
-                    on-search="vm_dc.query.filter = query"
-                    on-collapse="vm_dc.query.filter = undefined"
-                    debounce="300"
-                    direction="down"
-                  ></ms-search-bar>
-                  <div flex></div>
-                  <md-button
-                    class="md-icon-button"
-                    ng-click="vm_dc.getIvrCampaignHoppers()"
-                    aria-label="refresh Hoppers"
-                    translate
-                    translate-attr-label="MOTIONDIALER.REFRESH_HOPPERS"
-                  >
-                    <md-icon md-font-icon="icon-refresh"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-toolbar
-                class="md-table-toolbar md-accent"
-                ng-show="vm_dc.selectedIvrCampaignHoppers.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead"
-                    >{{vm_dc.selectedIvrCampaignHoppers.length}}
-                    {{vm_dc.selectedIvrCampaignHoppers.length > 1 ? 'items' :
-                    'item'}} selected</span
-                  >
-                  <div flex></div>
-                  <button
-                    class="md-icon-button"
-                    ng-csv="vm_dc.exportSelectedIvrCampaignHoppers"
-                    csv-label="true"
-                    filename="ivrCampaigns.csv"
-                  >
-                    <md-icon md-font-icon="icon-file-excel"></md-icon>
-                  </button>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canDelete"
-                    class="md-icon-button"
-                    ng-click="vm_dc.deleteSelectedIvrCampaignHoppers($event)"
-                    aria-label="delete selected"
-                    translate
-                    translate-attr-label="MOTIONDIALER.DELETE_SELECTED"
-                  >
-                    <md-icon md-font-icon="icon-delete"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-table-container class="font-size-12">
-                <table
-                  md-table
-                  md-row-select
-                  multiple
-                  ng-model="vm_dc.selectedIvrCampaignHoppers"
-                  md-progress="vm_dc.promise"
-                >
-                  <thead
-                    md-head
-                    md-order="vm_dc.query.sort"
-                    md-on-reorder="vm_dc.getIvrCampaignHoppers"
-                  >
-                    <tr md-row>
-                      <th md-column md-order-by="ContactId">
-                        {{ 'MOTIONDIALER.CONTACTID' | translate }}
-                      </th>
-                      <th md-column md-order-by="phone">
-                        {{ 'MOTIONDIALER.PHONE' | translate }}
-                      </th>
-                      <th md-column md-order-by="countcongestionretry">
-                        {{ 'MOTIONDIALER.CONGESTION' | translate }}
-                      </th>
-                      <th md-column md-order-by="countbusyretry">
-                        {{ 'MOTIONDIALER.BUSY' | translate }}
-                      </th>
-                      <th md-column md-order-by="countnoanswerretry">
-                        {{ 'MOTIONDIALER.NOANSWER' | translate }}
-                      </th>
-                      <th md-column md-order-by="countnosuchnumberretry">
-                        {{ 'MOTIONDIALER.NOSUCHNUMBER' | translate }}
-                      </th>
-                      <th md-column md-order-by="countdropretry">
-                        {{ 'MOTIONDIALER.DROP' | translate }}
-                      </th>
-                      <th md-column md-order-by="countabandonedretry">
-                        {{ 'MOTIONDIALER.ABANDONED' | translate }}
-                      </th>
-                      <th md-column md-order-by="countmachineretry">
-                        {{ 'MOTIONDIALER.MACHINE' | translate }}
-                      </th>
-                      <th md-column md-order-by="countagentrejectretry">
-                        {{ 'MOTIONDIALER.AGENTREJECT' | translate }}
-                      </th>
-                      <th md-column md-order-by="scheduledat">
-                        {{ 'MOTIONDIALER.SCHEDULEDAT' | translate }}
-                      </th>
-                      <th md-column md-order-by="priority">
-                        {{ 'MOTIONDIALER.PRIORITY' | translate }}
-                      </th>
-                      <th md-column width="10px"></th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr
-                      md-row
-                      md-select="hopper"
-                      md-select-id="id"
-                      ng-repeat="hopper in vm_dc.ivrCampaignHoppers.rows"
-                    >
-                      <td
-                        ng-click="vm_dc.createOrEditIvrCampaignHopper($event, hopper)"
-                        md-cell
-                      >
-                        {{hopper.ContactId}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditIvrCampaignHopper($event, hopper)"
-                        md-cell
-                      >
-                        {{hopper.phone}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditIvrCampaignHopper($event, hopper)"
-                        md-cell
-                      >
-                        {{hopper.countcongestionretry}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditIvrCampaignHopper($event, hopper)"
-                        md-cell
-                      >
-                        {{hopper.countbusyretry}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditIvrCampaignHopper($event, hopper)"
-                        md-cell
-                      >
-                        {{hopper.countnoanswerretry}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditIvrCampaignHopper($event, hopper)"
-                        md-cell
-                      >
-                        {{hopper.countnosuchnumberretry}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditIvrCampaignHopper($event, hopper)"
-                        md-cell
-                      >
-                        {{hopper.countdropretry}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditIvrCampaignHopper($event, hopper)"
-                        md-cell
-                      >
-                        {{hopper.countabandonedretry}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditIvrCampaignHopper($event, hopper)"
-                        md-cell
-                      >
-                        {{hopper.countmachineretry}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditIvrCampaignHopper($event, hopper)"
-                        md-cell
-                      >
-                        {{hopper.countagentrejectretry}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditIvrCampaignHopper($event, hopper)"
-                        md-cell
-                      >
-                        {{ hopper.scheduledat | formatdate }}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditIvrCampaignHopper($event, hopper)"
-                        md-cell
-                      >
-                        {{ vm_dc.arraypriority[hopper.priority].option }}
-                      </td>
-
-                      <td
-                        md-cell
-                        class="actions"
-                        ng-if="!vm_dc.crudPermissions.readOnly"
-                      >
-                        <md-menu>
-                          <md-button
-                            class="md-icon-button"
-                            aria-label="More"
-                            translate
-                            translate-attr-aria-label="MOTIONDIALER.MORE"
-                            ng-click="$mdOpenMenu($event)"
-                          >
-                            <md-icon
-                              md-font-icon="icon-dots-vertical"
-                            ></md-icon>
-                          </md-button>
-
-                          <md-menu-content width="3">
-                            <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
-                              <md-button
-                                ng-click="vm_dc.createOrEditIvrCampaignHopper($event, hopper)"
-                                translate="MOTIONDIALER.EDIT_HOPPER"
-                              >
-                                Edit Hopper
-                              </md-button>
-                            </md-menu-item>
-                            <md-menu-item
-                              ng-if="vm_dc.crudPermissions.canDelete"
-                            >
-                              <md-button
-                                ng-click="vm_dc.deleteConfirm(hopper, $event)"
-                                translate="MOTIONDIALER.DELETE_HOPPER"
-                              >
-                                Delete Hopper
-                              </md-button>
-                            </md-menu-item>
-                          </md-menu-content>
-                        </md-menu>
-                      </td>
-                    </tr>
-                    <tr md-row ng-if="!vm_dc.ivrCampaignHoppers.rows.length">
-                      <td md-cell colspan="15">
-                        <div layout="row" layout-align="center center">
-                          <span
-                            class="text-boxed-light"
-                            translate="MOTIONDIALER.NO_HOPPER_AVAILABLE"
-                            >No hopper available</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-              <md-table-pagination
-                md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
-                md-limit="vm_dc.query.limit"
-                md-limit-options="[10, 15, 20, 50, 100, 250]"
-                md-page="vm_dc.query.page"
-                md-total="{{vm_dc.ivrCampaignHoppers.count}}"
-                md-on-paginate="vm_dc.getIvrCampaignHoppers"
-                md-page-select
-              ></md-table-pagination>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="MOTIONDIALER.HISTORY">HISTORY</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="ivrCampaign-detail-form-container hopperhistories md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="IvrCampaignHopperHistoriesController as vm_dc"
-              ng-init="vm_dc.init(vm.ivrCampaign, vm.crudPermissions)"
-            >
-              <md-toolbar
-                class="md-table-toolbar md-default"
-                ng-hide="vm_dc.selectedIvrCampaignHopperHistories.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span
-                    class="md-subhead"
-                    translate="MOTIONDIALER.HOPPERHISTORIES"
-                    >HopperHistories</span
-                  >
-                  <ms-search-bar
-                    on-search="vm_dc.query.filter = query"
-                    on-collapse="vm_dc.query.filter = undefined"
-                    debounce="300"
-                    direction="down"
-                  ></ms-search-bar>
-                  <div flex></div>
-                  <md-button
-                    class="md-icon-button"
-                    ng-click="vm_dc.getIvrCampaignHopperHistories()"
-                    aria-label="refresh HopperHistories"
-                    translate
-                    translate-attr-label="MOTIONDIALER.REFRESH_HOPPERHISTORIES"
-                  >
-                    <md-icon md-font-icon="icon-refresh"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-toolbar
-                class="md-table-toolbar md-accent"
-                ng-show="vm_dc.selectedIvrCampaignHopperHistories.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead"
-                    >{{vm_dc.selectedIvrCampaignHopperHistories.length}}
-                    {{vm_dc.selectedIvrCampaignHopperHistories.length > 1 ?
-                    'items' : 'item'}} selected</span
-                  >
-                  <div flex></div>
-                  <button
-                    class="md-icon-button"
-                    ng-csv="vm_dc.exportSelectedIvrCampaignHopperHistories"
-                    csv-label="true"
-                    filename="ivrCampaigns.csv"
-                  >
-                    <md-icon md-font-icon="icon-file-excel"></md-icon>
-                  </button>
-                </div>
-              </md-toolbar>
-              <md-table-container class="font-size-12">
-                <table
-                  md-table
-                  md-row-select
-                  multiple
-                  ng-model="vm_dc.selectedIvrCampaignHopperHistories"
-                  md-progress="vm_dc.promise"
-                >
-                  <thead
-                    md-head
-                    md-order="vm_dc.query.sort"
-                    md-on-reorder="vm_dc.getIvrCampaignHopperHistories"
-                  >
-                    <tr md-row>
-                      <th md-column md-order-by="uniqueid">
-                        {{ 'MOTIONDIALER.UNIQUEID' | translate }}
-                      </th>
-                      <th md-column md-order-by="ContactId">
-                        {{ 'MOTIONDIALER.CONTACTID' | translate }}
-                      </th>
-                      <th md-column md-order-by="calleridnum">
-                        {{ 'MOTIONDIALER.PHONE' | translate }}
-                      </th>
-                      <th md-column md-order-by="calleridname">
-                        {{ 'MOTIONDIALER.NAME' | translate }}
-                      </th>
-                      <th md-column md-order-by="statedesc">
-                        {{ 'MOTIONDIALER.STATUS' | translate }}
-                      </th>
-                      <th md-column md-order-by="scheduledat">
-                        {{ 'MOTIONDIALER.SCHEDULEDAT' | translate }}
-                      </th>
-                      <th md-column md-order-by="starttime">
-                        {{ 'MOTIONDIALER.STARTTIME' | translate }}
-                      </th>
-                      <th md-column md-order-by="endtime">
-                        {{ 'MOTIONDIALER.ENDTIME' | translate }}
-                      </th>
-                      <th md-column width="10px"></th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr
-                      md-row
-                      md-select="hopperHistory"
-                      md-select-id="id"
-                      ng-repeat="hopperHistory in vm_dc.ivrCampaignHopperHistories.rows"
-                    >
-                      <td md-cell>{{hopperHistory.uniqueid}}</td>
-                      <td md-cell>{{hopperHistory.ContactId}}</td>
-                      <td md-cell>{{hopperHistory.calleridnum}}</td>
-                      <td md-cell>{{hopperHistory.calleridname}}</td>
-                      <td md-cell>{{hopperHistory.statedesc}}</td>
-                      <td md-cell>
-                        {{ hopperHistory.scheduledat | formatdate }}
-                      </td>
-                      <td md-cell>
-                        {{ hopperHistory.starttime | formatdate }}
-                      </td>
-                      <td md-cell>{{ hopperHistory.endtime | formatdate }}</td>
-                      <td md-cell class="actions"></td>
-                    </tr>
-                    <tr
-                      md-row
-                      ng-if="!vm_dc.ivrCampaignHopperHistories.rows.length"
-                    >
-                      <td md-cell colspan="11">
-                        <div layout="row" layout-align="center center">
-                          <span
-                            class="text-boxed-light"
-                            translate="MOTIONDIALER.NO_HOPPERHISTORY_AVAILABLE"
-                            >No hopperhistory available</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-              <md-table-pagination
-                md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
-                md-limit="vm_dc.query.limit"
-                md-limit-options="[10, 15, 20, 50, 100, 250]"
-                md-page="vm_dc.query.page"
-                md-total="{{vm_dc.ivrCampaignHopperHistories.count}}"
-                md-on-paginate="vm_dc.getIvrCampaignHopperHistories"
-                md-page-select
-              ></md-table-pagination>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="MOTIONDIALER.FINAL">FINAL</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="ivrCampaign-detail-form-container hopperfinals md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="IvrCampaignHopperFinalsController as vm_dc"
-              ng-init="vm_dc.init(vm.ivrCampaign, vm.crudPermissions)"
-            >
-              <md-toolbar
-                class="md-table-toolbar md-default"
-                ng-hide="vm_dc.selectedIvrCampaignHopperFinals.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead" translate="MOTIONDIALER.HOPPERFINALS"
-                    >HopperFinals</span
-                  >
-                  <ms-search-bar
-                    on-search="vm_dc.query.filter = query"
-                    on-collapse="vm_dc.query.filter = undefined"
-                    debounce="300"
-                    direction="down"
-                  ></ms-search-bar>
-                  <div flex></div>
-                  <md-button
-                    class="md-icon-button"
-                    ng-click="vm_dc.getIvrCampaignHopperFinals()"
-                    aria-label="refresh HopperFinals"
-                    translate
-                    translate-attr-label="MOTIONDIALER.REFRESH_HOPPERFINALS"
-                  >
-                    <md-icon md-font-icon="icon-refresh"></md-icon>
-                  </md-button>
-                  <td md-cell class="actions">
-                    <md-menu>
-                      <md-button
-                        class="md-icon-button"
-                        aria-label="More"
-                        translate
-                        translate-attr-aria-label="MOTIONDIALER.MORE"
-                        ng-click="vm_dc.countContactsIvrCampaignHopperFinal(vm_dc.query.id); $mdOpenMenu($event);"
-                      >
-                        <md-icon md-font-icon="icon-backup-restore"></md-icon>
-                        <md-tooltip
-                          ><span translate="MOTIONDIALER.RESTORECONTACTS"></span
-                        ></md-tooltip>
-                      </md-button>
-                      <md-menu-content width="3">
-                        <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
-                          <md-button
-                            ng-click="vm_dc.moveContactsIvrCampaignHopperFinal(3)"
-                          >
-                            <span translate="MOTIONDIALER.NOANSWER "
-                              >NoAnswer</span
-                            >
-                            <span class="badge"
-                              >({{vm_dc.contacts.noAnswerContacts}})</span
-                            >
-                          </md-button>
-                        </md-menu-item>
-                        <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
-                          <md-button
-                            ng-click="vm_dc.moveContactsIvrCampaignHopperFinal(5)"
-                          >
-                            <span translate="MOTIONDIALER.BUSY ">Busy</span>
-                            <span class="badge"
-                              >({{vm_dc.contacts.busyContacts}})</span
-                            >
-                          </md-button>
-                        </md-menu-item>
-                        <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
-                          <md-button
-                            ng-click="vm_dc.moveContactsIvrCampaignHopperFinal(8)"
-                          >
-                            <span translate="MOTIONDIALER.CONGESTION "
-                              >Congestion</span
-                            >
-                            <span class="badge"
-                              >({{vm_dc.contacts.congestionContacts}})</span
-                            >
-                          </md-button>
-                        </md-menu-item>
-                        <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
-                          <md-button
-                            ng-click="vm_dc.moveContactsIvrCampaignHopperFinal(10)"
-                          >
-                            <span translate="MOTIONDIALER.DROPPED ">Drop</span>
-                            <span class="badge"
-                              >({{vm_dc.contacts.dropContacts}})</span
-                            >
-                          </md-button>
-                        </md-menu-item>
-                        <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
-                          <md-button
-                            ng-click="vm_dc.moveContactsIvrCampaignHopperFinal(11)"
-                          >
-                            <span translate="MOTIONDIALER.ABANDONED "
-                              >Abandoned</span
-                            >
-                            <span class="badge"
-                              >({{vm_dc.contacts.abandonedContacts}})</span
-                            >
-                          </md-button>
-                        </md-menu-item>
-                        <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
-                          <md-button
-                            ng-click="vm_dc.moveContactsIvrCampaignHopperFinal(22)"
-                          >
-                            <span translate="MOTIONDIALER.RECALLFAILEDTIMEOUT"
-                              >Recall</span
-                            >
-                            <span class="badge"
-                              >({{vm_dc.contacts.reCallContacts}})</span
-                            >
-                          </md-button>
-                        </md-menu-item>
-                        <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
-                          <md-button
-                            ng-click="vm_dc.moveContactsIvrCampaignHopperFinal(0)"
-                          >
-                            <span translate="MOTIONDIALER.NO_SUCH_NUMBER"
-                              >NoSuchNumber</span
-                            >
-                            <span class="badge"
-                              >({{vm_dc.contacts.noSuchContacts}})</span
-                            >
-                          </md-button>
-                        </md-menu-item>
-                        <md-menu-item>
-                          <md-button
-                            ng-click="vm_dc.moveContactsIvrCampaignHopperFinal(19)"
-                          >
-                            <span translate="MOTIONDIALER.ANSWERING_MACHINE"
-                              >AnsweringMachine</span
-                            >
-                            <span class="badge"
-                              >({{vm_dc.contacts.answeringMachine}})</span
-                            >
-                          </md-button>
-                        </md-menu-item>
-                      </md-menu-content>
-                    </md-menu>
-                  </td>
-                </div>
-              </md-toolbar>
-              <md-toolbar
-                class="md-table-toolbar md-accent"
-                ng-show="vm_dc.selectedIvrCampaignHopperFinals.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead"
-                    >{{vm_dc.selectedIvrCampaignHopperFinals.length}}
-                    {{vm_dc.selectedIvrCampaignHopperFinals.length > 1 ? 'items'
-                    : 'item'}} selected</span
-                  >
-                  <div flex></div>
-                  <button
-                    class="md-icon-button"
-                    ng-csv="vm_dc.exportSelectedIvrCampaignHopperFinals"
-                    csv-label="true"
-                    filename="ivrCampaigns.csv"
-                  >
-                    <md-icon md-font-icon="icon-file-excel"></md-icon>
-                  </button>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canEdit"
-                    class="md-icon-button"
-                    ng-click="vm_dc.moveSelectedIvrCampaignHopperFinals($event)"
-                    aria-label="move selected"
-                    translate
-                    translate-attr-label="MOTIONDIALER.MOVE_SELECTED"
-                  >
-                    <md-icon md-font-icon="icon-restore"></md-icon>
-                    <md-tooltip
-                      ><span translate="MOTIONDIALER.RESTORECONTACTS"></span
-                    ></md-tooltip>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-table-container class="font-size-12">
-                <table
-                  md-table
-                  md-row-select
-                  multiple
-                  ng-model="vm_dc.selectedIvrCampaignHopperFinals"
-                  md-progress="vm_dc.promise"
-                >
-                  <thead
-                    md-head
-                    md-order="vm_dc.query.sort"
-                    md-on-reorder="vm_dc.getIvrCampaignHopperFinals"
-                  >
-                    <tr md-row>
-                      <th md-column md-order-by="uniqueid">
-                        {{ 'MOTIONDIALER.UNIQUEID' | translate }}
-                      </th>
-                      <th md-column md-order-by="ContactId">
-                        {{ 'MOTIONDIALER.CONTACTID' | translate }}
-                      </th>
-                      <th md-column md-order-by="calleridnum">
-                        {{ 'MOTIONDIALER.PHONE' | translate }}
-                      </th>
-                      <th md-column md-order-by="calleridname">
-                        {{ 'MOTIONDIALER.NAME' | translate }}
-                      </th>
-                      <th md-column md-order-by="statedesc">
-                        {{ 'MOTIONDIALER.STATUS' | translate }}
-                      </th>
-                      <th md-column md-order-by="countcongestionretry">
-                        {{ 'MOTIONDIALER.CONGESTION' | translate }}
-                      </th>
-                      <th md-column md-order-by="countbusyretry">
-                        {{ 'MOTIONDIALER.BUSY' | translate }}
-                      </th>
-                      <th md-column md-order-by="countnoanswerretry">
-                        {{ 'MOTIONDIALER.NOANSWER' | translate }}
-                      </th>
-                      <th md-column md-order-by="countnosuchnumberretry">
-                        {{ 'MOTIONDIALER.NOSUCHNUMBER' | translate }}
-                      </th>
-                      <th md-column md-order-by="countdropretry">
-                        {{ 'MOTIONDIALER.DROP' | translate }}
-                      </th>
-                      <th md-column md-order-by="countabandonedretry">
-                        {{ 'MOTIONDIALER.ABANDONED' | translate }}
-                      </th>
-                      <th md-column md-order-by="countmachineretry">
-                        {{ 'MOTIONDIALER.MACHINE' | translate }}
-                      </th>
-                      <th md-column md-order-by="countagentrejectretry">
-                        {{ 'MOTIONDIALER.AGENTREJECT' | translate }}
-                      </th>
-                      <th md-column md-order-by="starttime">
-                        {{ 'MOTIONDIALER.STARTTIME' | translate }}
-                      </th>
-                      <th md-column md-order-by="endtime">
-                        {{ 'MOTIONDIALER.ENDTIME' | translate }}
-                      </th>
-                      <th md-column md-order-by="disposition">
-                        {{ 'MOTIONDIALER.DISPOSITION' | translate }}
-                      </th>
-                      <th md-column width="10px"></th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr
-                      md-row
-                      md-select="hopperFinal"
-                      md-select-id="id"
-                      ng-repeat="hopperFinal in vm_dc.ivrCampaignHopperFinals.rows"
-                    >
-                      <td md-cell>{{hopperFinal.uniqueid}}</td>
-                      <td md-cell>{{hopperFinal.ContactId}}</td>
-                      <td md-cell>{{hopperFinal.calleridnum}}</td>
-                      <td md-cell>{{hopperFinal.calleridname}}</td>
-                      <td md-cell>{{hopperFinal.statedesc}}</td>
-                      <td md-cell>{{hopperFinal.countcongestionretry}}</td>
-                      <td md-cell>{{hopperFinal.countbusyretry}}</td>
-                      <td md-cell>{{hopperFinal.countnoanswerretry}}</td>
-                      <td md-cell>{{hopperFinal.countnosuchnumberretry}}</td>
-                      <td md-cell>{{hopperFinal.countdropretry}}</td>
-                      <td md-cell>{{hopperFinal.countabandonedretry}}</td>
-                      <td md-cell>{{hopperFinal.countmachineretry}}</td>
-                      <td md-cell>{{hopperFinal.countagentrejectretry}}</td>
-                      <td md-cell>{{ hopperFinal.starttime | formatdate }}</td>
-                      <td md-cell>{{ hopperFinal.endtime | formatdate }}</td>
-                      <td md-cell>{{hopperFinal.disposition}}</td>
-                      <td
-                        md-cell
-                        class="actions"
-                        ng-if="!vm_dc.crudPermissions.readOnly"
-                      >
-                        <md-menu>
-                          <md-button
-                            class="md-icon-button"
-                            aria-label="More"
-                            translate
-                            translate-attr-aria-label="MOTIONDIALER.MORE"
-                            ng-click="$mdOpenMenu($event)"
-                          >
-                            <md-icon
-                              md-font-icon="icon-dots-vertical"
-                            ></md-icon>
-                          </md-button>
-
-                          <md-menu-content width="3">
-                            <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
-                              <md-button
-                                ng-click="vm_dc.moveConfirm(hopperFinal, $event)"
-                                translate="MOTIONDIALER.MOVE_HOPPERFINAL"
-                              >
-                                Move HopperFinal
-                              </md-button>
-                            </md-menu-item>
-                          </md-menu-content>
-                        </md-menu>
-                      </td>
-                    </tr>
-                    <tr
-                      md-row
-                      ng-if="!vm_dc.ivrCampaignHopperFinals.rows.length"
-                    >
-                      <td md-cell colspan="28">
-                        <div layout="row" layout-align="center center">
-                          <span
-                            class="text-boxed-light"
-                            translate="MOTIONDIALER.NO_HOPPERFINAL_AVAILABLE"
-                            >No hopperfinal available</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-              <md-table-pagination
-                md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
-                md-limit="vm_dc.query.limit"
-                md-limit-options="[10, 15, 20, 50, 100, 250]"
-                md-page="vm_dc.query.page"
-                md-total="{{vm_dc.ivrCampaignHopperFinals.count}}"
-                md-on-paginate="vm_dc.getIvrCampaignHopperFinals"
-                md-page-select
-              ></md-table-pagination>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="MOTIONDIALER.BLACKLIST">BLACKLIST</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="ivrCampaign-detail-form-container hopperblacks md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="IvrCampaignHopperBlacksController as vm_dc"
-              ng-init="vm_dc.init(vm.ivrCampaign, vm.crudPermissions)"
-            >
-              <md-toolbar
-                class="md-table-toolbar md-default"
-                ng-hide="vm_dc.selectedIvrCampaignHopperBlacks.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead" translate="MOTIONDIALER.HOPPERBLACKS"
-                    >HopperBlacks</span
-                  >
-                  <ms-search-bar
-                    on-search="vm_dc.query.filter = query"
-                    on-collapse="vm_dc.query.filter = undefined"
-                    debounce="300"
-                    direction="down"
-                  ></ms-search-bar>
-                  <div flex></div>
-                </div>
-              </md-toolbar>
-              <md-toolbar
-                class="md-table-toolbar md-accent"
-                ng-show="vm_dc.selectedIvrCampaignHopperBlacks.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead"
-                    >{{vm_dc.selectedIvrCampaignHopperBlacks.length}}
-                    {{vm_dc.selectedIvrCampaignHopperBlacks.length > 1 ? 'items'
-                    : 'item'}} selected</span
-                  >
-                  <div flex></div>
-                  <button
-                    class="md-icon-button"
-                    ng-csv="vm_dc.exportSelectedIvrCampaignHopperBlacks"
-                    csv-label="true"
-                    filename="ivrCampaigns.csv"
-                  >
-                    <md-icon md-font-icon="icon-file-excel"></md-icon>
-                  </button>
-                </div>
-              </md-toolbar>
-              <md-table-container class="font-size-12">
-                <table
-                  md-table
-                  md-row-select
-                  multiple
-                  ng-model="vm_dc.selectedIvrCampaignHopperBlacks"
-                  md-progress="vm_dc.promise"
-                >
-                  <thead
-                    md-head
-                    md-order="vm_dc.query.sort"
-                    md-on-reorder="vm_dc.getIvrCampaignHopperBlacks"
-                  >
-                    <tr md-row>
-                      <th md-column md-order-by="ContactId">
-                        {{ 'MOTIONDIALER.CONTACTID' | translate }}
-                      </th>
-                      <th md-column md-order-by="phone">
-                        {{ 'MOTIONDIALER.PHONE' | translate }}
-                      </th>
-                      <th md-column width="10px"></th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr
-                      md-row
-                      md-select="hopperBlack"
-                      md-select-id="id"
-                      ng-repeat="hopperBlack in vm_dc.ivrCampaignHopperBlacks.rows"
-                    >
-                      <td md-cell>{{hopperBlack.ContactId}}</td>
-                      <td md-cell>{{hopperBlack.phone}}</td>
-                      <td md-cell class="actions"></td>
-                    </tr>
-                    <tr
-                      md-row
-                      ng-if="!vm_dc.ivrCampaignHopperBlacks.rows.length"
-                    >
-                      <td md-cell colspan="4">
-                        <div layout="row" layout-align="center center">
-                          <span
-                            class="text-boxed-light"
-                            translate="MOTIONDIALER.NO_HOPPERBLACK_AVAILABLE"
-                            >No hopperblack available</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-              <md-table-pagination
-                md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
-                md-limit="vm_dc.query.limit"
-                md-limit-options="[10, 15, 20, 50, 100, 250]"
-                md-page="vm_dc.query.page"
-                md-total="{{vm_dc.ivrCampaignHopperBlacks.count}}"
-                md-on-paginate="vm_dc.getIvrCampaignHopperBlacks"
-                md-page-select
-              ></md-table-pagination>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/view.html/view.html b/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/view.html/view.html
new file mode 100644
index 0000000..791690e
--- /dev/null
+++ b/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/edit/view.html/view.html
@@ -0,0 +1,3103 @@
+<div
+  id="motiondialer-ivrCampaign"
+  class="page-layout simple tabbed"
+  layout="column"
+>
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-ivrCampaigns-button md-icon-button"
+        aria-label="Go to ivrCampaigns"
+        ng-click="vm.gotoIvrCampaigns()"
+        translate
+        translate-attr-aria-label="MOTIONDIALER.GO_TO_IVRCAMPAIGNS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="ivrCampaign-image" hide-xs>
+          <img ng-src="assets/images/business/ivrCampaigns.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.ivrCampaign.id}}
+            <span ng-if="vm.ivrCampaign.name">{{vm.ivrCampaign.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="MOTIONDIALER.CREATED_AT"></span>
+            <span>{{vm.ivrCampaign.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div ng-cloak ng-if="vm.crudPermissions.canEdit">
+      <md-button
+        ng-click="vm.clonedialog(vm.ivrCampaign, $event)"
+        class="md-fab md-green-500-bg md-icon-button"
+        aria-label="clone"
+      >
+        <md-tooltip
+          ><span translate="MOTIONDIALER.CLONE_IVRCAMPAIGN"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-content-duplicate"></md-icon>
+      </md-button>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.listadddialog(vm.ivrCampaign, $event)"
+        class="md-fab md-green-500-bg md-icon-button"
+        aria-label="listadd"
+      >
+        <md-tooltip
+          ><span translate="MOTIONDIALER.LISTADD_IVRCAMPAIGN"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-format-list-numbers"></md-icon>
+      </md-button>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.blacklistadddialog(vm.ivrCampaign, $event)"
+        class="md-fab md-warn md-icon-button"
+        aria-label="blacklistadd"
+      >
+        <md-tooltip
+          ><span translate="MOTIONDIALER.BLACKLISTADD_IVRCAMPAIGN"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-block-helper"></md-icon>
+      </md-button>
+    </div>
+
+    <div ng-cloak ng-if="vm.crudPermissions.canEdit">
+      <md-button
+        ng-click="vm.resetlistdialog(vm.ivrCampaign, $event)"
+        class="md-fab md-warn md-icon-button"
+        aria-label="resetlist"
+      >
+        <md-tooltip
+          ><span translate="MOTIONDIALER.RESETLIST_IVRCAMPAIGN"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-restore"></md-icon>
+      </md-button>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.gotogoto(vm.ivrCampaign, $event)"
+        class="md-fab md-warn md-icon-button"
+        aria-label="goto"
+      >
+        <md-tooltip
+          ><span translate="MOTIONDIALER.GOTO_IVRCAMPAIGN"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-cast"></md-icon>
+      </md-button>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveIvrCampaign()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        translate="MOTIONDIALER.SAVE"
+        translate-attr-aria-label="MOTIONDIALER.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="MOTIONDIALER.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="ivrCampaign-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MOTIONDIALER.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.ivrCampaign.name"
+                  ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+                  ng-required="true"
+                  autofocus
+                  disabled
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.NAME"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                  <div ng-message="pattern">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.NAME_MUST_VALID_PATTERN"
+                      translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+                      >Name must be valid pattern
+                    </span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.ivrCampaign.active"
+                  aria-label="Active"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="MOTIONDIALER.ACTIVE"
+                    >Active</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.TRUNK">Trunk</label>
+                <md-select
+                  name="TrunkId"
+                  ng-model="vm.ivrCampaign.TrunkId"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="TrunkId.id"
+                    ng-repeat="TrunkId in vm.trunks"
+                    ng-disabled="TrunkId.canSelect === false"
+                    >{{ TrunkId.name }}</md-option
+                  >
+                </md-select>
+                <div
+                  ng-messages="generalForm['TrunkId'].$error"
+                  ng-show="generalForm['TrunkId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.TRUNK_REQUIRED"
+                      >Trunk field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.BACKUPTRUNK">BackupTrunk</label>
+                <md-select
+                  name="TrunkBackupId"
+                  ng-model="vm.ivrCampaign.TrunkBackupId"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="null">None</md-option>
+                  <md-option
+                    ng-value="TrunkBackupId.id"
+                    ng-repeat="TrunkBackupId in vm.trunks"
+                    ng-disabled="TrunkBackupId.canSelect === false"
+                    >{{ TrunkBackupId.name }}</md-option
+                  >
+                </md-select>
+                <div
+                  ng-messages="generalForm['TrunkBackupId'].$error"
+                  ng-show="generalForm['TrunkBackupId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.BACKUPTRUNK_REQUIRED"
+                      >BackupTrunk field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.INTERVAL">Interval</label>
+                <md-select
+                  name="IntervalId"
+                  ng-model="vm.ivrCampaign.IntervalId"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="IntervalId.id"
+                    ng-repeat="IntervalId in vm.interval"
+                    ng-disabled="IntervalId.canSelect === false"
+                    >{{ IntervalId.name }}</md-option
+                  >
+                </md-select>
+                <div
+                  ng-messages="generalForm['IntervalId'].$error"
+                  ng-show="generalForm['IntervalId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.INTERVAL_REQUIRED"
+                      >Interval field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.CHECKDUPLICATE"
+                  >CheckDuplicate</label
+                >
+                <md-select
+                  name="dialCheckDuplicateType"
+                  ng-model="vm.ivrCampaign.dialCheckDuplicateType"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'always'">
+                    {{ 'MOTIONDIALER.ALWAYS' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'never'">
+                    {{ 'MOTIONDIALER.NEVER' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'onlyIfOpen'">
+                    {{ 'MOTIONDIALER.ONLY_IF_OPEN' | translate }}
+                  </md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['dialCheckDuplicateType'].$error"
+                  ng-show="generalForm['dialCheckDuplicateType'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.CHECKDUPLICATE_REQUIRED"
+                      >CheckDuplicate field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.CUTDIGIT">CutDigit</label>
+                <input
+                  type="number"
+                  name="dialCutDigit"
+                  ng-model="vm.ivrCampaign.dialCutDigit"
+                  min="0"
+                  max="15"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['dialCutDigit'].$error"
+                  ng-show="generalForm['dialCutDigit'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.CUTDIGIT_REQUIRED"
+                      >CutDigit field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.CUTDIGIT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >CutDigit must be a valid greater or equal than</span
+                    >
+                    <span>0</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.CUTDIGIT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >CutDigit must be a valid greater or equal than</span
+                    >
+                    <span>15</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.ivrCampaign.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="MOTIONDIALER.CAMPAIGN">CAMPAIGN</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="ivrCampaign-detail-form-container campaign md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MOTIONDIALER.CAMPAIGN">
+                CAMPAIGN
+              </div>
+            </div>
+            <form name="campaignForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.CALLYSQUAREPROJECT"
+                  >CallySquareProject</label
+                >
+                <md-select
+                  name="SquareProjectId"
+                  ng-model="vm.ivrCampaign.SquareProjectId"
+                  autofocus
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="SquareProjectId.id"
+                    ng-repeat="SquareProjectId in vm.projects"
+                    ng-disabled="SquareProjectId.canSelect === false"
+                    >{{ SquareProjectId.name }}</md-option
+                  >
+                </md-select>
+                <div
+                  ng-messages="campaignForm['SquareProjectId'].$error"
+                  ng-show="campaignForm['SquareProjectId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.CALLYSQUAREPROJECT_REQUIRED"
+                      >CallySquareProject field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.CONCURRENTCALLS"
+                  >ConcurrentCalls</label
+                >
+                <input
+                  type="number"
+                  name="limitCalls"
+                  ng-model="vm.ivrCampaign.limitCalls"
+                  min="1"
+                  max="200"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.CONCURRENTCALLS"></span>
+                </div>
+                <div
+                  ng-messages="campaignForm['limitCalls'].$error"
+                  ng-show="campaignForm['limitCalls'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.CONCURRENTCALLS_REQUIRED"
+                      >ConcurrentCalls field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.CONCURRENTCALLS_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >ConcurrentCalls must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.CONCURRENTCALLS_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >ConcurrentCalls must be a valid greater or equal
+                      than</span
+                    >
+                    <span>200</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="ivrCampaign-detail-form-container originate md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MOTIONDIALER.ORIGINATE">
+                ORIGINATE
+              </div>
+            </div>
+            <form name="originateForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.ORIGINATECALLERIDNAME"
+                  >OriginateCallerIdName</label
+                >
+                <input
+                  type="text"
+                  name="dialOriginateCallerIdName"
+                  ng-model="vm.ivrCampaign.dialOriginateCallerIdName"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.ORIGINATECALLERIDNAME"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="originateForm['dialOriginateCallerIdName'].$error"
+                  ng-show="originateForm['dialOriginateCallerIdName'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.ORIGINATECALLERIDNAME_REQUIRED"
+                      >OriginateCallerIdName field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.ORIGINATECALLERIDNUMBER"
+                  >OriginateCallerIdNumber</label
+                >
+                <input
+                  type="text"
+                  name="dialOriginateCallerIdNumber"
+                  ng-model="vm.ivrCampaign.dialOriginateCallerIdNumber"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.ORIGINATECALLERIDNUMBER"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="originateForm['dialOriginateCallerIdNumber'].$error"
+                  ng-show="originateForm['dialOriginateCallerIdNumber'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.ORIGINATECALLERIDNUMBER_REQUIRED"
+                      >OriginateCallerIdNumber field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.RANDOMLASTDIGITCALLERIDNUMBER"
+                  >RandomLastDigitCallerIdNumber</label
+                >
+                <input
+                  type="number"
+                  name="dialRandomLastDigitCallerIdNumber"
+                  ng-model="vm.ivrCampaign.dialRandomLastDigitCallerIdNumber"
+                  min="0"
+                  max="15"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.RANDOMLASTDIGITCALLERIDNUMBER"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="originateForm['dialRandomLastDigitCallerIdNumber'].$error"
+                  ng-show="originateForm['dialRandomLastDigitCallerIdNumber'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.RANDOMLASTDIGITCALLERIDNUMBER_REQUIRED"
+                      >RandomLastDigitCallerIdNumber field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.RANDOMLASTDIGITCALLERIDNUMBER_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >RandomLastDigitCallerIdNumber must be a valid greater or
+                      equal than</span
+                    >
+                    <span>0</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.RANDOMLASTDIGITCALLERIDNUMBER_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >RandomLastDigitCallerIdNumber must be a valid greater or
+                      equal than</span
+                    >
+                    <span>15</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.ORIGINATETIMEOUT"
+                  >OriginateTimeout</label
+                >
+                <input
+                  type="number"
+                  name="dialOriginateTimeout"
+                  ng-model="vm.ivrCampaign.dialOriginateTimeout"
+                  min="1"
+                  max="999"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.ORIGINATETIMEOUT"></span>
+                </div>
+                <div
+                  ng-messages="originateForm['dialOriginateTimeout'].$error"
+                  ng-show="originateForm['dialOriginateTimeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.ORIGINATETIMEOUT_REQUIRED"
+                      >OriginateTimeout field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.ORIGINATETIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >OriginateTimeout must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.ORIGINATETIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >OriginateTimeout must be a valid greater or equal
+                      than</span
+                    >
+                    <span>999</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.PREFIX">Prefix</label>
+                <input
+                  type="text"
+                  name="dialPrefix"
+                  ng-model="vm.ivrCampaign.dialPrefix"
+                  ng-pattern="/^\d+$/"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.PREFIX"></span>
+                </div>
+                <div
+                  ng-messages="originateForm['dialPrefix'].$error"
+                  ng-show="originateForm['dialPrefix'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.PREFIX_REQUIRED"
+                      >Prefix field is required</span
+                    >
+                  </div>
+                  <div ng-message="pattern">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.PREFIX_MUST_VALID_PATTERN"
+                      translate-values="{ regex: '/^\d+$/' }"
+                      >Prefix must be valid pattern
+                    </span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="MOTIONDIALER.RETRYANDFREQUENCY"
+            >RETRYANDFREQUENCY</span
+          >
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="ivrCampaign-detail-form-container global md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MOTIONDIALER.GLOBAL">
+                GLOBAL
+              </div>
+            </div>
+            <form name="globalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.GLOBALMAXRETRY"
+                  >GlobalMaxRetry</label
+                >
+                <input
+                  type="number"
+                  name="dialGlobalMaxRetry"
+                  ng-model="vm.ivrCampaign.dialGlobalMaxRetry"
+                  min="1"
+                  max="999"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.GLOBALMAXRETRY"></span>
+                </div>
+                <div
+                  ng-messages="globalForm['dialGlobalMaxRetry'].$error"
+                  ng-show="globalForm['dialGlobalMaxRetry'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.GLOBALMAXRETRY_REQUIRED"
+                      >GlobalMaxRetry field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.GLOBALMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >GlobalMaxRetry must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.GLOBALMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >GlobalMaxRetry must be a valid greater or equal
+                      than</span
+                    >
+                    <span>999</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="ivrCampaign-detail-form-container congestion md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div
+                class="h2 secondary-text"
+                translate="MOTIONDIALER.CONGESTION"
+              >
+                CONGESTION
+              </div>
+            </div>
+            <form name="congestionForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.CONGESTIONMAXRETRY"
+                  >CongestionMaxRetry</label
+                >
+                <input
+                  type="number"
+                  name="dialCongestionMaxRetry"
+                  ng-model="vm.ivrCampaign.dialCongestionMaxRetry"
+                  min="1"
+                  max="999"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.CONGESTIONMAXRETRY"></span>
+                </div>
+                <div
+                  ng-messages="congestionForm['dialCongestionMaxRetry'].$error"
+                  ng-show="congestionForm['dialCongestionMaxRetry'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.CONGESTIONMAXRETRY_REQUIRED"
+                      >CongestionMaxRetry field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.CONGESTIONMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >CongestionMaxRetry must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.CONGESTIONMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >CongestionMaxRetry must be a valid greater or equal
+                      than</span
+                    >
+                    <span>999</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.CONGESTIONRETRYTIME"
+                  >CongestionRetryTime</label
+                >
+                <input
+                  type="number"
+                  name="dialCongestionRetryFrequency"
+                  ng-model="vm.ivrCampaign.dialCongestionRetryFrequency"
+                  min="1"
+                  max="99999"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.CONGESTIONRETRYTIME"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="congestionForm['dialCongestionRetryFrequency'].$error"
+                  ng-show="congestionForm['dialCongestionRetryFrequency'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.CONGESTIONRETRYTIME_REQUIRED"
+                      >CongestionRetryTime field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.CONGESTIONRETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >CongestionRetryTime must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.CONGESTIONRETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >CongestionRetryTime must be a valid greater or equal
+                      than</span
+                    >
+                    <span>99999</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="ivrCampaign-detail-form-container busy md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MOTIONDIALER.BUSY">
+                BUSY
+              </div>
+            </div>
+            <form name="busyForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.BUSYMAXRETRY"
+                  >BusyMaxRetry</label
+                >
+                <input
+                  type="number"
+                  name="dialBusyMaxRetry"
+                  ng-model="vm.ivrCampaign.dialBusyMaxRetry"
+                  min="1"
+                  max="999"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.BUSYMAXRETRY"></span>
+                </div>
+                <div
+                  ng-messages="busyForm['dialBusyMaxRetry'].$error"
+                  ng-show="busyForm['dialBusyMaxRetry'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.BUSYMAXRETRY_REQUIRED"
+                      >BusyMaxRetry field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.BUSYMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >BusyMaxRetry must be a valid greater or equal than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.BUSYMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >BusyMaxRetry must be a valid greater or equal than</span
+                    >
+                    <span>999</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.BUSYRETRYTIME"
+                  >BusyRetryTime</label
+                >
+                <input
+                  type="number"
+                  name="dialBusyRetryFrequency"
+                  ng-model="vm.ivrCampaign.dialBusyRetryFrequency"
+                  min="1"
+                  max="99999"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.BUSYRETRYTIME"></span>
+                </div>
+                <div
+                  ng-messages="busyForm['dialBusyRetryFrequency'].$error"
+                  ng-show="busyForm['dialBusyRetryFrequency'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.BUSYRETRYTIME_REQUIRED"
+                      >BusyRetryTime field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.BUSYRETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >BusyRetryTime must be a valid greater or equal than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.BUSYRETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >BusyRetryTime must be a valid greater or equal than</span
+                    >
+                    <span>99999</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="ivrCampaign-detail-form-container noanswer md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MOTIONDIALER.NOANSWER">
+                NOANSWER
+              </div>
+            </div>
+            <form name="noanswerForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.NOANSWERMAXRETRY"
+                  >NoAnswerMaxRetry</label
+                >
+                <input
+                  type="number"
+                  name="dialNoAnswerMaxRetry"
+                  ng-model="vm.ivrCampaign.dialNoAnswerMaxRetry"
+                  min="1"
+                  max="999"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.NOANSWERMAXRETRY"></span>
+                </div>
+                <div
+                  ng-messages="noanswerForm['dialNoAnswerMaxRetry'].$error"
+                  ng-show="noanswerForm['dialNoAnswerMaxRetry'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.NOANSWERMAXRETRY_REQUIRED"
+                      >NoAnswerMaxRetry field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.NOANSWERMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >NoAnswerMaxRetry must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.NOANSWERMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >NoAnswerMaxRetry must be a valid greater or equal
+                      than</span
+                    >
+                    <span>999</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.NOANSWERRETRYTIME"
+                  >NoAnswerRetryTime</label
+                >
+                <input
+                  type="number"
+                  name="dialNoAnswerRetryFrequency"
+                  ng-model="vm.ivrCampaign.dialNoAnswerRetryFrequency"
+                  min="1"
+                  max="99999"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.NOANSWERRETRYTIME"></span>
+                </div>
+                <div
+                  ng-messages="noanswerForm['dialNoAnswerRetryFrequency'].$error"
+                  ng-show="noanswerForm['dialNoAnswerRetryFrequency'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.NOANSWERRETRYTIME_REQUIRED"
+                      >NoAnswerRetryTime field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.NOANSWERRETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >NoAnswerRetryTime must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.NOANSWERRETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >NoAnswerRetryTime must be a valid greater or equal
+                      than</span
+                    >
+                    <span>99999</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="ivrCampaign-detail-form-container nosuchnumber md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div
+                class="h2 secondary-text"
+                translate="MOTIONDIALER.NOSUCHNUMBER"
+              >
+                NOSUCHNUMBER
+              </div>
+            </div>
+            <form name="nosuchnumberForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.NOSUCHNUMBERMAXRETRY"
+                  >NoSuchNumberMaxRetry</label
+                >
+                <input
+                  type="number"
+                  name="dialNoSuchNumberMaxRetry"
+                  ng-model="vm.ivrCampaign.dialNoSuchNumberMaxRetry"
+                  min="1"
+                  max="999"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.NOSUCHNUMBERMAXRETRY"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="nosuchnumberForm['dialNoSuchNumberMaxRetry'].$error"
+                  ng-show="nosuchnumberForm['dialNoSuchNumberMaxRetry'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.NOSUCHNUMBERMAXRETRY_REQUIRED"
+                      >NoSuchNumberMaxRetry field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.NOSUCHNUMBERMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >NoSuchNumberMaxRetry must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.NOSUCHNUMBERMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >NoSuchNumberMaxRetry must be a valid greater or equal
+                      than</span
+                    >
+                    <span>999</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.NOSUCHNUMBERRETRYTIME"
+                  >NoSuchNumberRetryTime</label
+                >
+                <input
+                  type="number"
+                  name="dialNoSuchNumberRetryFrequency"
+                  ng-model="vm.ivrCampaign.dialNoSuchNumberRetryFrequency"
+                  min="1"
+                  max="99999"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.NOSUCHNUMBERRETRYTIME"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="nosuchnumberForm['dialNoSuchNumberRetryFrequency'].$error"
+                  ng-show="nosuchnumberForm['dialNoSuchNumberRetryFrequency'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.NOSUCHNUMBERRETRYTIME_REQUIRED"
+                      >NoSuchNumberRetryTime field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.NOSUCHNUMBERRETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >NoSuchNumberRetryTime must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.NOSUCHNUMBERRETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >NoSuchNumberRetryTime must be a valid greater or equal
+                      than</span
+                    >
+                    <span>99999</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="ivrCampaign-detail-form-container drop md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MOTIONDIALER.DROP">
+                DROP
+              </div>
+            </div>
+            <form name="dropForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.DROPMAXRETRY"
+                  >DropMaxRetry</label
+                >
+                <input
+                  type="number"
+                  name="dialDropMaxRetry"
+                  ng-model="vm.ivrCampaign.dialDropMaxRetry"
+                  min="1"
+                  max="999"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.DROPMAXRETRY"></span>
+                </div>
+                <div
+                  ng-messages="dropForm['dialDropMaxRetry'].$error"
+                  ng-show="dropForm['dialDropMaxRetry'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.DROPMAXRETRY_REQUIRED"
+                      >DropMaxRetry field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.DROPMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >DropMaxRetry must be a valid greater or equal than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.DROPMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >DropMaxRetry must be a valid greater or equal than</span
+                    >
+                    <span>999</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.DROPRETRYTIME"
+                  >DropRetryTime</label
+                >
+                <input
+                  type="number"
+                  name="dialDropRetryFrequency"
+                  ng-model="vm.ivrCampaign.dialDropRetryFrequency"
+                  min="1"
+                  max="99999"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.DROPRETRYTIME"></span>
+                </div>
+                <div
+                  ng-messages="dropForm['dialDropRetryFrequency'].$error"
+                  ng-show="dropForm['dialDropRetryFrequency'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.DROPRETRYTIME_REQUIRED"
+                      >DropRetryTime field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.DROPRETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >DropRetryTime must be a valid greater or equal than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.DROPRETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >DropRetryTime must be a valid greater or equal than</span
+                    >
+                    <span>99999</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="ivrCampaign-detail-form-container abandoned md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MOTIONDIALER.ABANDONED">
+                ABANDONED
+              </div>
+            </div>
+            <form name="abandonedForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.ABANDONEDMAXRETRY"
+                  >AbandonedMaxRetry</label
+                >
+                <input
+                  type="number"
+                  name="dialAbandonedMaxRetry"
+                  ng-model="vm.ivrCampaign.dialAbandonedMaxRetry"
+                  min="1"
+                  max="999"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.ABANDONEDMAXRETRY"></span>
+                </div>
+                <div
+                  ng-messages="abandonedForm['dialAbandonedMaxRetry'].$error"
+                  ng-show="abandonedForm['dialAbandonedMaxRetry'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.ABANDONEDMAXRETRY_REQUIRED"
+                      >AbandonedMaxRetry field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.ABANDONEDMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AbandonedMaxRetry must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.ABANDONEDMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >AbandonedMaxRetry must be a valid greater or equal
+                      than</span
+                    >
+                    <span>999</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.ABANDONEDRETRYTIME"
+                  >AbandonedRetryTime</label
+                >
+                <input
+                  type="number"
+                  name="dialAbandonedRetryFrequency"
+                  ng-model="vm.ivrCampaign.dialAbandonedRetryFrequency"
+                  min="1"
+                  max="99999"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.ABANDONEDRETRYTIME"></span>
+                </div>
+                <div
+                  ng-messages="abandonedForm['dialAbandonedRetryFrequency'].$error"
+                  ng-show="abandonedForm['dialAbandonedRetryFrequency'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.ABANDONEDRETRYTIME_REQUIRED"
+                      >AbandonedRetryTime field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.ABANDONEDRETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AbandonedRetryTime must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.ABANDONEDRETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >AbandonedRetryTime must be a valid greater or equal
+                      than</span
+                    >
+                    <span>99999</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="ivrCampaign-detail-form-container machine md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MOTIONDIALER.MACHINE">
+                MACHINE
+              </div>
+            </div>
+            <form name="machineForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.MACHINEMAXRETRY"
+                  >MachineMaxRetry</label
+                >
+                <input
+                  type="number"
+                  name="dialMachineMaxRetry"
+                  ng-model="vm.ivrCampaign.dialMachineMaxRetry"
+                  min="1"
+                  max="999"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.MACHINEMAXRETRY"></span>
+                </div>
+                <div
+                  ng-messages="machineForm['dialMachineMaxRetry'].$error"
+                  ng-show="machineForm['dialMachineMaxRetry'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.MACHINEMAXRETRY_REQUIRED"
+                      >MachineMaxRetry field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.MACHINEMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >MachineMaxRetry must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.MACHINEMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >MachineMaxRetry must be a valid greater or equal
+                      than</span
+                    >
+                    <span>999</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.MACHINERETRYTIME"
+                  >MachineRetryTime</label
+                >
+                <input
+                  type="number"
+                  name="dialMachineRetryFrequency"
+                  ng-model="vm.ivrCampaign.dialMachineRetryFrequency"
+                  min="1"
+                  max="99999"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.MACHINERETRYTIME"></span>
+                </div>
+                <div
+                  ng-messages="machineForm['dialMachineRetryFrequency'].$error"
+                  ng-show="machineForm['dialMachineRetryFrequency'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.MACHINERETRYTIME_REQUIRED"
+                      >MachineRetryTime field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.MACHINERETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >MachineRetryTime must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.MACHINERETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >MachineRetryTime must be a valid greater or equal
+                      than</span
+                    >
+                    <span>99999</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="ivrCampaign-detail-form-container agentreject md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div
+                class="h2 secondary-text"
+                translate="MOTIONDIALER.AGENTREJECT"
+              >
+                AGENTREJECT
+              </div>
+            </div>
+            <form name="agentrejectForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.AGENTREJECTMAXRETRY"
+                  >AgentRejectMaxRetry</label
+                >
+                <input
+                  type="number"
+                  name="dialAgentRejectMaxRetry"
+                  ng-model="vm.ivrCampaign.dialAgentRejectMaxRetry"
+                  min="1"
+                  max="999"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.AGENTREJECTMAXRETRY"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="agentrejectForm['dialAgentRejectMaxRetry'].$error"
+                  ng-show="agentrejectForm['dialAgentRejectMaxRetry'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AGENTREJECTMAXRETRY_REQUIRED"
+                      >AgentRejectMaxRetry field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AGENTREJECTMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AgentRejectMaxRetry must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AGENTREJECTMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >AgentRejectMaxRetry must be a valid greater or equal
+                      than</span
+                    >
+                    <span>999</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.AGENTREJECTRETRYTIME"
+                  >AgentRejectRetryTime</label
+                >
+                <input
+                  type="number"
+                  name="dialAgentRejectRetryFrequency"
+                  ng-model="vm.ivrCampaign.dialAgentRejectRetryFrequency"
+                  min="1"
+                  max="99999"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.AGENTREJECTRETRYTIME"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="agentrejectForm['dialAgentRejectRetryFrequency'].$error"
+                  ng-show="agentrejectForm['dialAgentRejectRetryFrequency'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AGENTREJECTRETRYTIME_REQUIRED"
+                      >AgentRejectRetryTime field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AGENTREJECTRETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AgentRejectRetryTime must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AGENTREJECTRETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >AgentRejectRetryTime must be a valid greater or equal
+                      than</span
+                    >
+                    <span>99999</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="MOTIONDIALER.ADVANCED">ADVANCED</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="ivrCampaign-detail-form-container advanced md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MOTIONDIALER.ADVANCED">
+                ADVANCED
+              </div>
+            </div>
+            <form name="advancedForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.DIALORDERBYSCHEDULEDAT"
+                  >DialOrderByScheduledAt</label
+                >
+                <md-select
+                  name="dialOrderByScheduledAt"
+                  ng-model="vm.ivrCampaign.dialOrderByScheduledAt"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'DESC'">
+                    {{ 'MOTIONDIALER.DESC' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'ASC'">
+                    {{ 'MOTIONDIALER.ASC' | translate }}
+                  </md-option>
+                </md-select>
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.DIALORDERBYSCHEDULEDAT"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['dialOrderByScheduledAt'].$error"
+                  ng-show="advancedForm['dialOrderByScheduledAt'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.DIALORDERBYSCHEDULEDAT_REQUIRED"
+                      >DialOrderByScheduledAt field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="ivrCampaign-detail-form-container globalinterval md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div
+                class="h2 secondary-text"
+                translate="MOTIONDIALER.GLOBALINTERVAL"
+              >
+                GLOBALINTERVAL
+              </div>
+            </div>
+            <form name="globalintervalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.GLOBALINTERVAL"
+                  >GlobalInterval</label
+                >
+                <input
+                  type="text"
+                  name="dialGlobalInterval"
+                  ng-model="vm.ivrCampaign.dialGlobalInterval"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.GLOBALINTERVAL"></span>
+                </div>
+                <div
+                  ng-messages="globalintervalForm['dialGlobalInterval'].$error"
+                  ng-show="globalintervalForm['dialGlobalInterval'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.GLOBALINTERVAL_REQUIRED"
+                      >GlobalInterval field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="ivrCampaign-detail-form-container timezone md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MOTIONDIALER.TIMEZONE">
+                TIMEZONE
+              </div>
+            </div>
+            <form name="timezoneForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.TIMEZONE">Timezone</label>
+                <ms-timezone
+                  name="dialTimezone"
+                  ng-model="vm.ivrCampaign.dialTimezone"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                ></ms-timezone>
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.TIMEZONE"></span>
+                </div>
+                <div
+                  ng-messages="timezoneForm['dialTimezone'].$error"
+                  ng-show="timezoneForm[dialTimezone].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.TIMEZONE_REQUIRED"
+                      >Timezone field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="ivrCampaign-detail-form-container amd md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MOTIONDIALER.AMD">
+                AMD
+              </div>
+            </div>
+            <form name="amdForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.ivrCampaign.dialAMDActive"
+                  aria-label="AMDActive"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="MOTIONDIALER.AMDACTIVE"
+                    >AMDActive</span
+                  ></md-switch
+                >
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.AMDACTIVE"></span>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.ivrCampaign.dialAMDActive"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.AMDINITIALSILENCE"
+                  >AMDInitialSilence</label
+                >
+                <input
+                  type="number"
+                  name="dialAMDInitialSilence"
+                  ng-model="vm.ivrCampaign.dialAMDInitialSilence"
+                  min="0"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.AMDINITIALSILENCE"></span>
+                </div>
+                <div
+                  ng-messages="amdForm['dialAMDInitialSilence'].$error"
+                  ng-show="amdForm['dialAMDInitialSilence'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDINITIALSILENCE_REQUIRED"
+                      >AMDInitialSilence field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDINITIALSILENCE_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AMDInitialSilence must be a valid greater or equal
+                      than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.ivrCampaign.dialAMDActive"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.AMDGREETING">AMDGreeting</label>
+                <input
+                  type="number"
+                  name="dialAMDGreeting"
+                  ng-model="vm.ivrCampaign.dialAMDGreeting"
+                  min="0"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.AMDGREETING"></span>
+                </div>
+                <div
+                  ng-messages="amdForm['dialAMDGreeting'].$error"
+                  ng-show="amdForm['dialAMDGreeting'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.AMDGREETING_REQUIRED"
+                      >AMDGreeting field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDGREETING_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AMDGreeting must be a valid greater or equal than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.ivrCampaign.dialAMDActive"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.AMDAFTERGREETINGSILENCE"
+                  >AMDAfterGreetingSilence</label
+                >
+                <input
+                  type="number"
+                  name="dialAMDAfterGreetingSilence"
+                  ng-model="vm.ivrCampaign.dialAMDAfterGreetingSilence"
+                  min="0"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.AMDAFTERGREETINGSILENCE"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="amdForm['dialAMDAfterGreetingSilence'].$error"
+                  ng-show="amdForm['dialAMDAfterGreetingSilence'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDAFTERGREETINGSILENCE_REQUIRED"
+                      >AMDAfterGreetingSilence field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDAFTERGREETINGSILENCE_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AMDAfterGreetingSilence must be a valid greater or equal
+                      than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.ivrCampaign.dialAMDActive"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.AMDTOTALANALYSISTIME"
+                  >AMDTotalAnalysisTime</label
+                >
+                <input
+                  type="number"
+                  name="dialAMDTotalAnalysisTime"
+                  ng-model="vm.ivrCampaign.dialAMDTotalAnalysisTime"
+                  min="0"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.AMDTOTALANALYSISTIME"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="amdForm['dialAMDTotalAnalysisTime'].$error"
+                  ng-show="amdForm['dialAMDTotalAnalysisTime'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDTOTALANALYSISTIME_REQUIRED"
+                      >AMDTotalAnalysisTime field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDTOTALANALYSISTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AMDTotalAnalysisTime must be a valid greater or equal
+                      than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.ivrCampaign.dialAMDActive"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.AMDMINWORDLENGTH"
+                  >AMDMinWordLength</label
+                >
+                <input
+                  type="number"
+                  name="dialAMDMinWordLength"
+                  ng-model="vm.ivrCampaign.dialAMDMinWordLength"
+                  min="0"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.AMDMINWORDLENGTH"></span>
+                </div>
+                <div
+                  ng-messages="amdForm['dialAMDMinWordLength'].$error"
+                  ng-show="amdForm['dialAMDMinWordLength'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDMINWORDLENGTH_REQUIRED"
+                      >AMDMinWordLength field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDMINWORDLENGTH_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AMDMinWordLength must be a valid greater or equal
+                      than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.ivrCampaign.dialAMDActive"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.AMDBETWEENWORDSSILENCE"
+                  >AMDBetweenWordsSilence</label
+                >
+                <input
+                  type="number"
+                  name="dialAMDBetweenWordsSilence"
+                  ng-model="vm.ivrCampaign.dialAMDBetweenWordsSilence"
+                  min="0"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.AMDBETWEENWORDSSILENCE"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="amdForm['dialAMDBetweenWordsSilence'].$error"
+                  ng-show="amdForm['dialAMDBetweenWordsSilence'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDBETWEENWORDSSILENCE_REQUIRED"
+                      >AMDBetweenWordsSilence field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDBETWEENWORDSSILENCE_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AMDBetweenWordsSilence must be a valid greater or equal
+                      than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.ivrCampaign.dialAMDActive"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.AMDMAXIMUMNUMBEROFWORDS"
+                  >AMDMaximumNumberOfWords</label
+                >
+                <input
+                  type="number"
+                  name="dialAMDMaximumNumberOfWords"
+                  ng-model="vm.ivrCampaign.dialAMDMaximumNumberOfWords"
+                  min="0"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.AMDMAXIMUMNUMBEROFWORDS"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="amdForm['dialAMDMaximumNumberOfWords'].$error"
+                  ng-show="amdForm['dialAMDMaximumNumberOfWords'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDMAXIMUMNUMBEROFWORDS_REQUIRED"
+                      >AMDMaximumNumberOfWords field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDMAXIMUMNUMBEROFWORDS_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AMDMaximumNumberOfWords must be a valid greater or equal
+                      than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.ivrCampaign.dialAMDActive"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.AMDSILENCETHRESHOLD"
+                  >AMDSilenceThreshold</label
+                >
+                <input
+                  type="number"
+                  name="dialAMDSilenceThreshold"
+                  ng-model="vm.ivrCampaign.dialAMDSilenceThreshold"
+                  min="0"
+                  max="32767"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.AMDSILENCETHRESHOLD"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="amdForm['dialAMDSilenceThreshold'].$error"
+                  ng-show="amdForm['dialAMDSilenceThreshold'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDSILENCETHRESHOLD_REQUIRED"
+                      >AMDSilenceThreshold field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDSILENCETHRESHOLD_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AMDSilenceThreshold must be a valid greater or equal
+                      than</span
+                    >
+                    <span>0</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDSILENCETHRESHOLD_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >AMDSilenceThreshold must be a valid greater or equal
+                      than</span
+                    >
+                    <span>32767</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.ivrCampaign.dialAMDActive"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.AMDMAXIMUMWORDLENGTH"
+                  >AMDMaximumWordLength</label
+                >
+                <input
+                  type="number"
+                  name="dialAMDMaximumWordLength"
+                  ng-model="vm.ivrCampaign.dialAMDMaximumWordLength"
+                  min="0"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.AMDMAXIMUMWORDLENGTH"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="amdForm['dialAMDMaximumWordLength'].$error"
+                  ng-show="amdForm['dialAMDMaximumWordLength'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDMAXIMUMWORDLENGTH_REQUIRED"
+                      >AMDMaximumWordLength field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDMAXIMUMWORDLENGTH_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AMDMaximumWordLength must be a valid greater or equal
+                      than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="MOTIONDIALER.HOPPERS">HOPPERS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="ivrCampaign-detail-form-container hopperstatistics md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="IvrCampaignHopperStatisticsController as vm_hs"
+              ng-init="vm_hs.init(vm.ivrCampaign)"
+            >
+              <md-toolbar class="md-table-toolbar md-default">
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead" translate="MOTIONDIALER.HOPPERWIDGET"
+                    >Hoppers</span
+                  >
+                  <div flex></div>
+                  <md-button
+                    class="md-icon-button"
+                    ng-click="vm_hs.init(vm.ivrCampaign)"
+                    aria-label="refresh Hopper"
+                    translate
+                    translate-attr-label="MOTIONDIALER.REFRESH_HOPPERS"
+                  >
+                    <md-icon md-font-icon="icon-refresh"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <!-- WIDGET GROUP -->
+              <div class="widget-group" layout="row" flex="100" layout-wrap>
+                <!-- WIDGET 1 -->
+                <ms-widget
+                  class="h-140"
+                  layout="column"
+                  flex="100"
+                  flex-gt-xs="50"
+                  flex-gt-md="25"
+                >
+                  <!-- Front -->
+                  <ms-widget-front class="p-16 white-bg" layout="row" flex>
+                    <div
+                      class="pt-8 pb-8"
+                      layout="column"
+                      layout-align="center center"
+                      flex
+                    >
+                      <div class="md-display-1 pb-8">
+                        {{(vm_hs.total || 0) + (vm_hs.closed || 0)}}
+                      </div>
+                      <div class="font-weight-500 secondary-text">
+                        {{ 'MOTIONDIALER.TOTAL' | translate }}
+                      </div>
+                    </div>
+                  </ms-widget-front>
+                  <!-- / Front -->
+                </ms-widget>
+                <!-- / WIDGET 1 -->
+
+                <!-- WIDGET 2 -->
+                <ms-widget
+                  class="h-140"
+                  layout="column"
+                  flex="100"
+                  flex-gt-xs="50"
+                  flex-gt-md="25"
+                >
+                  <!-- Front -->
+                  <ms-widget-front class="p-16 white-bg" layout="row" flex>
+                    <div
+                      class="pt-8 pb-8"
+                      layout="column"
+                      layout-align="center center"
+                      flex
+                    >
+                      <div class="md-display-1 pb-8">
+                        {{vm_hs.fresh || 0}} ({{vm_hs.total ? ((((vm_hs.fresh ||
+                        0) * 100)/((vm_hs.closed || 0) + (vm_hs.total || 0))) |
+                        number: 2) : 0}}%)
+                      </div>
+                      <div class="font-weight-500 secondary-text">
+                        {{ 'MOTIONDIALER.FRESH' | translate }}
+                      </div>
+                    </div>
+                  </ms-widget-front>
+                  <!-- / Front -->
+                </ms-widget>
+                <!-- / WIDGET 2 -->
+
+                <!-- WIDGET 3 -->
+                <ms-widget
+                  class="h-140"
+                  layout="column"
+                  flex="100"
+                  flex-gt-xs="50"
+                  flex-gt-md="25"
+                >
+                  <!-- Front -->
+                  <ms-widget-front class="p-16 white-bg" layout="row" flex>
+                    <div
+                      class="pt-8 pb-8"
+                      layout="column"
+                      layout-align="center center"
+                      flex
+                    >
+                      <div class="md-display-1 pb-8">
+                        {{vm_hs.total ? (vm_hs.total - (vm_hs.fresh || 0)) : 0}}
+                        ({{vm_hs.total ? ((((vm_hs.total - (vm_hs.fresh || 0)) *
+                        100)/((vm_hs.closed || 0) + (vm_hs.total || 0))) |
+                        number: 2) : 0}}%)
+                      </div>
+                      <div class="font-weight-500 secondary-text">
+                        {{ 'MOTIONDIALER.OPEN' | translate }}
+                      </div>
+                    </div>
+                  </ms-widget-front>
+                  <!-- / Front -->
+                </ms-widget>
+                <!-- / WIDGET 3 -->
+
+                <!-- WIDGET 3 -->
+                <ms-widget
+                  class="h-140"
+                  layout="column"
+                  flex="100"
+                  flex-gt-xs="50"
+                  flex-gt-md="25"
+                >
+                  <!-- Front -->
+                  <ms-widget-front class="p-16 white-bg" layout="row" flex>
+                    <div
+                      class="pt-8 pb-8"
+                      layout="column"
+                      layout-align="center center"
+                      flex
+                    >
+                      <div class="md-display-1 pb-8">
+                        {{vm_hs.closed ? (vm_hs.closed || 0) : 0}}
+                        ({{vm_hs.closed ? ((((vm_hs.closed) * 100)/(vm_hs.closed
+                        + (vm_hs.total || 0))) | number: 2) : 0}}%)
+                      </div>
+                      <div class="font-weight-500 secondary-text">
+                        {{ 'MOTIONDIALER.CLOSED' | translate }}
+                      </div>
+                    </div>
+                  </ms-widget-front>
+                  <!-- / Front -->
+                </ms-widget>
+                <!-- / WIDGET 3 -->
+              </div>
+              <!-- / WIDGET GROUP -->
+            </div>
+          </div>
+          <div
+            class="ivrCampaign-detail-form-container hoppers md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="IvrCampaignHoppersController as vm_dc"
+              ng-init="vm_dc.init(vm.ivrCampaign, vm.crudPermissions)"
+            >
+              <md-toolbar
+                class="md-table-toolbar md-default"
+                ng-hide="vm_dc.selectedIvrCampaignHoppers.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead" translate="MOTIONDIALER.HOPPERS"
+                    >Hoppers</span
+                  >
+                  <ms-search-bar
+                    on-search="vm_dc.query.filter = query"
+                    on-collapse="vm_dc.query.filter = undefined"
+                    debounce="300"
+                    direction="down"
+                  ></ms-search-bar>
+                  <div flex></div>
+                  <md-button
+                    class="md-icon-button"
+                    ng-click="vm_dc.getIvrCampaignHoppers()"
+                    aria-label="refresh Hoppers"
+                    translate
+                    translate-attr-label="MOTIONDIALER.REFRESH_HOPPERS"
+                  >
+                    <md-icon md-font-icon="icon-refresh"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-toolbar
+                class="md-table-toolbar md-accent"
+                ng-show="vm_dc.selectedIvrCampaignHoppers.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead"
+                    >{{vm_dc.selectedIvrCampaignHoppers.length}}
+                    {{vm_dc.selectedIvrCampaignHoppers.length > 1 ? 'items' :
+                    'item'}} selected</span
+                  >
+                  <div flex></div>
+                  <button
+                    class="md-icon-button"
+                    ng-csv="vm_dc.exportSelectedIvrCampaignHoppers"
+                    csv-label="true"
+                    filename="ivrCampaigns.csv"
+                  >
+                    <md-icon md-font-icon="icon-file-excel"></md-icon>
+                  </button>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canDelete"
+                    class="md-icon-button"
+                    ng-click="vm_dc.deleteSelectedIvrCampaignHoppers($event)"
+                    aria-label="delete selected"
+                    translate
+                    translate-attr-label="MOTIONDIALER.DELETE_SELECTED"
+                  >
+                    <md-icon md-font-icon="icon-delete"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-table-container class="font-size-12">
+                <table
+                  md-table
+                  md-row-select
+                  multiple
+                  ng-model="vm_dc.selectedIvrCampaignHoppers"
+                  md-progress="vm_dc.promise"
+                >
+                  <thead
+                    md-head
+                    md-order="vm_dc.query.sort"
+                    md-on-reorder="vm_dc.getIvrCampaignHoppers"
+                  >
+                    <tr md-row>
+                      <th md-column md-order-by="ContactId">
+                        {{ 'MOTIONDIALER.CONTACTID' | translate }}
+                      </th>
+                      <th md-column md-order-by="phone">
+                        {{ 'MOTIONDIALER.PHONE' | translate }}
+                      </th>
+                      <th md-column md-order-by="countcongestionretry">
+                        {{ 'MOTIONDIALER.CONGESTION' | translate }}
+                      </th>
+                      <th md-column md-order-by="countbusyretry">
+                        {{ 'MOTIONDIALER.BUSY' | translate }}
+                      </th>
+                      <th md-column md-order-by="countnoanswerretry">
+                        {{ 'MOTIONDIALER.NOANSWER' | translate }}
+                      </th>
+                      <th md-column md-order-by="countnosuchnumberretry">
+                        {{ 'MOTIONDIALER.NOSUCHNUMBER' | translate }}
+                      </th>
+                      <th md-column md-order-by="countdropretry">
+                        {{ 'MOTIONDIALER.DROP' | translate }}
+                      </th>
+                      <th md-column md-order-by="countabandonedretry">
+                        {{ 'MOTIONDIALER.ABANDONED' | translate }}
+                      </th>
+                      <th md-column md-order-by="countmachineretry">
+                        {{ 'MOTIONDIALER.MACHINE' | translate }}
+                      </th>
+                      <th md-column md-order-by="countagentrejectretry">
+                        {{ 'MOTIONDIALER.AGENTREJECT' | translate }}
+                      </th>
+                      <th md-column md-order-by="scheduledat">
+                        {{ 'MOTIONDIALER.SCHEDULEDAT' | translate }}
+                      </th>
+                      <th md-column md-order-by="priority">
+                        {{ 'MOTIONDIALER.PRIORITY' | translate }}
+                      </th>
+                      <th md-column width="10px"></th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr
+                      md-row
+                      md-select="hopper"
+                      md-select-id="id"
+                      ng-repeat="hopper in vm_dc.ivrCampaignHoppers.rows"
+                    >
+                      <td
+                        ng-click="vm_dc.createOrEditIvrCampaignHopper($event, hopper)"
+                        md-cell
+                      >
+                        {{hopper.ContactId}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditIvrCampaignHopper($event, hopper)"
+                        md-cell
+                      >
+                        {{hopper.phone}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditIvrCampaignHopper($event, hopper)"
+                        md-cell
+                      >
+                        {{hopper.countcongestionretry}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditIvrCampaignHopper($event, hopper)"
+                        md-cell
+                      >
+                        {{hopper.countbusyretry}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditIvrCampaignHopper($event, hopper)"
+                        md-cell
+                      >
+                        {{hopper.countnoanswerretry}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditIvrCampaignHopper($event, hopper)"
+                        md-cell
+                      >
+                        {{hopper.countnosuchnumberretry}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditIvrCampaignHopper($event, hopper)"
+                        md-cell
+                      >
+                        {{hopper.countdropretry}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditIvrCampaignHopper($event, hopper)"
+                        md-cell
+                      >
+                        {{hopper.countabandonedretry}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditIvrCampaignHopper($event, hopper)"
+                        md-cell
+                      >
+                        {{hopper.countmachineretry}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditIvrCampaignHopper($event, hopper)"
+                        md-cell
+                      >
+                        {{hopper.countagentrejectretry}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditIvrCampaignHopper($event, hopper)"
+                        md-cell
+                      >
+                        {{ hopper.scheduledat | formatdate }}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditIvrCampaignHopper($event, hopper)"
+                        md-cell
+                      >
+                        {{ vm_dc.arraypriority[hopper.priority].option }}
+                      </td>
+
+                      <td
+                        md-cell
+                        class="actions"
+                        ng-if="!vm_dc.crudPermissions.readOnly"
+                      >
+                        <md-menu>
+                          <md-button
+                            class="md-icon-button"
+                            aria-label="More"
+                            translate
+                            translate-attr-aria-label="MOTIONDIALER.MORE"
+                            ng-click="$mdOpenMenu($event)"
+                          >
+                            <md-icon
+                              md-font-icon="icon-dots-vertical"
+                            ></md-icon>
+                          </md-button>
+
+                          <md-menu-content width="3">
+                            <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
+                              <md-button
+                                ng-click="vm_dc.createOrEditIvrCampaignHopper($event, hopper)"
+                                translate="MOTIONDIALER.EDIT_HOPPER"
+                              >
+                                Edit Hopper
+                              </md-button>
+                            </md-menu-item>
+                            <md-menu-item
+                              ng-if="vm_dc.crudPermissions.canDelete"
+                            >
+                              <md-button
+                                ng-click="vm_dc.deleteConfirm(hopper, $event)"
+                                translate="MOTIONDIALER.DELETE_HOPPER"
+                              >
+                                Delete Hopper
+                              </md-button>
+                            </md-menu-item>
+                          </md-menu-content>
+                        </md-menu>
+                      </td>
+                    </tr>
+                    <tr md-row ng-if="!vm_dc.ivrCampaignHoppers.rows.length">
+                      <td md-cell colspan="15">
+                        <div layout="row" layout-align="center center">
+                          <span
+                            class="text-boxed-light"
+                            translate="MOTIONDIALER.NO_HOPPER_AVAILABLE"
+                            >No hopper available</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+              <md-table-pagination
+                md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
+                md-limit="vm_dc.query.limit"
+                md-limit-options="[10, 15, 20, 50, 100, 250]"
+                md-page="vm_dc.query.page"
+                md-total="{{vm_dc.ivrCampaignHoppers.count}}"
+                md-on-paginate="vm_dc.getIvrCampaignHoppers"
+                md-page-select
+              ></md-table-pagination>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="MOTIONDIALER.HISTORY">HISTORY</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="ivrCampaign-detail-form-container hopperhistories md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="IvrCampaignHopperHistoriesController as vm_dc"
+              ng-init="vm_dc.init(vm.ivrCampaign, vm.crudPermissions)"
+            >
+              <md-toolbar
+                class="md-table-toolbar md-default"
+                ng-hide="vm_dc.selectedIvrCampaignHopperHistories.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span
+                    class="md-subhead"
+                    translate="MOTIONDIALER.HOPPERHISTORIES"
+                    >HopperHistories</span
+                  >
+                  <ms-search-bar
+                    on-search="vm_dc.query.filter = query"
+                    on-collapse="vm_dc.query.filter = undefined"
+                    debounce="300"
+                    direction="down"
+                  ></ms-search-bar>
+                  <div flex></div>
+                  <md-button
+                    class="md-icon-button"
+                    ng-click="vm_dc.getIvrCampaignHopperHistories()"
+                    aria-label="refresh HopperHistories"
+                    translate
+                    translate-attr-label="MOTIONDIALER.REFRESH_HOPPERHISTORIES"
+                  >
+                    <md-icon md-font-icon="icon-refresh"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-toolbar
+                class="md-table-toolbar md-accent"
+                ng-show="vm_dc.selectedIvrCampaignHopperHistories.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead"
+                    >{{vm_dc.selectedIvrCampaignHopperHistories.length}}
+                    {{vm_dc.selectedIvrCampaignHopperHistories.length > 1 ?
+                    'items' : 'item'}} selected</span
+                  >
+                  <div flex></div>
+                  <button
+                    class="md-icon-button"
+                    ng-csv="vm_dc.exportSelectedIvrCampaignHopperHistories"
+                    csv-label="true"
+                    filename="ivrCampaigns.csv"
+                  >
+                    <md-icon md-font-icon="icon-file-excel"></md-icon>
+                  </button>
+                </div>
+              </md-toolbar>
+              <md-table-container class="font-size-12">
+                <table
+                  md-table
+                  md-row-select
+                  multiple
+                  ng-model="vm_dc.selectedIvrCampaignHopperHistories"
+                  md-progress="vm_dc.promise"
+                >
+                  <thead
+                    md-head
+                    md-order="vm_dc.query.sort"
+                    md-on-reorder="vm_dc.getIvrCampaignHopperHistories"
+                  >
+                    <tr md-row>
+                      <th md-column md-order-by="uniqueid">
+                        {{ 'MOTIONDIALER.UNIQUEID' | translate }}
+                      </th>
+                      <th md-column md-order-by="ContactId">
+                        {{ 'MOTIONDIALER.CONTACTID' | translate }}
+                      </th>
+                      <th md-column md-order-by="calleridnum">
+                        {{ 'MOTIONDIALER.PHONE' | translate }}
+                      </th>
+                      <th md-column md-order-by="calleridname">
+                        {{ 'MOTIONDIALER.NAME' | translate }}
+                      </th>
+                      <th md-column md-order-by="statedesc">
+                        {{ 'MOTIONDIALER.STATUS' | translate }}
+                      </th>
+                      <th md-column md-order-by="scheduledat">
+                        {{ 'MOTIONDIALER.SCHEDULEDAT' | translate }}
+                      </th>
+                      <th md-column md-order-by="starttime">
+                        {{ 'MOTIONDIALER.STARTTIME' | translate }}
+                      </th>
+                      <th md-column md-order-by="endtime">
+                        {{ 'MOTIONDIALER.ENDTIME' | translate }}
+                      </th>
+                      <th md-column width="10px"></th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr
+                      md-row
+                      md-select="hopperHistory"
+                      md-select-id="id"
+                      ng-repeat="hopperHistory in vm_dc.ivrCampaignHopperHistories.rows"
+                    >
+                      <td md-cell>{{hopperHistory.uniqueid}}</td>
+                      <td md-cell>{{hopperHistory.ContactId}}</td>
+                      <td md-cell>{{hopperHistory.calleridnum}}</td>
+                      <td md-cell>{{hopperHistory.calleridname}}</td>
+                      <td md-cell>{{hopperHistory.statedesc}}</td>
+                      <td md-cell>
+                        {{ hopperHistory.scheduledat | formatdate }}
+                      </td>
+                      <td md-cell>
+                        {{ hopperHistory.starttime | formatdate }}
+                      </td>
+                      <td md-cell>{{ hopperHistory.endtime | formatdate }}</td>
+                      <td md-cell class="actions"></td>
+                    </tr>
+                    <tr
+                      md-row
+                      ng-if="!vm_dc.ivrCampaignHopperHistories.rows.length"
+                    >
+                      <td md-cell colspan="11">
+                        <div layout="row" layout-align="center center">
+                          <span
+                            class="text-boxed-light"
+                            translate="MOTIONDIALER.NO_HOPPERHISTORY_AVAILABLE"
+                            >No hopperhistory available</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+              <md-table-pagination
+                md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
+                md-limit="vm_dc.query.limit"
+                md-limit-options="[10, 15, 20, 50, 100, 250]"
+                md-page="vm_dc.query.page"
+                md-total="{{vm_dc.ivrCampaignHopperHistories.count}}"
+                md-on-paginate="vm_dc.getIvrCampaignHopperHistories"
+                md-page-select
+              ></md-table-pagination>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="MOTIONDIALER.FINAL">FINAL</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="ivrCampaign-detail-form-container hopperfinals md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="IvrCampaignHopperFinalsController as vm_dc"
+              ng-init="vm_dc.init(vm.ivrCampaign, vm.crudPermissions)"
+            >
+              <md-toolbar
+                class="md-table-toolbar md-default"
+                ng-hide="vm_dc.selectedIvrCampaignHopperFinals.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead" translate="MOTIONDIALER.HOPPERFINALS"
+                    >HopperFinals</span
+                  >
+                  <ms-search-bar
+                    on-search="vm_dc.query.filter = query"
+                    on-collapse="vm_dc.query.filter = undefined"
+                    debounce="300"
+                    direction="down"
+                  ></ms-search-bar>
+                  <div flex></div>
+                  <md-button
+                    class="md-icon-button"
+                    ng-click="vm_dc.getIvrCampaignHopperFinals()"
+                    aria-label="refresh HopperFinals"
+                    translate
+                    translate-attr-label="MOTIONDIALER.REFRESH_HOPPERFINALS"
+                  >
+                    <md-icon md-font-icon="icon-refresh"></md-icon>
+                  </md-button>
+                  <td md-cell class="actions">
+                    <md-menu>
+                      <md-button
+                        class="md-icon-button"
+                        aria-label="More"
+                        translate
+                        translate-attr-aria-label="MOTIONDIALER.MORE"
+                        ng-click="vm_dc.countContactsIvrCampaignHopperFinal(vm_dc.query.id); $mdOpenMenu($event);"
+                      >
+                        <md-icon md-font-icon="icon-backup-restore"></md-icon>
+                        <md-tooltip
+                          ><span translate="MOTIONDIALER.RESTORECONTACTS"></span
+                        ></md-tooltip>
+                      </md-button>
+                      <md-menu-content width="3">
+                        <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
+                          <md-button
+                            ng-click="vm_dc.moveContactsIvrCampaignHopperFinal(3)"
+                          >
+                            <span translate="MOTIONDIALER.NOANSWER "
+                              >NoAnswer</span
+                            >
+                            <span class="badge"
+                              >({{vm_dc.contacts.noAnswerContacts}})</span
+                            >
+                          </md-button>
+                        </md-menu-item>
+                        <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
+                          <md-button
+                            ng-click="vm_dc.moveContactsIvrCampaignHopperFinal(5)"
+                          >
+                            <span translate="MOTIONDIALER.BUSY ">Busy</span>
+                            <span class="badge"
+                              >({{vm_dc.contacts.busyContacts}})</span
+                            >
+                          </md-button>
+                        </md-menu-item>
+                        <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
+                          <md-button
+                            ng-click="vm_dc.moveContactsIvrCampaignHopperFinal(8)"
+                          >
+                            <span translate="MOTIONDIALER.CONGESTION "
+                              >Congestion</span
+                            >
+                            <span class="badge"
+                              >({{vm_dc.contacts.congestionContacts}})</span
+                            >
+                          </md-button>
+                        </md-menu-item>
+                        <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
+                          <md-button
+                            ng-click="vm_dc.moveContactsIvrCampaignHopperFinal(10)"
+                          >
+                            <span translate="MOTIONDIALER.DROPPED ">Drop</span>
+                            <span class="badge"
+                              >({{vm_dc.contacts.dropContacts}})</span
+                            >
+                          </md-button>
+                        </md-menu-item>
+                        <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
+                          <md-button
+                            ng-click="vm_dc.moveContactsIvrCampaignHopperFinal(11)"
+                          >
+                            <span translate="MOTIONDIALER.ABANDONED "
+                              >Abandoned</span
+                            >
+                            <span class="badge"
+                              >({{vm_dc.contacts.abandonedContacts}})</span
+                            >
+                          </md-button>
+                        </md-menu-item>
+                        <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
+                          <md-button
+                            ng-click="vm_dc.moveContactsIvrCampaignHopperFinal(22)"
+                          >
+                            <span translate="MOTIONDIALER.RECALLFAILEDTIMEOUT"
+                              >Recall</span
+                            >
+                            <span class="badge"
+                              >({{vm_dc.contacts.reCallContacts}})</span
+                            >
+                          </md-button>
+                        </md-menu-item>
+                        <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
+                          <md-button
+                            ng-click="vm_dc.moveContactsIvrCampaignHopperFinal(0)"
+                          >
+                            <span translate="MOTIONDIALER.NO_SUCH_NUMBER"
+                              >NoSuchNumber</span
+                            >
+                            <span class="badge"
+                              >({{vm_dc.contacts.noSuchContacts}})</span
+                            >
+                          </md-button>
+                        </md-menu-item>
+                        <md-menu-item>
+                          <md-button
+                            ng-click="vm_dc.moveContactsIvrCampaignHopperFinal(19)"
+                          >
+                            <span translate="MOTIONDIALER.ANSWERING_MACHINE"
+                              >AnsweringMachine</span
+                            >
+                            <span class="badge"
+                              >({{vm_dc.contacts.answeringMachine}})</span
+                            >
+                          </md-button>
+                        </md-menu-item>
+                      </md-menu-content>
+                    </md-menu>
+                  </td>
+                </div>
+              </md-toolbar>
+              <md-toolbar
+                class="md-table-toolbar md-accent"
+                ng-show="vm_dc.selectedIvrCampaignHopperFinals.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead"
+                    >{{vm_dc.selectedIvrCampaignHopperFinals.length}}
+                    {{vm_dc.selectedIvrCampaignHopperFinals.length > 1 ? 'items'
+                    : 'item'}} selected</span
+                  >
+                  <div flex></div>
+                  <button
+                    class="md-icon-button"
+                    ng-csv="vm_dc.exportSelectedIvrCampaignHopperFinals"
+                    csv-label="true"
+                    filename="ivrCampaigns.csv"
+                  >
+                    <md-icon md-font-icon="icon-file-excel"></md-icon>
+                  </button>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canEdit"
+                    class="md-icon-button"
+                    ng-click="vm_dc.moveSelectedIvrCampaignHopperFinals($event)"
+                    aria-label="move selected"
+                    translate
+                    translate-attr-label="MOTIONDIALER.MOVE_SELECTED"
+                  >
+                    <md-icon md-font-icon="icon-restore"></md-icon>
+                    <md-tooltip
+                      ><span translate="MOTIONDIALER.RESTORECONTACTS"></span
+                    ></md-tooltip>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-table-container class="font-size-12">
+                <table
+                  md-table
+                  md-row-select
+                  multiple
+                  ng-model="vm_dc.selectedIvrCampaignHopperFinals"
+                  md-progress="vm_dc.promise"
+                >
+                  <thead
+                    md-head
+                    md-order="vm_dc.query.sort"
+                    md-on-reorder="vm_dc.getIvrCampaignHopperFinals"
+                  >
+                    <tr md-row>
+                      <th md-column md-order-by="uniqueid">
+                        {{ 'MOTIONDIALER.UNIQUEID' | translate }}
+                      </th>
+                      <th md-column md-order-by="ContactId">
+                        {{ 'MOTIONDIALER.CONTACTID' | translate }}
+                      </th>
+                      <th md-column md-order-by="calleridnum">
+                        {{ 'MOTIONDIALER.PHONE' | translate }}
+                      </th>
+                      <th md-column md-order-by="calleridname">
+                        {{ 'MOTIONDIALER.NAME' | translate }}
+                      </th>
+                      <th md-column md-order-by="statedesc">
+                        {{ 'MOTIONDIALER.STATUS' | translate }}
+                      </th>
+                      <th md-column md-order-by="countcongestionretry">
+                        {{ 'MOTIONDIALER.CONGESTION' | translate }}
+                      </th>
+                      <th md-column md-order-by="countbusyretry">
+                        {{ 'MOTIONDIALER.BUSY' | translate }}
+                      </th>
+                      <th md-column md-order-by="countnoanswerretry">
+                        {{ 'MOTIONDIALER.NOANSWER' | translate }}
+                      </th>
+                      <th md-column md-order-by="countnosuchnumberretry">
+                        {{ 'MOTIONDIALER.NOSUCHNUMBER' | translate }}
+                      </th>
+                      <th md-column md-order-by="countdropretry">
+                        {{ 'MOTIONDIALER.DROP' | translate }}
+                      </th>
+                      <th md-column md-order-by="countabandonedretry">
+                        {{ 'MOTIONDIALER.ABANDONED' | translate }}
+                      </th>
+                      <th md-column md-order-by="countmachineretry">
+                        {{ 'MOTIONDIALER.MACHINE' | translate }}
+                      </th>
+                      <th md-column md-order-by="countagentrejectretry">
+                        {{ 'MOTIONDIALER.AGENTREJECT' | translate }}
+                      </th>
+                      <th md-column md-order-by="starttime">
+                        {{ 'MOTIONDIALER.STARTTIME' | translate }}
+                      </th>
+                      <th md-column md-order-by="endtime">
+                        {{ 'MOTIONDIALER.ENDTIME' | translate }}
+                      </th>
+                      <th md-column md-order-by="disposition">
+                        {{ 'MOTIONDIALER.DISPOSITION' | translate }}
+                      </th>
+                      <th md-column width="10px"></th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr
+                      md-row
+                      md-select="hopperFinal"
+                      md-select-id="id"
+                      ng-repeat="hopperFinal in vm_dc.ivrCampaignHopperFinals.rows"
+                    >
+                      <td md-cell>{{hopperFinal.uniqueid}}</td>
+                      <td md-cell>{{hopperFinal.ContactId}}</td>
+                      <td md-cell>{{hopperFinal.calleridnum}}</td>
+                      <td md-cell>{{hopperFinal.calleridname}}</td>
+                      <td md-cell>{{hopperFinal.statedesc}}</td>
+                      <td md-cell>{{hopperFinal.countcongestionretry}}</td>
+                      <td md-cell>{{hopperFinal.countbusyretry}}</td>
+                      <td md-cell>{{hopperFinal.countnoanswerretry}}</td>
+                      <td md-cell>{{hopperFinal.countnosuchnumberretry}}</td>
+                      <td md-cell>{{hopperFinal.countdropretry}}</td>
+                      <td md-cell>{{hopperFinal.countabandonedretry}}</td>
+                      <td md-cell>{{hopperFinal.countmachineretry}}</td>
+                      <td md-cell>{{hopperFinal.countagentrejectretry}}</td>
+                      <td md-cell>{{ hopperFinal.starttime | formatdate }}</td>
+                      <td md-cell>{{ hopperFinal.endtime | formatdate }}</td>
+                      <td md-cell>{{hopperFinal.disposition}}</td>
+                      <td
+                        md-cell
+                        class="actions"
+                        ng-if="!vm_dc.crudPermissions.readOnly"
+                      >
+                        <md-menu>
+                          <md-button
+                            class="md-icon-button"
+                            aria-label="More"
+                            translate
+                            translate-attr-aria-label="MOTIONDIALER.MORE"
+                            ng-click="$mdOpenMenu($event)"
+                          >
+                            <md-icon
+                              md-font-icon="icon-dots-vertical"
+                            ></md-icon>
+                          </md-button>
+
+                          <md-menu-content width="3">
+                            <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
+                              <md-button
+                                ng-click="vm_dc.moveConfirm(hopperFinal, $event)"
+                                translate="MOTIONDIALER.MOVE_HOPPERFINAL"
+                              >
+                                Move HopperFinal
+                              </md-button>
+                            </md-menu-item>
+                          </md-menu-content>
+                        </md-menu>
+                      </td>
+                    </tr>
+                    <tr
+                      md-row
+                      ng-if="!vm_dc.ivrCampaignHopperFinals.rows.length"
+                    >
+                      <td md-cell colspan="28">
+                        <div layout="row" layout-align="center center">
+                          <span
+                            class="text-boxed-light"
+                            translate="MOTIONDIALER.NO_HOPPERFINAL_AVAILABLE"
+                            >No hopperfinal available</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+              <md-table-pagination
+                md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
+                md-limit="vm_dc.query.limit"
+                md-limit-options="[10, 15, 20, 50, 100, 250]"
+                md-page="vm_dc.query.page"
+                md-total="{{vm_dc.ivrCampaignHopperFinals.count}}"
+                md-on-paginate="vm_dc.getIvrCampaignHopperFinals"
+                md-page-select
+              ></md-table-pagination>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="MOTIONDIALER.BLACKLIST">BLACKLIST</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="ivrCampaign-detail-form-container hopperblacks md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="IvrCampaignHopperBlacksController as vm_dc"
+              ng-init="vm_dc.init(vm.ivrCampaign, vm.crudPermissions)"
+            >
+              <md-toolbar
+                class="md-table-toolbar md-default"
+                ng-hide="vm_dc.selectedIvrCampaignHopperBlacks.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead" translate="MOTIONDIALER.HOPPERBLACKS"
+                    >HopperBlacks</span
+                  >
+                  <ms-search-bar
+                    on-search="vm_dc.query.filter = query"
+                    on-collapse="vm_dc.query.filter = undefined"
+                    debounce="300"
+                    direction="down"
+                  ></ms-search-bar>
+                  <div flex></div>
+                </div>
+              </md-toolbar>
+              <md-toolbar
+                class="md-table-toolbar md-accent"
+                ng-show="vm_dc.selectedIvrCampaignHopperBlacks.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead"
+                    >{{vm_dc.selectedIvrCampaignHopperBlacks.length}}
+                    {{vm_dc.selectedIvrCampaignHopperBlacks.length > 1 ? 'items'
+                    : 'item'}} selected</span
+                  >
+                  <div flex></div>
+                  <button
+                    class="md-icon-button"
+                    ng-csv="vm_dc.exportSelectedIvrCampaignHopperBlacks"
+                    csv-label="true"
+                    filename="ivrCampaigns.csv"
+                  >
+                    <md-icon md-font-icon="icon-file-excel"></md-icon>
+                  </button>
+                </div>
+              </md-toolbar>
+              <md-table-container class="font-size-12">
+                <table
+                  md-table
+                  md-row-select
+                  multiple
+                  ng-model="vm_dc.selectedIvrCampaignHopperBlacks"
+                  md-progress="vm_dc.promise"
+                >
+                  <thead
+                    md-head
+                    md-order="vm_dc.query.sort"
+                    md-on-reorder="vm_dc.getIvrCampaignHopperBlacks"
+                  >
+                    <tr md-row>
+                      <th md-column md-order-by="ContactId">
+                        {{ 'MOTIONDIALER.CONTACTID' | translate }}
+                      </th>
+                      <th md-column md-order-by="phone">
+                        {{ 'MOTIONDIALER.PHONE' | translate }}
+                      </th>
+                      <th md-column width="10px"></th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr
+                      md-row
+                      md-select="hopperBlack"
+                      md-select-id="id"
+                      ng-repeat="hopperBlack in vm_dc.ivrCampaignHopperBlacks.rows"
+                    >
+                      <td md-cell>{{hopperBlack.ContactId}}</td>
+                      <td md-cell>{{hopperBlack.phone}}</td>
+                      <td md-cell class="actions"></td>
+                    </tr>
+                    <tr
+                      md-row
+                      ng-if="!vm_dc.ivrCampaignHopperBlacks.rows.length"
+                    >
+                      <td md-cell colspan="4">
+                        <div layout="row" layout-align="center center">
+                          <span
+                            class="text-boxed-light"
+                            translate="MOTIONDIALER.NO_HOPPERBLACK_AVAILABLE"
+                            >No hopperblack available</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+              <md-table-pagination
+                md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
+                md-limit="vm_dc.query.limit"
+                md-limit-options="[10, 15, 20, 50, 100, 250]"
+                md-page="vm_dc.query.page"
+                md-total="{{vm_dc.ivrCampaignHopperBlacks.count}}"
+                md-on-paginate="vm_dc.getIvrCampaignHopperBlacks"
+                md-page-select
+              ></md-table-pagination>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/ivrCampaigns.html/ivrCampaigns-[chunkhash].html b/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/ivrCampaigns.html/ivrCampaigns-[chunkhash].html
deleted file mode 100644
index 4886e24..0000000
--- a/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/ivrCampaigns.html/ivrCampaigns-[chunkhash].html
+++ /dev/null
@@ -1,374 +0,0 @@
-<div
-  id="ivrCampaigns"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-fire" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="MOTIONDIALER.IVRCAMPAIGNS"
-          >IvrCampaigns</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="MOTIONDIALER.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedIvrCampaigns.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedIvrCampaigns =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="MOTIONDIALER.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-ivrCampaigns-count">
-          <span>{{vm.selectedIvrCampaigns.length}}</span>
-          <span translate="MOTIONDIALER.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="MOTIONDIALER.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllIvrCampaigns()"
-                translate="MOTIONDIALER.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectIvrCampaigns()"
-                translate="MOTIONDIALER.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedIvrCampaigns"
-          csv-label="true"
-          filename="ivrCampaigns.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedIvrCampaigns($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="MOTIONDIALER.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- IVRCAMPAIGN TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedIvrCampaigns"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getIvrCampaigns"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">
-                  {{ 'MOTIONDIALER.ID' | translate }}
-                </th>
-                <th md-column md-order-by="name">
-                  {{ 'MOTIONDIALER.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="active">
-                  {{ 'MOTIONDIALER.ACTIVE' | translate }}
-                </th>
-                <th md-column md-order-by="TrunkId">
-                  {{ 'MOTIONDIALER.TRUNK' | translate }}
-                </th>
-                <th md-column md-order-by="SquareProjectId">
-                  {{ 'MOTIONDIALER.CALLYSQUAREPROJECT' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.ivrCampaigns.rows.length">
-                <td md-cell colspan="6">
-                  <div layout="row" layout-align="center center">
-                    <span translate="MOTIONDIALER.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="ivrCampaign"
-                md-select-id="id"
-                ng-repeat="ivrCampaign in vm.ivrCampaigns.rows"
-              >
-                <td md-cell ng-if="ivrCampaign.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{ivrCampaign.name}}"
-                    ng-src="api/users/{{ivrCampaign.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!ivrCampaign.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{ivrCampaign.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(ivrCampaign, ev) : vm.createOrEditIvrCampaign($event, ivrCampaign)"
-                  md-cell
-                  class="id"
-                >
-                  {{ivrCampaign.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(ivrCampaign, ev) : vm.createOrEditIvrCampaign($event, ivrCampaign)"
-                  md-cell
-                  class="name"
-                >
-                  {{ivrCampaign.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(ivrCampaign, ev) : vm.createOrEditIvrCampaign($event, ivrCampaign)"
-                  md-cell
-                  class="active"
-                >
-                  <md-icon
-                    md-colors="{color: {{ivrCampaign.active ? '\'green\'' : '\'grey\''}}}"
-                    md-font-icon="{{ivrCampaign.active ? 'icon-check' : 'icon-close'}}"
-                  ></md-icon>
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(ivrCampaign, ev) : vm.createOrEditIvrCampaign($event, ivrCampaign)"
-                  md-cell
-                  class="TrunkId"
-                >
-                  {{ (vm.trunks | filter : {'id':ivrCampaign.TrunkId} :
-                  true)[0].name }}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(ivrCampaign, ev) : vm.createOrEditIvrCampaign($event, ivrCampaign)"
-                  md-cell
-                  class="SquareProjectId"
-                >
-                  {{ (vm.projects | filter : {'id':ivrCampaign.SquareProjectId}
-                  : true)[0].name }}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="MOTIONDIALER.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(ivrCampaign, $event    )"
-                          translate="MOTIONDIALER.EDIT_IVRCAMPAIGN"
-                        >
-                          Edit IvrCampaign
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.clonedialog(ivrCampaign, $event    )"
-                          translate="MOTIONDIALER.CLONE_IVRCAMPAIGN"
-                        >
-                          clone IvrCampaign
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.listadddialog(ivrCampaign, $event    )"
-                          translate="MOTIONDIALER.LISTADD_IVRCAMPAIGN"
-                        >
-                          listadd IvrCampaign
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.blacklistadddialog(ivrCampaign, $event    )"
-                          translate="MOTIONDIALER.BLACKLISTADD_IVRCAMPAIGN"
-                        >
-                          blacklistadd IvrCampaign
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(ivrCampaign, $event    )"
-                          translate="MOTIONDIALER.DELETE_IVRCAMPAIGN"
-                        >
-                          Delete IvrCampaign
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.gotorealtimegoto(ivrCampaign, $event    )"
-                          translate="MOTIONDIALER.GOTOREALTIME_IVRCAMPAIGN"
-                        >
-                          goToRealtime IvrCampaign
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.ivrCampaigns.count}}"
-          md-on-paginate="vm.getIvrCampaigns"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / IVRCAMPAIGN TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD IVRCAMPAIGN BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-ivrCampaign-button"
-    ng-click="vm.createOrEditIvrCampaign($event)"
-    aria-label="add ivrCampaign"
-    translate
-    translate-attr-aria-label="MOTIONDIALER.ADD_IVRCAMPAIGN"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD IVRCAMPAIGN BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/ivrCampaigns.html/ivrCampaigns.html b/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/ivrCampaigns.html/ivrCampaigns.html
new file mode 100644
index 0000000..4886e24
--- /dev/null
+++ b/public/src/js/modules/main/apps/motiondialer/views/ivrCampaigns/ivrCampaigns.html/ivrCampaigns.html
@@ -0,0 +1,374 @@
+<div
+  id="ivrCampaigns"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-fire" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="MOTIONDIALER.IVRCAMPAIGNS"
+          >IvrCampaigns</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="MOTIONDIALER.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedIvrCampaigns.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedIvrCampaigns =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="MOTIONDIALER.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-ivrCampaigns-count">
+          <span>{{vm.selectedIvrCampaigns.length}}</span>
+          <span translate="MOTIONDIALER.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="MOTIONDIALER.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllIvrCampaigns()"
+                translate="MOTIONDIALER.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectIvrCampaigns()"
+                translate="MOTIONDIALER.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedIvrCampaigns"
+          csv-label="true"
+          filename="ivrCampaigns.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedIvrCampaigns($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="MOTIONDIALER.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- IVRCAMPAIGN TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedIvrCampaigns"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getIvrCampaigns"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">
+                  {{ 'MOTIONDIALER.ID' | translate }}
+                </th>
+                <th md-column md-order-by="name">
+                  {{ 'MOTIONDIALER.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="active">
+                  {{ 'MOTIONDIALER.ACTIVE' | translate }}
+                </th>
+                <th md-column md-order-by="TrunkId">
+                  {{ 'MOTIONDIALER.TRUNK' | translate }}
+                </th>
+                <th md-column md-order-by="SquareProjectId">
+                  {{ 'MOTIONDIALER.CALLYSQUAREPROJECT' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.ivrCampaigns.rows.length">
+                <td md-cell colspan="6">
+                  <div layout="row" layout-align="center center">
+                    <span translate="MOTIONDIALER.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="ivrCampaign"
+                md-select-id="id"
+                ng-repeat="ivrCampaign in vm.ivrCampaigns.rows"
+              >
+                <td md-cell ng-if="ivrCampaign.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{ivrCampaign.name}}"
+                    ng-src="api/users/{{ivrCampaign.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!ivrCampaign.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{ivrCampaign.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(ivrCampaign, ev) : vm.createOrEditIvrCampaign($event, ivrCampaign)"
+                  md-cell
+                  class="id"
+                >
+                  {{ivrCampaign.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(ivrCampaign, ev) : vm.createOrEditIvrCampaign($event, ivrCampaign)"
+                  md-cell
+                  class="name"
+                >
+                  {{ivrCampaign.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(ivrCampaign, ev) : vm.createOrEditIvrCampaign($event, ivrCampaign)"
+                  md-cell
+                  class="active"
+                >
+                  <md-icon
+                    md-colors="{color: {{ivrCampaign.active ? '\'green\'' : '\'grey\''}}}"
+                    md-font-icon="{{ivrCampaign.active ? 'icon-check' : 'icon-close'}}"
+                  ></md-icon>
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(ivrCampaign, ev) : vm.createOrEditIvrCampaign($event, ivrCampaign)"
+                  md-cell
+                  class="TrunkId"
+                >
+                  {{ (vm.trunks | filter : {'id':ivrCampaign.TrunkId} :
+                  true)[0].name }}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(ivrCampaign, ev) : vm.createOrEditIvrCampaign($event, ivrCampaign)"
+                  md-cell
+                  class="SquareProjectId"
+                >
+                  {{ (vm.projects | filter : {'id':ivrCampaign.SquareProjectId}
+                  : true)[0].name }}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="MOTIONDIALER.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(ivrCampaign, $event    )"
+                          translate="MOTIONDIALER.EDIT_IVRCAMPAIGN"
+                        >
+                          Edit IvrCampaign
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.clonedialog(ivrCampaign, $event    )"
+                          translate="MOTIONDIALER.CLONE_IVRCAMPAIGN"
+                        >
+                          clone IvrCampaign
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.listadddialog(ivrCampaign, $event    )"
+                          translate="MOTIONDIALER.LISTADD_IVRCAMPAIGN"
+                        >
+                          listadd IvrCampaign
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.blacklistadddialog(ivrCampaign, $event    )"
+                          translate="MOTIONDIALER.BLACKLISTADD_IVRCAMPAIGN"
+                        >
+                          blacklistadd IvrCampaign
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(ivrCampaign, $event    )"
+                          translate="MOTIONDIALER.DELETE_IVRCAMPAIGN"
+                        >
+                          Delete IvrCampaign
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.gotorealtimegoto(ivrCampaign, $event    )"
+                          translate="MOTIONDIALER.GOTOREALTIME_IVRCAMPAIGN"
+                        >
+                          goToRealtime IvrCampaign
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.ivrCampaigns.count}}"
+          md-on-paginate="vm.getIvrCampaigns"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / IVRCAMPAIGN TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD IVRCAMPAIGN BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-ivrCampaign-button"
+    ng-click="vm.createOrEditIvrCampaign($event)"
+    aria-label="add ivrCampaign"
+    translate
+    translate-attr-aria-label="MOTIONDIALER.ADD_IVRCAMPAIGN"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD IVRCAMPAIGN BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index a118ac4..0000000
--- a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,494 +0,0 @@
-<md-dialog class="queueCampaign-dialog" aria-label="New QueueCampaign">
-  <form name="queueCampaignForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="MOTIONDIALER.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.queueCampaign.name"
-          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.newQueueCampaign"
-        />
-
-        <div class="hint"><span translate="MOTIONDIALER.HELP.NAME"></span></div>
-        <div
-          ng-messages="queueCampaignForm['name'].$error"
-          ng-show="queueCampaignForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MOTIONDIALER.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span
-              translate="MOTIONDIALER.ERRORS.NAME_MUST_VALID_PATTERN"
-              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-              >Name must be valid pattern
-            </span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <md-switch ng-model="vm.queueCampaign.dialActive" aria-label="Active"
-          ><span translate="MOTIONDIALER.ACTIVE">Active</span></md-switch
-        >
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="MOTIONDIALER.TRUNK">Trunk</label>
-        <md-select name="TrunkId" ng-model="vm.queueCampaign.TrunkId" required>
-          <md-option
-            ng-value="TrunkId.id"
-            ng-repeat="TrunkId in vm.trunks"
-            ng-disabled="TrunkId.canSelect === false"
-            >{{ TrunkId.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="queueCampaignForm['TrunkId'].$error"
-          ng-show="queueCampaignForm['TrunkId'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MOTIONDIALER.ERRORS.TRUNK_REQUIRED"
-              >Trunk field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.queueCampaign.dialMethod != 'preview'"
-        class="md-block"
-      >
-        <label translate="MOTIONDIALER.INTERVAL">Interval</label>
-        <md-select
-          name="IntervalId"
-          ng-model="vm.queueCampaign.IntervalId"
-          required
-        >
-          <md-option
-            ng-value="IntervalId.id"
-            ng-repeat="IntervalId in vm.interval"
-            ng-disabled="IntervalId.canSelect === false"
-            >{{ IntervalId.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="queueCampaignForm['IntervalId'].$error"
-          ng-show="queueCampaignForm['IntervalId'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MOTIONDIALER.ERRORS.INTERVAL_REQUIRED"
-              >Interval field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="MOTIONDIALER.CHECKDUPLICATE">CheckDuplicate</label>
-        <md-select
-          name="dialCheckDuplicateType"
-          ng-model="vm.queueCampaign.dialCheckDuplicateType"
-          required
-        >
-          <md-option ng-value="'always'">
-            {{ 'MOTIONDIALER.ALWAYS' | translate }}
-          </md-option>
-
-          <md-option ng-value="'never'">
-            {{ 'MOTIONDIALER.NEVER' | translate }}
-          </md-option>
-
-          <md-option ng-value="'onlyIfOpen'">
-            {{ 'MOTIONDIALER.ONLY_IF_OPEN' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="queueCampaignForm['dialCheckDuplicateType'].$error"
-          ng-show="queueCampaignForm['dialCheckDuplicateType'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MOTIONDIALER.ERRORS.CHECKDUPLICATE_REQUIRED"
-              >CheckDuplicate field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="MOTIONDIALER.METHOD">Method</label>
-        <md-select
-          name="dialMethod"
-          ng-model="vm.queueCampaign.dialMethod"
-          required
-        >
-          <md-option ng-value="'progressive'">Progressive</md-option>
-          <md-option ng-value="'power'">PowerDialing</md-option>
-          <md-option ng-value="'predictive'">Predictive</md-option>
-          <md-option ng-value="'preview'">Preview</md-option>
-          <md-option ng-value="'booked'">BookedProgressive</md-option>
-        </md-select>
-        <div class="hint">
-          <span translate="MOTIONDIALER.HELP.METHOD"></span>
-        </div>
-        <div
-          ng-messages="queueCampaignForm['dialMethod'].$error"
-          ng-show="queueCampaignForm['dialMethod'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MOTIONDIALER.ERRORS.METHOD_REQUIRED"
-              >Method field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.queueCampaign.dialMethod == 'power'"
-        class="md-block"
-      >
-        <span translate="MOTIONDIALER.POWERLEVEL">PowerLevel</span>
-        <div class="hint">
-          <span translate="MOTIONDIALER.HELP.POWERLEVEL"></span>
-        </div>
-        <md-slider
-          md-discrete
-          flex
-          ng-model="vm.queueCampaign.dialPowerLevel"
-          min="1"
-          max="10"
-          step="0.1"
-          class="md-accent"
-        ></md-slider>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.queueCampaign.dialMethod == 'predictive'"
-        class="md-block"
-      >
-        <label translate="MOTIONDIALER.PREDICTIVEOPTIMIZATION"
-          >PredictiveOptimization</label
-        >
-        <md-select
-          name="dialPredictiveOptimization"
-          ng-model="vm.queueCampaign.dialPredictiveOptimization"
-        >
-          <md-option ng-value="'agentBusyFactor'">
-            {{ 'MOTIONDIALER.AGENTBUSYFACTOR' | translate }}
-          </md-option>
-
-          <md-option ng-value="'dropRate'">
-            {{ 'MOTIONDIALER.DROPRATE' | translate }}
-          </md-option>
-        </md-select>
-        <div class="hint">
-          <span translate="MOTIONDIALER.HELP.PREDICTIVEOPTIMIZATION"></span>
-        </div>
-        <div
-          ng-messages="queueCampaignForm['dialPredictiveOptimization'].$error"
-          ng-show="queueCampaignForm['dialPredictiveOptimization'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span
-              translate="MOTIONDIALER.ERRORS.PREDICTIVEOPTIMIZATION_REQUIRED"
-              >PredictiveOptimization field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.queueCampaign.dialMethod == 'predictive'"
-        class="md-block"
-      >
-        <span translate="MOTIONDIALER.PREDICTIVEOPTIMIZATIONPERCENTAGE"
-          >PredictiveOptimizationPercentage</span
-        >
-        <div class="hint">
-          <span
-            translate="MOTIONDIALER.HELP.PREDICTIVEOPTIMIZATIONPERCENTAGE"
-          ></span>
-        </div>
-        <md-slider
-          md-discrete
-          flex
-          ng-model="vm.queueCampaign.dialPredictiveOptimizationPercentage"
-          min="1"
-          max="95"
-          step="0.1"
-          class="md-accent"
-        ></md-slider>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.queueCampaign.dialMethod == 'predictive'"
-        class="md-block"
-      >
-        <span translate="MOTIONDIALER.PREDICTIVEINTERVAL"
-          >PredictiveInterval</span
-        >
-        <div class="hint">
-          <span translate="MOTIONDIALER.HELP.PREDICTIVEINTERVAL"></span>
-        </div>
-        <md-slider
-          md-discrete
-          flex
-          ng-model="vm.queueCampaign.dialPredictiveInterval"
-          min="5"
-          max="30"
-          step="1"
-          class="md-accent"
-        ></md-slider>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.queueCampaign.dialMethod != 'preview'"
-        class="md-block"
-      >
-        <label translate="MOTIONDIALER.MAXCONCURRENTCALLS"
-          >MaxConcurrentCalls</label
-        >
-        <input
-          type="number"
-          name="dialLimitQueue"
-          ng-model="vm.queueCampaign.dialLimitQueue"
-          min="0"
-          max="9999"
-          ng-required="true"
-        />
-
-        <div class="hint">
-          <span translate="MOTIONDIALER.HELP.MAXCONCURRENTCALLS"></span>
-        </div>
-        <div
-          ng-messages="queueCampaignForm['dialLimitQueue'].$error"
-          ng-show="queueCampaignForm['dialLimitQueue'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MOTIONDIALER.ERRORS.MAXCONCURRENTCALLS_REQUIRED"
-              >MaxConcurrentCalls field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="MOTIONDIALER.ERRORS.MAXCONCURRENTCALLS_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >MaxConcurrentCalls must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-          <div ng-message="max">
-            <span
-              translate="MOTIONDIALER.ERRORS.MAXCONCURRENTCALLS_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-              >MaxConcurrentCalls must be a valid greater or equal than</span
-            >
-            <span>9999</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.queueCampaign.dialMethod === 'progressive' || vm.queueCampaign.dialMethod === 'predictive' || vm.queueCampaign.dialMethod === 'power'"
-        class="md-block"
-      >
-        <label translate="MOTIONDIALER.QUEUETIMEOUT">QueueTimeout</label>
-        <input
-          type="number"
-          name="dialQueueTimeout"
-          ng-model="vm.queueCampaign.dialQueueTimeout"
-          min="1"
-          max="999"
-          ng-required="true"
-        />
-
-        <div class="hint">
-          <span translate="MOTIONDIALER.HELP.QUEUETIMEOUT"></span>
-        </div>
-        <div
-          ng-messages="queueCampaignForm['dialQueueTimeout'].$error"
-          ng-show="queueCampaignForm['dialQueueTimeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MOTIONDIALER.ERRORS.QUEUETIMEOUT_REQUIRED"
-              >QueueTimeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="MOTIONDIALER.ERRORS.QUEUETIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >QueueTimeout must be a valid greater or equal than</span
-            >
-            <span>1</span>
-          </div>
-          <div ng-message="max">
-            <span
-              translate="MOTIONDIALER.ERRORS.QUEUETIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-              >QueueTimeout must be a valid greater or equal than</span
-            >
-            <span>999</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="MOTIONDIALER.AGENTTIMEOUT">AgentTimeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.queueCampaign.timeout"
-          min="0"
-          ng-required="true"
-        />
-
-        <div class="hint">
-          <span translate="MOTIONDIALER.HELP.AGENTTIMEOUT"></span>
-        </div>
-        <div
-          ng-messages="queueCampaignForm['timeout'].$error"
-          ng-show="queueCampaignForm['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MOTIONDIALER.ERRORS.AGENTTIMEOUT_REQUIRED"
-              >AgentTimeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="MOTIONDIALER.ERRORS.AGENTTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >AgentTimeout must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="MOTIONDIALER.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.queueCampaign.description"
-        />
-
-        <div
-          ng-messages="queueCampaignForm['description'].$error"
-          ng-show="queueCampaignForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MOTIONDIALER.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newQueueCampaign"
-          ng-click="vm.saveQueueCampaign()"
-          class="send-button md-accent md-raised"
-          ng-disabled="queueCampaignForm.$invalid || queueCampaignForm.$pristine"
-          aria-label="SAVE"
-          translate="MOTIONDIALER.SAVE"
-          translate-attr-aria-label="MOTIONDIALER.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newQueueCampaign"
-          ng-click="vm.addNewQueueCampaign()"
-          class="send-button md-accent md-raised"
-          ng-disabled="queueCampaignForm.$invalid"
-          aria-label="ADD"
-          translate="MOTIONDIALER.ADD_QUEUECAMPAIGN"
-          translate-attr-aria-label="MOTIONDIALER.ADD_QUEUECAMPAIGN"
-        >
-          ADD QUEUECAMPAIGN
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newQueueCampaign"
-          ng-click="vm.deleteQueueCampaign($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="MOTIONDIALER.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="MOTIONDIALER.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/create/dialog.html/dialog.html
new file mode 100644
index 0000000..a118ac4
--- /dev/null
+++ b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/create/dialog.html/dialog.html
@@ -0,0 +1,494 @@
+<md-dialog class="queueCampaign-dialog" aria-label="New QueueCampaign">
+  <form name="queueCampaignForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="MOTIONDIALER.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.queueCampaign.name"
+          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.newQueueCampaign"
+        />
+
+        <div class="hint"><span translate="MOTIONDIALER.HELP.NAME"></span></div>
+        <div
+          ng-messages="queueCampaignForm['name'].$error"
+          ng-show="queueCampaignForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MOTIONDIALER.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span
+              translate="MOTIONDIALER.ERRORS.NAME_MUST_VALID_PATTERN"
+              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+              >Name must be valid pattern
+            </span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <md-switch ng-model="vm.queueCampaign.dialActive" aria-label="Active"
+          ><span translate="MOTIONDIALER.ACTIVE">Active</span></md-switch
+        >
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="MOTIONDIALER.TRUNK">Trunk</label>
+        <md-select name="TrunkId" ng-model="vm.queueCampaign.TrunkId" required>
+          <md-option
+            ng-value="TrunkId.id"
+            ng-repeat="TrunkId in vm.trunks"
+            ng-disabled="TrunkId.canSelect === false"
+            >{{ TrunkId.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="queueCampaignForm['TrunkId'].$error"
+          ng-show="queueCampaignForm['TrunkId'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MOTIONDIALER.ERRORS.TRUNK_REQUIRED"
+              >Trunk field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.queueCampaign.dialMethod != 'preview'"
+        class="md-block"
+      >
+        <label translate="MOTIONDIALER.INTERVAL">Interval</label>
+        <md-select
+          name="IntervalId"
+          ng-model="vm.queueCampaign.IntervalId"
+          required
+        >
+          <md-option
+            ng-value="IntervalId.id"
+            ng-repeat="IntervalId in vm.interval"
+            ng-disabled="IntervalId.canSelect === false"
+            >{{ IntervalId.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="queueCampaignForm['IntervalId'].$error"
+          ng-show="queueCampaignForm['IntervalId'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MOTIONDIALER.ERRORS.INTERVAL_REQUIRED"
+              >Interval field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="MOTIONDIALER.CHECKDUPLICATE">CheckDuplicate</label>
+        <md-select
+          name="dialCheckDuplicateType"
+          ng-model="vm.queueCampaign.dialCheckDuplicateType"
+          required
+        >
+          <md-option ng-value="'always'">
+            {{ 'MOTIONDIALER.ALWAYS' | translate }}
+          </md-option>
+
+          <md-option ng-value="'never'">
+            {{ 'MOTIONDIALER.NEVER' | translate }}
+          </md-option>
+
+          <md-option ng-value="'onlyIfOpen'">
+            {{ 'MOTIONDIALER.ONLY_IF_OPEN' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="queueCampaignForm['dialCheckDuplicateType'].$error"
+          ng-show="queueCampaignForm['dialCheckDuplicateType'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MOTIONDIALER.ERRORS.CHECKDUPLICATE_REQUIRED"
+              >CheckDuplicate field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="MOTIONDIALER.METHOD">Method</label>
+        <md-select
+          name="dialMethod"
+          ng-model="vm.queueCampaign.dialMethod"
+          required
+        >
+          <md-option ng-value="'progressive'">Progressive</md-option>
+          <md-option ng-value="'power'">PowerDialing</md-option>
+          <md-option ng-value="'predictive'">Predictive</md-option>
+          <md-option ng-value="'preview'">Preview</md-option>
+          <md-option ng-value="'booked'">BookedProgressive</md-option>
+        </md-select>
+        <div class="hint">
+          <span translate="MOTIONDIALER.HELP.METHOD"></span>
+        </div>
+        <div
+          ng-messages="queueCampaignForm['dialMethod'].$error"
+          ng-show="queueCampaignForm['dialMethod'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MOTIONDIALER.ERRORS.METHOD_REQUIRED"
+              >Method field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.queueCampaign.dialMethod == 'power'"
+        class="md-block"
+      >
+        <span translate="MOTIONDIALER.POWERLEVEL">PowerLevel</span>
+        <div class="hint">
+          <span translate="MOTIONDIALER.HELP.POWERLEVEL"></span>
+        </div>
+        <md-slider
+          md-discrete
+          flex
+          ng-model="vm.queueCampaign.dialPowerLevel"
+          min="1"
+          max="10"
+          step="0.1"
+          class="md-accent"
+        ></md-slider>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.queueCampaign.dialMethod == 'predictive'"
+        class="md-block"
+      >
+        <label translate="MOTIONDIALER.PREDICTIVEOPTIMIZATION"
+          >PredictiveOptimization</label
+        >
+        <md-select
+          name="dialPredictiveOptimization"
+          ng-model="vm.queueCampaign.dialPredictiveOptimization"
+        >
+          <md-option ng-value="'agentBusyFactor'">
+            {{ 'MOTIONDIALER.AGENTBUSYFACTOR' | translate }}
+          </md-option>
+
+          <md-option ng-value="'dropRate'">
+            {{ 'MOTIONDIALER.DROPRATE' | translate }}
+          </md-option>
+        </md-select>
+        <div class="hint">
+          <span translate="MOTIONDIALER.HELP.PREDICTIVEOPTIMIZATION"></span>
+        </div>
+        <div
+          ng-messages="queueCampaignForm['dialPredictiveOptimization'].$error"
+          ng-show="queueCampaignForm['dialPredictiveOptimization'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span
+              translate="MOTIONDIALER.ERRORS.PREDICTIVEOPTIMIZATION_REQUIRED"
+              >PredictiveOptimization field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.queueCampaign.dialMethod == 'predictive'"
+        class="md-block"
+      >
+        <span translate="MOTIONDIALER.PREDICTIVEOPTIMIZATIONPERCENTAGE"
+          >PredictiveOptimizationPercentage</span
+        >
+        <div class="hint">
+          <span
+            translate="MOTIONDIALER.HELP.PREDICTIVEOPTIMIZATIONPERCENTAGE"
+          ></span>
+        </div>
+        <md-slider
+          md-discrete
+          flex
+          ng-model="vm.queueCampaign.dialPredictiveOptimizationPercentage"
+          min="1"
+          max="95"
+          step="0.1"
+          class="md-accent"
+        ></md-slider>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.queueCampaign.dialMethod == 'predictive'"
+        class="md-block"
+      >
+        <span translate="MOTIONDIALER.PREDICTIVEINTERVAL"
+          >PredictiveInterval</span
+        >
+        <div class="hint">
+          <span translate="MOTIONDIALER.HELP.PREDICTIVEINTERVAL"></span>
+        </div>
+        <md-slider
+          md-discrete
+          flex
+          ng-model="vm.queueCampaign.dialPredictiveInterval"
+          min="5"
+          max="30"
+          step="1"
+          class="md-accent"
+        ></md-slider>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.queueCampaign.dialMethod != 'preview'"
+        class="md-block"
+      >
+        <label translate="MOTIONDIALER.MAXCONCURRENTCALLS"
+          >MaxConcurrentCalls</label
+        >
+        <input
+          type="number"
+          name="dialLimitQueue"
+          ng-model="vm.queueCampaign.dialLimitQueue"
+          min="0"
+          max="9999"
+          ng-required="true"
+        />
+
+        <div class="hint">
+          <span translate="MOTIONDIALER.HELP.MAXCONCURRENTCALLS"></span>
+        </div>
+        <div
+          ng-messages="queueCampaignForm['dialLimitQueue'].$error"
+          ng-show="queueCampaignForm['dialLimitQueue'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MOTIONDIALER.ERRORS.MAXCONCURRENTCALLS_REQUIRED"
+              >MaxConcurrentCalls field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="MOTIONDIALER.ERRORS.MAXCONCURRENTCALLS_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >MaxConcurrentCalls must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+          <div ng-message="max">
+            <span
+              translate="MOTIONDIALER.ERRORS.MAXCONCURRENTCALLS_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+              >MaxConcurrentCalls must be a valid greater or equal than</span
+            >
+            <span>9999</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.queueCampaign.dialMethod === 'progressive' || vm.queueCampaign.dialMethod === 'predictive' || vm.queueCampaign.dialMethod === 'power'"
+        class="md-block"
+      >
+        <label translate="MOTIONDIALER.QUEUETIMEOUT">QueueTimeout</label>
+        <input
+          type="number"
+          name="dialQueueTimeout"
+          ng-model="vm.queueCampaign.dialQueueTimeout"
+          min="1"
+          max="999"
+          ng-required="true"
+        />
+
+        <div class="hint">
+          <span translate="MOTIONDIALER.HELP.QUEUETIMEOUT"></span>
+        </div>
+        <div
+          ng-messages="queueCampaignForm['dialQueueTimeout'].$error"
+          ng-show="queueCampaignForm['dialQueueTimeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MOTIONDIALER.ERRORS.QUEUETIMEOUT_REQUIRED"
+              >QueueTimeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="MOTIONDIALER.ERRORS.QUEUETIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >QueueTimeout must be a valid greater or equal than</span
+            >
+            <span>1</span>
+          </div>
+          <div ng-message="max">
+            <span
+              translate="MOTIONDIALER.ERRORS.QUEUETIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+              >QueueTimeout must be a valid greater or equal than</span
+            >
+            <span>999</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="MOTIONDIALER.AGENTTIMEOUT">AgentTimeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.queueCampaign.timeout"
+          min="0"
+          ng-required="true"
+        />
+
+        <div class="hint">
+          <span translate="MOTIONDIALER.HELP.AGENTTIMEOUT"></span>
+        </div>
+        <div
+          ng-messages="queueCampaignForm['timeout'].$error"
+          ng-show="queueCampaignForm['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MOTIONDIALER.ERRORS.AGENTTIMEOUT_REQUIRED"
+              >AgentTimeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="MOTIONDIALER.ERRORS.AGENTTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >AgentTimeout must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="MOTIONDIALER.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.queueCampaign.description"
+        />
+
+        <div
+          ng-messages="queueCampaignForm['description'].$error"
+          ng-show="queueCampaignForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MOTIONDIALER.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newQueueCampaign"
+          ng-click="vm.saveQueueCampaign()"
+          class="send-button md-accent md-raised"
+          ng-disabled="queueCampaignForm.$invalid || queueCampaignForm.$pristine"
+          aria-label="SAVE"
+          translate="MOTIONDIALER.SAVE"
+          translate-attr-aria-label="MOTIONDIALER.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newQueueCampaign"
+          ng-click="vm.addNewQueueCampaign()"
+          class="send-button md-accent md-raised"
+          ng-disabled="queueCampaignForm.$invalid"
+          aria-label="ADD"
+          translate="MOTIONDIALER.ADD_QUEUECAMPAIGN"
+          translate-attr-aria-label="MOTIONDIALER.ADD_QUEUECAMPAIGN"
+        >
+          ADD QUEUECAMPAIGN
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newQueueCampaign"
+          ng-click="vm.deleteQueueCampaign($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="MOTIONDIALER.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="MOTIONDIALER.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/agentadd/agentadd.html/agentadd-[chunkhash].html b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
deleted file mode 100644
index 98d6865..0000000
--- a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
+++ /dev/null
@@ -1,72 +0,0 @@
-<md-dialog
-  class="queueCampaign-dialog"
-  aria-label="queueCampaign"
-  ng-init="vm.onInit()"
->
-  <form name="queueCampaignForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="MOTIONDIALER.AGENTADD_QUEUECAMPAIGN">
-          Add Agent to queueCampaign
-        </h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <md-input-container flex class="no-margin">
-        <label translate="MOTIONDIALER.PENALTY">Penalty</label>
-        <input
-          name="penalty"
-          ng-model="vm.penalty"
-          placeholder="0"
-          required
-          md-minlength="0"
-          md-maxlength="3"
-        />
-        <div
-          ng-messages="queueCampaignForm.penalty.$error"
-          role="alert"
-          multiple
-        >
-          <div ng-message="required">
-            <span>You must supply a penalty.</span>
-          </div>
-          <div ng-message="md-minlength">
-            <span>Min Penalty 0 characters.</span>
-          </div>
-          <div ng-message="md-maxlength">
-            <span>Max Penalty 3 characters.</span>
-          </div>
-        </div>
-      </md-input-container>
-      <ms-dual-multiselect
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveAgents()"
-        class="send-button md-accent md-raised"
-        ng-disabled="!vm.pendingChanges"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/agentadd/agentadd.html/agentadd.html b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/agentadd/agentadd.html/agentadd.html
new file mode 100644
index 0000000..98d6865
--- /dev/null
+++ b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/agentadd/agentadd.html/agentadd.html
@@ -0,0 +1,72 @@
+<md-dialog
+  class="queueCampaign-dialog"
+  aria-label="queueCampaign"
+  ng-init="vm.onInit()"
+>
+  <form name="queueCampaignForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="MOTIONDIALER.AGENTADD_QUEUECAMPAIGN">
+          Add Agent to queueCampaign
+        </h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <md-input-container flex class="no-margin">
+        <label translate="MOTIONDIALER.PENALTY">Penalty</label>
+        <input
+          name="penalty"
+          ng-model="vm.penalty"
+          placeholder="0"
+          required
+          md-minlength="0"
+          md-maxlength="3"
+        />
+        <div
+          ng-messages="queueCampaignForm.penalty.$error"
+          role="alert"
+          multiple
+        >
+          <div ng-message="required">
+            <span>You must supply a penalty.</span>
+          </div>
+          <div ng-message="md-minlength">
+            <span>Min Penalty 0 characters.</span>
+          </div>
+          <div ng-message="md-maxlength">
+            <span>Max Penalty 3 characters.</span>
+          </div>
+        </div>
+      </md-input-container>
+      <ms-dual-multiselect
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveAgents()"
+        class="send-button md-accent md-raised"
+        ng-disabled="!vm.pendingChanges"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/blacklistadd/blacklistadd.html/blacklistadd-[chunkhash].html b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/blacklistadd/blacklistadd.html/blacklistadd-[chunkhash].html
deleted file mode 100644
index 7084bed..0000000
--- a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/blacklistadd/blacklistadd.html/blacklistadd-[chunkhash].html
+++ /dev/null
@@ -1,60 +0,0 @@
-<md-dialog
-  class="queueCampaign-dialog"
-  aria-label="queueCampaign"
-  ng-init="vm.onInit()"
->
-  <form name="queueCampaignForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="MOTIONDIALER.BLACKLISTADD_QUEUECAMPAIGN">
-          Add List in QUEUECAMPAIGN
-        </h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <ms-dual-multiselect
-        ng-hide="vm.loading"
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-      <div
-        ng-hide="!vm.loading"
-        layout-fill
-        style="min-height: 397px"
-        layout="row"
-        layout-sm="column"
-        layout-align="center center"
-      >
-        <md-progress-circular
-          class="md-primary md-hue-1"
-          md-diameter="96"
-        ></md-progress-circular>
-      </div>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveLists()"
-        class="send-button md-accent md-raised"
-        ng-disabled="!vm.pendingChanges"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/blacklistadd/blacklistadd.html/blacklistadd.html b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/blacklistadd/blacklistadd.html/blacklistadd.html
new file mode 100644
index 0000000..7084bed
--- /dev/null
+++ b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/blacklistadd/blacklistadd.html/blacklistadd.html
@@ -0,0 +1,60 @@
+<md-dialog
+  class="queueCampaign-dialog"
+  aria-label="queueCampaign"
+  ng-init="vm.onInit()"
+>
+  <form name="queueCampaignForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="MOTIONDIALER.BLACKLISTADD_QUEUECAMPAIGN">
+          Add List in QUEUECAMPAIGN
+        </h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <ms-dual-multiselect
+        ng-hide="vm.loading"
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+      <div
+        ng-hide="!vm.loading"
+        layout-fill
+        style="min-height: 397px"
+        layout="row"
+        layout-sm="column"
+        layout-align="center center"
+      >
+        <md-progress-circular
+          class="md-primary md-hue-1"
+          md-diameter="96"
+        ></md-progress-circular>
+      </div>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveLists()"
+        class="send-button md-accent md-raised"
+        ng-disabled="!vm.pendingChanges"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/clone/clone.html/clone-[chunkhash].html b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/clone/clone.html/clone-[chunkhash].html
deleted file mode 100644
index fc14cd7..0000000
--- a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/clone/clone.html/clone-[chunkhash].html
+++ /dev/null
@@ -1,114 +0,0 @@
-<md-dialog class="queueCampaign-dialog" aria-label="Clone QueueCampaign">
-  <form name="queueCampaignForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="MOTIONDIALER.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.queueCampaign.name"
-          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.newQueueCampaign"
-        />
-
-        <div class="hint"><span translate="MOTIONDIALER.HELP.NAME"></span></div>
-        <div
-          ng-messages="queueCampaignForm['name'].$error"
-          ng-show="queueCampaignForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MOTIONDIALER.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span
-              translate="MOTIONDIALER.ERRORS.NAME_MUST_VALID_PATTERN"
-              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-              >Name must be valid pattern
-            </span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <md-switch ng-model="vm.queueCampaign.dialActive" aria-label="Active"
-          ><span translate="MOTIONDIALER.ACTIVE">Active</span></md-switch
-        >
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <md-button
-        type="submit"
-        ng-click="vm.cloneQueueCampaign()"
-        class="send-button md-accent md-raised"
-        ng-disabled="queueCampaignForm.$invalid"
-        aria-label="CLONE"
-        translate="MOTIONDIALER.CLONE_QUEUECAMPAIGN"
-        translate-attr-aria-label="MOTIONDIALER.CLONE_QUEUECAMPAIGN"
-      >
-        CLONE QUEUECAMPAIGN
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/clone/clone.html/clone.html b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/clone/clone.html/clone.html
new file mode 100644
index 0000000..fc14cd7
--- /dev/null
+++ b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/clone/clone.html/clone.html
@@ -0,0 +1,114 @@
+<md-dialog class="queueCampaign-dialog" aria-label="Clone QueueCampaign">
+  <form name="queueCampaignForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="MOTIONDIALER.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.queueCampaign.name"
+          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.newQueueCampaign"
+        />
+
+        <div class="hint"><span translate="MOTIONDIALER.HELP.NAME"></span></div>
+        <div
+          ng-messages="queueCampaignForm['name'].$error"
+          ng-show="queueCampaignForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MOTIONDIALER.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span
+              translate="MOTIONDIALER.ERRORS.NAME_MUST_VALID_PATTERN"
+              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+              >Name must be valid pattern
+            </span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <md-switch ng-model="vm.queueCampaign.dialActive" aria-label="Active"
+          ><span translate="MOTIONDIALER.ACTIVE">Active</span></md-switch
+        >
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <md-button
+        type="submit"
+        ng-click="vm.cloneQueueCampaign()"
+        class="send-button md-accent md-raised"
+        ng-disabled="queueCampaignForm.$invalid"
+        aria-label="CLONE"
+        translate="MOTIONDIALER.CLONE_QUEUECAMPAIGN"
+        translate-attr-aria-label="MOTIONDIALER.CLONE_QUEUECAMPAIGN"
+      >
+        CLONE QUEUECAMPAIGN
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/hoppers/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/hoppers/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index a3cfc63..0000000
--- a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/hoppers/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,225 +0,0 @@
-<md-dialog class="hopper-dialog" aria-label="New Hopper">
-  <form name="hopperForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <div class="md-block">
-        <label translate="MOTIONDIALER.SCHEDULEDAT">ScheduledAt</label>
-        <md-content layout="row" class="md-padding">
-          <div flex class="md-block">
-            <mdp-date-picker
-              mdp-open-on-click
-              name="scheduledatDate"
-              mdp-placeholder="Date"
-              mdp-format="YYYY-MM-DD"
-              ng-model="vm.hopper.scheduledat"
-              ng-init="vm.hopper.scheduledat = vm.getDateFromString(vm.hopper.scheduledat)"
-            >
-              <div
-                ng-messages="hopperForm.dateRangeFrom.$error"
-                ng-show="hopperForm.dateRangeFrom.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="MOTIONDIALER.ERRORS.DATE_REQUIRED"
-                    >Date is required</span
-                  >
-                </div>
-                <div ng-message="format">
-                  <span translate="MOTIONDIALER.ERRORS.DATE_INVALID"
-                    >Date is invalid</span
-                  >
-                </div>
-              </div>
-            </mdp-date-picker>
-          </div>
-          <div flex class="md-block">
-            <mdp-time-picker
-              mdp-open-on-click
-              name="scheduledatTime"
-              mdp-placeholder="Time"
-              mdp-format="HH:mm:ss"
-              mdp-auto-switch="true"
-              ng-model="vm.hopper.scheduledat"
-              ng-init="vm.hopper.scheduledat = vm.getDateFromString(vm.hopper.scheduledat)"
-            >
-              <div
-                ng-messages="hopperForm.timeRangeFrom.$error"
-                ng-show="hopperForm.timeRangeFrom.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="MOTIONDIALER.ERRORS.TIME_REQUIRED"
-                    >Time is required</span
-                  >
-                </div>
-                <div ng-message="format">
-                  <span translate="MOTIONDIALER.ERRORS.TIME_INVALID"
-                    >Time is invalid</span
-                  >
-                </div>
-              </div>
-            </mdp-time-picker>
-          </div>
-        </md-content>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="MOTIONDIALER.PRIORITY">Priority</label>
-        <md-select name="priority" ng-model="vm.hopper.priority">
-          <md-option ng-value="'4'">Highest</md-option>
-          <md-option ng-value="'3'">High</md-option>
-          <md-option ng-value="'2'">Medium</md-option>
-          <md-option ng-value="'1'">Low</md-option>
-          <md-option ng-value="'0'">Lowest</md-option>
-        </md-select>
-        <div class="hint">
-          <span translate="MOTIONDIALER.HELP.PRIORITY"></span>
-        </div>
-        <div
-          ng-messages="hopperForm['priority'].$error"
-          ng-show="hopperForm['priority'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MOTIONDIALER.ERRORS.PRIORITY_REQUIRED"
-              >Priority field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <md-switch ng-model="vm.hopper.recallme" aria-label="RecallAgent"
-          ><span translate="MOTIONDIALER.RECALLAGENT"
-            >RecallAgent</span
-          ></md-switch
-        >
-      </md-input-container>
-      <md-input-container ng-if="vm.hopper.recallme" class="md-block">
-        <label translate="MOTIONDIALER.AGENT">Agent</label>
-        <md-select name="UserId" ng-model="vm.hopper.UserId" required>
-          <md-option
-            ng-value="UserId.id"
-            ng-repeat="UserId in vm.agents"
-            ng-disabled="UserId.canSelect === false"
-            >{{ UserId.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="hopperForm['UserId'].$error"
-          ng-show="hopperForm['UserId'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="MOTIONDIALER.ERRORS.AGENT_REQUIRED"
-              >Agent field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newHopper"
-          ng-click="vm.saveHopper()"
-          class="send-button md-accent md-raised"
-          ng-disabled="hopperForm.$invalid || hopperForm.$pristine"
-          aria-label="SAVE"
-          translate="MOTIONDIALER.SAVE"
-          translate-attr-aria-label="MOTIONDIALER.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newHopper"
-          ng-click="vm.addNewHopper()"
-          class="send-button md-accent md-raised"
-          ng-disabled="hopperForm.$invalid"
-          aria-label="ADD"
-          translate="MOTIONDIALER.ADD_HOPPER"
-          translate-attr-aria-label="MOTIONDIALER.ADD_HOPPER"
-        >
-          ADD HOPPER
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newHopper"
-          ng-click="vm.deleteHopper($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="MOTIONDIALER.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="MOTIONDIALER.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/hoppers/dialog.html/dialog.html b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/hoppers/dialog.html/dialog.html
new file mode 100644
index 0000000..a3cfc63
--- /dev/null
+++ b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/hoppers/dialog.html/dialog.html
@@ -0,0 +1,225 @@
+<md-dialog class="hopper-dialog" aria-label="New Hopper">
+  <form name="hopperForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <div class="md-block">
+        <label translate="MOTIONDIALER.SCHEDULEDAT">ScheduledAt</label>
+        <md-content layout="row" class="md-padding">
+          <div flex class="md-block">
+            <mdp-date-picker
+              mdp-open-on-click
+              name="scheduledatDate"
+              mdp-placeholder="Date"
+              mdp-format="YYYY-MM-DD"
+              ng-model="vm.hopper.scheduledat"
+              ng-init="vm.hopper.scheduledat = vm.getDateFromString(vm.hopper.scheduledat)"
+            >
+              <div
+                ng-messages="hopperForm.dateRangeFrom.$error"
+                ng-show="hopperForm.dateRangeFrom.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="MOTIONDIALER.ERRORS.DATE_REQUIRED"
+                    >Date is required</span
+                  >
+                </div>
+                <div ng-message="format">
+                  <span translate="MOTIONDIALER.ERRORS.DATE_INVALID"
+                    >Date is invalid</span
+                  >
+                </div>
+              </div>
+            </mdp-date-picker>
+          </div>
+          <div flex class="md-block">
+            <mdp-time-picker
+              mdp-open-on-click
+              name="scheduledatTime"
+              mdp-placeholder="Time"
+              mdp-format="HH:mm:ss"
+              mdp-auto-switch="true"
+              ng-model="vm.hopper.scheduledat"
+              ng-init="vm.hopper.scheduledat = vm.getDateFromString(vm.hopper.scheduledat)"
+            >
+              <div
+                ng-messages="hopperForm.timeRangeFrom.$error"
+                ng-show="hopperForm.timeRangeFrom.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="MOTIONDIALER.ERRORS.TIME_REQUIRED"
+                    >Time is required</span
+                  >
+                </div>
+                <div ng-message="format">
+                  <span translate="MOTIONDIALER.ERRORS.TIME_INVALID"
+                    >Time is invalid</span
+                  >
+                </div>
+              </div>
+            </mdp-time-picker>
+          </div>
+        </md-content>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="MOTIONDIALER.PRIORITY">Priority</label>
+        <md-select name="priority" ng-model="vm.hopper.priority">
+          <md-option ng-value="'4'">Highest</md-option>
+          <md-option ng-value="'3'">High</md-option>
+          <md-option ng-value="'2'">Medium</md-option>
+          <md-option ng-value="'1'">Low</md-option>
+          <md-option ng-value="'0'">Lowest</md-option>
+        </md-select>
+        <div class="hint">
+          <span translate="MOTIONDIALER.HELP.PRIORITY"></span>
+        </div>
+        <div
+          ng-messages="hopperForm['priority'].$error"
+          ng-show="hopperForm['priority'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MOTIONDIALER.ERRORS.PRIORITY_REQUIRED"
+              >Priority field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <md-switch ng-model="vm.hopper.recallme" aria-label="RecallAgent"
+          ><span translate="MOTIONDIALER.RECALLAGENT"
+            >RecallAgent</span
+          ></md-switch
+        >
+      </md-input-container>
+      <md-input-container ng-if="vm.hopper.recallme" class="md-block">
+        <label translate="MOTIONDIALER.AGENT">Agent</label>
+        <md-select name="UserId" ng-model="vm.hopper.UserId" required>
+          <md-option
+            ng-value="UserId.id"
+            ng-repeat="UserId in vm.agents"
+            ng-disabled="UserId.canSelect === false"
+            >{{ UserId.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="hopperForm['UserId'].$error"
+          ng-show="hopperForm['UserId'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="MOTIONDIALER.ERRORS.AGENT_REQUIRED"
+              >Agent field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newHopper"
+          ng-click="vm.saveHopper()"
+          class="send-button md-accent md-raised"
+          ng-disabled="hopperForm.$invalid || hopperForm.$pristine"
+          aria-label="SAVE"
+          translate="MOTIONDIALER.SAVE"
+          translate-attr-aria-label="MOTIONDIALER.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newHopper"
+          ng-click="vm.addNewHopper()"
+          class="send-button md-accent md-raised"
+          ng-disabled="hopperForm.$invalid"
+          aria-label="ADD"
+          translate="MOTIONDIALER.ADD_HOPPER"
+          translate-attr-aria-label="MOTIONDIALER.ADD_HOPPER"
+        >
+          ADD HOPPER
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newHopper"
+          ng-click="vm.deleteHopper($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="MOTIONDIALER.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="MOTIONDIALER.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/listadd/listadd.html/listadd-[chunkhash].html b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/listadd/listadd.html/listadd-[chunkhash].html
deleted file mode 100644
index 2117cf9..0000000
--- a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/listadd/listadd.html/listadd-[chunkhash].html
+++ /dev/null
@@ -1,60 +0,0 @@
-<md-dialog
-  class="queueCampaign-dialog"
-  aria-label="queueCampaign"
-  ng-init="vm.onInit()"
->
-  <form name="queueCampaignForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="MOTIONDIALER.LISTADD_QUEUECAMPAIGN">
-          Add List in QUEUECAMPAIGN
-        </h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <ms-dual-multiselect
-        ng-hide="vm.loading"
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-      <div
-        ng-hide="!vm.loading"
-        layout-fill
-        style="min-height: 397px"
-        layout="row"
-        layout-sm="column"
-        layout-align="center center"
-      >
-        <md-progress-circular
-          class="md-primary md-hue-1"
-          md-diameter="96"
-        ></md-progress-circular>
-      </div>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveLists()"
-        class="send-button md-accent md-raised"
-        ng-disabled="!vm.pendingChanges"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/listadd/listadd.html/listadd.html b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/listadd/listadd.html/listadd.html
new file mode 100644
index 0000000..2117cf9
--- /dev/null
+++ b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/listadd/listadd.html/listadd.html
@@ -0,0 +1,60 @@
+<md-dialog
+  class="queueCampaign-dialog"
+  aria-label="queueCampaign"
+  ng-init="vm.onInit()"
+>
+  <form name="queueCampaignForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="MOTIONDIALER.LISTADD_QUEUECAMPAIGN">
+          Add List in QUEUECAMPAIGN
+        </h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <ms-dual-multiselect
+        ng-hide="vm.loading"
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+      <div
+        ng-hide="!vm.loading"
+        layout-fill
+        style="min-height: 397px"
+        layout="row"
+        layout-sm="column"
+        layout-align="center center"
+      >
+        <md-progress-circular
+          class="md-primary md-hue-1"
+          md-diameter="96"
+        ></md-progress-circular>
+      </div>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveLists()"
+        class="send-button md-accent md-raised"
+        ng-disabled="!vm.pendingChanges"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/resetlist/resetlist.html/resetlist-[chunkhash].html b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/resetlist/resetlist.html/resetlist-[chunkhash].html
deleted file mode 100644
index 2f13ccd..0000000
--- a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/resetlist/resetlist.html/resetlist-[chunkhash].html
+++ /dev/null
@@ -1,84 +0,0 @@
-<md-dialog class="queueCampaign-dialog" aria-label="queueCampaign">
-  <form name="queueCampaignForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="MOTIONDIALER.RESETLIST ">Reset List</h2>
-        <span flex></span>
-        <md-button
-          class="md-icon-button"
-          ng-disabled="vm.loading"
-          ng-click="vm.closeDialog()"
-        >
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content ng-hide="vm.loading">
-      <div layout="row" layout-wrap flex>
-        <div flex-xs flex="50">
-          <md-checkbox
-            aria-label="Select All"
-            ng-checked="vm.isChecked()"
-            md-indeterminate="vm.isIndeterminate()"
-            ng-click="vm.toggleAll()"
-          >
-            <span
-              ng-if="vm.isChecked()"
-              translate="MOTIONDIALER.UNSELECTALL"
-            ></span>
-            <span
-              ng-if="!vm.isChecked()"
-              translate="MOTIONDIALER.SELECTALL"
-            ></span>
-          </md-checkbox>
-        </div>
-        <div flex-xs flex="50"></div>
-        <div
-          flex="{{vm.items.length > 10 ? 50 : 100 }}"
-          ng-repeat="item in vm.items"
-        >
-          <md-checkbox
-            ng-checked="vm.exists(item, vm.selected)"
-            ng-click="vm.toggle(item, vm.selected)"
-          >
-            {{ item.name | limitTo:40 }}
-          </md-checkbox>
-        </div>
-      </div>
-    </md-dialog-content>
-    <md-dialog-actions
-      ng-hide="vm.loading"
-      layout="row"
-      layout-align="end center"
-    >
-      <div></div>
-      <md-button
-        type="submit"
-        ng-click="vm.listSelected()"
-        class="send-button md-accent md-raised"
-        ng-disabled="vm.loading"
-        aria-label="RESET"
-        translate="MOTIONDIALER.RESET"
-        translate-attr-aria-label="MOTIONDIALER.RESET"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-    <div
-      ng-hide="!vm.loading"
-      layout-fill
-      style="min-height: 397px"
-      layout="row"
-      layout-sm="column"
-      layout-align="center center"
-    >
-      <md-progress-circular
-        class="md-primary md-hue-1"
-        md-diameter="96"
-      ></md-progress-circular>
-    </div>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/resetlist/resetlist.html/resetlist.html b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/resetlist/resetlist.html/resetlist.html
new file mode 100644
index 0000000..2f13ccd
--- /dev/null
+++ b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/resetlist/resetlist.html/resetlist.html
@@ -0,0 +1,84 @@
+<md-dialog class="queueCampaign-dialog" aria-label="queueCampaign">
+  <form name="queueCampaignForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="MOTIONDIALER.RESETLIST ">Reset List</h2>
+        <span flex></span>
+        <md-button
+          class="md-icon-button"
+          ng-disabled="vm.loading"
+          ng-click="vm.closeDialog()"
+        >
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content ng-hide="vm.loading">
+      <div layout="row" layout-wrap flex>
+        <div flex-xs flex="50">
+          <md-checkbox
+            aria-label="Select All"
+            ng-checked="vm.isChecked()"
+            md-indeterminate="vm.isIndeterminate()"
+            ng-click="vm.toggleAll()"
+          >
+            <span
+              ng-if="vm.isChecked()"
+              translate="MOTIONDIALER.UNSELECTALL"
+            ></span>
+            <span
+              ng-if="!vm.isChecked()"
+              translate="MOTIONDIALER.SELECTALL"
+            ></span>
+          </md-checkbox>
+        </div>
+        <div flex-xs flex="50"></div>
+        <div
+          flex="{{vm.items.length > 10 ? 50 : 100 }}"
+          ng-repeat="item in vm.items"
+        >
+          <md-checkbox
+            ng-checked="vm.exists(item, vm.selected)"
+            ng-click="vm.toggle(item, vm.selected)"
+          >
+            {{ item.name | limitTo:40 }}
+          </md-checkbox>
+        </div>
+      </div>
+    </md-dialog-content>
+    <md-dialog-actions
+      ng-hide="vm.loading"
+      layout="row"
+      layout-align="end center"
+    >
+      <div></div>
+      <md-button
+        type="submit"
+        ng-click="vm.listSelected()"
+        class="send-button md-accent md-raised"
+        ng-disabled="vm.loading"
+        aria-label="RESET"
+        translate="MOTIONDIALER.RESET"
+        translate-attr-aria-label="MOTIONDIALER.RESET"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+    <div
+      ng-hide="!vm.loading"
+      layout-fill
+      style="min-height: 397px"
+      layout="row"
+      layout-sm="column"
+      layout-align="center center"
+    >
+      <md-progress-circular
+        class="md-primary md-hue-1"
+        md-diameter="96"
+      ></md-progress-circular>
+    </div>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/teamadd/teamadd.html/teamadd-[chunkhash].html b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/teamadd/teamadd.html/teamadd-[chunkhash].html
deleted file mode 100644
index fa1abeb..0000000
--- a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/teamadd/teamadd.html/teamadd-[chunkhash].html
+++ /dev/null
@@ -1,70 +0,0 @@
-<md-dialog
-  class="queueCampaign-dialog"
-  aria-label="queueCampaign"
-  ng-init="vm.onInit()"
->
-  <form name="queueCampaignForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="MOTIONDIALER.TEAMS_ASSOCIATION">Teams Association</h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <md-input-container flex class="no-margin">
-        <label translate="MOTIONDIALER.PENALTY">Penalty</label>
-        <input
-          name="penalty"
-          ng-model="vm.penalty"
-          placeholder="0"
-          required
-          md-minlength="0"
-          md-maxlength="3"
-        />
-        <div
-          ng-messages="queueCampaignForm.penalty.$error"
-          role="alert"
-          multiple
-        >
-          <div ng-message="required">
-            <span>You must supply a penalty.</span>
-          </div>
-          <div ng-message="md-minlength">
-            <span>Min Penalty 0 characters.</span>
-          </div>
-          <div ng-message="md-maxlength">
-            <span>Max Penalty 3 characters.</span>
-          </div>
-        </div>
-      </md-input-container>
-      <ms-dual-multiselect
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveTeams()"
-        ng-disabled="!vm.pendingChanges"
-        class="send-button md-accent md-raised"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/teamadd/teamadd.html/teamadd.html b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/teamadd/teamadd.html/teamadd.html
new file mode 100644
index 0000000..fa1abeb
--- /dev/null
+++ b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/teamadd/teamadd.html/teamadd.html
@@ -0,0 +1,70 @@
+<md-dialog
+  class="queueCampaign-dialog"
+  aria-label="queueCampaign"
+  ng-init="vm.onInit()"
+>
+  <form name="queueCampaignForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="MOTIONDIALER.TEAMS_ASSOCIATION">Teams Association</h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <md-input-container flex class="no-margin">
+        <label translate="MOTIONDIALER.PENALTY">Penalty</label>
+        <input
+          name="penalty"
+          ng-model="vm.penalty"
+          placeholder="0"
+          required
+          md-minlength="0"
+          md-maxlength="3"
+        />
+        <div
+          ng-messages="queueCampaignForm.penalty.$error"
+          role="alert"
+          multiple
+        >
+          <div ng-message="required">
+            <span>You must supply a penalty.</span>
+          </div>
+          <div ng-message="md-minlength">
+            <span>Min Penalty 0 characters.</span>
+          </div>
+          <div ng-message="md-maxlength">
+            <span>Max Penalty 3 characters.</span>
+          </div>
+        </div>
+      </md-input-container>
+      <ms-dual-multiselect
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveTeams()"
+        ng-disabled="!vm.pendingChanges"
+        class="send-button md-accent md-raised"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index 9f0528a..0000000
--- a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,4423 +0,0 @@
-<div
-  id="motiondialer-queueCampaign"
-  class="page-layout simple tabbed"
-  layout="column"
->
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-queueCampaigns-button md-icon-button"
-        aria-label="Go to queueCampaigns"
-        ng-click="vm.gotoQueueCampaigns()"
-        translate
-        translate-attr-aria-label="MOTIONDIALER.GO_TO_QUEUECAMPAIGNS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="queueCampaign-image" hide-xs>
-          <img ng-src="assets/images/business/queueCampaigns.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.queueCampaign.id}}
-            <span ng-if="vm.queueCampaign.name">{{vm.queueCampaign.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="MOTIONDIALER.CREATED_AT"></span>
-            <span>{{vm.queueCampaign.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div ng-cloak ng-if="vm.crudPermissions.canEdit">
-      <md-button
-        ng-click="vm.clonedialog(vm.queueCampaign, $event)"
-        class="md-fab md-green-500-bg md-icon-button"
-        aria-label="clone"
-      >
-        <md-tooltip
-          ><span translate="MOTIONDIALER.CLONE_QUEUECAMPAIGN"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-content-duplicate"></md-icon>
-      </md-button>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.listadddialog(vm.queueCampaign, $event)"
-        class="md-fab md-green-500-bg md-icon-button"
-        aria-label="listadd"
-      >
-        <md-tooltip
-          ><span translate="MOTIONDIALER.LISTADD_QUEUECAMPAIGN"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-format-list-numbers"></md-icon>
-      </md-button>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.blacklistadddialog(vm.queueCampaign, $event)"
-        class="md-fab md-warn md-icon-button"
-        aria-label="blacklistadd"
-      >
-        <md-tooltip
-          ><span translate="MOTIONDIALER.BLACKLISTADD_QUEUECAMPAIGN"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-block-helper"></md-icon>
-      </md-button>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.teamadddialog(vm.queueCampaign, $event)"
-        class="md-fab md-orange-500-bg md-icon-button"
-        aria-label="teamadd"
-      >
-        <md-tooltip
-          ><span translate="MOTIONDIALER.TEAMADD_QUEUECAMPAIGN"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
-      </md-button>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.agentadddialog(vm.queueCampaign, $event)"
-        class="md-fab md-purple-500-bg md-icon-button"
-        aria-label="agentadd"
-      >
-        <md-tooltip
-          ><span translate="MOTIONDIALER.AGENTADD_QUEUECAMPAIGN"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-account-plus"></md-icon>
-      </md-button>
-    </div>
-
-    <div ng-cloak ng-if="vm.crudPermissions.canEdit">
-      <md-button
-        ng-click="vm.resetlistdialog(vm.queueCampaign, $event)"
-        class="md-fab md-warn md-icon-button"
-        aria-label="resetlist"
-      >
-        <md-tooltip
-          ><span translate="MOTIONDIALER.RESETLIST_QUEUECAMPAIGN"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-restore"></md-icon>
-      </md-button>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.gotogoto(vm.queueCampaign, $event)"
-        class="md-fab md-warn md-icon-button"
-        aria-label="goto"
-      >
-        <md-tooltip
-          ><span translate="MOTIONDIALER.GOTO_QUEUECAMPAIGN"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-cast"></md-icon>
-      </md-button>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveQueueCampaign()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        translate="MOTIONDIALER.SAVE"
-        translate-attr-aria-label="MOTIONDIALER.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="MOTIONDIALER.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="queueCampaign-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MOTIONDIALER.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.queueCampaign.name"
-                  ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-                  ng-required="true"
-                  autofocus
-                  disabled
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.NAME"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                  <div ng-message="pattern">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.NAME_MUST_VALID_PATTERN"
-                      translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-                      >Name must be valid pattern
-                    </span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.queueCampaign.dialActive"
-                  aria-label="Active"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="MOTIONDIALER.ACTIVE"
-                    >Active</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.TRUNK">Trunk</label>
-                <md-select
-                  name="TrunkId"
-                  ng-model="vm.queueCampaign.TrunkId"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="TrunkId.id"
-                    ng-repeat="TrunkId in vm.trunks"
-                    ng-disabled="TrunkId.canSelect === false"
-                    >{{ TrunkId.name }}</md-option
-                  >
-                </md-select>
-                <div
-                  ng-messages="generalForm['TrunkId'].$error"
-                  ng-show="generalForm['TrunkId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.TRUNK_REQUIRED"
-                      >Trunk field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.BACKUPTRUNK">BackupTrunk</label>
-                <md-select
-                  name="TrunkBackupId"
-                  ng-model="vm.queueCampaign.TrunkBackupId"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="null">None</md-option>
-                  <md-option
-                    ng-value="TrunkBackupId.id"
-                    ng-repeat="TrunkBackupId in vm.trunks"
-                    ng-disabled="TrunkBackupId.canSelect === false"
-                    >{{ TrunkBackupId.name }}</md-option
-                  >
-                </md-select>
-                <div
-                  ng-messages="generalForm['TrunkBackupId'].$error"
-                  ng-show="generalForm['TrunkBackupId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.BACKUPTRUNK_REQUIRED"
-                      >BackupTrunk field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.queueCampaign.dialMethod != 'preview'"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.INTERVAL">Interval</label>
-                <md-select
-                  name="IntervalId"
-                  ng-model="vm.queueCampaign.IntervalId"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="IntervalId.id"
-                    ng-repeat="IntervalId in vm.interval"
-                    ng-disabled="IntervalId.canSelect === false"
-                    >{{ IntervalId.name }}</md-option
-                  >
-                </md-select>
-                <div
-                  ng-messages="generalForm['IntervalId'].$error"
-                  ng-show="generalForm['IntervalId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.INTERVAL_REQUIRED"
-                      >Interval field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.CHECKDUPLICATE"
-                  >CheckDuplicate</label
-                >
-                <md-select
-                  name="dialCheckDuplicateType"
-                  ng-model="vm.queueCampaign.dialCheckDuplicateType"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'always'">
-                    {{ 'MOTIONDIALER.ALWAYS' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'never'">
-                    {{ 'MOTIONDIALER.NEVER' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'onlyIfOpen'">
-                    {{ 'MOTIONDIALER.ONLY_IF_OPEN' | translate }}
-                  </md-option>
-                </md-select>
-                <div
-                  ng-messages="generalForm['dialCheckDuplicateType'].$error"
-                  ng-show="generalForm['dialCheckDuplicateType'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.CHECKDUPLICATE_REQUIRED"
-                      >CheckDuplicate field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.CUTDIGIT">CutDigit</label>
-                <input
-                  type="number"
-                  name="dialCutDigit"
-                  ng-model="vm.queueCampaign.dialCutDigit"
-                  min="0"
-                  max="15"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['dialCutDigit'].$error"
-                  ng-show="generalForm['dialCutDigit'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.CUTDIGIT_REQUIRED"
-                      >CutDigit field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.CUTDIGIT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >CutDigit must be a valid greater or equal than</span
-                    >
-                    <span>0</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.CUTDIGIT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >CutDigit must be a valid greater or equal than</span
-                    >
-                    <span>15</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.queueCampaign.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="MOTIONDIALER.CAMPAIGN">CAMPAIGN</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="queueCampaign-detail-form-container campaign md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MOTIONDIALER.CAMPAIGN">
-                CAMPAIGN
-              </div>
-            </div>
-            <form name="campaignForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.METHOD">Method</label>
-                <md-select
-                  name="dialMethod"
-                  ng-model="vm.queueCampaign.dialMethod"
-                  autofocus
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'progressive'">Progressive</md-option>
-                  <md-option ng-value="'power'">PowerDialing</md-option>
-                  <md-option ng-value="'predictive'">Predictive</md-option>
-                  <md-option ng-value="'preview'">Preview</md-option>
-                  <md-option ng-value="'booked'">BookedProgressive</md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.METHOD"></span>
-                </div>
-                <div
-                  ng-messages="campaignForm['dialMethod'].$error"
-                  ng-show="campaignForm['dialMethod'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.METHOD_REQUIRED"
-                      >Method field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.queueCampaign.dialMethod == 'power'"
-                class="md-block"
-              >
-                <span translate="MOTIONDIALER.POWERLEVEL">PowerLevel</span>
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.POWERLEVEL"></span>
-                </div>
-                <md-slider
-                  md-discrete
-                  flex
-                  ng-model="vm.queueCampaign.dialPowerLevel"
-                  min="1"
-                  max="10"
-                  step="0.1"
-                  class="md-accent"
-                ></md-slider>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.queueCampaign.dialMethod == 'predictive'"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.PREDICTIVEOPTIMIZATION"
-                  >PredictiveOptimization</label
-                >
-                <md-select
-                  name="dialPredictiveOptimization"
-                  ng-model="vm.queueCampaign.dialPredictiveOptimization"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'agentBusyFactor'">
-                    {{ 'MOTIONDIALER.AGENTBUSYFACTOR' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'dropRate'">
-                    {{ 'MOTIONDIALER.DROPRATE' | translate }}
-                  </md-option>
-                </md-select>
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.PREDICTIVEOPTIMIZATION"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="campaignForm['dialPredictiveOptimization'].$error"
-                  ng-show="campaignForm['dialPredictiveOptimization'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.PREDICTIVEOPTIMIZATION_REQUIRED"
-                      >PredictiveOptimization field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.queueCampaign.dialMethod == 'predictive'"
-                class="md-block"
-              >
-                <span translate="MOTIONDIALER.PREDICTIVEOPTIMIZATIONPERCENTAGE"
-                  >PredictiveOptimizationPercentage</span
-                >
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.PREDICTIVEOPTIMIZATIONPERCENTAGE"
-                  ></span>
-                </div>
-                <md-slider
-                  md-discrete
-                  flex
-                  ng-model="vm.queueCampaign.dialPredictiveOptimizationPercentage"
-                  min="1"
-                  max="95"
-                  step="0.1"
-                  class="md-accent"
-                ></md-slider>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.queueCampaign.dialMethod == 'predictive'"
-                class="md-block"
-              >
-                <span translate="MOTIONDIALER.PREDICTIVEINTERVAL"
-                  >PredictiveInterval</span
-                >
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.PREDICTIVEINTERVAL"></span>
-                </div>
-                <md-slider
-                  md-discrete
-                  flex
-                  ng-model="vm.queueCampaign.dialPredictiveInterval"
-                  min="5"
-                  max="30"
-                  step="1"
-                  class="md-accent"
-                ></md-slider>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.queueCampaign.dialMethod != 'preview'"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.MAXCONCURRENTCALLS"
-                  >MaxConcurrentCalls</label
-                >
-                <input
-                  type="number"
-                  name="dialLimitQueue"
-                  ng-model="vm.queueCampaign.dialLimitQueue"
-                  min="0"
-                  max="9999"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.MAXCONCURRENTCALLS"></span>
-                </div>
-                <div
-                  ng-messages="campaignForm['dialLimitQueue'].$error"
-                  ng-show="campaignForm['dialLimitQueue'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.MAXCONCURRENTCALLS_REQUIRED"
-                      >MaxConcurrentCalls field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.MAXCONCURRENTCALLS_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >MaxConcurrentCalls must be a valid greater or equal
-                      than</span
-                    >
-                    <span>0</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.MAXCONCURRENTCALLS_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >MaxConcurrentCalls must be a valid greater or equal
-                      than</span
-                    >
-                    <span>9999</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.AGENTTIMEOUT"
-                  >AgentTimeout</label
-                >
-                <input
-                  type="number"
-                  name="timeout"
-                  ng-model="vm.queueCampaign.timeout"
-                  min="0"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.AGENTTIMEOUT"></span>
-                </div>
-                <div
-                  ng-messages="campaignForm['timeout'].$error"
-                  ng-show="campaignForm['timeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.AGENTTIMEOUT_REQUIRED"
-                      >AgentTimeout field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AGENTTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AgentTimeout must be a valid greater or equal than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="queueCampaign-detail-form-container queue md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MOTIONDIALER.QUEUE">
-                QUEUE
-              </div>
-            </div>
-            <form name="queueForm" novalidate>
-              <md-input-container
-                ng-if="vm.queueCampaign.dialMethod === 'progressive' || vm.queueCampaign.dialMethod === 'predictive' || vm.queueCampaign.dialMethod === 'power'"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.QUEUEOPTIONS"
-                  >QueueOptions</label
-                >
-                <input
-                  type="text"
-                  name="dialQueueOptions"
-                  ng-model="vm.queueCampaign.dialQueueOptions"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="queueForm['dialQueueOptions'].$error"
-                  ng-show="queueForm['dialQueueOptions'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.QUEUEOPTIONS_REQUIRED"
-                      >QueueOptions field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.queueCampaign.dialMethod === 'progressive' || vm.queueCampaign.dialMethod === 'predictive' || vm.queueCampaign.dialMethod === 'power'"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.QUEUETIMEOUT"
-                  >QueueTimeout</label
-                >
-                <input
-                  type="number"
-                  name="dialQueueTimeout"
-                  ng-model="vm.queueCampaign.dialQueueTimeout"
-                  min="1"
-                  max="999"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.QUEUETIMEOUT"></span>
-                </div>
-                <div
-                  ng-messages="queueForm['dialQueueTimeout'].$error"
-                  ng-show="queueForm['dialQueueTimeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.QUEUETIMEOUT_REQUIRED"
-                      >QueueTimeout field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.QUEUETIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >QueueTimeout must be a valid greater or equal than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.QUEUETIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >QueueTimeout must be a valid greater or equal than</span
-                    >
-                    <span>999</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.queueCampaign.dialMethod === 'booked' || vm.queueCampaign.dialMethod === 'progressive' || vm.queueCampaign.dialMethod === 'predictive' || vm.queueCampaign.dialMethod === 'power'"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.STRATEGY">Strategy</label>
-                <md-select
-                  name="strategy"
-                  ng-model="vm.queueCampaign.strategy"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'rrmemory'"
-                    >Round Robin Memory</md-option
-                  >
-                  <md-option
-                    ng-value="'roundrobin'"
-                    ng-if="vm.queueCampaign.dialMethod === 'booked'"
-                    >Round Robin</md-option
-                  >
-                  <md-option
-                    ng-value="'leastrecent'"
-                    ng-if="vm.queueCampaign.dialMethod !== 'booked'"
-                    >Least Recent</md-option
-                  >
-                  <md-option
-                    ng-value="'fewestcalls'"
-                    ng-if="vm.queueCampaign.dialMethod !== 'booked'"
-                    >Fewest Calls</md-option
-                  >
-                  <md-option
-                    ng-value="'random'"
-                    ng-if="vm.queueCampaign.dialMethod !== 'booked'"
-                    >Random</md-option
-                  >
-                  <md-option
-                    ng-value="'linear'"
-                    ng-if="vm.queueCampaign.dialMethod !== 'booked'"
-                    >Linear</md-option
-                  >
-                  <md-option
-                    ng-value="'wrandom'"
-                    ng-if="vm.queueCampaign.dialMethod !== 'booked'"
-                    >Weight Random</md-option
-                  >
-                </md-select>
-                <div
-                  ng-messages="queueForm['strategy'].$error"
-                  ng-show="queueForm['strategy'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.STRATEGY_REQUIRED"
-                      >Strategy field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.queueCampaign.dialMethod === 'progressive' || vm.queueCampaign.dialMethod === 'predictive' || vm.queueCampaign.dialMethod === 'power'"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.RETRY">Retry</label>
-                <input
-                  type="number"
-                  name="retry"
-                  ng-model="vm.queueCampaign.retry"
-                  min="0"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.RETRY"></span>
-                </div>
-                <div
-                  ng-messages="queueForm['retry'].$error"
-                  ng-show="queueForm['retry'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.RETRY_REQUIRED"
-                      >Retry field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.RETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >Retry must be a valid greater or equal than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.queueCampaign.dialMethod === 'progressive' || vm.queueCampaign.dialMethod === 'predictive' || vm.queueCampaign.dialMethod === 'power'"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.WRAPUPTIME">WrapupTime</label>
-                <input
-                  type="number"
-                  name="wrapuptime"
-                  ng-model="vm.queueCampaign.wrapuptime"
-                  min="0"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.WRAPUPTIME"></span>
-                </div>
-                <div
-                  ng-messages="queueForm['wrapuptime'].$error"
-                  ng-show="queueForm['wrapuptime'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.WRAPUPTIME_REQUIRED"
-                      >WrapupTime field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.WRAPUPTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >WrapupTime must be a valid greater or equal than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.queueCampaign.dialMethod === 'progressive' || vm.queueCampaign.dialMethod === 'predictive' || vm.queueCampaign.dialMethod === 'power'"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.WEIGHT">Weight</label>
-                <input
-                  type="number"
-                  name="weight"
-                  ng-model="vm.queueCampaign.weight"
-                  min="0"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.WEIGHT"></span>
-                </div>
-                <div
-                  ng-messages="queueForm['weight'].$error"
-                  ng-show="queueForm['weight'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.WEIGHT_REQUIRED"
-                      >Weight field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.WEIGHT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >Weight must be a valid greater or equal than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.queueCampaign.dialMethod === 'progressive' || vm.queueCampaign.dialMethod === 'predictive' || vm.queueCampaign.dialMethod === 'power'"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.MUSICONHOLD">MusicOnHold</label>
-                <md-select
-                  name="musiconhold"
-                  ng-model="vm.queueCampaign.musiconhold"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="musiconhold.name"
-                    ng-repeat="musiconhold in vm.musiconholds"
-                    ng-disabled="musiconhold.canSelect === false"
-                    >{{ musiconhold.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.MUSICONHOLD"></span>
-                </div>
-                <div
-                  ng-messages="queueForm['musiconhold'].$error"
-                  ng-show="queueForm['musiconhold'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.MUSICONHOLD_REQUIRED"
-                      >MusicOnHold field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.queueCampaign.dialMethod === 'progressive' || vm.queueCampaign.dialMethod === 'predictive' || vm.queueCampaign.dialMethod === 'power'"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.CALLYSQUAREPROJECT"
-                  >CallySquareProject</label
-                >
-                <md-select
-                  name="dialQueueProject"
-                  ng-model="vm.queueCampaign.dialQueueProject"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="null">None</md-option>
-                  <md-option
-                    ng-value="dialQueueProject.name"
-                    ng-repeat="dialQueueProject in vm.projects"
-                    ng-disabled="dialQueueProject.canSelect === false"
-                    >{{ dialQueueProject.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.CALLYSQUAREPROJECT"></span>
-                </div>
-                <div
-                  ng-messages="queueForm['dialQueueProject'].$error"
-                  ng-show="queueForm['dialQueueProject'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.CALLYSQUAREPROJECT_REQUIRED"
-                      >CallySquareProject field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.queueCampaign.dialMethod === 'progressive' || vm.queueCampaign.dialMethod === 'predictive' || vm.queueCampaign.dialMethod === 'power'"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.CALLYSQUAREPROJECT2"
-                  >CallySquareProject2</label
-                >
-                <md-select
-                  name="dialQueueProject2"
-                  ng-model="vm.queueCampaign.dialQueueProject2"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="null">None</md-option>
-                  <md-option
-                    ng-value="dialQueueProject2.name"
-                    ng-repeat="dialQueueProject2 in vm.projects"
-                    ng-disabled="dialQueueProject2.canSelect === false"
-                    >{{ dialQueueProject2.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.CALLYSQUAREPROJECT2"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="queueForm['dialQueueProject2'].$error"
-                  ng-show="queueForm['dialQueueProject2'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.CALLYSQUAREPROJECT2_REQUIRED"
-                      >CallySquareProject2 field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.queueCampaign.dialMethod === 'preview' || vm.queueCampaign.dialMethod === 'booked'"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.CALLYSQUAREPROJECTPREVIEW"
-                  >CallySquareProjectPreview</label
-                >
-                <md-select
-                  name="dialQueueProject"
-                  ng-model="vm.queueCampaign.dialQueueProject"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="null">None</md-option>
-                  <md-option
-                    ng-value="dialQueueProject.name"
-                    ng-repeat="dialQueueProject in vm.projects"
-                    ng-disabled="dialQueueProject.canSelect === false"
-                    >{{ dialQueueProject.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.CALLYSQUAREPROJECTPREVIEW"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="queueForm['dialQueueProject'].$error"
-                  ng-show="queueForm['dialQueueProject'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.CALLYSQUAREPROJECTPREVIEW_REQUIRED"
-                      >CallySquareProjectPreview field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.queueCampaign.dialMethod === 'preview' || vm.queueCampaign.dialMethod === 'booked'"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.CALLYSQUAREPROJECTPREVIEW2"
-                  >CallySquareProjectPreview2</label
-                >
-                <md-select
-                  name="dialQueueProject2"
-                  ng-model="vm.queueCampaign.dialQueueProject2"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="null">None</md-option>
-                  <md-option
-                    ng-value="dialQueueProject2.name"
-                    ng-repeat="dialQueueProject2 in vm.projects"
-                    ng-disabled="dialQueueProject2.canSelect === false"
-                    >{{ dialQueueProject2.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.CALLYSQUAREPROJECTPREVIEW2"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="queueForm['dialQueueProject2'].$error"
-                  ng-show="queueForm['dialQueueProject2'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.CALLYSQUAREPROJECTPREVIEW2_REQUIRED"
-                      >CallySquareProjectPreview2 field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.queueCampaign.dialQueueProject2 && (vm.queueCampaign.dialMethod === 'progressive' || vm.queueCampaign.dialMethod === 'predictive' || vm.queueCampaign.dialMethod === 'power')"
-                class="md-block"
-              >
-                <md-switch
-                  ng-model="vm.queueCampaign.dialAgiAfterHangupAgent"
-                  aria-label="RunIfHangupAgent"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="MOTIONDIALER.RUNIFHANGUPAGENT"
-                    >RunIfHangupAgent</span
-                  ></md-switch
-                >
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.RUNIFHANGUPAGENT"></span>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="queueCampaign-detail-form-container originate md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MOTIONDIALER.ORIGINATE">
-                ORIGINATE
-              </div>
-            </div>
-            <form name="originateForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.ORIGINATECALLERIDNAME"
-                  >OriginateCallerIdName</label
-                >
-                <input
-                  type="text"
-                  name="dialOriginateCallerIdName"
-                  ng-model="vm.queueCampaign.dialOriginateCallerIdName"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.ORIGINATECALLERIDNAME"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="originateForm['dialOriginateCallerIdName'].$error"
-                  ng-show="originateForm['dialOriginateCallerIdName'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.ORIGINATECALLERIDNAME_REQUIRED"
-                      >OriginateCallerIdName field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.ORIGINATECALLERIDNUMBER"
-                  >OriginateCallerIdNumber</label
-                >
-                <input
-                  type="text"
-                  name="dialOriginateCallerIdNumber"
-                  ng-model="vm.queueCampaign.dialOriginateCallerIdNumber"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.ORIGINATECALLERIDNUMBER"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="originateForm['dialOriginateCallerIdNumber'].$error"
-                  ng-show="originateForm['dialOriginateCallerIdNumber'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.ORIGINATECALLERIDNUMBER_REQUIRED"
-                      >OriginateCallerIdNumber field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.RANDOMLASTDIGITCALLERIDNUMBER"
-                  >RandomLastDigitCallerIdNumber</label
-                >
-                <input
-                  type="number"
-                  name="dialRandomLastDigitCallerIdNumber"
-                  ng-model="vm.queueCampaign.dialRandomLastDigitCallerIdNumber"
-                  min="0"
-                  max="15"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.RANDOMLASTDIGITCALLERIDNUMBER"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="originateForm['dialRandomLastDigitCallerIdNumber'].$error"
-                  ng-show="originateForm['dialRandomLastDigitCallerIdNumber'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.RANDOMLASTDIGITCALLERIDNUMBER_REQUIRED"
-                      >RandomLastDigitCallerIdNumber field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.RANDOMLASTDIGITCALLERIDNUMBER_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >RandomLastDigitCallerIdNumber must be a valid greater or
-                      equal than</span
-                    >
-                    <span>0</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.RANDOMLASTDIGITCALLERIDNUMBER_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >RandomLastDigitCallerIdNumber must be a valid greater or
-                      equal than</span
-                    >
-                    <span>15</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.ORIGINATETIMEOUT"
-                  >OriginateTimeout</label
-                >
-                <input
-                  type="number"
-                  name="dialOriginateTimeout"
-                  ng-model="vm.queueCampaign.dialOriginateTimeout"
-                  min="1"
-                  max="999"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.ORIGINATETIMEOUT"></span>
-                </div>
-                <div
-                  ng-messages="originateForm['dialOriginateTimeout'].$error"
-                  ng-show="originateForm['dialOriginateTimeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.ORIGINATETIMEOUT_REQUIRED"
-                      >OriginateTimeout field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.ORIGINATETIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >OriginateTimeout must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.ORIGINATETIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >OriginateTimeout must be a valid greater or equal
-                      than</span
-                    >
-                    <span>999</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.PREFIX">Prefix</label>
-                <input
-                  type="text"
-                  name="dialPrefix"
-                  ng-model="vm.queueCampaign.dialPrefix"
-                  ng-pattern="/^\d+$/"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.PREFIX"></span>
-                </div>
-                <div
-                  ng-messages="originateForm['dialPrefix'].$error"
-                  ng-show="originateForm['dialPrefix'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.PREFIX_REQUIRED"
-                      >Prefix field is required</span
-                    >
-                  </div>
-                  <div ng-message="pattern">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.PREFIX_MUST_VALID_PATTERN"
-                      translate-values="{ regex: '/^\d+$/' }"
-                      >Prefix must be valid pattern
-                    </span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="MOTIONDIALER.RETRYANDFREQUENCY"
-            >RETRYANDFREQUENCY</span
-          >
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="queueCampaign-detail-form-container global md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MOTIONDIALER.GLOBAL">
-                GLOBAL
-              </div>
-            </div>
-            <form name="globalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.GLOBALMAXRETRY"
-                  >GlobalMaxRetry</label
-                >
-                <input
-                  type="number"
-                  name="dialGlobalMaxRetry"
-                  ng-model="vm.queueCampaign.dialGlobalMaxRetry"
-                  min="1"
-                  max="999"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.GLOBALMAXRETRY"></span>
-                </div>
-                <div
-                  ng-messages="globalForm['dialGlobalMaxRetry'].$error"
-                  ng-show="globalForm['dialGlobalMaxRetry'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.GLOBALMAXRETRY_REQUIRED"
-                      >GlobalMaxRetry field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.GLOBALMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >GlobalMaxRetry must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.GLOBALMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >GlobalMaxRetry must be a valid greater or equal
-                      than</span
-                    >
-                    <span>999</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="queueCampaign-detail-form-container congestion md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div
-                class="h2 secondary-text"
-                translate="MOTIONDIALER.CONGESTION"
-              >
-                CONGESTION
-              </div>
-            </div>
-            <form name="congestionForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.CONGESTIONMAXRETRY"
-                  >CongestionMaxRetry</label
-                >
-                <input
-                  type="number"
-                  name="dialCongestionMaxRetry"
-                  ng-model="vm.queueCampaign.dialCongestionMaxRetry"
-                  min="1"
-                  max="999"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.CONGESTIONMAXRETRY"></span>
-                </div>
-                <div
-                  ng-messages="congestionForm['dialCongestionMaxRetry'].$error"
-                  ng-show="congestionForm['dialCongestionMaxRetry'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.CONGESTIONMAXRETRY_REQUIRED"
-                      >CongestionMaxRetry field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.CONGESTIONMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >CongestionMaxRetry must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.CONGESTIONMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >CongestionMaxRetry must be a valid greater or equal
-                      than</span
-                    >
-                    <span>999</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.CONGESTIONRETRYTIME"
-                  >CongestionRetryTime</label
-                >
-                <input
-                  type="number"
-                  name="dialCongestionRetryFrequency"
-                  ng-model="vm.queueCampaign.dialCongestionRetryFrequency"
-                  min="1"
-                  max="99999"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.CONGESTIONRETRYTIME"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="congestionForm['dialCongestionRetryFrequency'].$error"
-                  ng-show="congestionForm['dialCongestionRetryFrequency'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.CONGESTIONRETRYTIME_REQUIRED"
-                      >CongestionRetryTime field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.CONGESTIONRETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >CongestionRetryTime must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.CONGESTIONRETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >CongestionRetryTime must be a valid greater or equal
-                      than</span
-                    >
-                    <span>99999</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="queueCampaign-detail-form-container busy md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MOTIONDIALER.BUSY">
-                BUSY
-              </div>
-            </div>
-            <form name="busyForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.BUSYMAXRETRY"
-                  >BusyMaxRetry</label
-                >
-                <input
-                  type="number"
-                  name="dialBusyMaxRetry"
-                  ng-model="vm.queueCampaign.dialBusyMaxRetry"
-                  min="1"
-                  max="999"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.BUSYMAXRETRY"></span>
-                </div>
-                <div
-                  ng-messages="busyForm['dialBusyMaxRetry'].$error"
-                  ng-show="busyForm['dialBusyMaxRetry'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.BUSYMAXRETRY_REQUIRED"
-                      >BusyMaxRetry field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.BUSYMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >BusyMaxRetry must be a valid greater or equal than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.BUSYMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >BusyMaxRetry must be a valid greater or equal than</span
-                    >
-                    <span>999</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.BUSYRETRYTIME"
-                  >BusyRetryTime</label
-                >
-                <input
-                  type="number"
-                  name="dialBusyRetryFrequency"
-                  ng-model="vm.queueCampaign.dialBusyRetryFrequency"
-                  min="1"
-                  max="99999"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.BUSYRETRYTIME"></span>
-                </div>
-                <div
-                  ng-messages="busyForm['dialBusyRetryFrequency'].$error"
-                  ng-show="busyForm['dialBusyRetryFrequency'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.BUSYRETRYTIME_REQUIRED"
-                      >BusyRetryTime field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.BUSYRETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >BusyRetryTime must be a valid greater or equal than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.BUSYRETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >BusyRetryTime must be a valid greater or equal than</span
-                    >
-                    <span>99999</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="queueCampaign-detail-form-container noanswer md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MOTIONDIALER.NOANSWER">
-                NOANSWER
-              </div>
-            </div>
-            <form name="noanswerForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.NOANSWERMAXRETRY"
-                  >NoAnswerMaxRetry</label
-                >
-                <input
-                  type="number"
-                  name="dialNoAnswerMaxRetry"
-                  ng-model="vm.queueCampaign.dialNoAnswerMaxRetry"
-                  min="1"
-                  max="999"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.NOANSWERMAXRETRY"></span>
-                </div>
-                <div
-                  ng-messages="noanswerForm['dialNoAnswerMaxRetry'].$error"
-                  ng-show="noanswerForm['dialNoAnswerMaxRetry'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.NOANSWERMAXRETRY_REQUIRED"
-                      >NoAnswerMaxRetry field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.NOANSWERMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >NoAnswerMaxRetry must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.NOANSWERMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >NoAnswerMaxRetry must be a valid greater or equal
-                      than</span
-                    >
-                    <span>999</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.NOANSWERRETRYTIME"
-                  >NoAnswerRetryTime</label
-                >
-                <input
-                  type="number"
-                  name="dialNoAnswerRetryFrequency"
-                  ng-model="vm.queueCampaign.dialNoAnswerRetryFrequency"
-                  min="1"
-                  max="99999"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.NOANSWERRETRYTIME"></span>
-                </div>
-                <div
-                  ng-messages="noanswerForm['dialNoAnswerRetryFrequency'].$error"
-                  ng-show="noanswerForm['dialNoAnswerRetryFrequency'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.NOANSWERRETRYTIME_REQUIRED"
-                      >NoAnswerRetryTime field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.NOANSWERRETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >NoAnswerRetryTime must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.NOANSWERRETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >NoAnswerRetryTime must be a valid greater or equal
-                      than</span
-                    >
-                    <span>99999</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="queueCampaign-detail-form-container nosuchnumber md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div
-                class="h2 secondary-text"
-                translate="MOTIONDIALER.NOSUCHNUMBER"
-              >
-                NOSUCHNUMBER
-              </div>
-            </div>
-            <form name="nosuchnumberForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.NOSUCHNUMBERMAXRETRY"
-                  >NoSuchNumberMaxRetry</label
-                >
-                <input
-                  type="number"
-                  name="dialNoSuchNumberMaxRetry"
-                  ng-model="vm.queueCampaign.dialNoSuchNumberMaxRetry"
-                  min="1"
-                  max="999"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.NOSUCHNUMBERMAXRETRY"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="nosuchnumberForm['dialNoSuchNumberMaxRetry'].$error"
-                  ng-show="nosuchnumberForm['dialNoSuchNumberMaxRetry'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.NOSUCHNUMBERMAXRETRY_REQUIRED"
-                      >NoSuchNumberMaxRetry field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.NOSUCHNUMBERMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >NoSuchNumberMaxRetry must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.NOSUCHNUMBERMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >NoSuchNumberMaxRetry must be a valid greater or equal
-                      than</span
-                    >
-                    <span>999</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.NOSUCHNUMBERRETRYTIME"
-                  >NoSuchNumberRetryTime</label
-                >
-                <input
-                  type="number"
-                  name="dialNoSuchNumberRetryFrequency"
-                  ng-model="vm.queueCampaign.dialNoSuchNumberRetryFrequency"
-                  min="1"
-                  max="99999"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.NOSUCHNUMBERRETRYTIME"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="nosuchnumberForm['dialNoSuchNumberRetryFrequency'].$error"
-                  ng-show="nosuchnumberForm['dialNoSuchNumberRetryFrequency'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.NOSUCHNUMBERRETRYTIME_REQUIRED"
-                      >NoSuchNumberRetryTime field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.NOSUCHNUMBERRETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >NoSuchNumberRetryTime must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.NOSUCHNUMBERRETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >NoSuchNumberRetryTime must be a valid greater or equal
-                      than</span
-                    >
-                    <span>99999</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="queueCampaign-detail-form-container drop md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MOTIONDIALER.DROP">
-                DROP
-              </div>
-            </div>
-            <form name="dropForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.DROPMAXRETRY"
-                  >DropMaxRetry</label
-                >
-                <input
-                  type="number"
-                  name="dialDropMaxRetry"
-                  ng-model="vm.queueCampaign.dialDropMaxRetry"
-                  min="1"
-                  max="999"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.DROPMAXRETRY"></span>
-                </div>
-                <div
-                  ng-messages="dropForm['dialDropMaxRetry'].$error"
-                  ng-show="dropForm['dialDropMaxRetry'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.DROPMAXRETRY_REQUIRED"
-                      >DropMaxRetry field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.DROPMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >DropMaxRetry must be a valid greater or equal than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.DROPMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >DropMaxRetry must be a valid greater or equal than</span
-                    >
-                    <span>999</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.DROPRETRYTIME"
-                  >DropRetryTime</label
-                >
-                <input
-                  type="number"
-                  name="dialDropRetryFrequency"
-                  ng-model="vm.queueCampaign.dialDropRetryFrequency"
-                  min="1"
-                  max="99999"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.DROPRETRYTIME"></span>
-                </div>
-                <div
-                  ng-messages="dropForm['dialDropRetryFrequency'].$error"
-                  ng-show="dropForm['dialDropRetryFrequency'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.DROPRETRYTIME_REQUIRED"
-                      >DropRetryTime field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.DROPRETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >DropRetryTime must be a valid greater or equal than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.DROPRETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >DropRetryTime must be a valid greater or equal than</span
-                    >
-                    <span>99999</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="queueCampaign-detail-form-container abandoned md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MOTIONDIALER.ABANDONED">
-                ABANDONED
-              </div>
-            </div>
-            <form name="abandonedForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.ABANDONEDMAXRETRY"
-                  >AbandonedMaxRetry</label
-                >
-                <input
-                  type="number"
-                  name="dialAbandonedMaxRetry"
-                  ng-model="vm.queueCampaign.dialAbandonedMaxRetry"
-                  min="1"
-                  max="999"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.ABANDONEDMAXRETRY"></span>
-                </div>
-                <div
-                  ng-messages="abandonedForm['dialAbandonedMaxRetry'].$error"
-                  ng-show="abandonedForm['dialAbandonedMaxRetry'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.ABANDONEDMAXRETRY_REQUIRED"
-                      >AbandonedMaxRetry field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.ABANDONEDMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AbandonedMaxRetry must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.ABANDONEDMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >AbandonedMaxRetry must be a valid greater or equal
-                      than</span
-                    >
-                    <span>999</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.ABANDONEDRETRYTIME"
-                  >AbandonedRetryTime</label
-                >
-                <input
-                  type="number"
-                  name="dialAbandonedRetryFrequency"
-                  ng-model="vm.queueCampaign.dialAbandonedRetryFrequency"
-                  min="1"
-                  max="99999"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.ABANDONEDRETRYTIME"></span>
-                </div>
-                <div
-                  ng-messages="abandonedForm['dialAbandonedRetryFrequency'].$error"
-                  ng-show="abandonedForm['dialAbandonedRetryFrequency'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.ABANDONEDRETRYTIME_REQUIRED"
-                      >AbandonedRetryTime field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.ABANDONEDRETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AbandonedRetryTime must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.ABANDONEDRETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >AbandonedRetryTime must be a valid greater or equal
-                      than</span
-                    >
-                    <span>99999</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="queueCampaign-detail-form-container machine md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MOTIONDIALER.MACHINE">
-                MACHINE
-              </div>
-            </div>
-            <form name="machineForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.MACHINEMAXRETRY"
-                  >MachineMaxRetry</label
-                >
-                <input
-                  type="number"
-                  name="dialMachineMaxRetry"
-                  ng-model="vm.queueCampaign.dialMachineMaxRetry"
-                  min="1"
-                  max="999"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.MACHINEMAXRETRY"></span>
-                </div>
-                <div
-                  ng-messages="machineForm['dialMachineMaxRetry'].$error"
-                  ng-show="machineForm['dialMachineMaxRetry'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.MACHINEMAXRETRY_REQUIRED"
-                      >MachineMaxRetry field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.MACHINEMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >MachineMaxRetry must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.MACHINEMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >MachineMaxRetry must be a valid greater or equal
-                      than</span
-                    >
-                    <span>999</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.MACHINERETRYTIME"
-                  >MachineRetryTime</label
-                >
-                <input
-                  type="number"
-                  name="dialMachineRetryFrequency"
-                  ng-model="vm.queueCampaign.dialMachineRetryFrequency"
-                  min="1"
-                  max="99999"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.MACHINERETRYTIME"></span>
-                </div>
-                <div
-                  ng-messages="machineForm['dialMachineRetryFrequency'].$error"
-                  ng-show="machineForm['dialMachineRetryFrequency'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.MACHINERETRYTIME_REQUIRED"
-                      >MachineRetryTime field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.MACHINERETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >MachineRetryTime must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.MACHINERETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >MachineRetryTime must be a valid greater or equal
-                      than</span
-                    >
-                    <span>99999</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="queueCampaign-detail-form-container agentreject md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div
-                class="h2 secondary-text"
-                translate="MOTIONDIALER.AGENTREJECT"
-              >
-                AGENTREJECT
-              </div>
-            </div>
-            <form name="agentrejectForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.AGENTREJECTMAXRETRY"
-                  >AgentRejectMaxRetry</label
-                >
-                <input
-                  type="number"
-                  name="dialAgentRejectMaxRetry"
-                  ng-model="vm.queueCampaign.dialAgentRejectMaxRetry"
-                  min="1"
-                  max="999"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.AGENTREJECTMAXRETRY"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="agentrejectForm['dialAgentRejectMaxRetry'].$error"
-                  ng-show="agentrejectForm['dialAgentRejectMaxRetry'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AGENTREJECTMAXRETRY_REQUIRED"
-                      >AgentRejectMaxRetry field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AGENTREJECTMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AgentRejectMaxRetry must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AGENTREJECTMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >AgentRejectMaxRetry must be a valid greater or equal
-                      than</span
-                    >
-                    <span>999</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.AGENTREJECTRETRYTIME"
-                  >AgentRejectRetryTime</label
-                >
-                <input
-                  type="number"
-                  name="dialAgentRejectRetryFrequency"
-                  ng-model="vm.queueCampaign.dialAgentRejectRetryFrequency"
-                  min="1"
-                  max="99999"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.AGENTREJECTRETRYTIME"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="agentrejectForm['dialAgentRejectRetryFrequency'].$error"
-                  ng-show="agentrejectForm['dialAgentRejectRetryFrequency'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AGENTREJECTRETRYTIME_REQUIRED"
-                      >AgentRejectRetryTime field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AGENTREJECTRETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AgentRejectRetryTime must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AGENTREJECTRETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >AgentRejectRetryTime must be a valid greater or equal
-                      than</span
-                    >
-                    <span>99999</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="MOTIONDIALER.ADVANCED">ADVANCED</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            ng-if="vm.queueCampaign.dialMethod === 'progressive' || vm.queueCampaign.dialMethod === 'predictive' || vm.queueCampaign.dialMethod === 'power'"
-            class="queueCampaign-detail-form-container advanced md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MOTIONDIALER.ADVANCED">
-                ADVANCED
-              </div>
-            </div>
-            <form name="advancedForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.queueCampaign.acw"
-                  aria-label="AfterCallWork"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="MOTIONDIALER.AFTERCALLWORK"
-                    >AfterCallWork</span
-                  ></md-switch
-                >
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.AFTERCALLWORK"></span>
-                </div>
-              </md-input-container>
-              <md-input-container ng-if="vm.queueCampaign.acw" class="md-block">
-                <label translate="MOTIONDIALER.AFTERCALLWORKDURATION"
-                  >AfterCallWorkDuration</label
-                >
-                <input
-                  type="number"
-                  name="acwTimeout"
-                  ng-model="vm.queueCampaign.acwTimeout"
-                  min="0"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.AFTERCALLWORKDURATION"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['acwTimeout'].$error"
-                  ng-show="advancedForm['acwTimeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AFTERCALLWORKDURATION_REQUIRED"
-                      >AfterCallWorkDuration field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AFTERCALLWORKDURATION_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AfterCallWorkDuration must be a valid greater or equal
-                      than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.AUTOPAUSE">AutoPause</label>
-                <md-select
-                  name="autopause"
-                  ng-model="vm.queueCampaign.autopause"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'all'">
-                    {{ 'MOTIONDIALER.YES' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'no'">
-                    {{ 'MOTIONDIALER.NO' | translate }}
-                  </md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.AUTOPAUSE"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['autopause'].$error"
-                  ng-show="advancedForm['autopause'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.AUTOPAUSE_REQUIRED"
-                      >AutoPause field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.RINGINUSE">RingInUse</label>
-                <md-select
-                  name="ringinuse"
-                  ng-model="vm.queueCampaign.ringinuse"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">
-                    {{ 'MOTIONDIALER.YES' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'no'">
-                    {{ 'MOTIONDIALER.NO' | translate }}
-                  </md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.RINGINUSE"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['ringinuse'].$error"
-                  ng-show="advancedForm['ringinuse'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.RINGINUSE_REQUIRED"
-                      >RingInUse field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.MEMBERDELAY">MemberDelay</label>
-                <input
-                  type="number"
-                  name="memberdelay"
-                  ng-model="vm.queueCampaign.memberdelay"
-                  min="0"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.MEMBERDELAY"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['memberdelay'].$error"
-                  ng-show="advancedForm['memberdelay'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.MEMBERDELAY_REQUIRED"
-                      >MemberDelay field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.MEMBERDELAY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >MemberDelay must be a valid greater or equal than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.TIMEOUTRESTART"
-                  >TimeoutRestart</label
-                >
-                <md-select
-                  name="timeoutrestart"
-                  ng-model="vm.queueCampaign.timeoutrestart"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">
-                    {{ 'MOTIONDIALER.YES' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'no'">
-                    {{ 'MOTIONDIALER.NO' | translate }}
-                  </md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.TIMEOUTRESTART"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['timeoutrestart'].$error"
-                  ng-show="advancedForm['timeoutrestart'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.TIMEOUTRESTART_REQUIRED"
-                      >TimeoutRestart field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.MONITORFORMAT"
-                  >MonitorFormat</label
-                >
-                <md-select
-                  name="monitor_format"
-                  ng-model="vm.queueCampaign.monitor_format"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="''">Inactive</md-option>
-                  <md-option ng-value="'wav'">wav</md-option>
-                  <md-option ng-value="'wav49'">wav49</md-option>
-                  <md-option ng-value="'gsm'">gsm</md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.MONITORFORMAT"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['monitor_format'].$error"
-                  ng-show="advancedForm['monitor_format'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.MONITORFORMAT_REQUIRED"
-                      >MonitorFormat field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.CONTEXT">Context</label>
-                <input
-                  type="text"
-                  name="context"
-                  ng-model="vm.queueCampaign.context"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.CONTEXT"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['context'].$error"
-                  ng-show="advancedForm['context'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.CONTEXT_REQUIRED"
-                      >Context field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.SETINTERFACEVARIABLES"
-                  >SetInterfaceVariables</label
-                >
-                <md-select
-                  name="setinterfacevar"
-                  ng-model="vm.queueCampaign.setinterfacevar"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">
-                    {{ 'MOTIONDIALER.YES' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'no'">
-                    {{ 'MOTIONDIALER.NO' | translate }}
-                  </md-option>
-                </md-select>
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.SETINTERFACEVARIABLES"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['setinterfacevar'].$error"
-                  ng-show="advancedForm['setinterfacevar'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.SETINTERFACEVARIABLES_REQUIRED"
-                      >SetInterfaceVariables field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.SETQUEUEVARIABLES"
-                  >SetQueueVariables</label
-                >
-                <md-select
-                  name="setqueuevar"
-                  ng-model="vm.queueCampaign.setqueuevar"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">
-                    {{ 'MOTIONDIALER.YES' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'no'">
-                    {{ 'MOTIONDIALER.NO' | translate }}
-                  </md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.SETQUEUEVARIABLES"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['setqueuevar'].$error"
-                  ng-show="advancedForm['setqueuevar'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.SETQUEUEVARIABLES_REQUIRED"
-                      >SetQueueVariables field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.SETQUEUEENTRYVARIABLES"
-                  >SetQueueEntryVariables</label
-                >
-                <md-select
-                  name="setqueueentryvar"
-                  ng-model="vm.queueCampaign.setqueueentryvar"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">
-                    {{ 'MOTIONDIALER.YES' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'no'">
-                    {{ 'MOTIONDIALER.NO' | translate }}
-                  </md-option>
-                </md-select>
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.SETQUEUEENTRYVARIABLES"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['setqueueentryvar'].$error"
-                  ng-show="advancedForm['setqueueentryvar'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.SETQUEUEENTRYVARIABLES_REQUIRED"
-                      >SetQueueEntryVariables field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.DIALORDERBYSCHEDULEDAT"
-                  >DialOrderByScheduledAt</label
-                >
-                <md-select
-                  name="dialOrderByScheduledAt"
-                  ng-model="vm.queueCampaign.dialOrderByScheduledAt"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'DESC'">
-                    {{ 'MOTIONDIALER.DESC' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'ASC'">
-                    {{ 'MOTIONDIALER.ASC' | translate }}
-                  </md-option>
-                </md-select>
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.DIALORDERBYSCHEDULEDAT"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['dialOrderByScheduledAt'].$error"
-                  ng-show="advancedForm['dialOrderByScheduledAt'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.DIALORDERBYSCHEDULEDAT_REQUIRED"
-                      >DialOrderByScheduledAt field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.queueCampaign.mandatoryDisposition"
-                  aria-label="MandatoryDisposition"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="MOTIONDIALER.MANDATORYDISPOSITION"
-                    >MandatoryDisposition</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.queueCampaign.mandatoryDisposition"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.MANDATORYDISPOSITIONPAUSEID"
-                  >MandatoryDispositionPauseId</label
-                >
-                <md-select
-                  name="mandatoryDispositionPauseId"
-                  ng-model="vm.queueCampaign.mandatoryDispositionPauseId"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="mandatoryDispositionPauseId.id"
-                    ng-repeat="mandatoryDispositionPauseId in vm.pauses"
-                    ng-disabled="mandatoryDispositionPauseId.canSelect === false"
-                    >{{ mandatoryDispositionPauseId.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.MANDATORYDISPOSITIONPAUSEID"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['mandatoryDispositionPauseId'].$error"
-                  ng-show="advancedForm['mandatoryDispositionPauseId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.MANDATORYDISPOSITIONPAUSEID_REQUIRED"
-                      >MandatoryDispositionPauseId field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            ng-if="vm.queueCampaign.dialMethod === 'preview' || vm.queueCampaign.dialMethod === 'booked'"
-            class="queueCampaign-detail-form-container advancedpreview md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div
-                class="h2 secondary-text"
-                translate="MOTIONDIALER.ADVANCEDPREVIEW"
-              >
-                ADVANCEDPREVIEW
-              </div>
-            </div>
-            <form name="advancedpreviewForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.queueCampaign.acw"
-                  aria-label="AfterCallWork"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="MOTIONDIALER.AFTERCALLWORK"
-                    >AfterCallWork</span
-                  ></md-switch
-                >
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.AFTERCALLWORK"></span>
-                </div>
-              </md-input-container>
-              <md-input-container ng-if="vm.queueCampaign.acw" class="md-block">
-                <label translate="MOTIONDIALER.AFTERCALLWORKDURATION"
-                  >AfterCallWorkDuration</label
-                >
-                <input
-                  type="number"
-                  name="acwTimeout"
-                  ng-model="vm.queueCampaign.acwTimeout"
-                  min="0"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.AFTERCALLWORKDURATION"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="advancedpreviewForm['acwTimeout'].$error"
-                  ng-show="advancedpreviewForm['acwTimeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AFTERCALLWORKDURATION_REQUIRED"
-                      >AfterCallWorkDuration field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AFTERCALLWORKDURATION_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AfterCallWorkDuration must be a valid greater or equal
-                      than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.MONITORFORMAT"
-                  >MonitorFormat</label
-                >
-                <md-select
-                  name="monitor_format"
-                  ng-model="vm.queueCampaign.monitor_format"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="''">Inactive</md-option>
-                  <md-option ng-value="'wav'">wav</md-option>
-                  <md-option ng-value="'wav49'">wav49</md-option>
-                  <md-option ng-value="'gsm'">gsm</md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.MONITORFORMAT"></span>
-                </div>
-                <div
-                  ng-messages="advancedpreviewForm['monitor_format'].$error"
-                  ng-show="advancedpreviewForm['monitor_format'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.MONITORFORMAT_REQUIRED"
-                      >MonitorFormat field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.DIALORDERBYSCHEDULEDAT"
-                  >DialOrderByScheduledAt</label
-                >
-                <md-select
-                  name="dialOrderByScheduledAt"
-                  ng-model="vm.queueCampaign.dialOrderByScheduledAt"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'DESC'">
-                    {{ 'MOTIONDIALER.DESC' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'ASC'">
-                    {{ 'MOTIONDIALER.ASC' | translate }}
-                  </md-option>
-                </md-select>
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.DIALORDERBYSCHEDULEDAT"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="advancedpreviewForm['dialOrderByScheduledAt'].$error"
-                  ng-show="advancedpreviewForm['dialOrderByScheduledAt'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.DIALORDERBYSCHEDULEDAT_REQUIRED"
-                      >DialOrderByScheduledAt field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.queueCampaign.mandatoryDisposition"
-                  aria-label="MandatoryDisposition"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="MOTIONDIALER.MANDATORYDISPOSITION"
-                    >MandatoryDisposition</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.queueCampaign.mandatoryDisposition"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.MANDATORYDISPOSITIONPAUSEID"
-                  >MandatoryDispositionPauseId</label
-                >
-                <md-select
-                  name="mandatoryDispositionPauseId"
-                  ng-model="vm.queueCampaign.mandatoryDispositionPauseId"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="mandatoryDispositionPauseId.id"
-                    ng-repeat="mandatoryDispositionPauseId in vm.pauses"
-                    ng-disabled="mandatoryDispositionPauseId.canSelect === false"
-                    >{{ mandatoryDispositionPauseId.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.MANDATORYDISPOSITIONPAUSEID"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="advancedpreviewForm['mandatoryDispositionPauseId'].$error"
-                  ng-show="advancedpreviewForm['mandatoryDispositionPauseId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.MANDATORYDISPOSITIONPAUSEID_REQUIRED"
-                      >MandatoryDispositionPauseId field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            ng-if="vm.queueCampaign.dialMethod === 'predictive'"
-            class="queueCampaign-detail-form-container thresholds md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div
-                class="h2 secondary-text"
-                translate="MOTIONDIALER.THRESHOLDS"
-              >
-                THRESHOLDS
-              </div>
-            </div>
-            <form name="thresholdsForm" novalidate>
-              <md-input-container
-                ng-if="vm.queueCampaign.dialMethod == 'predictive'"
-                class="md-block"
-              >
-                <span translate="MOTIONDIALER.PREDICTIVEMAXTHRESHOLD"
-                  >PredictiveMaxThreshold</span
-                >
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.PREDICTIVEMAXTHRESHOLD"
-                  ></span>
-                </div>
-                <md-slider
-                  md-discrete
-                  flex
-                  ng-model="vm.queueCampaign.dialPredictiveIntervalMaxThreshold"
-                  min="1"
-                  max="100"
-                  step="1"
-                  class="md-accent"
-                ></md-slider>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.queueCampaign.dialMethod == 'predictive'"
-                class="md-block"
-              >
-                <span translate="MOTIONDIALER.PREDICTIVEMINTHRESHOLD"
-                  >PredictiveMinThreshold</span
-                >
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.PREDICTIVEMINTHRESHOLD"
-                  ></span>
-                </div>
-                <md-slider
-                  md-discrete
-                  flex
-                  ng-model="vm.queueCampaign.dialPredictiveIntervalMinThreshold"
-                  min="1"
-                  max="100"
-                  step="1"
-                  class="md-accent"
-                ></md-slider>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="queueCampaign-detail-form-container recallme md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MOTIONDIALER.RECALLME">
-                RECALLME
-              </div>
-            </div>
-            <form name="recallmeForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.DIALRECALLMETIMEOUT"
-                  >DialRecallMeTimeout</label
-                >
-                <input
-                  type="number"
-                  name="dialRecallMeTimeout"
-                  ng-model="vm.queueCampaign.dialRecallMeTimeout"
-                  min="1"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.DIALRECALLMETIMEOUT"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="recallmeForm['dialRecallMeTimeout'].$error"
-                  ng-show="recallmeForm['dialRecallMeTimeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.DIALRECALLMETIMEOUT_REQUIRED"
-                      >DialRecallMeTimeout field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.DIALRECALLMETIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >DialRecallMeTimeout must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.queueCampaign.dialRecallInQueue"
-                  aria-label="DialRecallInQueue"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="MOTIONDIALER.DIALRECALLINQUEUE"
-                    >DialRecallInQueue</span
-                  ></md-switch
-                >
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.DIALRECALLINQUEUE"></span>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            ng-if="vm.queueCampaign.dialMethod != 'preview'"
-            class="queueCampaign-detail-form-container globalinterval md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div
-                class="h2 secondary-text"
-                translate="MOTIONDIALER.GLOBALINTERVAL"
-              >
-                GLOBALINTERVAL
-              </div>
-            </div>
-            <form name="globalintervalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.GLOBALINTERVAL"
-                  >GlobalInterval</label
-                >
-                <input
-                  type="text"
-                  name="dialGlobalInterval"
-                  ng-model="vm.queueCampaign.dialGlobalInterval"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.GLOBALINTERVAL"></span>
-                </div>
-                <div
-                  ng-messages="globalintervalForm['dialGlobalInterval'].$error"
-                  ng-show="globalintervalForm['dialGlobalInterval'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.GLOBALINTERVAL_REQUIRED"
-                      >GlobalInterval field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            ng-if="vm.queueCampaign.dialMethod != 'preview'"
-            class="queueCampaign-detail-form-container timezone md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MOTIONDIALER.TIMEZONE">
-                TIMEZONE
-              </div>
-            </div>
-            <form name="timezoneForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="MOTIONDIALER.TIMEZONE">Timezone</label>
-                <ms-timezone
-                  name="dialTimezone"
-                  ng-model="vm.queueCampaign.dialTimezone"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                ></ms-timezone>
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.TIMEZONE"></span>
-                </div>
-                <div
-                  ng-messages="timezoneForm['dialTimezone'].$error"
-                  ng-show="timezoneForm[dialTimezone].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.TIMEZONE_REQUIRED"
-                      >Timezone field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            ng-if="vm.queueCampaign.dialMethod === 'progressive' || vm.queueCampaign.dialMethod === 'predictive' || vm.queueCampaign.dialMethod === 'power'"
-            class="queueCampaign-detail-form-container amd md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="MOTIONDIALER.AMD">
-                AMD
-              </div>
-            </div>
-            <form name="amdForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.queueCampaign.dialAMDActive"
-                  aria-label="AMDActive"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="MOTIONDIALER.AMDACTIVE"
-                    >AMDActive</span
-                  ></md-switch
-                >
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.AMDACTIVE"></span>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.queueCampaign.dialAMDActive"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.AMDINITIALSILENCE"
-                  >AMDInitialSilence</label
-                >
-                <input
-                  type="number"
-                  name="dialAMDInitialSilence"
-                  ng-model="vm.queueCampaign.dialAMDInitialSilence"
-                  min="0"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.AMDINITIALSILENCE"></span>
-                </div>
-                <div
-                  ng-messages="amdForm['dialAMDInitialSilence'].$error"
-                  ng-show="amdForm['dialAMDInitialSilence'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDINITIALSILENCE_REQUIRED"
-                      >AMDInitialSilence field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDINITIALSILENCE_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AMDInitialSilence must be a valid greater or equal
-                      than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.queueCampaign.dialAMDActive"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.AMDGREETING">AMDGreeting</label>
-                <input
-                  type="number"
-                  name="dialAMDGreeting"
-                  ng-model="vm.queueCampaign.dialAMDGreeting"
-                  min="0"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.AMDGREETING"></span>
-                </div>
-                <div
-                  ng-messages="amdForm['dialAMDGreeting'].$error"
-                  ng-show="amdForm['dialAMDGreeting'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="MOTIONDIALER.ERRORS.AMDGREETING_REQUIRED"
-                      >AMDGreeting field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDGREETING_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AMDGreeting must be a valid greater or equal than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.queueCampaign.dialAMDActive"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.AMDAFTERGREETINGSILENCE"
-                  >AMDAfterGreetingSilence</label
-                >
-                <input
-                  type="number"
-                  name="dialAMDAfterGreetingSilence"
-                  ng-model="vm.queueCampaign.dialAMDAfterGreetingSilence"
-                  min="0"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.AMDAFTERGREETINGSILENCE"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="amdForm['dialAMDAfterGreetingSilence'].$error"
-                  ng-show="amdForm['dialAMDAfterGreetingSilence'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDAFTERGREETINGSILENCE_REQUIRED"
-                      >AMDAfterGreetingSilence field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDAFTERGREETINGSILENCE_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AMDAfterGreetingSilence must be a valid greater or equal
-                      than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.queueCampaign.dialAMDActive"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.AMDTOTALANALYSISTIME"
-                  >AMDTotalAnalysisTime</label
-                >
-                <input
-                  type="number"
-                  name="dialAMDTotalAnalysisTime"
-                  ng-model="vm.queueCampaign.dialAMDTotalAnalysisTime"
-                  min="0"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.AMDTOTALANALYSISTIME"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="amdForm['dialAMDTotalAnalysisTime'].$error"
-                  ng-show="amdForm['dialAMDTotalAnalysisTime'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDTOTALANALYSISTIME_REQUIRED"
-                      >AMDTotalAnalysisTime field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDTOTALANALYSISTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AMDTotalAnalysisTime must be a valid greater or equal
-                      than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.queueCampaign.dialAMDActive"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.AMDMINWORDLENGTH"
-                  >AMDMinWordLength</label
-                >
-                <input
-                  type="number"
-                  name="dialAMDMinWordLength"
-                  ng-model="vm.queueCampaign.dialAMDMinWordLength"
-                  min="0"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="MOTIONDIALER.HELP.AMDMINWORDLENGTH"></span>
-                </div>
-                <div
-                  ng-messages="amdForm['dialAMDMinWordLength'].$error"
-                  ng-show="amdForm['dialAMDMinWordLength'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDMINWORDLENGTH_REQUIRED"
-                      >AMDMinWordLength field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDMINWORDLENGTH_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AMDMinWordLength must be a valid greater or equal
-                      than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.queueCampaign.dialAMDActive"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.AMDBETWEENWORDSSILENCE"
-                  >AMDBetweenWordsSilence</label
-                >
-                <input
-                  type="number"
-                  name="dialAMDBetweenWordsSilence"
-                  ng-model="vm.queueCampaign.dialAMDBetweenWordsSilence"
-                  min="0"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.AMDBETWEENWORDSSILENCE"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="amdForm['dialAMDBetweenWordsSilence'].$error"
-                  ng-show="amdForm['dialAMDBetweenWordsSilence'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDBETWEENWORDSSILENCE_REQUIRED"
-                      >AMDBetweenWordsSilence field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDBETWEENWORDSSILENCE_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AMDBetweenWordsSilence must be a valid greater or equal
-                      than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.queueCampaign.dialAMDActive"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.AMDMAXIMUMNUMBEROFWORDS"
-                  >AMDMaximumNumberOfWords</label
-                >
-                <input
-                  type="number"
-                  name="dialAMDMaximumNumberOfWords"
-                  ng-model="vm.queueCampaign.dialAMDMaximumNumberOfWords"
-                  min="0"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.AMDMAXIMUMNUMBEROFWORDS"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="amdForm['dialAMDMaximumNumberOfWords'].$error"
-                  ng-show="amdForm['dialAMDMaximumNumberOfWords'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDMAXIMUMNUMBEROFWORDS_REQUIRED"
-                      >AMDMaximumNumberOfWords field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDMAXIMUMNUMBEROFWORDS_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AMDMaximumNumberOfWords must be a valid greater or equal
-                      than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.queueCampaign.dialAMDActive"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.AMDSILENCETHRESHOLD"
-                  >AMDSilenceThreshold</label
-                >
-                <input
-                  type="number"
-                  name="dialAMDSilenceThreshold"
-                  ng-model="vm.queueCampaign.dialAMDSilenceThreshold"
-                  min="0"
-                  max="32767"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.AMDSILENCETHRESHOLD"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="amdForm['dialAMDSilenceThreshold'].$error"
-                  ng-show="amdForm['dialAMDSilenceThreshold'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDSILENCETHRESHOLD_REQUIRED"
-                      >AMDSilenceThreshold field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDSILENCETHRESHOLD_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AMDSilenceThreshold must be a valid greater or equal
-                      than</span
-                    >
-                    <span>0</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDSILENCETHRESHOLD_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >AMDSilenceThreshold must be a valid greater or equal
-                      than</span
-                    >
-                    <span>32767</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.queueCampaign.dialAMDActive"
-                class="md-block"
-              >
-                <label translate="MOTIONDIALER.AMDMAXIMUMWORDLENGTH"
-                  >AMDMaximumWordLength</label
-                >
-                <input
-                  type="number"
-                  name="dialAMDMaximumWordLength"
-                  ng-model="vm.queueCampaign.dialAMDMaximumWordLength"
-                  min="0"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span
-                    translate="MOTIONDIALER.HELP.AMDMAXIMUMWORDLENGTH"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="amdForm['dialAMDMaximumWordLength'].$error"
-                  ng-show="amdForm['dialAMDMaximumWordLength'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDMAXIMUMWORDLENGTH_REQUIRED"
-                      >AMDMaximumWordLength field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="MOTIONDIALER.ERRORS.AMDMAXIMUMWORDLENGTH_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AMDMaximumWordLength must be a valid greater or equal
-                      than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="MOTIONDIALER.HOPPERS">HOPPERS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="queueCampaign-detail-form-container hopperstatistics md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="QueueCampaignHopperStatisticsController as vm_hs"
-              ng-init="vm_hs.init(vm.queueCampaign)"
-            >
-              <md-toolbar class="md-table-toolbar md-default">
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead" translate="MOTIONDIALER.HOPPERWIDGET"
-                    >Hoppers</span
-                  >
-                  <div flex></div>
-                  <md-button
-                    class="md-icon-button"
-                    ng-click="vm_hs.init(vm.queueCampaign)"
-                    aria-label="refresh Hopper"
-                    translate
-                    translate-attr-label="MOTIONDIALER.REFRESH_HOPPERS"
-                  >
-                    <md-icon md-font-icon="icon-refresh"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <!-- WIDGET GROUP -->
-              <div class="widget-group" layout="row" flex="100" layout-wrap>
-                <!-- WIDGET 1 -->
-                <ms-widget
-                  class="h-140"
-                  layout="column"
-                  flex="100"
-                  flex-gt-xs="50"
-                  flex-gt-md="25"
-                >
-                  <!-- Front -->
-                  <ms-widget-front class="p-16 white-bg" layout="row" flex>
-                    <div
-                      class="pt-8 pb-8"
-                      layout="column"
-                      layout-align="center center"
-                      flex
-                    >
-                      <div class="md-display-1 pb-8">
-                        {{(vm_hs.total || 0) + (vm_hs.closed || 0)}}
-                      </div>
-                      <div class="font-weight-500 secondary-text">
-                        {{ 'MOTIONDIALER.TOTAL' | translate }}
-                      </div>
-                    </div>
-                  </ms-widget-front>
-                  <!-- / Front -->
-                </ms-widget>
-                <!-- / WIDGET 1 -->
-
-                <!-- WIDGET 2 -->
-                <ms-widget
-                  class="h-140"
-                  layout="column"
-                  flex="100"
-                  flex-gt-xs="50"
-                  flex-gt-md="25"
-                >
-                  <!-- Front -->
-                  <ms-widget-front class="p-16 white-bg" layout="row" flex>
-                    <div
-                      class="pt-8 pb-8"
-                      layout="column"
-                      layout-align="center center"
-                      flex
-                    >
-                      <div class="md-display-1 pb-8">
-                        {{vm_hs.fresh || 0}} ({{vm_hs.total ? ((((vm_hs.fresh ||
-                        0) * 100)/((vm_hs.closed || 0) + (vm_hs.total || 0))) |
-                        number: 2) : 0}}%)
-                      </div>
-                      <div class="font-weight-500 secondary-text">
-                        {{ 'MOTIONDIALER.FRESH' | translate }}
-                      </div>
-                    </div>
-                  </ms-widget-front>
-                  <!-- / Front -->
-                </ms-widget>
-                <!-- / WIDGET 2 -->
-
-                <!-- WIDGET 3 -->
-                <ms-widget
-                  class="h-140"
-                  layout="column"
-                  flex="100"
-                  flex-gt-xs="50"
-                  flex-gt-md="25"
-                >
-                  <!-- Front -->
-                  <ms-widget-front class="p-16 white-bg" layout="row" flex>
-                    <div
-                      class="pt-8 pb-8"
-                      layout="column"
-                      layout-align="center center"
-                      flex
-                    >
-                      <div class="md-display-1 pb-8">
-                        {{vm_hs.total ? (vm_hs.total - (vm_hs.fresh || 0)) : 0}}
-                        ({{vm_hs.total ? ((((vm_hs.total - (vm_hs.fresh || 0)) *
-                        100)/((vm_hs.closed || 0) + (vm_hs.total || 0))) |
-                        number: 2) : 0}}%)
-                      </div>
-                      <div class="font-weight-500 secondary-text">
-                        {{ 'MOTIONDIALER.OPEN' | translate }}
-                      </div>
-                    </div>
-                  </ms-widget-front>
-                  <!-- / Front -->
-                </ms-widget>
-                <!-- / WIDGET 3 -->
-
-                <!-- WIDGET 3 -->
-                <ms-widget
-                  class="h-140"
-                  layout="column"
-                  flex="100"
-                  flex-gt-xs="50"
-                  flex-gt-md="25"
-                >
-                  <!-- Front -->
-                  <ms-widget-front class="p-16 white-bg" layout="row" flex>
-                    <div
-                      class="pt-8 pb-8"
-                      layout="column"
-                      layout-align="center center"
-                      flex
-                    >
-                      <div class="md-display-1 pb-8">
-                        {{vm_hs.closed ? (vm_hs.closed || 0) : 0}}
-                        ({{vm_hs.closed ? ((((vm_hs.closed) * 100)/(vm_hs.closed
-                        + (vm_hs.total || 0))) | number: 2) : 0}}%)
-                      </div>
-                      <div class="font-weight-500 secondary-text">
-                        {{ 'MOTIONDIALER.CLOSED' | translate }}
-                      </div>
-                    </div>
-                  </ms-widget-front>
-                  <!-- / Front -->
-                </ms-widget>
-                <!-- / WIDGET 3 -->
-              </div>
-              <!-- / WIDGET GROUP -->
-            </div>
-          </div>
-          <div
-            class="queueCampaign-detail-form-container hoppers md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="QueueCampaignHoppersController as vm_dc"
-              ng-init="vm_dc.init(vm.queueCampaign, vm.crudPermissions)"
-            >
-              <md-toolbar
-                class="md-table-toolbar md-default"
-                ng-hide="vm_dc.selectedQueueCampaignHoppers.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead" translate="MOTIONDIALER.HOPPERS"
-                    >Hoppers</span
-                  >
-                  <ms-search-bar
-                    on-search="vm_dc.query.filter = query"
-                    on-collapse="vm_dc.query.filter = undefined"
-                    debounce="300"
-                    direction="down"
-                  ></ms-search-bar>
-                  <div flex></div>
-                  <md-button
-                    class="md-icon-button"
-                    ng-click="vm_dc.getQueueCampaignHoppers()"
-                    aria-label="refresh Hoppers"
-                    translate
-                    translate-attr-label="MOTIONDIALER.REFRESH_HOPPERS"
-                  >
-                    <md-icon md-font-icon="icon-refresh"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-toolbar
-                class="md-table-toolbar md-accent"
-                ng-show="vm_dc.selectedQueueCampaignHoppers.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead"
-                    >{{vm_dc.selectedQueueCampaignHoppers.length}}
-                    {{vm_dc.selectedQueueCampaignHoppers.length > 1 ? 'items' :
-                    'item'}} selected</span
-                  >
-                  <div flex></div>
-                  <button
-                    class="md-icon-button"
-                    ng-csv="vm_dc.exportSelectedQueueCampaignHoppers"
-                    csv-label="true"
-                    filename="queueCampaigns.csv"
-                  >
-                    <md-icon md-font-icon="icon-file-excel"></md-icon>
-                  </button>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canDelete"
-                    class="md-icon-button"
-                    ng-click="vm_dc.deleteSelectedQueueCampaignHoppers($event)"
-                    aria-label="delete selected"
-                    translate
-                    translate-attr-label="MOTIONDIALER.DELETE_SELECTED"
-                  >
-                    <md-icon md-font-icon="icon-delete"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-table-container class="font-size-12">
-                <table
-                  md-table
-                  md-row-select
-                  multiple
-                  ng-model="vm_dc.selectedQueueCampaignHoppers"
-                  md-progress="vm_dc.promise"
-                >
-                  <thead
-                    md-head
-                    md-order="vm_dc.query.sort"
-                    md-on-reorder="vm_dc.getQueueCampaignHoppers"
-                  >
-                    <tr md-row>
-                      <th md-column md-order-by="ContactId">
-                        {{ 'MOTIONDIALER.CONTACTID' | translate }}
-                      </th>
-                      <th md-column md-order-by="phone">
-                        {{ 'MOTIONDIALER.PHONE' | translate }}
-                      </th>
-                      <th md-column md-order-by="countcongestionretry">
-                        {{ 'MOTIONDIALER.CONGESTION' | translate }}
-                      </th>
-                      <th md-column md-order-by="countbusyretry">
-                        {{ 'MOTIONDIALER.BUSY' | translate }}
-                      </th>
-                      <th md-column md-order-by="countnoanswerretry">
-                        {{ 'MOTIONDIALER.NOANSWER' | translate }}
-                      </th>
-                      <th md-column md-order-by="countnosuchnumberretry">
-                        {{ 'MOTIONDIALER.NOSUCHNUMBER' | translate }}
-                      </th>
-                      <th md-column md-order-by="countdropretry">
-                        {{ 'MOTIONDIALER.DROP' | translate }}
-                      </th>
-                      <th md-column md-order-by="countabandonedretry">
-                        {{ 'MOTIONDIALER.ABANDONED' | translate }}
-                      </th>
-                      <th md-column md-order-by="countmachineretry">
-                        {{ 'MOTIONDIALER.MACHINE' | translate }}
-                      </th>
-                      <th md-column md-order-by="countagentrejectretry">
-                        {{ 'MOTIONDIALER.AGENTREJECT' | translate }}
-                      </th>
-                      <th md-column md-order-by="scheduledat">
-                        {{ 'MOTIONDIALER.SCHEDULEDAT' | translate }}
-                      </th>
-                      <th md-column md-order-by="priority">
-                        {{ 'MOTIONDIALER.PRIORITY' | translate }}
-                      </th>
-                      <th md-column md-order-by="recallme">
-                        {{ 'MOTIONDIALER.RECALLAGENT' | translate }}
-                      </th>
-                      <th md-column width="10px"></th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr
-                      md-row
-                      md-select="hopper"
-                      md-select-id="id"
-                      ng-repeat="hopper in vm_dc.queueCampaignHoppers.rows"
-                    >
-                      <td
-                        ng-click="vm_dc.createOrEditQueueCampaignHopper($event, hopper)"
-                        md-cell
-                      >
-                        {{hopper.ContactId}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditQueueCampaignHopper($event, hopper)"
-                        md-cell
-                      >
-                        {{hopper.phone}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditQueueCampaignHopper($event, hopper)"
-                        md-cell
-                      >
-                        {{hopper.countcongestionretry}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditQueueCampaignHopper($event, hopper)"
-                        md-cell
-                      >
-                        {{hopper.countbusyretry}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditQueueCampaignHopper($event, hopper)"
-                        md-cell
-                      >
-                        {{hopper.countnoanswerretry}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditQueueCampaignHopper($event, hopper)"
-                        md-cell
-                      >
-                        {{hopper.countnosuchnumberretry}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditQueueCampaignHopper($event, hopper)"
-                        md-cell
-                      >
-                        {{hopper.countdropretry}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditQueueCampaignHopper($event, hopper)"
-                        md-cell
-                      >
-                        {{hopper.countabandonedretry}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditQueueCampaignHopper($event, hopper)"
-                        md-cell
-                      >
-                        {{hopper.countmachineretry}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditQueueCampaignHopper($event, hopper)"
-                        md-cell
-                      >
-                        {{hopper.countagentrejectretry}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditQueueCampaignHopper($event, hopper)"
-                        md-cell
-                      >
-                        {{ hopper.scheduledat | formatdate }}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditQueueCampaignHopper($event, hopper)"
-                        md-cell
-                      >
-                        {{ vm_dc.arraypriority[hopper.priority].option }}
-                      </td>
-
-                      <td
-                        ng-click="vm_dc.createOrEditQueueCampaignHopper($event, hopper)"
-                        md-cell
-                        class="recallme"
-                      >
-                        <md-icon
-                          md-colors="{color: {{hopper.recallme ? '\'green\'' : '\'grey\''}}}"
-                          md-font-icon="{{hopper.recallme? 'icon-check' : 'icon-close'}}"
-                        ></md-icon>
-                      </td>
-                      <td
-                        md-cell
-                        class="actions"
-                        ng-if="!vm_dc.crudPermissions.readOnly"
-                      >
-                        <md-menu>
-                          <md-button
-                            class="md-icon-button"
-                            aria-label="More"
-                            translate
-                            translate-attr-aria-label="MOTIONDIALER.MORE"
-                            ng-click="$mdOpenMenu($event)"
-                          >
-                            <md-icon
-                              md-font-icon="icon-dots-vertical"
-                            ></md-icon>
-                          </md-button>
-
-                          <md-menu-content width="3">
-                            <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
-                              <md-button
-                                ng-click="vm_dc.createOrEditQueueCampaignHopper($event, hopper)"
-                                translate="MOTIONDIALER.EDIT_HOPPER"
-                              >
-                                Edit Hopper
-                              </md-button>
-                            </md-menu-item>
-                            <md-menu-item
-                              ng-if="vm_dc.crudPermissions.canDelete"
-                            >
-                              <md-button
-                                ng-click="vm_dc.deleteConfirm(hopper, $event)"
-                                translate="MOTIONDIALER.DELETE_HOPPER"
-                              >
-                                Delete Hopper
-                              </md-button>
-                            </md-menu-item>
-                          </md-menu-content>
-                        </md-menu>
-                      </td>
-                    </tr>
-                    <tr md-row ng-if="!vm_dc.queueCampaignHoppers.rows.length">
-                      <td md-cell colspan="17">
-                        <div layout="row" layout-align="center center">
-                          <span
-                            class="text-boxed-light"
-                            translate="MOTIONDIALER.NO_HOPPER_AVAILABLE"
-                            >No hopper available</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-              <md-table-pagination
-                md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
-                md-limit="vm_dc.query.limit"
-                md-limit-options="[10, 15, 20, 50, 100, 250]"
-                md-page="vm_dc.query.page"
-                md-total="{{vm_dc.queueCampaignHoppers.count}}"
-                md-on-paginate="vm_dc.getQueueCampaignHoppers"
-                md-page-select
-              ></md-table-pagination>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="MOTIONDIALER.HISTORY">HISTORY</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="queueCampaign-detail-form-container hopperhistories md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="QueueCampaignHopperHistoriesController as vm_dc"
-              ng-init="vm_dc.init(vm.queueCampaign, vm.crudPermissions)"
-            >
-              <md-toolbar
-                class="md-table-toolbar md-default"
-                ng-hide="vm_dc.selectedQueueCampaignHopperHistories.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span
-                    class="md-subhead"
-                    translate="MOTIONDIALER.HOPPERHISTORIES"
-                    >HopperHistories</span
-                  >
-                  <ms-search-bar
-                    on-search="vm_dc.query.filter = query"
-                    on-collapse="vm_dc.query.filter = undefined"
-                    debounce="300"
-                    direction="down"
-                  ></ms-search-bar>
-                  <div flex></div>
-                  <md-button
-                    class="md-icon-button"
-                    ng-click="vm_dc.getQueueCampaignHopperHistories()"
-                    aria-label="refresh HopperHistories"
-                    translate
-                    translate-attr-label="MOTIONDIALER.REFRESH_HOPPERHISTORIES"
-                  >
-                    <md-icon md-font-icon="icon-refresh"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-toolbar
-                class="md-table-toolbar md-accent"
-                ng-show="vm_dc.selectedQueueCampaignHopperHistories.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead"
-                    >{{vm_dc.selectedQueueCampaignHopperHistories.length}}
-                    {{vm_dc.selectedQueueCampaignHopperHistories.length > 1 ?
-                    'items' : 'item'}} selected</span
-                  >
-                  <div flex></div>
-                  <button
-                    class="md-icon-button"
-                    ng-csv="vm_dc.exportSelectedQueueCampaignHopperHistories"
-                    csv-label="true"
-                    filename="queueCampaigns.csv"
-                  >
-                    <md-icon md-font-icon="icon-file-excel"></md-icon>
-                  </button>
-                </div>
-              </md-toolbar>
-              <md-table-container class="font-size-12">
-                <table
-                  md-table
-                  md-row-select
-                  multiple
-                  ng-model="vm_dc.selectedQueueCampaignHopperHistories"
-                  md-progress="vm_dc.promise"
-                >
-                  <thead
-                    md-head
-                    md-order="vm_dc.query.sort"
-                    md-on-reorder="vm_dc.getQueueCampaignHopperHistories"
-                  >
-                    <tr md-row>
-                      <th md-column md-order-by="uniqueid">
-                        {{ 'MOTIONDIALER.UNIQUEID' | translate }}
-                      </th>
-                      <th md-column md-order-by="ContactId">
-                        {{ 'MOTIONDIALER.CONTACTID' | translate }}
-                      </th>
-                      <th md-column md-order-by="calleridnum">
-                        {{ 'MOTIONDIALER.PHONE' | translate }}
-                      </th>
-                      <th md-column md-order-by="calleridname">
-                        {{ 'MOTIONDIALER.NAME' | translate }}
-                      </th>
-                      <th md-column md-order-by="statedesc">
-                        {{ 'MOTIONDIALER.STATUS' | translate }}
-                      </th>
-                      <th md-column md-order-by="scheduledat">
-                        {{ 'MOTIONDIALER.SCHEDULEDAT' | translate }}
-                      </th>
-                      <th md-column md-order-by="starttime">
-                        {{ 'MOTIONDIALER.STARTTIME' | translate }}
-                      </th>
-                      <th md-column md-order-by="endtime">
-                        {{ 'MOTIONDIALER.ENDTIME' | translate }}
-                      </th>
-                      <th md-column width="10px"></th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr
-                      md-row
-                      md-select="hopperHistory"
-                      md-select-id="id"
-                      ng-repeat="hopperHistory in vm_dc.queueCampaignHopperHistories.rows"
-                    >
-                      <td md-cell>{{hopperHistory.uniqueid}}</td>
-                      <td md-cell>{{hopperHistory.ContactId}}</td>
-                      <td md-cell>{{hopperHistory.calleridnum}}</td>
-                      <td md-cell>{{hopperHistory.calleridname}}</td>
-                      <td md-cell>{{hopperHistory.statedesc}}</td>
-                      <td md-cell>
-                        {{ hopperHistory.scheduledat | formatdate }}
-                      </td>
-                      <td md-cell>
-                        {{ hopperHistory.starttime | formatdate }}
-                      </td>
-                      <td md-cell>{{ hopperHistory.endtime | formatdate }}</td>
-                      <td md-cell class="actions"></td>
-                    </tr>
-                    <tr
-                      md-row
-                      ng-if="!vm_dc.queueCampaignHopperHistories.rows.length"
-                    >
-                      <td md-cell colspan="11">
-                        <div layout="row" layout-align="center center">
-                          <span
-                            class="text-boxed-light"
-                            translate="MOTIONDIALER.NO_HOPPERHISTORY_AVAILABLE"
-                            >No hopperhistory available</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-              <md-table-pagination
-                md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
-                md-limit="vm_dc.query.limit"
-                md-limit-options="[10, 15, 20, 50, 100, 250]"
-                md-page="vm_dc.query.page"
-                md-total="{{vm_dc.queueCampaignHopperHistories.count}}"
-                md-on-paginate="vm_dc.getQueueCampaignHopperHistories"
-                md-page-select
-              ></md-table-pagination>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="MOTIONDIALER.FINAL">FINAL</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="queueCampaign-detail-form-container hopperfinals md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="QueueCampaignHopperFinalsController as vm_dc"
-              ng-init="vm_dc.init(vm.queueCampaign, vm.crudPermissions)"
-            >
-              <md-toolbar
-                class="md-table-toolbar md-default"
-                ng-hide="vm_dc.selectedQueueCampaignHopperFinals.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead" translate="MOTIONDIALER.HOPPERFINALS"
-                    >HopperFinals</span
-                  >
-                  <ms-search-bar
-                    on-search="vm_dc.query.filter = query"
-                    on-collapse="vm_dc.query.filter = undefined"
-                    debounce="300"
-                    direction="down"
-                  ></ms-search-bar>
-                  <div flex></div>
-                  <md-button
-                    class="md-icon-button"
-                    ng-click="vm_dc.getQueueCampaignHopperFinals()"
-                    aria-label="refresh HopperFinals"
-                    translate
-                    translate-attr-label="MOTIONDIALER.REFRESH_HOPPERFINALS"
-                  >
-                    <md-icon md-font-icon="icon-refresh"></md-icon>
-                  </md-button>
-                  <td md-cell class="actions">
-                    <md-menu>
-                      <md-button
-                        class="md-icon-button"
-                        aria-label="More"
-                        translate
-                        translate-attr-aria-label="MOTIONDIALER.MORE"
-                        ng-click="vm_dc.countContactsQueueCampaignHopperFinal(vm_dc.query.id); $mdOpenMenu($event);"
-                      >
-                        <md-icon md-font-icon="icon-backup-restore"></md-icon>
-                        <md-tooltip
-                          ><span translate="MOTIONDIALER.RESTORECONTACTS"></span
-                        ></md-tooltip>
-                      </md-button>
-                      <md-menu-content width="3">
-                        <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
-                          <md-button
-                            ng-click="vm_dc.moveContactsQueueCampaignHopperFinal(3)"
-                          >
-                            <span translate="MOTIONDIALER.NOANSWER "
-                              >NoAnswer</span
-                            >
-                            <span class="badge"
-                              >({{vm_dc.contacts.noAnswerContacts}})</span
-                            >
-                          </md-button>
-                        </md-menu-item>
-                        <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
-                          <md-button
-                            ng-click="vm_dc.moveContactsQueueCampaignHopperFinal(5)"
-                          >
-                            <span translate="MOTIONDIALER.BUSY ">Busy</span>
-                            <span class="badge"
-                              >({{vm_dc.contacts.busyContacts}})</span
-                            >
-                          </md-button>
-                        </md-menu-item>
-                        <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
-                          <md-button
-                            ng-click="vm_dc.moveContactsQueueCampaignHopperFinal(8)"
-                          >
-                            <span translate="MOTIONDIALER.CONGESTION "
-                              >Congestion</span
-                            >
-                            <span class="badge"
-                              >({{vm_dc.contacts.congestionContacts}})</span
-                            >
-                          </md-button>
-                        </md-menu-item>
-                        <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
-                          <md-button
-                            ng-click="vm_dc.moveContactsQueueCampaignHopperFinal(10)"
-                          >
-                            <span translate="MOTIONDIALER.DROPPED ">Drop</span>
-                            <span class="badge"
-                              >({{vm_dc.contacts.dropContacts}})</span
-                            >
-                          </md-button>
-                        </md-menu-item>
-                        <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
-                          <md-button
-                            ng-click="vm_dc.moveContactsQueueCampaignHopperFinal(11)"
-                          >
-                            <span translate="MOTIONDIALER.ABANDONED "
-                              >Abandoned</span
-                            >
-                            <span class="badge"
-                              >({{vm_dc.contacts.abandonedContacts}})</span
-                            >
-                          </md-button>
-                        </md-menu-item>
-                        <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
-                          <md-button
-                            ng-click="vm_dc.moveContactsQueueCampaignHopperFinal(22)"
-                          >
-                            <span translate="MOTIONDIALER.RECALLFAILEDTIMEOUT"
-                              >Recall</span
-                            >
-                            <span class="badge"
-                              >({{vm_dc.contacts.reCallContacts}})</span
-                            >
-                          </md-button>
-                        </md-menu-item>
-                        <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
-                          <md-button
-                            ng-click="vm_dc.moveContactsQueueCampaignHopperFinal(0)"
-                          >
-                            <span translate="MOTIONDIALER.NO_SUCH_NUMBER"
-                              >NoSuchNumber</span
-                            >
-                            <span class="badge"
-                              >({{vm_dc.contacts.noSuchContacts}})</span
-                            >
-                          </md-button>
-                        </md-menu-item>
-                        <md-menu-item>
-                          <md-button
-                            ng-click="vm_dc.moveContactsQueueCampaignHopperFinal(19)"
-                          >
-                            <span translate="MOTIONDIALER.ANSWERING_MACHINE"
-                              >AnsweringMachine</span
-                            >
-                            <span class="badge"
-                              >({{vm_dc.contacts.answeringMachine}})</span
-                            >
-                          </md-button>
-                        </md-menu-item>
-                      </md-menu-content>
-                    </md-menu>
-                  </td>
-                </div>
-              </md-toolbar>
-              <md-toolbar
-                class="md-table-toolbar md-accent"
-                ng-show="vm_dc.selectedQueueCampaignHopperFinals.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead"
-                    >{{vm_dc.selectedQueueCampaignHopperFinals.length}}
-                    {{vm_dc.selectedQueueCampaignHopperFinals.length > 1 ?
-                    'items' : 'item'}} selected</span
-                  >
-                  <div flex></div>
-                  <button
-                    class="md-icon-button"
-                    ng-csv="vm_dc.exportSelectedQueueCampaignHopperFinals"
-                    csv-label="true"
-                    filename="queueCampaigns.csv"
-                  >
-                    <md-icon md-font-icon="icon-file-excel"></md-icon>
-                  </button>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canEdit"
-                    class="md-icon-button"
-                    ng-click="vm_dc.moveSelectedQueueCampaignHopperFinals($event)"
-                    aria-label="move selected"
-                    translate
-                    translate-attr-label="MOTIONDIALER.MOVE_SELECTED"
-                  >
-                    <md-icon md-font-icon="icon-restore"></md-icon>
-                    <md-tooltip
-                      ><span translate="MOTIONDIALER.RESTORECONTACTS"></span
-                    ></md-tooltip>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-table-container class="font-size-12">
-                <table
-                  md-table
-                  md-row-select
-                  multiple
-                  ng-model="vm_dc.selectedQueueCampaignHopperFinals"
-                  md-progress="vm_dc.promise"
-                >
-                  <thead
-                    md-head
-                    md-order="vm_dc.query.sort"
-                    md-on-reorder="vm_dc.getQueueCampaignHopperFinals"
-                  >
-                    <tr md-row>
-                      <th md-column md-order-by="uniqueid">
-                        {{ 'MOTIONDIALER.UNIQUEID' | translate }}
-                      </th>
-                      <th md-column md-order-by="ContactId">
-                        {{ 'MOTIONDIALER.CONTACTID' | translate }}
-                      </th>
-                      <th md-column md-order-by="calleridnum">
-                        {{ 'MOTIONDIALER.PHONE' | translate }}
-                      </th>
-                      <th md-column md-order-by="calleridname">
-                        {{ 'MOTIONDIALER.NAME' | translate }}
-                      </th>
-                      <th md-column md-order-by="statedesc">
-                        {{ 'MOTIONDIALER.STATUS' | translate }}
-                      </th>
-                      <th md-column md-order-by="countcongestionretry">
-                        {{ 'MOTIONDIALER.CONGESTION' | translate }}
-                      </th>
-                      <th md-column md-order-by="countbusyretry">
-                        {{ 'MOTIONDIALER.BUSY' | translate }}
-                      </th>
-                      <th md-column md-order-by="countnoanswerretry">
-                        {{ 'MOTIONDIALER.NOANSWER' | translate }}
-                      </th>
-                      <th md-column md-order-by="countnosuchnumberretry">
-                        {{ 'MOTIONDIALER.NOSUCHNUMBER' | translate }}
-                      </th>
-                      <th md-column md-order-by="countdropretry">
-                        {{ 'MOTIONDIALER.DROP' | translate }}
-                      </th>
-                      <th md-column md-order-by="countabandonedretry">
-                        {{ 'MOTIONDIALER.ABANDONED' | translate }}
-                      </th>
-                      <th md-column md-order-by="countmachineretry">
-                        {{ 'MOTIONDIALER.MACHINE' | translate }}
-                      </th>
-                      <th md-column md-order-by="countagentrejectretry">
-                        {{ 'MOTIONDIALER.AGENTREJECT' | translate }}
-                      </th>
-                      <th md-column md-order-by="starttime">
-                        {{ 'MOTIONDIALER.STARTTIME' | translate }}
-                      </th>
-                      <th md-column md-order-by="endtime">
-                        {{ 'MOTIONDIALER.ENDTIME' | translate }}
-                      </th>
-                      <th md-column md-order-by="disposition">
-                        {{ 'MOTIONDIALER.DISPOSITION' | translate }}
-                      </th>
-                      <th md-column md-order-by="secondDisposition">
-                        {{ 'MOTIONDIALER.SECOND_LEVEL_DISPOSITION' | translate
-                        }}
-                      </th>
-                      <th md-column md-order-by="thirdDisposition">
-                        {{ 'MOTIONDIALER.THIRD_LEVEL_DISPOSITION' | translate }}
-                      </th>
-                      <th md-column width="10px"></th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr
-                      md-row
-                      md-select="hopperFinal"
-                      md-select-id="id"
-                      ng-repeat="hopperFinal in vm_dc.queueCampaignHopperFinals.rows"
-                    >
-                      <td md-cell>{{hopperFinal.uniqueid}}</td>
-                      <td md-cell>{{hopperFinal.ContactId}}</td>
-                      <td md-cell>{{hopperFinal.calleridnum}}</td>
-                      <td md-cell>{{hopperFinal.calleridname}}</td>
-                      <td md-cell>{{hopperFinal.statedesc}}</td>
-                      <td md-cell>{{hopperFinal.countcongestionretry}}</td>
-                      <td md-cell>{{hopperFinal.countbusyretry}}</td>
-                      <td md-cell>{{hopperFinal.countnoanswerretry}}</td>
-                      <td md-cell>{{hopperFinal.countnosuchnumberretry}}</td>
-                      <td md-cell>{{hopperFinal.countdropretry}}</td>
-                      <td md-cell>{{hopperFinal.countabandonedretry}}</td>
-                      <td md-cell>{{hopperFinal.countmachineretry}}</td>
-                      <td md-cell>{{hopperFinal.countagentrejectretry}}</td>
-                      <td md-cell>{{ hopperFinal.starttime | formatdate }}</td>
-                      <td md-cell>{{ hopperFinal.endtime | formatdate }}</td>
-                      <td md-cell>{{hopperFinal.disposition}}</td>
-                      <td md-cell>{{hopperFinal.secondDisposition}}</td>
-                      <td md-cell>{{hopperFinal.thirdDisposition}}</td>
-                      <td
-                        md-cell
-                        class="actions"
-                        ng-if="!vm_dc.crudPermissions.readOnly"
-                      >
-                        <md-menu>
-                          <md-button
-                            class="md-icon-button"
-                            aria-label="More"
-                            translate
-                            translate-attr-aria-label="MOTIONDIALER.MORE"
-                            ng-click="$mdOpenMenu($event)"
-                          >
-                            <md-icon
-                              md-font-icon="icon-dots-vertical"
-                            ></md-icon>
-                          </md-button>
-
-                          <md-menu-content width="3">
-                            <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
-                              <md-button
-                                ng-click="vm_dc.moveConfirm(hopperFinal, $event)"
-                                translate="MOTIONDIALER.MOVE_HOPPERFINAL"
-                              >
-                                Move HopperFinal
-                              </md-button>
-                            </md-menu-item>
-                          </md-menu-content>
-                        </md-menu>
-                      </td>
-                    </tr>
-                    <tr
-                      md-row
-                      ng-if="!vm_dc.queueCampaignHopperFinals.rows.length"
-                    >
-                      <td md-cell colspan="30">
-                        <div layout="row" layout-align="center center">
-                          <span
-                            class="text-boxed-light"
-                            translate="MOTIONDIALER.NO_HOPPERFINAL_AVAILABLE"
-                            >No hopperfinal available</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-              <md-table-pagination
-                md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
-                md-limit="vm_dc.query.limit"
-                md-limit-options="[10, 15, 20, 50, 100, 250]"
-                md-page="vm_dc.query.page"
-                md-total="{{vm_dc.queueCampaignHopperFinals.count}}"
-                md-on-paginate="vm_dc.getQueueCampaignHopperFinals"
-                md-page-select
-              ></md-table-pagination>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="MOTIONDIALER.BLACKLIST">BLACKLIST</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="queueCampaign-detail-form-container hopperblacks md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="QueueCampaignHopperBlacksController as vm_dc"
-              ng-init="vm_dc.init(vm.queueCampaign, vm.crudPermissions)"
-            >
-              <md-toolbar
-                class="md-table-toolbar md-default"
-                ng-hide="vm_dc.selectedQueueCampaignHopperBlacks.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead" translate="MOTIONDIALER.HOPPERBLACKS"
-                    >HopperBlacks</span
-                  >
-                  <ms-search-bar
-                    on-search="vm_dc.query.filter = query"
-                    on-collapse="vm_dc.query.filter = undefined"
-                    debounce="300"
-                    direction="down"
-                  ></ms-search-bar>
-                  <div flex></div>
-                </div>
-              </md-toolbar>
-              <md-toolbar
-                class="md-table-toolbar md-accent"
-                ng-show="vm_dc.selectedQueueCampaignHopperBlacks.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead"
-                    >{{vm_dc.selectedQueueCampaignHopperBlacks.length}}
-                    {{vm_dc.selectedQueueCampaignHopperBlacks.length > 1 ?
-                    'items' : 'item'}} selected</span
-                  >
-                  <div flex></div>
-                  <button
-                    class="md-icon-button"
-                    ng-csv="vm_dc.exportSelectedQueueCampaignHopperBlacks"
-                    csv-label="true"
-                    filename="queueCampaigns.csv"
-                  >
-                    <md-icon md-font-icon="icon-file-excel"></md-icon>
-                  </button>
-                </div>
-              </md-toolbar>
-              <md-table-container class="font-size-12">
-                <table
-                  md-table
-                  md-row-select
-                  multiple
-                  ng-model="vm_dc.selectedQueueCampaignHopperBlacks"
-                  md-progress="vm_dc.promise"
-                >
-                  <thead
-                    md-head
-                    md-order="vm_dc.query.sort"
-                    md-on-reorder="vm_dc.getQueueCampaignHopperBlacks"
-                  >
-                    <tr md-row>
-                      <th md-column md-order-by="ContactId">
-                        {{ 'MOTIONDIALER.CONTACTID' | translate }}
-                      </th>
-                      <th md-column md-order-by="phone">
-                        {{ 'MOTIONDIALER.PHONE' | translate }}
-                      </th>
-                      <th md-column width="10px"></th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr
-                      md-row
-                      md-select="hopperBlack"
-                      md-select-id="id"
-                      ng-repeat="hopperBlack in vm_dc.queueCampaignHopperBlacks.rows"
-                    >
-                      <td md-cell>{{hopperBlack.ContactId}}</td>
-                      <td md-cell>{{hopperBlack.phone}}</td>
-                      <td md-cell class="actions"></td>
-                    </tr>
-                    <tr
-                      md-row
-                      ng-if="!vm_dc.queueCampaignHopperBlacks.rows.length"
-                    >
-                      <td md-cell colspan="4">
-                        <div layout="row" layout-align="center center">
-                          <span
-                            class="text-boxed-light"
-                            translate="MOTIONDIALER.NO_HOPPERBLACK_AVAILABLE"
-                            >No hopperblack available</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-              <md-table-pagination
-                md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
-                md-limit="vm_dc.query.limit"
-                md-limit-options="[10, 15, 20, 50, 100, 250]"
-                md-page="vm_dc.query.page"
-                md-total="{{vm_dc.queueCampaignHopperBlacks.count}}"
-                md-on-paginate="vm_dc.getQueueCampaignHopperBlacks"
-                md-page-select
-              ></md-table-pagination>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/view.html/view.html b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/view.html/view.html
new file mode 100644
index 0000000..9f0528a
--- /dev/null
+++ b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/edit/view.html/view.html
@@ -0,0 +1,4423 @@
+<div
+  id="motiondialer-queueCampaign"
+  class="page-layout simple tabbed"
+  layout="column"
+>
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-queueCampaigns-button md-icon-button"
+        aria-label="Go to queueCampaigns"
+        ng-click="vm.gotoQueueCampaigns()"
+        translate
+        translate-attr-aria-label="MOTIONDIALER.GO_TO_QUEUECAMPAIGNS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="queueCampaign-image" hide-xs>
+          <img ng-src="assets/images/business/queueCampaigns.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.queueCampaign.id}}
+            <span ng-if="vm.queueCampaign.name">{{vm.queueCampaign.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="MOTIONDIALER.CREATED_AT"></span>
+            <span>{{vm.queueCampaign.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div ng-cloak ng-if="vm.crudPermissions.canEdit">
+      <md-button
+        ng-click="vm.clonedialog(vm.queueCampaign, $event)"
+        class="md-fab md-green-500-bg md-icon-button"
+        aria-label="clone"
+      >
+        <md-tooltip
+          ><span translate="MOTIONDIALER.CLONE_QUEUECAMPAIGN"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-content-duplicate"></md-icon>
+      </md-button>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.listadddialog(vm.queueCampaign, $event)"
+        class="md-fab md-green-500-bg md-icon-button"
+        aria-label="listadd"
+      >
+        <md-tooltip
+          ><span translate="MOTIONDIALER.LISTADD_QUEUECAMPAIGN"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-format-list-numbers"></md-icon>
+      </md-button>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.blacklistadddialog(vm.queueCampaign, $event)"
+        class="md-fab md-warn md-icon-button"
+        aria-label="blacklistadd"
+      >
+        <md-tooltip
+          ><span translate="MOTIONDIALER.BLACKLISTADD_QUEUECAMPAIGN"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-block-helper"></md-icon>
+      </md-button>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.teamadddialog(vm.queueCampaign, $event)"
+        class="md-fab md-orange-500-bg md-icon-button"
+        aria-label="teamadd"
+      >
+        <md-tooltip
+          ><span translate="MOTIONDIALER.TEAMADD_QUEUECAMPAIGN"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
+      </md-button>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.agentadddialog(vm.queueCampaign, $event)"
+        class="md-fab md-purple-500-bg md-icon-button"
+        aria-label="agentadd"
+      >
+        <md-tooltip
+          ><span translate="MOTIONDIALER.AGENTADD_QUEUECAMPAIGN"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-account-plus"></md-icon>
+      </md-button>
+    </div>
+
+    <div ng-cloak ng-if="vm.crudPermissions.canEdit">
+      <md-button
+        ng-click="vm.resetlistdialog(vm.queueCampaign, $event)"
+        class="md-fab md-warn md-icon-button"
+        aria-label="resetlist"
+      >
+        <md-tooltip
+          ><span translate="MOTIONDIALER.RESETLIST_QUEUECAMPAIGN"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-restore"></md-icon>
+      </md-button>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.gotogoto(vm.queueCampaign, $event)"
+        class="md-fab md-warn md-icon-button"
+        aria-label="goto"
+      >
+        <md-tooltip
+          ><span translate="MOTIONDIALER.GOTO_QUEUECAMPAIGN"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-cast"></md-icon>
+      </md-button>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveQueueCampaign()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        translate="MOTIONDIALER.SAVE"
+        translate-attr-aria-label="MOTIONDIALER.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="MOTIONDIALER.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="queueCampaign-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MOTIONDIALER.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.queueCampaign.name"
+                  ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+                  ng-required="true"
+                  autofocus
+                  disabled
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.NAME"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                  <div ng-message="pattern">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.NAME_MUST_VALID_PATTERN"
+                      translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+                      >Name must be valid pattern
+                    </span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.queueCampaign.dialActive"
+                  aria-label="Active"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="MOTIONDIALER.ACTIVE"
+                    >Active</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.TRUNK">Trunk</label>
+                <md-select
+                  name="TrunkId"
+                  ng-model="vm.queueCampaign.TrunkId"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="TrunkId.id"
+                    ng-repeat="TrunkId in vm.trunks"
+                    ng-disabled="TrunkId.canSelect === false"
+                    >{{ TrunkId.name }}</md-option
+                  >
+                </md-select>
+                <div
+                  ng-messages="generalForm['TrunkId'].$error"
+                  ng-show="generalForm['TrunkId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.TRUNK_REQUIRED"
+                      >Trunk field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.BACKUPTRUNK">BackupTrunk</label>
+                <md-select
+                  name="TrunkBackupId"
+                  ng-model="vm.queueCampaign.TrunkBackupId"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="null">None</md-option>
+                  <md-option
+                    ng-value="TrunkBackupId.id"
+                    ng-repeat="TrunkBackupId in vm.trunks"
+                    ng-disabled="TrunkBackupId.canSelect === false"
+                    >{{ TrunkBackupId.name }}</md-option
+                  >
+                </md-select>
+                <div
+                  ng-messages="generalForm['TrunkBackupId'].$error"
+                  ng-show="generalForm['TrunkBackupId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.BACKUPTRUNK_REQUIRED"
+                      >BackupTrunk field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.queueCampaign.dialMethod != 'preview'"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.INTERVAL">Interval</label>
+                <md-select
+                  name="IntervalId"
+                  ng-model="vm.queueCampaign.IntervalId"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="IntervalId.id"
+                    ng-repeat="IntervalId in vm.interval"
+                    ng-disabled="IntervalId.canSelect === false"
+                    >{{ IntervalId.name }}</md-option
+                  >
+                </md-select>
+                <div
+                  ng-messages="generalForm['IntervalId'].$error"
+                  ng-show="generalForm['IntervalId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.INTERVAL_REQUIRED"
+                      >Interval field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.CHECKDUPLICATE"
+                  >CheckDuplicate</label
+                >
+                <md-select
+                  name="dialCheckDuplicateType"
+                  ng-model="vm.queueCampaign.dialCheckDuplicateType"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'always'">
+                    {{ 'MOTIONDIALER.ALWAYS' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'never'">
+                    {{ 'MOTIONDIALER.NEVER' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'onlyIfOpen'">
+                    {{ 'MOTIONDIALER.ONLY_IF_OPEN' | translate }}
+                  </md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['dialCheckDuplicateType'].$error"
+                  ng-show="generalForm['dialCheckDuplicateType'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.CHECKDUPLICATE_REQUIRED"
+                      >CheckDuplicate field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.CUTDIGIT">CutDigit</label>
+                <input
+                  type="number"
+                  name="dialCutDigit"
+                  ng-model="vm.queueCampaign.dialCutDigit"
+                  min="0"
+                  max="15"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['dialCutDigit'].$error"
+                  ng-show="generalForm['dialCutDigit'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.CUTDIGIT_REQUIRED"
+                      >CutDigit field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.CUTDIGIT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >CutDigit must be a valid greater or equal than</span
+                    >
+                    <span>0</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.CUTDIGIT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >CutDigit must be a valid greater or equal than</span
+                    >
+                    <span>15</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.queueCampaign.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="MOTIONDIALER.CAMPAIGN">CAMPAIGN</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="queueCampaign-detail-form-container campaign md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MOTIONDIALER.CAMPAIGN">
+                CAMPAIGN
+              </div>
+            </div>
+            <form name="campaignForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.METHOD">Method</label>
+                <md-select
+                  name="dialMethod"
+                  ng-model="vm.queueCampaign.dialMethod"
+                  autofocus
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'progressive'">Progressive</md-option>
+                  <md-option ng-value="'power'">PowerDialing</md-option>
+                  <md-option ng-value="'predictive'">Predictive</md-option>
+                  <md-option ng-value="'preview'">Preview</md-option>
+                  <md-option ng-value="'booked'">BookedProgressive</md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.METHOD"></span>
+                </div>
+                <div
+                  ng-messages="campaignForm['dialMethod'].$error"
+                  ng-show="campaignForm['dialMethod'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.METHOD_REQUIRED"
+                      >Method field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.queueCampaign.dialMethod == 'power'"
+                class="md-block"
+              >
+                <span translate="MOTIONDIALER.POWERLEVEL">PowerLevel</span>
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.POWERLEVEL"></span>
+                </div>
+                <md-slider
+                  md-discrete
+                  flex
+                  ng-model="vm.queueCampaign.dialPowerLevel"
+                  min="1"
+                  max="10"
+                  step="0.1"
+                  class="md-accent"
+                ></md-slider>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.queueCampaign.dialMethod == 'predictive'"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.PREDICTIVEOPTIMIZATION"
+                  >PredictiveOptimization</label
+                >
+                <md-select
+                  name="dialPredictiveOptimization"
+                  ng-model="vm.queueCampaign.dialPredictiveOptimization"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'agentBusyFactor'">
+                    {{ 'MOTIONDIALER.AGENTBUSYFACTOR' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'dropRate'">
+                    {{ 'MOTIONDIALER.DROPRATE' | translate }}
+                  </md-option>
+                </md-select>
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.PREDICTIVEOPTIMIZATION"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="campaignForm['dialPredictiveOptimization'].$error"
+                  ng-show="campaignForm['dialPredictiveOptimization'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.PREDICTIVEOPTIMIZATION_REQUIRED"
+                      >PredictiveOptimization field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.queueCampaign.dialMethod == 'predictive'"
+                class="md-block"
+              >
+                <span translate="MOTIONDIALER.PREDICTIVEOPTIMIZATIONPERCENTAGE"
+                  >PredictiveOptimizationPercentage</span
+                >
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.PREDICTIVEOPTIMIZATIONPERCENTAGE"
+                  ></span>
+                </div>
+                <md-slider
+                  md-discrete
+                  flex
+                  ng-model="vm.queueCampaign.dialPredictiveOptimizationPercentage"
+                  min="1"
+                  max="95"
+                  step="0.1"
+                  class="md-accent"
+                ></md-slider>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.queueCampaign.dialMethod == 'predictive'"
+                class="md-block"
+              >
+                <span translate="MOTIONDIALER.PREDICTIVEINTERVAL"
+                  >PredictiveInterval</span
+                >
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.PREDICTIVEINTERVAL"></span>
+                </div>
+                <md-slider
+                  md-discrete
+                  flex
+                  ng-model="vm.queueCampaign.dialPredictiveInterval"
+                  min="5"
+                  max="30"
+                  step="1"
+                  class="md-accent"
+                ></md-slider>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.queueCampaign.dialMethod != 'preview'"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.MAXCONCURRENTCALLS"
+                  >MaxConcurrentCalls</label
+                >
+                <input
+                  type="number"
+                  name="dialLimitQueue"
+                  ng-model="vm.queueCampaign.dialLimitQueue"
+                  min="0"
+                  max="9999"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.MAXCONCURRENTCALLS"></span>
+                </div>
+                <div
+                  ng-messages="campaignForm['dialLimitQueue'].$error"
+                  ng-show="campaignForm['dialLimitQueue'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.MAXCONCURRENTCALLS_REQUIRED"
+                      >MaxConcurrentCalls field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.MAXCONCURRENTCALLS_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >MaxConcurrentCalls must be a valid greater or equal
+                      than</span
+                    >
+                    <span>0</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.MAXCONCURRENTCALLS_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >MaxConcurrentCalls must be a valid greater or equal
+                      than</span
+                    >
+                    <span>9999</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.AGENTTIMEOUT"
+                  >AgentTimeout</label
+                >
+                <input
+                  type="number"
+                  name="timeout"
+                  ng-model="vm.queueCampaign.timeout"
+                  min="0"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.AGENTTIMEOUT"></span>
+                </div>
+                <div
+                  ng-messages="campaignForm['timeout'].$error"
+                  ng-show="campaignForm['timeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.AGENTTIMEOUT_REQUIRED"
+                      >AgentTimeout field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AGENTTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AgentTimeout must be a valid greater or equal than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="queueCampaign-detail-form-container queue md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MOTIONDIALER.QUEUE">
+                QUEUE
+              </div>
+            </div>
+            <form name="queueForm" novalidate>
+              <md-input-container
+                ng-if="vm.queueCampaign.dialMethod === 'progressive' || vm.queueCampaign.dialMethod === 'predictive' || vm.queueCampaign.dialMethod === 'power'"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.QUEUEOPTIONS"
+                  >QueueOptions</label
+                >
+                <input
+                  type="text"
+                  name="dialQueueOptions"
+                  ng-model="vm.queueCampaign.dialQueueOptions"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="queueForm['dialQueueOptions'].$error"
+                  ng-show="queueForm['dialQueueOptions'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.QUEUEOPTIONS_REQUIRED"
+                      >QueueOptions field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.queueCampaign.dialMethod === 'progressive' || vm.queueCampaign.dialMethod === 'predictive' || vm.queueCampaign.dialMethod === 'power'"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.QUEUETIMEOUT"
+                  >QueueTimeout</label
+                >
+                <input
+                  type="number"
+                  name="dialQueueTimeout"
+                  ng-model="vm.queueCampaign.dialQueueTimeout"
+                  min="1"
+                  max="999"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.QUEUETIMEOUT"></span>
+                </div>
+                <div
+                  ng-messages="queueForm['dialQueueTimeout'].$error"
+                  ng-show="queueForm['dialQueueTimeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.QUEUETIMEOUT_REQUIRED"
+                      >QueueTimeout field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.QUEUETIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >QueueTimeout must be a valid greater or equal than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.QUEUETIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >QueueTimeout must be a valid greater or equal than</span
+                    >
+                    <span>999</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.queueCampaign.dialMethod === 'booked' || vm.queueCampaign.dialMethod === 'progressive' || vm.queueCampaign.dialMethod === 'predictive' || vm.queueCampaign.dialMethod === 'power'"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.STRATEGY">Strategy</label>
+                <md-select
+                  name="strategy"
+                  ng-model="vm.queueCampaign.strategy"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'rrmemory'"
+                    >Round Robin Memory</md-option
+                  >
+                  <md-option
+                    ng-value="'roundrobin'"
+                    ng-if="vm.queueCampaign.dialMethod === 'booked'"
+                    >Round Robin</md-option
+                  >
+                  <md-option
+                    ng-value="'leastrecent'"
+                    ng-if="vm.queueCampaign.dialMethod !== 'booked'"
+                    >Least Recent</md-option
+                  >
+                  <md-option
+                    ng-value="'fewestcalls'"
+                    ng-if="vm.queueCampaign.dialMethod !== 'booked'"
+                    >Fewest Calls</md-option
+                  >
+                  <md-option
+                    ng-value="'random'"
+                    ng-if="vm.queueCampaign.dialMethod !== 'booked'"
+                    >Random</md-option
+                  >
+                  <md-option
+                    ng-value="'linear'"
+                    ng-if="vm.queueCampaign.dialMethod !== 'booked'"
+                    >Linear</md-option
+                  >
+                  <md-option
+                    ng-value="'wrandom'"
+                    ng-if="vm.queueCampaign.dialMethod !== 'booked'"
+                    >Weight Random</md-option
+                  >
+                </md-select>
+                <div
+                  ng-messages="queueForm['strategy'].$error"
+                  ng-show="queueForm['strategy'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.STRATEGY_REQUIRED"
+                      >Strategy field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.queueCampaign.dialMethod === 'progressive' || vm.queueCampaign.dialMethod === 'predictive' || vm.queueCampaign.dialMethod === 'power'"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.RETRY">Retry</label>
+                <input
+                  type="number"
+                  name="retry"
+                  ng-model="vm.queueCampaign.retry"
+                  min="0"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.RETRY"></span>
+                </div>
+                <div
+                  ng-messages="queueForm['retry'].$error"
+                  ng-show="queueForm['retry'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.RETRY_REQUIRED"
+                      >Retry field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.RETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >Retry must be a valid greater or equal than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.queueCampaign.dialMethod === 'progressive' || vm.queueCampaign.dialMethod === 'predictive' || vm.queueCampaign.dialMethod === 'power'"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.WRAPUPTIME">WrapupTime</label>
+                <input
+                  type="number"
+                  name="wrapuptime"
+                  ng-model="vm.queueCampaign.wrapuptime"
+                  min="0"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.WRAPUPTIME"></span>
+                </div>
+                <div
+                  ng-messages="queueForm['wrapuptime'].$error"
+                  ng-show="queueForm['wrapuptime'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.WRAPUPTIME_REQUIRED"
+                      >WrapupTime field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.WRAPUPTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >WrapupTime must be a valid greater or equal than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.queueCampaign.dialMethod === 'progressive' || vm.queueCampaign.dialMethod === 'predictive' || vm.queueCampaign.dialMethod === 'power'"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.WEIGHT">Weight</label>
+                <input
+                  type="number"
+                  name="weight"
+                  ng-model="vm.queueCampaign.weight"
+                  min="0"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.WEIGHT"></span>
+                </div>
+                <div
+                  ng-messages="queueForm['weight'].$error"
+                  ng-show="queueForm['weight'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.WEIGHT_REQUIRED"
+                      >Weight field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.WEIGHT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >Weight must be a valid greater or equal than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.queueCampaign.dialMethod === 'progressive' || vm.queueCampaign.dialMethod === 'predictive' || vm.queueCampaign.dialMethod === 'power'"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.MUSICONHOLD">MusicOnHold</label>
+                <md-select
+                  name="musiconhold"
+                  ng-model="vm.queueCampaign.musiconhold"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="musiconhold.name"
+                    ng-repeat="musiconhold in vm.musiconholds"
+                    ng-disabled="musiconhold.canSelect === false"
+                    >{{ musiconhold.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.MUSICONHOLD"></span>
+                </div>
+                <div
+                  ng-messages="queueForm['musiconhold'].$error"
+                  ng-show="queueForm['musiconhold'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.MUSICONHOLD_REQUIRED"
+                      >MusicOnHold field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.queueCampaign.dialMethod === 'progressive' || vm.queueCampaign.dialMethod === 'predictive' || vm.queueCampaign.dialMethod === 'power'"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.CALLYSQUAREPROJECT"
+                  >CallySquareProject</label
+                >
+                <md-select
+                  name="dialQueueProject"
+                  ng-model="vm.queueCampaign.dialQueueProject"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="null">None</md-option>
+                  <md-option
+                    ng-value="dialQueueProject.name"
+                    ng-repeat="dialQueueProject in vm.projects"
+                    ng-disabled="dialQueueProject.canSelect === false"
+                    >{{ dialQueueProject.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.CALLYSQUAREPROJECT"></span>
+                </div>
+                <div
+                  ng-messages="queueForm['dialQueueProject'].$error"
+                  ng-show="queueForm['dialQueueProject'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.CALLYSQUAREPROJECT_REQUIRED"
+                      >CallySquareProject field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.queueCampaign.dialMethod === 'progressive' || vm.queueCampaign.dialMethod === 'predictive' || vm.queueCampaign.dialMethod === 'power'"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.CALLYSQUAREPROJECT2"
+                  >CallySquareProject2</label
+                >
+                <md-select
+                  name="dialQueueProject2"
+                  ng-model="vm.queueCampaign.dialQueueProject2"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="null">None</md-option>
+                  <md-option
+                    ng-value="dialQueueProject2.name"
+                    ng-repeat="dialQueueProject2 in vm.projects"
+                    ng-disabled="dialQueueProject2.canSelect === false"
+                    >{{ dialQueueProject2.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.CALLYSQUAREPROJECT2"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="queueForm['dialQueueProject2'].$error"
+                  ng-show="queueForm['dialQueueProject2'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.CALLYSQUAREPROJECT2_REQUIRED"
+                      >CallySquareProject2 field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.queueCampaign.dialMethod === 'preview' || vm.queueCampaign.dialMethod === 'booked'"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.CALLYSQUAREPROJECTPREVIEW"
+                  >CallySquareProjectPreview</label
+                >
+                <md-select
+                  name="dialQueueProject"
+                  ng-model="vm.queueCampaign.dialQueueProject"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="null">None</md-option>
+                  <md-option
+                    ng-value="dialQueueProject.name"
+                    ng-repeat="dialQueueProject in vm.projects"
+                    ng-disabled="dialQueueProject.canSelect === false"
+                    >{{ dialQueueProject.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.CALLYSQUAREPROJECTPREVIEW"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="queueForm['dialQueueProject'].$error"
+                  ng-show="queueForm['dialQueueProject'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.CALLYSQUAREPROJECTPREVIEW_REQUIRED"
+                      >CallySquareProjectPreview field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.queueCampaign.dialMethod === 'preview' || vm.queueCampaign.dialMethod === 'booked'"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.CALLYSQUAREPROJECTPREVIEW2"
+                  >CallySquareProjectPreview2</label
+                >
+                <md-select
+                  name="dialQueueProject2"
+                  ng-model="vm.queueCampaign.dialQueueProject2"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="null">None</md-option>
+                  <md-option
+                    ng-value="dialQueueProject2.name"
+                    ng-repeat="dialQueueProject2 in vm.projects"
+                    ng-disabled="dialQueueProject2.canSelect === false"
+                    >{{ dialQueueProject2.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.CALLYSQUAREPROJECTPREVIEW2"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="queueForm['dialQueueProject2'].$error"
+                  ng-show="queueForm['dialQueueProject2'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.CALLYSQUAREPROJECTPREVIEW2_REQUIRED"
+                      >CallySquareProjectPreview2 field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.queueCampaign.dialQueueProject2 && (vm.queueCampaign.dialMethod === 'progressive' || vm.queueCampaign.dialMethod === 'predictive' || vm.queueCampaign.dialMethod === 'power')"
+                class="md-block"
+              >
+                <md-switch
+                  ng-model="vm.queueCampaign.dialAgiAfterHangupAgent"
+                  aria-label="RunIfHangupAgent"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="MOTIONDIALER.RUNIFHANGUPAGENT"
+                    >RunIfHangupAgent</span
+                  ></md-switch
+                >
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.RUNIFHANGUPAGENT"></span>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="queueCampaign-detail-form-container originate md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MOTIONDIALER.ORIGINATE">
+                ORIGINATE
+              </div>
+            </div>
+            <form name="originateForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.ORIGINATECALLERIDNAME"
+                  >OriginateCallerIdName</label
+                >
+                <input
+                  type="text"
+                  name="dialOriginateCallerIdName"
+                  ng-model="vm.queueCampaign.dialOriginateCallerIdName"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.ORIGINATECALLERIDNAME"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="originateForm['dialOriginateCallerIdName'].$error"
+                  ng-show="originateForm['dialOriginateCallerIdName'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.ORIGINATECALLERIDNAME_REQUIRED"
+                      >OriginateCallerIdName field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.ORIGINATECALLERIDNUMBER"
+                  >OriginateCallerIdNumber</label
+                >
+                <input
+                  type="text"
+                  name="dialOriginateCallerIdNumber"
+                  ng-model="vm.queueCampaign.dialOriginateCallerIdNumber"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.ORIGINATECALLERIDNUMBER"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="originateForm['dialOriginateCallerIdNumber'].$error"
+                  ng-show="originateForm['dialOriginateCallerIdNumber'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.ORIGINATECALLERIDNUMBER_REQUIRED"
+                      >OriginateCallerIdNumber field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.RANDOMLASTDIGITCALLERIDNUMBER"
+                  >RandomLastDigitCallerIdNumber</label
+                >
+                <input
+                  type="number"
+                  name="dialRandomLastDigitCallerIdNumber"
+                  ng-model="vm.queueCampaign.dialRandomLastDigitCallerIdNumber"
+                  min="0"
+                  max="15"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.RANDOMLASTDIGITCALLERIDNUMBER"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="originateForm['dialRandomLastDigitCallerIdNumber'].$error"
+                  ng-show="originateForm['dialRandomLastDigitCallerIdNumber'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.RANDOMLASTDIGITCALLERIDNUMBER_REQUIRED"
+                      >RandomLastDigitCallerIdNumber field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.RANDOMLASTDIGITCALLERIDNUMBER_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >RandomLastDigitCallerIdNumber must be a valid greater or
+                      equal than</span
+                    >
+                    <span>0</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.RANDOMLASTDIGITCALLERIDNUMBER_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >RandomLastDigitCallerIdNumber must be a valid greater or
+                      equal than</span
+                    >
+                    <span>15</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.ORIGINATETIMEOUT"
+                  >OriginateTimeout</label
+                >
+                <input
+                  type="number"
+                  name="dialOriginateTimeout"
+                  ng-model="vm.queueCampaign.dialOriginateTimeout"
+                  min="1"
+                  max="999"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.ORIGINATETIMEOUT"></span>
+                </div>
+                <div
+                  ng-messages="originateForm['dialOriginateTimeout'].$error"
+                  ng-show="originateForm['dialOriginateTimeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.ORIGINATETIMEOUT_REQUIRED"
+                      >OriginateTimeout field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.ORIGINATETIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >OriginateTimeout must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.ORIGINATETIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >OriginateTimeout must be a valid greater or equal
+                      than</span
+                    >
+                    <span>999</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.PREFIX">Prefix</label>
+                <input
+                  type="text"
+                  name="dialPrefix"
+                  ng-model="vm.queueCampaign.dialPrefix"
+                  ng-pattern="/^\d+$/"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.PREFIX"></span>
+                </div>
+                <div
+                  ng-messages="originateForm['dialPrefix'].$error"
+                  ng-show="originateForm['dialPrefix'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.PREFIX_REQUIRED"
+                      >Prefix field is required</span
+                    >
+                  </div>
+                  <div ng-message="pattern">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.PREFIX_MUST_VALID_PATTERN"
+                      translate-values="{ regex: '/^\d+$/' }"
+                      >Prefix must be valid pattern
+                    </span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="MOTIONDIALER.RETRYANDFREQUENCY"
+            >RETRYANDFREQUENCY</span
+          >
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="queueCampaign-detail-form-container global md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MOTIONDIALER.GLOBAL">
+                GLOBAL
+              </div>
+            </div>
+            <form name="globalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.GLOBALMAXRETRY"
+                  >GlobalMaxRetry</label
+                >
+                <input
+                  type="number"
+                  name="dialGlobalMaxRetry"
+                  ng-model="vm.queueCampaign.dialGlobalMaxRetry"
+                  min="1"
+                  max="999"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.GLOBALMAXRETRY"></span>
+                </div>
+                <div
+                  ng-messages="globalForm['dialGlobalMaxRetry'].$error"
+                  ng-show="globalForm['dialGlobalMaxRetry'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.GLOBALMAXRETRY_REQUIRED"
+                      >GlobalMaxRetry field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.GLOBALMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >GlobalMaxRetry must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.GLOBALMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >GlobalMaxRetry must be a valid greater or equal
+                      than</span
+                    >
+                    <span>999</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="queueCampaign-detail-form-container congestion md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div
+                class="h2 secondary-text"
+                translate="MOTIONDIALER.CONGESTION"
+              >
+                CONGESTION
+              </div>
+            </div>
+            <form name="congestionForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.CONGESTIONMAXRETRY"
+                  >CongestionMaxRetry</label
+                >
+                <input
+                  type="number"
+                  name="dialCongestionMaxRetry"
+                  ng-model="vm.queueCampaign.dialCongestionMaxRetry"
+                  min="1"
+                  max="999"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.CONGESTIONMAXRETRY"></span>
+                </div>
+                <div
+                  ng-messages="congestionForm['dialCongestionMaxRetry'].$error"
+                  ng-show="congestionForm['dialCongestionMaxRetry'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.CONGESTIONMAXRETRY_REQUIRED"
+                      >CongestionMaxRetry field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.CONGESTIONMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >CongestionMaxRetry must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.CONGESTIONMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >CongestionMaxRetry must be a valid greater or equal
+                      than</span
+                    >
+                    <span>999</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.CONGESTIONRETRYTIME"
+                  >CongestionRetryTime</label
+                >
+                <input
+                  type="number"
+                  name="dialCongestionRetryFrequency"
+                  ng-model="vm.queueCampaign.dialCongestionRetryFrequency"
+                  min="1"
+                  max="99999"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.CONGESTIONRETRYTIME"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="congestionForm['dialCongestionRetryFrequency'].$error"
+                  ng-show="congestionForm['dialCongestionRetryFrequency'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.CONGESTIONRETRYTIME_REQUIRED"
+                      >CongestionRetryTime field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.CONGESTIONRETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >CongestionRetryTime must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.CONGESTIONRETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >CongestionRetryTime must be a valid greater or equal
+                      than</span
+                    >
+                    <span>99999</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="queueCampaign-detail-form-container busy md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MOTIONDIALER.BUSY">
+                BUSY
+              </div>
+            </div>
+            <form name="busyForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.BUSYMAXRETRY"
+                  >BusyMaxRetry</label
+                >
+                <input
+                  type="number"
+                  name="dialBusyMaxRetry"
+                  ng-model="vm.queueCampaign.dialBusyMaxRetry"
+                  min="1"
+                  max="999"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.BUSYMAXRETRY"></span>
+                </div>
+                <div
+                  ng-messages="busyForm['dialBusyMaxRetry'].$error"
+                  ng-show="busyForm['dialBusyMaxRetry'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.BUSYMAXRETRY_REQUIRED"
+                      >BusyMaxRetry field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.BUSYMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >BusyMaxRetry must be a valid greater or equal than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.BUSYMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >BusyMaxRetry must be a valid greater or equal than</span
+                    >
+                    <span>999</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.BUSYRETRYTIME"
+                  >BusyRetryTime</label
+                >
+                <input
+                  type="number"
+                  name="dialBusyRetryFrequency"
+                  ng-model="vm.queueCampaign.dialBusyRetryFrequency"
+                  min="1"
+                  max="99999"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.BUSYRETRYTIME"></span>
+                </div>
+                <div
+                  ng-messages="busyForm['dialBusyRetryFrequency'].$error"
+                  ng-show="busyForm['dialBusyRetryFrequency'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.BUSYRETRYTIME_REQUIRED"
+                      >BusyRetryTime field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.BUSYRETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >BusyRetryTime must be a valid greater or equal than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.BUSYRETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >BusyRetryTime must be a valid greater or equal than</span
+                    >
+                    <span>99999</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="queueCampaign-detail-form-container noanswer md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MOTIONDIALER.NOANSWER">
+                NOANSWER
+              </div>
+            </div>
+            <form name="noanswerForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.NOANSWERMAXRETRY"
+                  >NoAnswerMaxRetry</label
+                >
+                <input
+                  type="number"
+                  name="dialNoAnswerMaxRetry"
+                  ng-model="vm.queueCampaign.dialNoAnswerMaxRetry"
+                  min="1"
+                  max="999"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.NOANSWERMAXRETRY"></span>
+                </div>
+                <div
+                  ng-messages="noanswerForm['dialNoAnswerMaxRetry'].$error"
+                  ng-show="noanswerForm['dialNoAnswerMaxRetry'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.NOANSWERMAXRETRY_REQUIRED"
+                      >NoAnswerMaxRetry field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.NOANSWERMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >NoAnswerMaxRetry must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.NOANSWERMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >NoAnswerMaxRetry must be a valid greater or equal
+                      than</span
+                    >
+                    <span>999</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.NOANSWERRETRYTIME"
+                  >NoAnswerRetryTime</label
+                >
+                <input
+                  type="number"
+                  name="dialNoAnswerRetryFrequency"
+                  ng-model="vm.queueCampaign.dialNoAnswerRetryFrequency"
+                  min="1"
+                  max="99999"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.NOANSWERRETRYTIME"></span>
+                </div>
+                <div
+                  ng-messages="noanswerForm['dialNoAnswerRetryFrequency'].$error"
+                  ng-show="noanswerForm['dialNoAnswerRetryFrequency'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.NOANSWERRETRYTIME_REQUIRED"
+                      >NoAnswerRetryTime field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.NOANSWERRETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >NoAnswerRetryTime must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.NOANSWERRETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >NoAnswerRetryTime must be a valid greater or equal
+                      than</span
+                    >
+                    <span>99999</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="queueCampaign-detail-form-container nosuchnumber md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div
+                class="h2 secondary-text"
+                translate="MOTIONDIALER.NOSUCHNUMBER"
+              >
+                NOSUCHNUMBER
+              </div>
+            </div>
+            <form name="nosuchnumberForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.NOSUCHNUMBERMAXRETRY"
+                  >NoSuchNumberMaxRetry</label
+                >
+                <input
+                  type="number"
+                  name="dialNoSuchNumberMaxRetry"
+                  ng-model="vm.queueCampaign.dialNoSuchNumberMaxRetry"
+                  min="1"
+                  max="999"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.NOSUCHNUMBERMAXRETRY"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="nosuchnumberForm['dialNoSuchNumberMaxRetry'].$error"
+                  ng-show="nosuchnumberForm['dialNoSuchNumberMaxRetry'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.NOSUCHNUMBERMAXRETRY_REQUIRED"
+                      >NoSuchNumberMaxRetry field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.NOSUCHNUMBERMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >NoSuchNumberMaxRetry must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.NOSUCHNUMBERMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >NoSuchNumberMaxRetry must be a valid greater or equal
+                      than</span
+                    >
+                    <span>999</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.NOSUCHNUMBERRETRYTIME"
+                  >NoSuchNumberRetryTime</label
+                >
+                <input
+                  type="number"
+                  name="dialNoSuchNumberRetryFrequency"
+                  ng-model="vm.queueCampaign.dialNoSuchNumberRetryFrequency"
+                  min="1"
+                  max="99999"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.NOSUCHNUMBERRETRYTIME"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="nosuchnumberForm['dialNoSuchNumberRetryFrequency'].$error"
+                  ng-show="nosuchnumberForm['dialNoSuchNumberRetryFrequency'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.NOSUCHNUMBERRETRYTIME_REQUIRED"
+                      >NoSuchNumberRetryTime field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.NOSUCHNUMBERRETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >NoSuchNumberRetryTime must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.NOSUCHNUMBERRETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >NoSuchNumberRetryTime must be a valid greater or equal
+                      than</span
+                    >
+                    <span>99999</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="queueCampaign-detail-form-container drop md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MOTIONDIALER.DROP">
+                DROP
+              </div>
+            </div>
+            <form name="dropForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.DROPMAXRETRY"
+                  >DropMaxRetry</label
+                >
+                <input
+                  type="number"
+                  name="dialDropMaxRetry"
+                  ng-model="vm.queueCampaign.dialDropMaxRetry"
+                  min="1"
+                  max="999"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.DROPMAXRETRY"></span>
+                </div>
+                <div
+                  ng-messages="dropForm['dialDropMaxRetry'].$error"
+                  ng-show="dropForm['dialDropMaxRetry'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.DROPMAXRETRY_REQUIRED"
+                      >DropMaxRetry field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.DROPMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >DropMaxRetry must be a valid greater or equal than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.DROPMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >DropMaxRetry must be a valid greater or equal than</span
+                    >
+                    <span>999</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.DROPRETRYTIME"
+                  >DropRetryTime</label
+                >
+                <input
+                  type="number"
+                  name="dialDropRetryFrequency"
+                  ng-model="vm.queueCampaign.dialDropRetryFrequency"
+                  min="1"
+                  max="99999"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.DROPRETRYTIME"></span>
+                </div>
+                <div
+                  ng-messages="dropForm['dialDropRetryFrequency'].$error"
+                  ng-show="dropForm['dialDropRetryFrequency'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.DROPRETRYTIME_REQUIRED"
+                      >DropRetryTime field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.DROPRETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >DropRetryTime must be a valid greater or equal than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.DROPRETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >DropRetryTime must be a valid greater or equal than</span
+                    >
+                    <span>99999</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="queueCampaign-detail-form-container abandoned md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MOTIONDIALER.ABANDONED">
+                ABANDONED
+              </div>
+            </div>
+            <form name="abandonedForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.ABANDONEDMAXRETRY"
+                  >AbandonedMaxRetry</label
+                >
+                <input
+                  type="number"
+                  name="dialAbandonedMaxRetry"
+                  ng-model="vm.queueCampaign.dialAbandonedMaxRetry"
+                  min="1"
+                  max="999"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.ABANDONEDMAXRETRY"></span>
+                </div>
+                <div
+                  ng-messages="abandonedForm['dialAbandonedMaxRetry'].$error"
+                  ng-show="abandonedForm['dialAbandonedMaxRetry'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.ABANDONEDMAXRETRY_REQUIRED"
+                      >AbandonedMaxRetry field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.ABANDONEDMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AbandonedMaxRetry must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.ABANDONEDMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >AbandonedMaxRetry must be a valid greater or equal
+                      than</span
+                    >
+                    <span>999</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.ABANDONEDRETRYTIME"
+                  >AbandonedRetryTime</label
+                >
+                <input
+                  type="number"
+                  name="dialAbandonedRetryFrequency"
+                  ng-model="vm.queueCampaign.dialAbandonedRetryFrequency"
+                  min="1"
+                  max="99999"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.ABANDONEDRETRYTIME"></span>
+                </div>
+                <div
+                  ng-messages="abandonedForm['dialAbandonedRetryFrequency'].$error"
+                  ng-show="abandonedForm['dialAbandonedRetryFrequency'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.ABANDONEDRETRYTIME_REQUIRED"
+                      >AbandonedRetryTime field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.ABANDONEDRETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AbandonedRetryTime must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.ABANDONEDRETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >AbandonedRetryTime must be a valid greater or equal
+                      than</span
+                    >
+                    <span>99999</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="queueCampaign-detail-form-container machine md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MOTIONDIALER.MACHINE">
+                MACHINE
+              </div>
+            </div>
+            <form name="machineForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.MACHINEMAXRETRY"
+                  >MachineMaxRetry</label
+                >
+                <input
+                  type="number"
+                  name="dialMachineMaxRetry"
+                  ng-model="vm.queueCampaign.dialMachineMaxRetry"
+                  min="1"
+                  max="999"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.MACHINEMAXRETRY"></span>
+                </div>
+                <div
+                  ng-messages="machineForm['dialMachineMaxRetry'].$error"
+                  ng-show="machineForm['dialMachineMaxRetry'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.MACHINEMAXRETRY_REQUIRED"
+                      >MachineMaxRetry field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.MACHINEMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >MachineMaxRetry must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.MACHINEMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >MachineMaxRetry must be a valid greater or equal
+                      than</span
+                    >
+                    <span>999</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.MACHINERETRYTIME"
+                  >MachineRetryTime</label
+                >
+                <input
+                  type="number"
+                  name="dialMachineRetryFrequency"
+                  ng-model="vm.queueCampaign.dialMachineRetryFrequency"
+                  min="1"
+                  max="99999"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.MACHINERETRYTIME"></span>
+                </div>
+                <div
+                  ng-messages="machineForm['dialMachineRetryFrequency'].$error"
+                  ng-show="machineForm['dialMachineRetryFrequency'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.MACHINERETRYTIME_REQUIRED"
+                      >MachineRetryTime field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.MACHINERETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >MachineRetryTime must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.MACHINERETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >MachineRetryTime must be a valid greater or equal
+                      than</span
+                    >
+                    <span>99999</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="queueCampaign-detail-form-container agentreject md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div
+                class="h2 secondary-text"
+                translate="MOTIONDIALER.AGENTREJECT"
+              >
+                AGENTREJECT
+              </div>
+            </div>
+            <form name="agentrejectForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.AGENTREJECTMAXRETRY"
+                  >AgentRejectMaxRetry</label
+                >
+                <input
+                  type="number"
+                  name="dialAgentRejectMaxRetry"
+                  ng-model="vm.queueCampaign.dialAgentRejectMaxRetry"
+                  min="1"
+                  max="999"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.AGENTREJECTMAXRETRY"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="agentrejectForm['dialAgentRejectMaxRetry'].$error"
+                  ng-show="agentrejectForm['dialAgentRejectMaxRetry'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AGENTREJECTMAXRETRY_REQUIRED"
+                      >AgentRejectMaxRetry field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AGENTREJECTMAXRETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AgentRejectMaxRetry must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AGENTREJECTMAXRETRY_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >AgentRejectMaxRetry must be a valid greater or equal
+                      than</span
+                    >
+                    <span>999</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.AGENTREJECTRETRYTIME"
+                  >AgentRejectRetryTime</label
+                >
+                <input
+                  type="number"
+                  name="dialAgentRejectRetryFrequency"
+                  ng-model="vm.queueCampaign.dialAgentRejectRetryFrequency"
+                  min="1"
+                  max="99999"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.AGENTREJECTRETRYTIME"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="agentrejectForm['dialAgentRejectRetryFrequency'].$error"
+                  ng-show="agentrejectForm['dialAgentRejectRetryFrequency'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AGENTREJECTRETRYTIME_REQUIRED"
+                      >AgentRejectRetryTime field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AGENTREJECTRETRYTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AgentRejectRetryTime must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AGENTREJECTRETRYTIME_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >AgentRejectRetryTime must be a valid greater or equal
+                      than</span
+                    >
+                    <span>99999</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="MOTIONDIALER.ADVANCED">ADVANCED</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            ng-if="vm.queueCampaign.dialMethod === 'progressive' || vm.queueCampaign.dialMethod === 'predictive' || vm.queueCampaign.dialMethod === 'power'"
+            class="queueCampaign-detail-form-container advanced md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MOTIONDIALER.ADVANCED">
+                ADVANCED
+              </div>
+            </div>
+            <form name="advancedForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.queueCampaign.acw"
+                  aria-label="AfterCallWork"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="MOTIONDIALER.AFTERCALLWORK"
+                    >AfterCallWork</span
+                  ></md-switch
+                >
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.AFTERCALLWORK"></span>
+                </div>
+              </md-input-container>
+              <md-input-container ng-if="vm.queueCampaign.acw" class="md-block">
+                <label translate="MOTIONDIALER.AFTERCALLWORKDURATION"
+                  >AfterCallWorkDuration</label
+                >
+                <input
+                  type="number"
+                  name="acwTimeout"
+                  ng-model="vm.queueCampaign.acwTimeout"
+                  min="0"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.AFTERCALLWORKDURATION"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['acwTimeout'].$error"
+                  ng-show="advancedForm['acwTimeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AFTERCALLWORKDURATION_REQUIRED"
+                      >AfterCallWorkDuration field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AFTERCALLWORKDURATION_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AfterCallWorkDuration must be a valid greater or equal
+                      than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.AUTOPAUSE">AutoPause</label>
+                <md-select
+                  name="autopause"
+                  ng-model="vm.queueCampaign.autopause"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'all'">
+                    {{ 'MOTIONDIALER.YES' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'no'">
+                    {{ 'MOTIONDIALER.NO' | translate }}
+                  </md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.AUTOPAUSE"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['autopause'].$error"
+                  ng-show="advancedForm['autopause'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.AUTOPAUSE_REQUIRED"
+                      >AutoPause field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.RINGINUSE">RingInUse</label>
+                <md-select
+                  name="ringinuse"
+                  ng-model="vm.queueCampaign.ringinuse"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">
+                    {{ 'MOTIONDIALER.YES' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'no'">
+                    {{ 'MOTIONDIALER.NO' | translate }}
+                  </md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.RINGINUSE"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['ringinuse'].$error"
+                  ng-show="advancedForm['ringinuse'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.RINGINUSE_REQUIRED"
+                      >RingInUse field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.MEMBERDELAY">MemberDelay</label>
+                <input
+                  type="number"
+                  name="memberdelay"
+                  ng-model="vm.queueCampaign.memberdelay"
+                  min="0"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.MEMBERDELAY"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['memberdelay'].$error"
+                  ng-show="advancedForm['memberdelay'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.MEMBERDELAY_REQUIRED"
+                      >MemberDelay field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.MEMBERDELAY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >MemberDelay must be a valid greater or equal than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.TIMEOUTRESTART"
+                  >TimeoutRestart</label
+                >
+                <md-select
+                  name="timeoutrestart"
+                  ng-model="vm.queueCampaign.timeoutrestart"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">
+                    {{ 'MOTIONDIALER.YES' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'no'">
+                    {{ 'MOTIONDIALER.NO' | translate }}
+                  </md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.TIMEOUTRESTART"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['timeoutrestart'].$error"
+                  ng-show="advancedForm['timeoutrestart'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.TIMEOUTRESTART_REQUIRED"
+                      >TimeoutRestart field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.MONITORFORMAT"
+                  >MonitorFormat</label
+                >
+                <md-select
+                  name="monitor_format"
+                  ng-model="vm.queueCampaign.monitor_format"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="''">Inactive</md-option>
+                  <md-option ng-value="'wav'">wav</md-option>
+                  <md-option ng-value="'wav49'">wav49</md-option>
+                  <md-option ng-value="'gsm'">gsm</md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.MONITORFORMAT"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['monitor_format'].$error"
+                  ng-show="advancedForm['monitor_format'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.MONITORFORMAT_REQUIRED"
+                      >MonitorFormat field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.CONTEXT">Context</label>
+                <input
+                  type="text"
+                  name="context"
+                  ng-model="vm.queueCampaign.context"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.CONTEXT"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['context'].$error"
+                  ng-show="advancedForm['context'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.CONTEXT_REQUIRED"
+                      >Context field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.SETINTERFACEVARIABLES"
+                  >SetInterfaceVariables</label
+                >
+                <md-select
+                  name="setinterfacevar"
+                  ng-model="vm.queueCampaign.setinterfacevar"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">
+                    {{ 'MOTIONDIALER.YES' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'no'">
+                    {{ 'MOTIONDIALER.NO' | translate }}
+                  </md-option>
+                </md-select>
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.SETINTERFACEVARIABLES"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['setinterfacevar'].$error"
+                  ng-show="advancedForm['setinterfacevar'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.SETINTERFACEVARIABLES_REQUIRED"
+                      >SetInterfaceVariables field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.SETQUEUEVARIABLES"
+                  >SetQueueVariables</label
+                >
+                <md-select
+                  name="setqueuevar"
+                  ng-model="vm.queueCampaign.setqueuevar"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">
+                    {{ 'MOTIONDIALER.YES' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'no'">
+                    {{ 'MOTIONDIALER.NO' | translate }}
+                  </md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.SETQUEUEVARIABLES"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['setqueuevar'].$error"
+                  ng-show="advancedForm['setqueuevar'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.SETQUEUEVARIABLES_REQUIRED"
+                      >SetQueueVariables field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.SETQUEUEENTRYVARIABLES"
+                  >SetQueueEntryVariables</label
+                >
+                <md-select
+                  name="setqueueentryvar"
+                  ng-model="vm.queueCampaign.setqueueentryvar"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">
+                    {{ 'MOTIONDIALER.YES' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'no'">
+                    {{ 'MOTIONDIALER.NO' | translate }}
+                  </md-option>
+                </md-select>
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.SETQUEUEENTRYVARIABLES"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['setqueueentryvar'].$error"
+                  ng-show="advancedForm['setqueueentryvar'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.SETQUEUEENTRYVARIABLES_REQUIRED"
+                      >SetQueueEntryVariables field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.DIALORDERBYSCHEDULEDAT"
+                  >DialOrderByScheduledAt</label
+                >
+                <md-select
+                  name="dialOrderByScheduledAt"
+                  ng-model="vm.queueCampaign.dialOrderByScheduledAt"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'DESC'">
+                    {{ 'MOTIONDIALER.DESC' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'ASC'">
+                    {{ 'MOTIONDIALER.ASC' | translate }}
+                  </md-option>
+                </md-select>
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.DIALORDERBYSCHEDULEDAT"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['dialOrderByScheduledAt'].$error"
+                  ng-show="advancedForm['dialOrderByScheduledAt'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.DIALORDERBYSCHEDULEDAT_REQUIRED"
+                      >DialOrderByScheduledAt field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.queueCampaign.mandatoryDisposition"
+                  aria-label="MandatoryDisposition"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="MOTIONDIALER.MANDATORYDISPOSITION"
+                    >MandatoryDisposition</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.queueCampaign.mandatoryDisposition"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.MANDATORYDISPOSITIONPAUSEID"
+                  >MandatoryDispositionPauseId</label
+                >
+                <md-select
+                  name="mandatoryDispositionPauseId"
+                  ng-model="vm.queueCampaign.mandatoryDispositionPauseId"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="mandatoryDispositionPauseId.id"
+                    ng-repeat="mandatoryDispositionPauseId in vm.pauses"
+                    ng-disabled="mandatoryDispositionPauseId.canSelect === false"
+                    >{{ mandatoryDispositionPauseId.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.MANDATORYDISPOSITIONPAUSEID"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['mandatoryDispositionPauseId'].$error"
+                  ng-show="advancedForm['mandatoryDispositionPauseId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.MANDATORYDISPOSITIONPAUSEID_REQUIRED"
+                      >MandatoryDispositionPauseId field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            ng-if="vm.queueCampaign.dialMethod === 'preview' || vm.queueCampaign.dialMethod === 'booked'"
+            class="queueCampaign-detail-form-container advancedpreview md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div
+                class="h2 secondary-text"
+                translate="MOTIONDIALER.ADVANCEDPREVIEW"
+              >
+                ADVANCEDPREVIEW
+              </div>
+            </div>
+            <form name="advancedpreviewForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.queueCampaign.acw"
+                  aria-label="AfterCallWork"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="MOTIONDIALER.AFTERCALLWORK"
+                    >AfterCallWork</span
+                  ></md-switch
+                >
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.AFTERCALLWORK"></span>
+                </div>
+              </md-input-container>
+              <md-input-container ng-if="vm.queueCampaign.acw" class="md-block">
+                <label translate="MOTIONDIALER.AFTERCALLWORKDURATION"
+                  >AfterCallWorkDuration</label
+                >
+                <input
+                  type="number"
+                  name="acwTimeout"
+                  ng-model="vm.queueCampaign.acwTimeout"
+                  min="0"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.AFTERCALLWORKDURATION"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="advancedpreviewForm['acwTimeout'].$error"
+                  ng-show="advancedpreviewForm['acwTimeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AFTERCALLWORKDURATION_REQUIRED"
+                      >AfterCallWorkDuration field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AFTERCALLWORKDURATION_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AfterCallWorkDuration must be a valid greater or equal
+                      than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.MONITORFORMAT"
+                  >MonitorFormat</label
+                >
+                <md-select
+                  name="monitor_format"
+                  ng-model="vm.queueCampaign.monitor_format"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="''">Inactive</md-option>
+                  <md-option ng-value="'wav'">wav</md-option>
+                  <md-option ng-value="'wav49'">wav49</md-option>
+                  <md-option ng-value="'gsm'">gsm</md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.MONITORFORMAT"></span>
+                </div>
+                <div
+                  ng-messages="advancedpreviewForm['monitor_format'].$error"
+                  ng-show="advancedpreviewForm['monitor_format'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.MONITORFORMAT_REQUIRED"
+                      >MonitorFormat field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.DIALORDERBYSCHEDULEDAT"
+                  >DialOrderByScheduledAt</label
+                >
+                <md-select
+                  name="dialOrderByScheduledAt"
+                  ng-model="vm.queueCampaign.dialOrderByScheduledAt"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'DESC'">
+                    {{ 'MOTIONDIALER.DESC' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'ASC'">
+                    {{ 'MOTIONDIALER.ASC' | translate }}
+                  </md-option>
+                </md-select>
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.DIALORDERBYSCHEDULEDAT"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="advancedpreviewForm['dialOrderByScheduledAt'].$error"
+                  ng-show="advancedpreviewForm['dialOrderByScheduledAt'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.DIALORDERBYSCHEDULEDAT_REQUIRED"
+                      >DialOrderByScheduledAt field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.queueCampaign.mandatoryDisposition"
+                  aria-label="MandatoryDisposition"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="MOTIONDIALER.MANDATORYDISPOSITION"
+                    >MandatoryDisposition</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.queueCampaign.mandatoryDisposition"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.MANDATORYDISPOSITIONPAUSEID"
+                  >MandatoryDispositionPauseId</label
+                >
+                <md-select
+                  name="mandatoryDispositionPauseId"
+                  ng-model="vm.queueCampaign.mandatoryDispositionPauseId"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="mandatoryDispositionPauseId.id"
+                    ng-repeat="mandatoryDispositionPauseId in vm.pauses"
+                    ng-disabled="mandatoryDispositionPauseId.canSelect === false"
+                    >{{ mandatoryDispositionPauseId.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.MANDATORYDISPOSITIONPAUSEID"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="advancedpreviewForm['mandatoryDispositionPauseId'].$error"
+                  ng-show="advancedpreviewForm['mandatoryDispositionPauseId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.MANDATORYDISPOSITIONPAUSEID_REQUIRED"
+                      >MandatoryDispositionPauseId field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            ng-if="vm.queueCampaign.dialMethod === 'predictive'"
+            class="queueCampaign-detail-form-container thresholds md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div
+                class="h2 secondary-text"
+                translate="MOTIONDIALER.THRESHOLDS"
+              >
+                THRESHOLDS
+              </div>
+            </div>
+            <form name="thresholdsForm" novalidate>
+              <md-input-container
+                ng-if="vm.queueCampaign.dialMethod == 'predictive'"
+                class="md-block"
+              >
+                <span translate="MOTIONDIALER.PREDICTIVEMAXTHRESHOLD"
+                  >PredictiveMaxThreshold</span
+                >
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.PREDICTIVEMAXTHRESHOLD"
+                  ></span>
+                </div>
+                <md-slider
+                  md-discrete
+                  flex
+                  ng-model="vm.queueCampaign.dialPredictiveIntervalMaxThreshold"
+                  min="1"
+                  max="100"
+                  step="1"
+                  class="md-accent"
+                ></md-slider>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.queueCampaign.dialMethod == 'predictive'"
+                class="md-block"
+              >
+                <span translate="MOTIONDIALER.PREDICTIVEMINTHRESHOLD"
+                  >PredictiveMinThreshold</span
+                >
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.PREDICTIVEMINTHRESHOLD"
+                  ></span>
+                </div>
+                <md-slider
+                  md-discrete
+                  flex
+                  ng-model="vm.queueCampaign.dialPredictiveIntervalMinThreshold"
+                  min="1"
+                  max="100"
+                  step="1"
+                  class="md-accent"
+                ></md-slider>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="queueCampaign-detail-form-container recallme md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MOTIONDIALER.RECALLME">
+                RECALLME
+              </div>
+            </div>
+            <form name="recallmeForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.DIALRECALLMETIMEOUT"
+                  >DialRecallMeTimeout</label
+                >
+                <input
+                  type="number"
+                  name="dialRecallMeTimeout"
+                  ng-model="vm.queueCampaign.dialRecallMeTimeout"
+                  min="1"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.DIALRECALLMETIMEOUT"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="recallmeForm['dialRecallMeTimeout'].$error"
+                  ng-show="recallmeForm['dialRecallMeTimeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.DIALRECALLMETIMEOUT_REQUIRED"
+                      >DialRecallMeTimeout field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.DIALRECALLMETIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >DialRecallMeTimeout must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.queueCampaign.dialRecallInQueue"
+                  aria-label="DialRecallInQueue"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="MOTIONDIALER.DIALRECALLINQUEUE"
+                    >DialRecallInQueue</span
+                  ></md-switch
+                >
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.DIALRECALLINQUEUE"></span>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            ng-if="vm.queueCampaign.dialMethod != 'preview'"
+            class="queueCampaign-detail-form-container globalinterval md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div
+                class="h2 secondary-text"
+                translate="MOTIONDIALER.GLOBALINTERVAL"
+              >
+                GLOBALINTERVAL
+              </div>
+            </div>
+            <form name="globalintervalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.GLOBALINTERVAL"
+                  >GlobalInterval</label
+                >
+                <input
+                  type="text"
+                  name="dialGlobalInterval"
+                  ng-model="vm.queueCampaign.dialGlobalInterval"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.GLOBALINTERVAL"></span>
+                </div>
+                <div
+                  ng-messages="globalintervalForm['dialGlobalInterval'].$error"
+                  ng-show="globalintervalForm['dialGlobalInterval'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.GLOBALINTERVAL_REQUIRED"
+                      >GlobalInterval field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            ng-if="vm.queueCampaign.dialMethod != 'preview'"
+            class="queueCampaign-detail-form-container timezone md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MOTIONDIALER.TIMEZONE">
+                TIMEZONE
+              </div>
+            </div>
+            <form name="timezoneForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="MOTIONDIALER.TIMEZONE">Timezone</label>
+                <ms-timezone
+                  name="dialTimezone"
+                  ng-model="vm.queueCampaign.dialTimezone"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                ></ms-timezone>
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.TIMEZONE"></span>
+                </div>
+                <div
+                  ng-messages="timezoneForm['dialTimezone'].$error"
+                  ng-show="timezoneForm[dialTimezone].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.TIMEZONE_REQUIRED"
+                      >Timezone field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            ng-if="vm.queueCampaign.dialMethod === 'progressive' || vm.queueCampaign.dialMethod === 'predictive' || vm.queueCampaign.dialMethod === 'power'"
+            class="queueCampaign-detail-form-container amd md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="MOTIONDIALER.AMD">
+                AMD
+              </div>
+            </div>
+            <form name="amdForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.queueCampaign.dialAMDActive"
+                  aria-label="AMDActive"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="MOTIONDIALER.AMDACTIVE"
+                    >AMDActive</span
+                  ></md-switch
+                >
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.AMDACTIVE"></span>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.queueCampaign.dialAMDActive"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.AMDINITIALSILENCE"
+                  >AMDInitialSilence</label
+                >
+                <input
+                  type="number"
+                  name="dialAMDInitialSilence"
+                  ng-model="vm.queueCampaign.dialAMDInitialSilence"
+                  min="0"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.AMDINITIALSILENCE"></span>
+                </div>
+                <div
+                  ng-messages="amdForm['dialAMDInitialSilence'].$error"
+                  ng-show="amdForm['dialAMDInitialSilence'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDINITIALSILENCE_REQUIRED"
+                      >AMDInitialSilence field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDINITIALSILENCE_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AMDInitialSilence must be a valid greater or equal
+                      than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.queueCampaign.dialAMDActive"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.AMDGREETING">AMDGreeting</label>
+                <input
+                  type="number"
+                  name="dialAMDGreeting"
+                  ng-model="vm.queueCampaign.dialAMDGreeting"
+                  min="0"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.AMDGREETING"></span>
+                </div>
+                <div
+                  ng-messages="amdForm['dialAMDGreeting'].$error"
+                  ng-show="amdForm['dialAMDGreeting'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="MOTIONDIALER.ERRORS.AMDGREETING_REQUIRED"
+                      >AMDGreeting field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDGREETING_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AMDGreeting must be a valid greater or equal than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.queueCampaign.dialAMDActive"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.AMDAFTERGREETINGSILENCE"
+                  >AMDAfterGreetingSilence</label
+                >
+                <input
+                  type="number"
+                  name="dialAMDAfterGreetingSilence"
+                  ng-model="vm.queueCampaign.dialAMDAfterGreetingSilence"
+                  min="0"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.AMDAFTERGREETINGSILENCE"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="amdForm['dialAMDAfterGreetingSilence'].$error"
+                  ng-show="amdForm['dialAMDAfterGreetingSilence'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDAFTERGREETINGSILENCE_REQUIRED"
+                      >AMDAfterGreetingSilence field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDAFTERGREETINGSILENCE_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AMDAfterGreetingSilence must be a valid greater or equal
+                      than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.queueCampaign.dialAMDActive"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.AMDTOTALANALYSISTIME"
+                  >AMDTotalAnalysisTime</label
+                >
+                <input
+                  type="number"
+                  name="dialAMDTotalAnalysisTime"
+                  ng-model="vm.queueCampaign.dialAMDTotalAnalysisTime"
+                  min="0"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.AMDTOTALANALYSISTIME"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="amdForm['dialAMDTotalAnalysisTime'].$error"
+                  ng-show="amdForm['dialAMDTotalAnalysisTime'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDTOTALANALYSISTIME_REQUIRED"
+                      >AMDTotalAnalysisTime field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDTOTALANALYSISTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AMDTotalAnalysisTime must be a valid greater or equal
+                      than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.queueCampaign.dialAMDActive"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.AMDMINWORDLENGTH"
+                  >AMDMinWordLength</label
+                >
+                <input
+                  type="number"
+                  name="dialAMDMinWordLength"
+                  ng-model="vm.queueCampaign.dialAMDMinWordLength"
+                  min="0"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="MOTIONDIALER.HELP.AMDMINWORDLENGTH"></span>
+                </div>
+                <div
+                  ng-messages="amdForm['dialAMDMinWordLength'].$error"
+                  ng-show="amdForm['dialAMDMinWordLength'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDMINWORDLENGTH_REQUIRED"
+                      >AMDMinWordLength field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDMINWORDLENGTH_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AMDMinWordLength must be a valid greater or equal
+                      than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.queueCampaign.dialAMDActive"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.AMDBETWEENWORDSSILENCE"
+                  >AMDBetweenWordsSilence</label
+                >
+                <input
+                  type="number"
+                  name="dialAMDBetweenWordsSilence"
+                  ng-model="vm.queueCampaign.dialAMDBetweenWordsSilence"
+                  min="0"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.AMDBETWEENWORDSSILENCE"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="amdForm['dialAMDBetweenWordsSilence'].$error"
+                  ng-show="amdForm['dialAMDBetweenWordsSilence'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDBETWEENWORDSSILENCE_REQUIRED"
+                      >AMDBetweenWordsSilence field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDBETWEENWORDSSILENCE_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AMDBetweenWordsSilence must be a valid greater or equal
+                      than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.queueCampaign.dialAMDActive"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.AMDMAXIMUMNUMBEROFWORDS"
+                  >AMDMaximumNumberOfWords</label
+                >
+                <input
+                  type="number"
+                  name="dialAMDMaximumNumberOfWords"
+                  ng-model="vm.queueCampaign.dialAMDMaximumNumberOfWords"
+                  min="0"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.AMDMAXIMUMNUMBEROFWORDS"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="amdForm['dialAMDMaximumNumberOfWords'].$error"
+                  ng-show="amdForm['dialAMDMaximumNumberOfWords'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDMAXIMUMNUMBEROFWORDS_REQUIRED"
+                      >AMDMaximumNumberOfWords field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDMAXIMUMNUMBEROFWORDS_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AMDMaximumNumberOfWords must be a valid greater or equal
+                      than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.queueCampaign.dialAMDActive"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.AMDSILENCETHRESHOLD"
+                  >AMDSilenceThreshold</label
+                >
+                <input
+                  type="number"
+                  name="dialAMDSilenceThreshold"
+                  ng-model="vm.queueCampaign.dialAMDSilenceThreshold"
+                  min="0"
+                  max="32767"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.AMDSILENCETHRESHOLD"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="amdForm['dialAMDSilenceThreshold'].$error"
+                  ng-show="amdForm['dialAMDSilenceThreshold'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDSILENCETHRESHOLD_REQUIRED"
+                      >AMDSilenceThreshold field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDSILENCETHRESHOLD_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AMDSilenceThreshold must be a valid greater or equal
+                      than</span
+                    >
+                    <span>0</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDSILENCETHRESHOLD_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >AMDSilenceThreshold must be a valid greater or equal
+                      than</span
+                    >
+                    <span>32767</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.queueCampaign.dialAMDActive"
+                class="md-block"
+              >
+                <label translate="MOTIONDIALER.AMDMAXIMUMWORDLENGTH"
+                  >AMDMaximumWordLength</label
+                >
+                <input
+                  type="number"
+                  name="dialAMDMaximumWordLength"
+                  ng-model="vm.queueCampaign.dialAMDMaximumWordLength"
+                  min="0"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span
+                    translate="MOTIONDIALER.HELP.AMDMAXIMUMWORDLENGTH"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="amdForm['dialAMDMaximumWordLength'].$error"
+                  ng-show="amdForm['dialAMDMaximumWordLength'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDMAXIMUMWORDLENGTH_REQUIRED"
+                      >AMDMaximumWordLength field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="MOTIONDIALER.ERRORS.AMDMAXIMUMWORDLENGTH_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AMDMaximumWordLength must be a valid greater or equal
+                      than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="MOTIONDIALER.HOPPERS">HOPPERS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="queueCampaign-detail-form-container hopperstatistics md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="QueueCampaignHopperStatisticsController as vm_hs"
+              ng-init="vm_hs.init(vm.queueCampaign)"
+            >
+              <md-toolbar class="md-table-toolbar md-default">
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead" translate="MOTIONDIALER.HOPPERWIDGET"
+                    >Hoppers</span
+                  >
+                  <div flex></div>
+                  <md-button
+                    class="md-icon-button"
+                    ng-click="vm_hs.init(vm.queueCampaign)"
+                    aria-label="refresh Hopper"
+                    translate
+                    translate-attr-label="MOTIONDIALER.REFRESH_HOPPERS"
+                  >
+                    <md-icon md-font-icon="icon-refresh"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <!-- WIDGET GROUP -->
+              <div class="widget-group" layout="row" flex="100" layout-wrap>
+                <!-- WIDGET 1 -->
+                <ms-widget
+                  class="h-140"
+                  layout="column"
+                  flex="100"
+                  flex-gt-xs="50"
+                  flex-gt-md="25"
+                >
+                  <!-- Front -->
+                  <ms-widget-front class="p-16 white-bg" layout="row" flex>
+                    <div
+                      class="pt-8 pb-8"
+                      layout="column"
+                      layout-align="center center"
+                      flex
+                    >
+                      <div class="md-display-1 pb-8">
+                        {{(vm_hs.total || 0) + (vm_hs.closed || 0)}}
+                      </div>
+                      <div class="font-weight-500 secondary-text">
+                        {{ 'MOTIONDIALER.TOTAL' | translate }}
+                      </div>
+                    </div>
+                  </ms-widget-front>
+                  <!-- / Front -->
+                </ms-widget>
+                <!-- / WIDGET 1 -->
+
+                <!-- WIDGET 2 -->
+                <ms-widget
+                  class="h-140"
+                  layout="column"
+                  flex="100"
+                  flex-gt-xs="50"
+                  flex-gt-md="25"
+                >
+                  <!-- Front -->
+                  <ms-widget-front class="p-16 white-bg" layout="row" flex>
+                    <div
+                      class="pt-8 pb-8"
+                      layout="column"
+                      layout-align="center center"
+                      flex
+                    >
+                      <div class="md-display-1 pb-8">
+                        {{vm_hs.fresh || 0}} ({{vm_hs.total ? ((((vm_hs.fresh ||
+                        0) * 100)/((vm_hs.closed || 0) + (vm_hs.total || 0))) |
+                        number: 2) : 0}}%)
+                      </div>
+                      <div class="font-weight-500 secondary-text">
+                        {{ 'MOTIONDIALER.FRESH' | translate }}
+                      </div>
+                    </div>
+                  </ms-widget-front>
+                  <!-- / Front -->
+                </ms-widget>
+                <!-- / WIDGET 2 -->
+
+                <!-- WIDGET 3 -->
+                <ms-widget
+                  class="h-140"
+                  layout="column"
+                  flex="100"
+                  flex-gt-xs="50"
+                  flex-gt-md="25"
+                >
+                  <!-- Front -->
+                  <ms-widget-front class="p-16 white-bg" layout="row" flex>
+                    <div
+                      class="pt-8 pb-8"
+                      layout="column"
+                      layout-align="center center"
+                      flex
+                    >
+                      <div class="md-display-1 pb-8">
+                        {{vm_hs.total ? (vm_hs.total - (vm_hs.fresh || 0)) : 0}}
+                        ({{vm_hs.total ? ((((vm_hs.total - (vm_hs.fresh || 0)) *
+                        100)/((vm_hs.closed || 0) + (vm_hs.total || 0))) |
+                        number: 2) : 0}}%)
+                      </div>
+                      <div class="font-weight-500 secondary-text">
+                        {{ 'MOTIONDIALER.OPEN' | translate }}
+                      </div>
+                    </div>
+                  </ms-widget-front>
+                  <!-- / Front -->
+                </ms-widget>
+                <!-- / WIDGET 3 -->
+
+                <!-- WIDGET 3 -->
+                <ms-widget
+                  class="h-140"
+                  layout="column"
+                  flex="100"
+                  flex-gt-xs="50"
+                  flex-gt-md="25"
+                >
+                  <!-- Front -->
+                  <ms-widget-front class="p-16 white-bg" layout="row" flex>
+                    <div
+                      class="pt-8 pb-8"
+                      layout="column"
+                      layout-align="center center"
+                      flex
+                    >
+                      <div class="md-display-1 pb-8">
+                        {{vm_hs.closed ? (vm_hs.closed || 0) : 0}}
+                        ({{vm_hs.closed ? ((((vm_hs.closed) * 100)/(vm_hs.closed
+                        + (vm_hs.total || 0))) | number: 2) : 0}}%)
+                      </div>
+                      <div class="font-weight-500 secondary-text">
+                        {{ 'MOTIONDIALER.CLOSED' | translate }}
+                      </div>
+                    </div>
+                  </ms-widget-front>
+                  <!-- / Front -->
+                </ms-widget>
+                <!-- / WIDGET 3 -->
+              </div>
+              <!-- / WIDGET GROUP -->
+            </div>
+          </div>
+          <div
+            class="queueCampaign-detail-form-container hoppers md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="QueueCampaignHoppersController as vm_dc"
+              ng-init="vm_dc.init(vm.queueCampaign, vm.crudPermissions)"
+            >
+              <md-toolbar
+                class="md-table-toolbar md-default"
+                ng-hide="vm_dc.selectedQueueCampaignHoppers.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead" translate="MOTIONDIALER.HOPPERS"
+                    >Hoppers</span
+                  >
+                  <ms-search-bar
+                    on-search="vm_dc.query.filter = query"
+                    on-collapse="vm_dc.query.filter = undefined"
+                    debounce="300"
+                    direction="down"
+                  ></ms-search-bar>
+                  <div flex></div>
+                  <md-button
+                    class="md-icon-button"
+                    ng-click="vm_dc.getQueueCampaignHoppers()"
+                    aria-label="refresh Hoppers"
+                    translate
+                    translate-attr-label="MOTIONDIALER.REFRESH_HOPPERS"
+                  >
+                    <md-icon md-font-icon="icon-refresh"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-toolbar
+                class="md-table-toolbar md-accent"
+                ng-show="vm_dc.selectedQueueCampaignHoppers.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead"
+                    >{{vm_dc.selectedQueueCampaignHoppers.length}}
+                    {{vm_dc.selectedQueueCampaignHoppers.length > 1 ? 'items' :
+                    'item'}} selected</span
+                  >
+                  <div flex></div>
+                  <button
+                    class="md-icon-button"
+                    ng-csv="vm_dc.exportSelectedQueueCampaignHoppers"
+                    csv-label="true"
+                    filename="queueCampaigns.csv"
+                  >
+                    <md-icon md-font-icon="icon-file-excel"></md-icon>
+                  </button>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canDelete"
+                    class="md-icon-button"
+                    ng-click="vm_dc.deleteSelectedQueueCampaignHoppers($event)"
+                    aria-label="delete selected"
+                    translate
+                    translate-attr-label="MOTIONDIALER.DELETE_SELECTED"
+                  >
+                    <md-icon md-font-icon="icon-delete"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-table-container class="font-size-12">
+                <table
+                  md-table
+                  md-row-select
+                  multiple
+                  ng-model="vm_dc.selectedQueueCampaignHoppers"
+                  md-progress="vm_dc.promise"
+                >
+                  <thead
+                    md-head
+                    md-order="vm_dc.query.sort"
+                    md-on-reorder="vm_dc.getQueueCampaignHoppers"
+                  >
+                    <tr md-row>
+                      <th md-column md-order-by="ContactId">
+                        {{ 'MOTIONDIALER.CONTACTID' | translate }}
+                      </th>
+                      <th md-column md-order-by="phone">
+                        {{ 'MOTIONDIALER.PHONE' | translate }}
+                      </th>
+                      <th md-column md-order-by="countcongestionretry">
+                        {{ 'MOTIONDIALER.CONGESTION' | translate }}
+                      </th>
+                      <th md-column md-order-by="countbusyretry">
+                        {{ 'MOTIONDIALER.BUSY' | translate }}
+                      </th>
+                      <th md-column md-order-by="countnoanswerretry">
+                        {{ 'MOTIONDIALER.NOANSWER' | translate }}
+                      </th>
+                      <th md-column md-order-by="countnosuchnumberretry">
+                        {{ 'MOTIONDIALER.NOSUCHNUMBER' | translate }}
+                      </th>
+                      <th md-column md-order-by="countdropretry">
+                        {{ 'MOTIONDIALER.DROP' | translate }}
+                      </th>
+                      <th md-column md-order-by="countabandonedretry">
+                        {{ 'MOTIONDIALER.ABANDONED' | translate }}
+                      </th>
+                      <th md-column md-order-by="countmachineretry">
+                        {{ 'MOTIONDIALER.MACHINE' | translate }}
+                      </th>
+                      <th md-column md-order-by="countagentrejectretry">
+                        {{ 'MOTIONDIALER.AGENTREJECT' | translate }}
+                      </th>
+                      <th md-column md-order-by="scheduledat">
+                        {{ 'MOTIONDIALER.SCHEDULEDAT' | translate }}
+                      </th>
+                      <th md-column md-order-by="priority">
+                        {{ 'MOTIONDIALER.PRIORITY' | translate }}
+                      </th>
+                      <th md-column md-order-by="recallme">
+                        {{ 'MOTIONDIALER.RECALLAGENT' | translate }}
+                      </th>
+                      <th md-column width="10px"></th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr
+                      md-row
+                      md-select="hopper"
+                      md-select-id="id"
+                      ng-repeat="hopper in vm_dc.queueCampaignHoppers.rows"
+                    >
+                      <td
+                        ng-click="vm_dc.createOrEditQueueCampaignHopper($event, hopper)"
+                        md-cell
+                      >
+                        {{hopper.ContactId}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditQueueCampaignHopper($event, hopper)"
+                        md-cell
+                      >
+                        {{hopper.phone}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditQueueCampaignHopper($event, hopper)"
+                        md-cell
+                      >
+                        {{hopper.countcongestionretry}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditQueueCampaignHopper($event, hopper)"
+                        md-cell
+                      >
+                        {{hopper.countbusyretry}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditQueueCampaignHopper($event, hopper)"
+                        md-cell
+                      >
+                        {{hopper.countnoanswerretry}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditQueueCampaignHopper($event, hopper)"
+                        md-cell
+                      >
+                        {{hopper.countnosuchnumberretry}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditQueueCampaignHopper($event, hopper)"
+                        md-cell
+                      >
+                        {{hopper.countdropretry}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditQueueCampaignHopper($event, hopper)"
+                        md-cell
+                      >
+                        {{hopper.countabandonedretry}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditQueueCampaignHopper($event, hopper)"
+                        md-cell
+                      >
+                        {{hopper.countmachineretry}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditQueueCampaignHopper($event, hopper)"
+                        md-cell
+                      >
+                        {{hopper.countagentrejectretry}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditQueueCampaignHopper($event, hopper)"
+                        md-cell
+                      >
+                        {{ hopper.scheduledat | formatdate }}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditQueueCampaignHopper($event, hopper)"
+                        md-cell
+                      >
+                        {{ vm_dc.arraypriority[hopper.priority].option }}
+                      </td>
+
+                      <td
+                        ng-click="vm_dc.createOrEditQueueCampaignHopper($event, hopper)"
+                        md-cell
+                        class="recallme"
+                      >
+                        <md-icon
+                          md-colors="{color: {{hopper.recallme ? '\'green\'' : '\'grey\''}}}"
+                          md-font-icon="{{hopper.recallme? 'icon-check' : 'icon-close'}}"
+                        ></md-icon>
+                      </td>
+                      <td
+                        md-cell
+                        class="actions"
+                        ng-if="!vm_dc.crudPermissions.readOnly"
+                      >
+                        <md-menu>
+                          <md-button
+                            class="md-icon-button"
+                            aria-label="More"
+                            translate
+                            translate-attr-aria-label="MOTIONDIALER.MORE"
+                            ng-click="$mdOpenMenu($event)"
+                          >
+                            <md-icon
+                              md-font-icon="icon-dots-vertical"
+                            ></md-icon>
+                          </md-button>
+
+                          <md-menu-content width="3">
+                            <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
+                              <md-button
+                                ng-click="vm_dc.createOrEditQueueCampaignHopper($event, hopper)"
+                                translate="MOTIONDIALER.EDIT_HOPPER"
+                              >
+                                Edit Hopper
+                              </md-button>
+                            </md-menu-item>
+                            <md-menu-item
+                              ng-if="vm_dc.crudPermissions.canDelete"
+                            >
+                              <md-button
+                                ng-click="vm_dc.deleteConfirm(hopper, $event)"
+                                translate="MOTIONDIALER.DELETE_HOPPER"
+                              >
+                                Delete Hopper
+                              </md-button>
+                            </md-menu-item>
+                          </md-menu-content>
+                        </md-menu>
+                      </td>
+                    </tr>
+                    <tr md-row ng-if="!vm_dc.queueCampaignHoppers.rows.length">
+                      <td md-cell colspan="17">
+                        <div layout="row" layout-align="center center">
+                          <span
+                            class="text-boxed-light"
+                            translate="MOTIONDIALER.NO_HOPPER_AVAILABLE"
+                            >No hopper available</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+              <md-table-pagination
+                md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
+                md-limit="vm_dc.query.limit"
+                md-limit-options="[10, 15, 20, 50, 100, 250]"
+                md-page="vm_dc.query.page"
+                md-total="{{vm_dc.queueCampaignHoppers.count}}"
+                md-on-paginate="vm_dc.getQueueCampaignHoppers"
+                md-page-select
+              ></md-table-pagination>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="MOTIONDIALER.HISTORY">HISTORY</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="queueCampaign-detail-form-container hopperhistories md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="QueueCampaignHopperHistoriesController as vm_dc"
+              ng-init="vm_dc.init(vm.queueCampaign, vm.crudPermissions)"
+            >
+              <md-toolbar
+                class="md-table-toolbar md-default"
+                ng-hide="vm_dc.selectedQueueCampaignHopperHistories.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span
+                    class="md-subhead"
+                    translate="MOTIONDIALER.HOPPERHISTORIES"
+                    >HopperHistories</span
+                  >
+                  <ms-search-bar
+                    on-search="vm_dc.query.filter = query"
+                    on-collapse="vm_dc.query.filter = undefined"
+                    debounce="300"
+                    direction="down"
+                  ></ms-search-bar>
+                  <div flex></div>
+                  <md-button
+                    class="md-icon-button"
+                    ng-click="vm_dc.getQueueCampaignHopperHistories()"
+                    aria-label="refresh HopperHistories"
+                    translate
+                    translate-attr-label="MOTIONDIALER.REFRESH_HOPPERHISTORIES"
+                  >
+                    <md-icon md-font-icon="icon-refresh"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-toolbar
+                class="md-table-toolbar md-accent"
+                ng-show="vm_dc.selectedQueueCampaignHopperHistories.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead"
+                    >{{vm_dc.selectedQueueCampaignHopperHistories.length}}
+                    {{vm_dc.selectedQueueCampaignHopperHistories.length > 1 ?
+                    'items' : 'item'}} selected</span
+                  >
+                  <div flex></div>
+                  <button
+                    class="md-icon-button"
+                    ng-csv="vm_dc.exportSelectedQueueCampaignHopperHistories"
+                    csv-label="true"
+                    filename="queueCampaigns.csv"
+                  >
+                    <md-icon md-font-icon="icon-file-excel"></md-icon>
+                  </button>
+                </div>
+              </md-toolbar>
+              <md-table-container class="font-size-12">
+                <table
+                  md-table
+                  md-row-select
+                  multiple
+                  ng-model="vm_dc.selectedQueueCampaignHopperHistories"
+                  md-progress="vm_dc.promise"
+                >
+                  <thead
+                    md-head
+                    md-order="vm_dc.query.sort"
+                    md-on-reorder="vm_dc.getQueueCampaignHopperHistories"
+                  >
+                    <tr md-row>
+                      <th md-column md-order-by="uniqueid">
+                        {{ 'MOTIONDIALER.UNIQUEID' | translate }}
+                      </th>
+                      <th md-column md-order-by="ContactId">
+                        {{ 'MOTIONDIALER.CONTACTID' | translate }}
+                      </th>
+                      <th md-column md-order-by="calleridnum">
+                        {{ 'MOTIONDIALER.PHONE' | translate }}
+                      </th>
+                      <th md-column md-order-by="calleridname">
+                        {{ 'MOTIONDIALER.NAME' | translate }}
+                      </th>
+                      <th md-column md-order-by="statedesc">
+                        {{ 'MOTIONDIALER.STATUS' | translate }}
+                      </th>
+                      <th md-column md-order-by="scheduledat">
+                        {{ 'MOTIONDIALER.SCHEDULEDAT' | translate }}
+                      </th>
+                      <th md-column md-order-by="starttime">
+                        {{ 'MOTIONDIALER.STARTTIME' | translate }}
+                      </th>
+                      <th md-column md-order-by="endtime">
+                        {{ 'MOTIONDIALER.ENDTIME' | translate }}
+                      </th>
+                      <th md-column width="10px"></th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr
+                      md-row
+                      md-select="hopperHistory"
+                      md-select-id="id"
+                      ng-repeat="hopperHistory in vm_dc.queueCampaignHopperHistories.rows"
+                    >
+                      <td md-cell>{{hopperHistory.uniqueid}}</td>
+                      <td md-cell>{{hopperHistory.ContactId}}</td>
+                      <td md-cell>{{hopperHistory.calleridnum}}</td>
+                      <td md-cell>{{hopperHistory.calleridname}}</td>
+                      <td md-cell>{{hopperHistory.statedesc}}</td>
+                      <td md-cell>
+                        {{ hopperHistory.scheduledat | formatdate }}
+                      </td>
+                      <td md-cell>
+                        {{ hopperHistory.starttime | formatdate }}
+                      </td>
+                      <td md-cell>{{ hopperHistory.endtime | formatdate }}</td>
+                      <td md-cell class="actions"></td>
+                    </tr>
+                    <tr
+                      md-row
+                      ng-if="!vm_dc.queueCampaignHopperHistories.rows.length"
+                    >
+                      <td md-cell colspan="11">
+                        <div layout="row" layout-align="center center">
+                          <span
+                            class="text-boxed-light"
+                            translate="MOTIONDIALER.NO_HOPPERHISTORY_AVAILABLE"
+                            >No hopperhistory available</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+              <md-table-pagination
+                md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
+                md-limit="vm_dc.query.limit"
+                md-limit-options="[10, 15, 20, 50, 100, 250]"
+                md-page="vm_dc.query.page"
+                md-total="{{vm_dc.queueCampaignHopperHistories.count}}"
+                md-on-paginate="vm_dc.getQueueCampaignHopperHistories"
+                md-page-select
+              ></md-table-pagination>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="MOTIONDIALER.FINAL">FINAL</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="queueCampaign-detail-form-container hopperfinals md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="QueueCampaignHopperFinalsController as vm_dc"
+              ng-init="vm_dc.init(vm.queueCampaign, vm.crudPermissions)"
+            >
+              <md-toolbar
+                class="md-table-toolbar md-default"
+                ng-hide="vm_dc.selectedQueueCampaignHopperFinals.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead" translate="MOTIONDIALER.HOPPERFINALS"
+                    >HopperFinals</span
+                  >
+                  <ms-search-bar
+                    on-search="vm_dc.query.filter = query"
+                    on-collapse="vm_dc.query.filter = undefined"
+                    debounce="300"
+                    direction="down"
+                  ></ms-search-bar>
+                  <div flex></div>
+                  <md-button
+                    class="md-icon-button"
+                    ng-click="vm_dc.getQueueCampaignHopperFinals()"
+                    aria-label="refresh HopperFinals"
+                    translate
+                    translate-attr-label="MOTIONDIALER.REFRESH_HOPPERFINALS"
+                  >
+                    <md-icon md-font-icon="icon-refresh"></md-icon>
+                  </md-button>
+                  <td md-cell class="actions">
+                    <md-menu>
+                      <md-button
+                        class="md-icon-button"
+                        aria-label="More"
+                        translate
+                        translate-attr-aria-label="MOTIONDIALER.MORE"
+                        ng-click="vm_dc.countContactsQueueCampaignHopperFinal(vm_dc.query.id); $mdOpenMenu($event);"
+                      >
+                        <md-icon md-font-icon="icon-backup-restore"></md-icon>
+                        <md-tooltip
+                          ><span translate="MOTIONDIALER.RESTORECONTACTS"></span
+                        ></md-tooltip>
+                      </md-button>
+                      <md-menu-content width="3">
+                        <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
+                          <md-button
+                            ng-click="vm_dc.moveContactsQueueCampaignHopperFinal(3)"
+                          >
+                            <span translate="MOTIONDIALER.NOANSWER "
+                              >NoAnswer</span
+                            >
+                            <span class="badge"
+                              >({{vm_dc.contacts.noAnswerContacts}})</span
+                            >
+                          </md-button>
+                        </md-menu-item>
+                        <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
+                          <md-button
+                            ng-click="vm_dc.moveContactsQueueCampaignHopperFinal(5)"
+                          >
+                            <span translate="MOTIONDIALER.BUSY ">Busy</span>
+                            <span class="badge"
+                              >({{vm_dc.contacts.busyContacts}})</span
+                            >
+                          </md-button>
+                        </md-menu-item>
+                        <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
+                          <md-button
+                            ng-click="vm_dc.moveContactsQueueCampaignHopperFinal(8)"
+                          >
+                            <span translate="MOTIONDIALER.CONGESTION "
+                              >Congestion</span
+                            >
+                            <span class="badge"
+                              >({{vm_dc.contacts.congestionContacts}})</span
+                            >
+                          </md-button>
+                        </md-menu-item>
+                        <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
+                          <md-button
+                            ng-click="vm_dc.moveContactsQueueCampaignHopperFinal(10)"
+                          >
+                            <span translate="MOTIONDIALER.DROPPED ">Drop</span>
+                            <span class="badge"
+                              >({{vm_dc.contacts.dropContacts}})</span
+                            >
+                          </md-button>
+                        </md-menu-item>
+                        <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
+                          <md-button
+                            ng-click="vm_dc.moveContactsQueueCampaignHopperFinal(11)"
+                          >
+                            <span translate="MOTIONDIALER.ABANDONED "
+                              >Abandoned</span
+                            >
+                            <span class="badge"
+                              >({{vm_dc.contacts.abandonedContacts}})</span
+                            >
+                          </md-button>
+                        </md-menu-item>
+                        <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
+                          <md-button
+                            ng-click="vm_dc.moveContactsQueueCampaignHopperFinal(22)"
+                          >
+                            <span translate="MOTIONDIALER.RECALLFAILEDTIMEOUT"
+                              >Recall</span
+                            >
+                            <span class="badge"
+                              >({{vm_dc.contacts.reCallContacts}})</span
+                            >
+                          </md-button>
+                        </md-menu-item>
+                        <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
+                          <md-button
+                            ng-click="vm_dc.moveContactsQueueCampaignHopperFinal(0)"
+                          >
+                            <span translate="MOTIONDIALER.NO_SUCH_NUMBER"
+                              >NoSuchNumber</span
+                            >
+                            <span class="badge"
+                              >({{vm_dc.contacts.noSuchContacts}})</span
+                            >
+                          </md-button>
+                        </md-menu-item>
+                        <md-menu-item>
+                          <md-button
+                            ng-click="vm_dc.moveContactsQueueCampaignHopperFinal(19)"
+                          >
+                            <span translate="MOTIONDIALER.ANSWERING_MACHINE"
+                              >AnsweringMachine</span
+                            >
+                            <span class="badge"
+                              >({{vm_dc.contacts.answeringMachine}})</span
+                            >
+                          </md-button>
+                        </md-menu-item>
+                      </md-menu-content>
+                    </md-menu>
+                  </td>
+                </div>
+              </md-toolbar>
+              <md-toolbar
+                class="md-table-toolbar md-accent"
+                ng-show="vm_dc.selectedQueueCampaignHopperFinals.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead"
+                    >{{vm_dc.selectedQueueCampaignHopperFinals.length}}
+                    {{vm_dc.selectedQueueCampaignHopperFinals.length > 1 ?
+                    'items' : 'item'}} selected</span
+                  >
+                  <div flex></div>
+                  <button
+                    class="md-icon-button"
+                    ng-csv="vm_dc.exportSelectedQueueCampaignHopperFinals"
+                    csv-label="true"
+                    filename="queueCampaigns.csv"
+                  >
+                    <md-icon md-font-icon="icon-file-excel"></md-icon>
+                  </button>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canEdit"
+                    class="md-icon-button"
+                    ng-click="vm_dc.moveSelectedQueueCampaignHopperFinals($event)"
+                    aria-label="move selected"
+                    translate
+                    translate-attr-label="MOTIONDIALER.MOVE_SELECTED"
+                  >
+                    <md-icon md-font-icon="icon-restore"></md-icon>
+                    <md-tooltip
+                      ><span translate="MOTIONDIALER.RESTORECONTACTS"></span
+                    ></md-tooltip>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-table-container class="font-size-12">
+                <table
+                  md-table
+                  md-row-select
+                  multiple
+                  ng-model="vm_dc.selectedQueueCampaignHopperFinals"
+                  md-progress="vm_dc.promise"
+                >
+                  <thead
+                    md-head
+                    md-order="vm_dc.query.sort"
+                    md-on-reorder="vm_dc.getQueueCampaignHopperFinals"
+                  >
+                    <tr md-row>
+                      <th md-column md-order-by="uniqueid">
+                        {{ 'MOTIONDIALER.UNIQUEID' | translate }}
+                      </th>
+                      <th md-column md-order-by="ContactId">
+                        {{ 'MOTIONDIALER.CONTACTID' | translate }}
+                      </th>
+                      <th md-column md-order-by="calleridnum">
+                        {{ 'MOTIONDIALER.PHONE' | translate }}
+                      </th>
+                      <th md-column md-order-by="calleridname">
+                        {{ 'MOTIONDIALER.NAME' | translate }}
+                      </th>
+                      <th md-column md-order-by="statedesc">
+                        {{ 'MOTIONDIALER.STATUS' | translate }}
+                      </th>
+                      <th md-column md-order-by="countcongestionretry">
+                        {{ 'MOTIONDIALER.CONGESTION' | translate }}
+                      </th>
+                      <th md-column md-order-by="countbusyretry">
+                        {{ 'MOTIONDIALER.BUSY' | translate }}
+                      </th>
+                      <th md-column md-order-by="countnoanswerretry">
+                        {{ 'MOTIONDIALER.NOANSWER' | translate }}
+                      </th>
+                      <th md-column md-order-by="countnosuchnumberretry">
+                        {{ 'MOTIONDIALER.NOSUCHNUMBER' | translate }}
+                      </th>
+                      <th md-column md-order-by="countdropretry">
+                        {{ 'MOTIONDIALER.DROP' | translate }}
+                      </th>
+                      <th md-column md-order-by="countabandonedretry">
+                        {{ 'MOTIONDIALER.ABANDONED' | translate }}
+                      </th>
+                      <th md-column md-order-by="countmachineretry">
+                        {{ 'MOTIONDIALER.MACHINE' | translate }}
+                      </th>
+                      <th md-column md-order-by="countagentrejectretry">
+                        {{ 'MOTIONDIALER.AGENTREJECT' | translate }}
+                      </th>
+                      <th md-column md-order-by="starttime">
+                        {{ 'MOTIONDIALER.STARTTIME' | translate }}
+                      </th>
+                      <th md-column md-order-by="endtime">
+                        {{ 'MOTIONDIALER.ENDTIME' | translate }}
+                      </th>
+                      <th md-column md-order-by="disposition">
+                        {{ 'MOTIONDIALER.DISPOSITION' | translate }}
+                      </th>
+                      <th md-column md-order-by="secondDisposition">
+                        {{ 'MOTIONDIALER.SECOND_LEVEL_DISPOSITION' | translate
+                        }}
+                      </th>
+                      <th md-column md-order-by="thirdDisposition">
+                        {{ 'MOTIONDIALER.THIRD_LEVEL_DISPOSITION' | translate }}
+                      </th>
+                      <th md-column width="10px"></th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr
+                      md-row
+                      md-select="hopperFinal"
+                      md-select-id="id"
+                      ng-repeat="hopperFinal in vm_dc.queueCampaignHopperFinals.rows"
+                    >
+                      <td md-cell>{{hopperFinal.uniqueid}}</td>
+                      <td md-cell>{{hopperFinal.ContactId}}</td>
+                      <td md-cell>{{hopperFinal.calleridnum}}</td>
+                      <td md-cell>{{hopperFinal.calleridname}}</td>
+                      <td md-cell>{{hopperFinal.statedesc}}</td>
+                      <td md-cell>{{hopperFinal.countcongestionretry}}</td>
+                      <td md-cell>{{hopperFinal.countbusyretry}}</td>
+                      <td md-cell>{{hopperFinal.countnoanswerretry}}</td>
+                      <td md-cell>{{hopperFinal.countnosuchnumberretry}}</td>
+                      <td md-cell>{{hopperFinal.countdropretry}}</td>
+                      <td md-cell>{{hopperFinal.countabandonedretry}}</td>
+                      <td md-cell>{{hopperFinal.countmachineretry}}</td>
+                      <td md-cell>{{hopperFinal.countagentrejectretry}}</td>
+                      <td md-cell>{{ hopperFinal.starttime | formatdate }}</td>
+                      <td md-cell>{{ hopperFinal.endtime | formatdate }}</td>
+                      <td md-cell>{{hopperFinal.disposition}}</td>
+                      <td md-cell>{{hopperFinal.secondDisposition}}</td>
+                      <td md-cell>{{hopperFinal.thirdDisposition}}</td>
+                      <td
+                        md-cell
+                        class="actions"
+                        ng-if="!vm_dc.crudPermissions.readOnly"
+                      >
+                        <md-menu>
+                          <md-button
+                            class="md-icon-button"
+                            aria-label="More"
+                            translate
+                            translate-attr-aria-label="MOTIONDIALER.MORE"
+                            ng-click="$mdOpenMenu($event)"
+                          >
+                            <md-icon
+                              md-font-icon="icon-dots-vertical"
+                            ></md-icon>
+                          </md-button>
+
+                          <md-menu-content width="3">
+                            <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
+                              <md-button
+                                ng-click="vm_dc.moveConfirm(hopperFinal, $event)"
+                                translate="MOTIONDIALER.MOVE_HOPPERFINAL"
+                              >
+                                Move HopperFinal
+                              </md-button>
+                            </md-menu-item>
+                          </md-menu-content>
+                        </md-menu>
+                      </td>
+                    </tr>
+                    <tr
+                      md-row
+                      ng-if="!vm_dc.queueCampaignHopperFinals.rows.length"
+                    >
+                      <td md-cell colspan="30">
+                        <div layout="row" layout-align="center center">
+                          <span
+                            class="text-boxed-light"
+                            translate="MOTIONDIALER.NO_HOPPERFINAL_AVAILABLE"
+                            >No hopperfinal available</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+              <md-table-pagination
+                md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
+                md-limit="vm_dc.query.limit"
+                md-limit-options="[10, 15, 20, 50, 100, 250]"
+                md-page="vm_dc.query.page"
+                md-total="{{vm_dc.queueCampaignHopperFinals.count}}"
+                md-on-paginate="vm_dc.getQueueCampaignHopperFinals"
+                md-page-select
+              ></md-table-pagination>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="MOTIONDIALER.BLACKLIST">BLACKLIST</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="queueCampaign-detail-form-container hopperblacks md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="QueueCampaignHopperBlacksController as vm_dc"
+              ng-init="vm_dc.init(vm.queueCampaign, vm.crudPermissions)"
+            >
+              <md-toolbar
+                class="md-table-toolbar md-default"
+                ng-hide="vm_dc.selectedQueueCampaignHopperBlacks.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead" translate="MOTIONDIALER.HOPPERBLACKS"
+                    >HopperBlacks</span
+                  >
+                  <ms-search-bar
+                    on-search="vm_dc.query.filter = query"
+                    on-collapse="vm_dc.query.filter = undefined"
+                    debounce="300"
+                    direction="down"
+                  ></ms-search-bar>
+                  <div flex></div>
+                </div>
+              </md-toolbar>
+              <md-toolbar
+                class="md-table-toolbar md-accent"
+                ng-show="vm_dc.selectedQueueCampaignHopperBlacks.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead"
+                    >{{vm_dc.selectedQueueCampaignHopperBlacks.length}}
+                    {{vm_dc.selectedQueueCampaignHopperBlacks.length > 1 ?
+                    'items' : 'item'}} selected</span
+                  >
+                  <div flex></div>
+                  <button
+                    class="md-icon-button"
+                    ng-csv="vm_dc.exportSelectedQueueCampaignHopperBlacks"
+                    csv-label="true"
+                    filename="queueCampaigns.csv"
+                  >
+                    <md-icon md-font-icon="icon-file-excel"></md-icon>
+                  </button>
+                </div>
+              </md-toolbar>
+              <md-table-container class="font-size-12">
+                <table
+                  md-table
+                  md-row-select
+                  multiple
+                  ng-model="vm_dc.selectedQueueCampaignHopperBlacks"
+                  md-progress="vm_dc.promise"
+                >
+                  <thead
+                    md-head
+                    md-order="vm_dc.query.sort"
+                    md-on-reorder="vm_dc.getQueueCampaignHopperBlacks"
+                  >
+                    <tr md-row>
+                      <th md-column md-order-by="ContactId">
+                        {{ 'MOTIONDIALER.CONTACTID' | translate }}
+                      </th>
+                      <th md-column md-order-by="phone">
+                        {{ 'MOTIONDIALER.PHONE' | translate }}
+                      </th>
+                      <th md-column width="10px"></th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr
+                      md-row
+                      md-select="hopperBlack"
+                      md-select-id="id"
+                      ng-repeat="hopperBlack in vm_dc.queueCampaignHopperBlacks.rows"
+                    >
+                      <td md-cell>{{hopperBlack.ContactId}}</td>
+                      <td md-cell>{{hopperBlack.phone}}</td>
+                      <td md-cell class="actions"></td>
+                    </tr>
+                    <tr
+                      md-row
+                      ng-if="!vm_dc.queueCampaignHopperBlacks.rows.length"
+                    >
+                      <td md-cell colspan="4">
+                        <div layout="row" layout-align="center center">
+                          <span
+                            class="text-boxed-light"
+                            translate="MOTIONDIALER.NO_HOPPERBLACK_AVAILABLE"
+                            >No hopperblack available</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+              <md-table-pagination
+                md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
+                md-limit="vm_dc.query.limit"
+                md-limit-options="[10, 15, 20, 50, 100, 250]"
+                md-page="vm_dc.query.page"
+                md-total="{{vm_dc.queueCampaignHopperBlacks.count}}"
+                md-on-paginate="vm_dc.getQueueCampaignHopperBlacks"
+                md-page-select
+              ></md-table-pagination>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/queueCampaigns.html/queueCampaigns-[chunkhash].html b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/queueCampaigns.html/queueCampaigns-[chunkhash].html
deleted file mode 100644
index 4fac2fb..0000000
--- a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/queueCampaigns.html/queueCampaigns-[chunkhash].html
+++ /dev/null
@@ -1,409 +0,0 @@
-<div
-  id="queueCampaigns"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-fire" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="MOTIONDIALER.QUEUECAMPAIGNS"
-          >QueueCampaigns</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="MOTIONDIALER.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedQueueCampaigns.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedQueueCampaigns =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="MOTIONDIALER.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-queueCampaigns-count">
-          <span>{{vm.selectedQueueCampaigns.length}}</span>
-          <span translate="MOTIONDIALER.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="MOTIONDIALER.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllQueueCampaigns()"
-                translate="MOTIONDIALER.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectQueueCampaigns()"
-                translate="MOTIONDIALER.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedQueueCampaigns"
-          csv-label="true"
-          filename="queueCampaigns.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedQueueCampaigns($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="MOTIONDIALER.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- QUEUECAMPAIGN TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedQueueCampaigns"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getQueueCampaigns"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">
-                  {{ 'MOTIONDIALER.ID' | translate }}
-                </th>
-                <th md-column md-order-by="name">
-                  {{ 'MOTIONDIALER.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="dialActive">
-                  {{ 'MOTIONDIALER.ACTIVE' | translate }}
-                </th>
-                <th md-column md-order-by="TrunkId">
-                  {{ 'MOTIONDIALER.TRUNK' | translate }}
-                </th>
-                <th md-column md-order-by="dialMethod">
-                  {{ 'MOTIONDIALER.METHOD' | translate }}
-                </th>
-                <th md-column md-order-by="strategy">
-                  {{ 'MOTIONDIALER.STRATEGY' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.queueCampaigns.rows.length">
-                <td md-cell colspan="7">
-                  <div layout="row" layout-align="center center">
-                    <span translate="MOTIONDIALER.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="queueCampaign"
-                md-select-id="id"
-                ng-repeat="queueCampaign in vm.queueCampaigns.rows"
-              >
-                <td md-cell ng-if="queueCampaign.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{queueCampaign.name}}"
-                    ng-src="api/users/{{queueCampaign.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!queueCampaign.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{queueCampaign.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(queueCampaign, ev) : vm.createOrEditQueueCampaign($event, queueCampaign)"
-                  md-cell
-                  class="id"
-                >
-                  {{queueCampaign.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(queueCampaign, ev) : vm.createOrEditQueueCampaign($event, queueCampaign)"
-                  md-cell
-                  class="name"
-                >
-                  {{queueCampaign.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(queueCampaign, ev) : vm.createOrEditQueueCampaign($event, queueCampaign)"
-                  md-cell
-                  class="dialActive"
-                >
-                  <md-icon
-                    md-colors="{color: {{queueCampaign.dialActive ? '\'green\'' : '\'grey\''}}}"
-                    md-font-icon="{{queueCampaign.dialActive ? 'icon-check' : 'icon-close'}}"
-                  ></md-icon>
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(queueCampaign, ev) : vm.createOrEditQueueCampaign($event, queueCampaign)"
-                  md-cell
-                  class="TrunkId"
-                >
-                  {{ (vm.trunks | filter : {'id':queueCampaign.TrunkId} :
-                  true)[0].name }}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(queueCampaign, ev) : vm.createOrEditQueueCampaign($event, queueCampaign)"
-                  md-cell
-                  class="dialMethod"
-                >
-                  {{ vm.arraydialMethod[queueCampaign.dialMethod].option }}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(queueCampaign, ev) : vm.createOrEditQueueCampaign($event, queueCampaign)"
-                  md-cell
-                  class="strategy"
-                >
-                  {{ vm.arraystrategy[queueCampaign.strategy].option }}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="MOTIONDIALER.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(queueCampaign, $event    )"
-                          translate="MOTIONDIALER.EDIT_QUEUECAMPAIGN"
-                        >
-                          Edit QueueCampaign
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.clonedialog(queueCampaign, $event    )"
-                          translate="MOTIONDIALER.CLONE_QUEUECAMPAIGN"
-                        >
-                          clone QueueCampaign
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.listadddialog(queueCampaign, $event    )"
-                          translate="MOTIONDIALER.LISTADD_QUEUECAMPAIGN"
-                        >
-                          listadd QueueCampaign
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.blacklistadddialog(queueCampaign, $event    )"
-                          translate="MOTIONDIALER.BLACKLISTADD_QUEUECAMPAIGN"
-                        >
-                          blacklistadd QueueCampaign
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.teamadddialog(queueCampaign, $event    )"
-                          translate="MOTIONDIALER.TEAMADD_QUEUECAMPAIGN"
-                        >
-                          teamadd QueueCampaign
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.agentadddialog(queueCampaign, $event    )"
-                          translate="MOTIONDIALER.AGENTADD_QUEUECAMPAIGN"
-                        >
-                          agentadd QueueCampaign
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(queueCampaign, $event    )"
-                          translate="MOTIONDIALER.DELETE_QUEUECAMPAIGN"
-                        >
-                          Delete QueueCampaign
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.gotorealtimegoto(queueCampaign, $event    )"
-                          translate="MOTIONDIALER.GOTOREALTIME_QUEUECAMPAIGN"
-                        >
-                          goToRealtime QueueCampaign
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.queueCampaigns.count}}"
-          md-on-paginate="vm.getQueueCampaigns"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / QUEUECAMPAIGN TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD QUEUECAMPAIGN BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-queueCampaign-button"
-    ng-click="vm.createOrEditQueueCampaign($event)"
-    aria-label="add queueCampaign"
-    translate
-    translate-attr-aria-label="MOTIONDIALER.ADD_QUEUECAMPAIGN"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD QUEUECAMPAIGN BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/queueCampaigns.html/queueCampaigns.html b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/queueCampaigns.html/queueCampaigns.html
new file mode 100644
index 0000000..4fac2fb
--- /dev/null
+++ b/public/src/js/modules/main/apps/motiondialer/views/queueCampaigns/queueCampaigns.html/queueCampaigns.html
@@ -0,0 +1,409 @@
+<div
+  id="queueCampaigns"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-fire" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="MOTIONDIALER.QUEUECAMPAIGNS"
+          >QueueCampaigns</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="MOTIONDIALER.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedQueueCampaigns.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedQueueCampaigns =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="MOTIONDIALER.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-queueCampaigns-count">
+          <span>{{vm.selectedQueueCampaigns.length}}</span>
+          <span translate="MOTIONDIALER.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="MOTIONDIALER.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllQueueCampaigns()"
+                translate="MOTIONDIALER.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectQueueCampaigns()"
+                translate="MOTIONDIALER.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedQueueCampaigns"
+          csv-label="true"
+          filename="queueCampaigns.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedQueueCampaigns($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="MOTIONDIALER.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- QUEUECAMPAIGN TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedQueueCampaigns"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getQueueCampaigns"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">
+                  {{ 'MOTIONDIALER.ID' | translate }}
+                </th>
+                <th md-column md-order-by="name">
+                  {{ 'MOTIONDIALER.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="dialActive">
+                  {{ 'MOTIONDIALER.ACTIVE' | translate }}
+                </th>
+                <th md-column md-order-by="TrunkId">
+                  {{ 'MOTIONDIALER.TRUNK' | translate }}
+                </th>
+                <th md-column md-order-by="dialMethod">
+                  {{ 'MOTIONDIALER.METHOD' | translate }}
+                </th>
+                <th md-column md-order-by="strategy">
+                  {{ 'MOTIONDIALER.STRATEGY' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.queueCampaigns.rows.length">
+                <td md-cell colspan="7">
+                  <div layout="row" layout-align="center center">
+                    <span translate="MOTIONDIALER.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="queueCampaign"
+                md-select-id="id"
+                ng-repeat="queueCampaign in vm.queueCampaigns.rows"
+              >
+                <td md-cell ng-if="queueCampaign.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{queueCampaign.name}}"
+                    ng-src="api/users/{{queueCampaign.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!queueCampaign.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{queueCampaign.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(queueCampaign, ev) : vm.createOrEditQueueCampaign($event, queueCampaign)"
+                  md-cell
+                  class="id"
+                >
+                  {{queueCampaign.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(queueCampaign, ev) : vm.createOrEditQueueCampaign($event, queueCampaign)"
+                  md-cell
+                  class="name"
+                >
+                  {{queueCampaign.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(queueCampaign, ev) : vm.createOrEditQueueCampaign($event, queueCampaign)"
+                  md-cell
+                  class="dialActive"
+                >
+                  <md-icon
+                    md-colors="{color: {{queueCampaign.dialActive ? '\'green\'' : '\'grey\''}}}"
+                    md-font-icon="{{queueCampaign.dialActive ? 'icon-check' : 'icon-close'}}"
+                  ></md-icon>
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(queueCampaign, ev) : vm.createOrEditQueueCampaign($event, queueCampaign)"
+                  md-cell
+                  class="TrunkId"
+                >
+                  {{ (vm.trunks | filter : {'id':queueCampaign.TrunkId} :
+                  true)[0].name }}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(queueCampaign, ev) : vm.createOrEditQueueCampaign($event, queueCampaign)"
+                  md-cell
+                  class="dialMethod"
+                >
+                  {{ vm.arraydialMethod[queueCampaign.dialMethod].option }}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(queueCampaign, ev) : vm.createOrEditQueueCampaign($event, queueCampaign)"
+                  md-cell
+                  class="strategy"
+                >
+                  {{ vm.arraystrategy[queueCampaign.strategy].option }}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="MOTIONDIALER.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(queueCampaign, $event    )"
+                          translate="MOTIONDIALER.EDIT_QUEUECAMPAIGN"
+                        >
+                          Edit QueueCampaign
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.clonedialog(queueCampaign, $event    )"
+                          translate="MOTIONDIALER.CLONE_QUEUECAMPAIGN"
+                        >
+                          clone QueueCampaign
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.listadddialog(queueCampaign, $event    )"
+                          translate="MOTIONDIALER.LISTADD_QUEUECAMPAIGN"
+                        >
+                          listadd QueueCampaign
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.blacklistadddialog(queueCampaign, $event    )"
+                          translate="MOTIONDIALER.BLACKLISTADD_QUEUECAMPAIGN"
+                        >
+                          blacklistadd QueueCampaign
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.teamadddialog(queueCampaign, $event    )"
+                          translate="MOTIONDIALER.TEAMADD_QUEUECAMPAIGN"
+                        >
+                          teamadd QueueCampaign
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.agentadddialog(queueCampaign, $event    )"
+                          translate="MOTIONDIALER.AGENTADD_QUEUECAMPAIGN"
+                        >
+                          agentadd QueueCampaign
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(queueCampaign, $event    )"
+                          translate="MOTIONDIALER.DELETE_QUEUECAMPAIGN"
+                        >
+                          Delete QueueCampaign
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.gotorealtimegoto(queueCampaign, $event    )"
+                          translate="MOTIONDIALER.GOTOREALTIME_QUEUECAMPAIGN"
+                        >
+                          goToRealtime QueueCampaign
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.queueCampaigns.count}}"
+          md-on-paginate="vm.getQueueCampaigns"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / QUEUECAMPAIGN TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD QUEUECAMPAIGN BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-queueCampaign-button"
+    ng-click="vm.createOrEditQueueCampaign($event)"
+    aria-label="add queueCampaign"
+    translate
+    translate-attr-aria-label="MOTIONDIALER.ADD_QUEUECAMPAIGN"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD QUEUECAMPAIGN BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/realtime/abandonedcalls/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/motiondialer/views/realtime/abandonedcalls/view.html/view-[chunkhash].html
deleted file mode 100644
index 6926696..0000000
--- a/public/src/js/modules/main/apps/motiondialer/views/realtime/abandonedcalls/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,162 +0,0 @@
-<md-toolbar class="md-table-toolbar md-default table-header">
-  <div class="md-toolbar-tools" layout="row" layout-align="center center">
-    <span class="md-subhead" translate="DASHBOARDS.ABANDONEDQUEUECALLS"
-      >ABANDONED QUEUE CALLS</span
-    >
-    <ms-search-bar
-      on-search="vm.query.filter = query"
-      on-collapse="vm.query.filter = undefined"
-      debounce="300"
-    >
-    </ms-search-bar>
-    <div flex></div>
-
-    <ms-quick-filter
-      filters="vm.quickFilters"
-      query="vm.query"
-      search="vm.getAbandonedCalls()"
-    ></ms-quick-filter>
-
-    <md-button
-      class="md-icon-button"
-      ng-click="vm.refresh && vm.refreshAbandonedCalls($event)"
-      aria-label="Reload"
-      translate
-      translate-attr-label="DASHBOARDS.RELOAD"
-    >
-      <md-icon md-font-icon="icon-reload"></md-icon>
-      <md-tooltip ng-if="vm.showTooltip" md-visible="vm.showTooltip"
-        >{{'DASHBOARDS.CLICKRELOAD' | translate}}
-      </md-tooltip>
-    </md-button>
-  </div>
-</md-toolbar>
-<md-table-container>
-  <table md-table md-progress="vm.promise">
-    <thead
-      md-head
-      md-order="vm.query.sort"
-      md-on-reorder="vm.getAbandonedCalls"
-    >
-      <tr md-row>
-        <th md-column md-order-by="id">ID</th>
-        <th md-column md-order-by="calleridname">
-          {{'DASHBOARDS.FULLNAME' | translate}}
-        </th>
-        <th md-column md-order-by="calleridnum">
-          {{'DASHBOARDS.PHONE' | translate}}
-        </th>
-        <th md-column md-order-by="queue">
-          {{'DASHBOARDS.QUEUE' | translate}}
-        </th>
-        <th md-column md-order-by="queuecallerabandonAt">
-          {{'DASHBOARDS.ABANDONAT' | translate}}
-        </th>
-        <th md-column md-order-by="queuecallerexitAt">
-          {{'DASHBOARDS.QUEUECALLEREXITAT' | translate}}
-        </th>
-        <th md-column md-order-by="queuecallerexitreason">
-          {{'DASHBOARDS.QUEUECALLEREXITREASON' | translate}}
-        </th>
-        <th md-column md-order-by="lastAssignedTo">
-          {{'DASHBOARDS.LASTASSIGNEDTO' | translate}}
-        </th>
-        <th md-column md-order-by="disposition">
-          {{'DASHBOARDS.DISPOSITION' | translate}}
-        </th>
-        <th md-column md-order-by="disposition">
-          {{'DASHBOARDS.SECOND_LEVEL_DISPOSITION' | translate}}
-        </th>
-        <th md-column md-order-by="disposition">
-          {{'DASHBOARDS.THIRD_LEVEL_DISPOSITION' | translate}}
-        </th>
-        <th md-column width="10px"></th>
-      </tr>
-    </thead>
-    <tbody md-body>
-      <tr md-row ng-hide="vm.abandonedCalls.rows.length">
-        <td md-cell colspan="12">
-          <div layout="row" layout-align="center center">
-            <span translate="VOICE.NO_AVAILABLE_INFO">No Available Info</span>
-          </div>
-        </td>
-      </tr>
-      <tr md-row ng-repeat="call in vm.abandonedCalls.rows">
-        <td md-cell class="id">{{call.id}}</td>
-        <td md-cell class="firstName">{{call.calleridname}}</td>
-        <td md-cell class="list">{{call.calleridnum}}</td>
-        <td md-cell class="list">{{vm.queuesMap[call.queue]}}</td>
-        <td md-cell class="list">
-          {{call.queuecallerabandonAt ? (call.queuecallerabandonAt | formatdate)
-          : undefined }}
-        </td>
-        <td md-cell class="list">
-          {{call.queuecallerexitAt ? (call.queuecallerexitAt | formatdate) :
-          undefined }}
-        </td>
-        <td md-cell class="list">{{call.queuecallerexitreason}}</td>
-        <td md-cell class="list">{{call.lastAssignedTo}}</td>
-        <td md-cell class="list">{{ call.disposition }}</td>
-        <td md-cell class="list">{{ call.secondDisposition }}</td>
-        <td md-cell class="list">{{ call.thirdDisposition }}</td>
-        <td md-cell class="actions">
-          <md-menu>
-            <md-button
-              class="md-icon-button"
-              aria-label="More"
-              translate
-              translate-attr-aria-label="DASHBOARDS.MORE"
-              ng-click="$mdOpenMenu($event)"
-            >
-              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-            </md-button>
-            <md-menu-content width="2">
-              <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                <md-menu>
-                  <md-button
-                    ng-click="$mdMenu.open()"
-                    class="text-capitalize"
-                    translate="DASHBOARDS.ASSIGNTO"
-                    >Assigned to</md-button
-                  >
-                  <md-menu-content>
-                    <md-menu-item ng-if="call.lastAssignedTo">
-                      <md-button ng-click="vm.assignTo(call)"
-                        ><em translate="DASHBOARDS.NONE">Not Assigned</em>
-                      </md-button>
-                    </md-menu-item>
-                    <md-menu-item
-                      ng-if="vm.agents.rows.length"
-                      ng-repeat="agent in vm.agents.rows"
-                    >
-                      <md-button ng-click="vm.assignTo(call,agent)"
-                        >{{agent.name}}</md-button
-                      >
-                    </md-menu-item>
-                  </md-menu-content>
-                </md-menu>
-              </md-menu-item>
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.dispose(call)"
-                  class="text-capitalize"
-                  translate="DASHBOARDS.DISPOSE"
-                  >Dispose
-                </md-button>
-              </md-menu-item>
-            </md-menu-content>
-          </md-menu>
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</md-table-container>
-
-<md-table-pagination
-  md-limit="vm.query.limit"
-  md-limit-options="[10, 15, 20, 50, 100, 250]"
-  md-page="vm.query.page"
-  md-total="{{vm.abandonedCalls.count}}"
-  md-on-paginate="vm.getAbandonedCalls"
-  md-page-select
-></md-table-pagination>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/realtime/abandonedcalls/view.html/view.html b/public/src/js/modules/main/apps/motiondialer/views/realtime/abandonedcalls/view.html/view.html
new file mode 100644
index 0000000..6926696
--- /dev/null
+++ b/public/src/js/modules/main/apps/motiondialer/views/realtime/abandonedcalls/view.html/view.html
@@ -0,0 +1,162 @@
+<md-toolbar class="md-table-toolbar md-default table-header">
+  <div class="md-toolbar-tools" layout="row" layout-align="center center">
+    <span class="md-subhead" translate="DASHBOARDS.ABANDONEDQUEUECALLS"
+      >ABANDONED QUEUE CALLS</span
+    >
+    <ms-search-bar
+      on-search="vm.query.filter = query"
+      on-collapse="vm.query.filter = undefined"
+      debounce="300"
+    >
+    </ms-search-bar>
+    <div flex></div>
+
+    <ms-quick-filter
+      filters="vm.quickFilters"
+      query="vm.query"
+      search="vm.getAbandonedCalls()"
+    ></ms-quick-filter>
+
+    <md-button
+      class="md-icon-button"
+      ng-click="vm.refresh && vm.refreshAbandonedCalls($event)"
+      aria-label="Reload"
+      translate
+      translate-attr-label="DASHBOARDS.RELOAD"
+    >
+      <md-icon md-font-icon="icon-reload"></md-icon>
+      <md-tooltip ng-if="vm.showTooltip" md-visible="vm.showTooltip"
+        >{{'DASHBOARDS.CLICKRELOAD' | translate}}
+      </md-tooltip>
+    </md-button>
+  </div>
+</md-toolbar>
+<md-table-container>
+  <table md-table md-progress="vm.promise">
+    <thead
+      md-head
+      md-order="vm.query.sort"
+      md-on-reorder="vm.getAbandonedCalls"
+    >
+      <tr md-row>
+        <th md-column md-order-by="id">ID</th>
+        <th md-column md-order-by="calleridname">
+          {{'DASHBOARDS.FULLNAME' | translate}}
+        </th>
+        <th md-column md-order-by="calleridnum">
+          {{'DASHBOARDS.PHONE' | translate}}
+        </th>
+        <th md-column md-order-by="queue">
+          {{'DASHBOARDS.QUEUE' | translate}}
+        </th>
+        <th md-column md-order-by="queuecallerabandonAt">
+          {{'DASHBOARDS.ABANDONAT' | translate}}
+        </th>
+        <th md-column md-order-by="queuecallerexitAt">
+          {{'DASHBOARDS.QUEUECALLEREXITAT' | translate}}
+        </th>
+        <th md-column md-order-by="queuecallerexitreason">
+          {{'DASHBOARDS.QUEUECALLEREXITREASON' | translate}}
+        </th>
+        <th md-column md-order-by="lastAssignedTo">
+          {{'DASHBOARDS.LASTASSIGNEDTO' | translate}}
+        </th>
+        <th md-column md-order-by="disposition">
+          {{'DASHBOARDS.DISPOSITION' | translate}}
+        </th>
+        <th md-column md-order-by="disposition">
+          {{'DASHBOARDS.SECOND_LEVEL_DISPOSITION' | translate}}
+        </th>
+        <th md-column md-order-by="disposition">
+          {{'DASHBOARDS.THIRD_LEVEL_DISPOSITION' | translate}}
+        </th>
+        <th md-column width="10px"></th>
+      </tr>
+    </thead>
+    <tbody md-body>
+      <tr md-row ng-hide="vm.abandonedCalls.rows.length">
+        <td md-cell colspan="12">
+          <div layout="row" layout-align="center center">
+            <span translate="VOICE.NO_AVAILABLE_INFO">No Available Info</span>
+          </div>
+        </td>
+      </tr>
+      <tr md-row ng-repeat="call in vm.abandonedCalls.rows">
+        <td md-cell class="id">{{call.id}}</td>
+        <td md-cell class="firstName">{{call.calleridname}}</td>
+        <td md-cell class="list">{{call.calleridnum}}</td>
+        <td md-cell class="list">{{vm.queuesMap[call.queue]}}</td>
+        <td md-cell class="list">
+          {{call.queuecallerabandonAt ? (call.queuecallerabandonAt | formatdate)
+          : undefined }}
+        </td>
+        <td md-cell class="list">
+          {{call.queuecallerexitAt ? (call.queuecallerexitAt | formatdate) :
+          undefined }}
+        </td>
+        <td md-cell class="list">{{call.queuecallerexitreason}}</td>
+        <td md-cell class="list">{{call.lastAssignedTo}}</td>
+        <td md-cell class="list">{{ call.disposition }}</td>
+        <td md-cell class="list">{{ call.secondDisposition }}</td>
+        <td md-cell class="list">{{ call.thirdDisposition }}</td>
+        <td md-cell class="actions">
+          <md-menu>
+            <md-button
+              class="md-icon-button"
+              aria-label="More"
+              translate
+              translate-attr-aria-label="DASHBOARDS.MORE"
+              ng-click="$mdOpenMenu($event)"
+            >
+              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+            </md-button>
+            <md-menu-content width="2">
+              <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                <md-menu>
+                  <md-button
+                    ng-click="$mdMenu.open()"
+                    class="text-capitalize"
+                    translate="DASHBOARDS.ASSIGNTO"
+                    >Assigned to</md-button
+                  >
+                  <md-menu-content>
+                    <md-menu-item ng-if="call.lastAssignedTo">
+                      <md-button ng-click="vm.assignTo(call)"
+                        ><em translate="DASHBOARDS.NONE">Not Assigned</em>
+                      </md-button>
+                    </md-menu-item>
+                    <md-menu-item
+                      ng-if="vm.agents.rows.length"
+                      ng-repeat="agent in vm.agents.rows"
+                    >
+                      <md-button ng-click="vm.assignTo(call,agent)"
+                        >{{agent.name}}</md-button
+                      >
+                    </md-menu-item>
+                  </md-menu-content>
+                </md-menu>
+              </md-menu-item>
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.dispose(call)"
+                  class="text-capitalize"
+                  translate="DASHBOARDS.DISPOSE"
+                  >Dispose
+                </md-button>
+              </md-menu-item>
+            </md-menu-content>
+          </md-menu>
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</md-table-container>
+
+<md-table-pagination
+  md-limit="vm.query.limit"
+  md-limit-options="[10, 15, 20, 50, 100, 250]"
+  md-page="vm.query.page"
+  md-total="{{vm.abandonedCalls.count}}"
+  md-on-paginate="vm.getAbandonedCalls"
+  md-page-select
+></md-table-pagination>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/realtime/agents/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/motiondialer/views/realtime/agents/view.html/view-[chunkhash].html
deleted file mode 100644
index 8a08fb0..0000000
--- a/public/src/js/modules/main/apps/motiondialer/views/realtime/agents/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,519 +0,0 @@
-<!-- MAIN -->
-<md-toolbar class="md-table-toolbar md-default">
-  <div class="md-toolbar-tools">
-    <span class="md-subhead" translate="MOTIONDIALER.AGENTS">Agents</span>
-    <div flex></div>
-    <ms-search-bar
-      on-search="vm.query.filter = query; vm.onInit()"
-      on-collapse="vm.query.filter = undefined; vm.onInit()"
-      debounce="300"
-    ></ms-search-bar>
-    <md-select
-      ng-model="vm.query.globalStatusFilter"
-      class="md-caption"
-      ng-change="vm.query.pauseTypeFilter = ''; vm.onInit()"
-    >
-      <md-option ng-value="''">{{ 'MOTIONDIALER.ALL' | translate }}</md-option>
-      <md-option value="pause"
-        >{{ 'MOTIONDIALER.PAUSE' | translate }}</md-option
-      >
-      <md-option value="*pause"
-        >{{ 'MOTIONDIALER.PARTIALPAUSE' | translate }}</md-option
-      >
-      <md-option value="busy">{{ 'MOTIONDIALER.BUSY' | translate }}</md-option>
-      <md-option value="idle">{{ 'MOTIONDIALER.IDLE' | translate }}</md-option>
-    </md-select>
-
-    <md-select
-      ng-if="vm.isPause(vm.query.globalStatusFilter)"
-      ng-model="vm.query.pauseTypeFilter"
-      class="md-caption"
-      ng-change="vm.onInit()"
-    >
-      <md-option ng-value="''">All</md-option>
-      <md-option value="DEFAULT PAUSE">DEFAULT PAUSE</md-option>
-      <md-option value="ACW">ACW</md-option>
-      <md-option value="LOGININPAUSE">LOGININPAUSE</md-option>
-      <md-option value="Auto-Pause">AUTOPAUSE</md-option>
-      <md-option ng-value="pause.name" ng-repeat="pause in vm.pauses.rows"
-        >{{pause.name}}</md-option
-      >
-    </md-select>
-  </div>
-</md-toolbar>
-
-<!-- AGENT TABLE -->
-<md-table-container>
-  <table md-table multiple md-progress="vm.promise">
-    <thead md-head md-order="vm.query.order" md-on-reorder="vm.onInit">
-      <tr md-row border="1">
-        <th class="bv text-center" colspan="5">
-          {{ 'MOTIONDIALER.AGENT' | translate }}
-        </th>
-        <th class="bv bl text-center" colspan="2">
-          {{ 'VOICE.VOICE' | translate }}
-        </th>
-        <th ng-if="vm.license.chat" class="bv bl text-center" colspan="2">
-          {{ 'CHAT.CHAT' | translate }}
-        </th>
-        <th ng-if="vm.license.mail" class="bv bl text-center" colspan="2">
-          {{ 'MAIL.MAIL' | translate }}
-        </th>
-        <th ng-if="vm.license.messaging" class="bv bl text-center" colspan="2">
-          {{ 'SMS.SMS' | translate }}
-        </th>
-        <th
-          ng-if="vm.license.openchannel"
-          class="bv bl text-center"
-          colspan="2"
-        >
-          {{ 'OPENCHANNEL.OPENCHANNEL' | translate }}
-        </th>
-        <th ng-if="vm.license.fax" class="bv bl text-center" colspan="2">
-          {{ 'FAX.FAX' | translate }}
-        </th>
-        <th ng-if="vm.license.whatsapp" class="bv bl text-center" colspan="2">
-          {{ 'WHATSAPP.WHATSAPP' | translate }}
-        </th>
-        <th width="10px" class="bt bl" rowspan="2"></th>
-      </tr>
-      <tr md-row>
-        <th class="bl" colspan="2" md-column md-order-by="fullname">
-          {{ 'MOTIONDIALER.NAME' | translate }}
-        </th>
-        <th class="bl custom-column" md-column md-order-by="globalStatus">
-          {{ 'MOTIONDIALER.STATUS' | translate }}
-        </th>
-        <th class="bl custom-column" md-column md-order-by="lastLoginAt">
-          {{ 'MOTIONDIALER.LOGIN_TIME' | translate }}
-        </th>
-        <th class="bl custom-column" md-column md-order-by="lastPauseAt">
-          {{ 'MOTIONDIALER.PAUSE_TIME' | translate }}
-        </th>
-
-        <th class="bl custom-column">{{ 'VOICE.STATUS' | translate }}</th>
-        <th class="bl custom-column">Info</th>
-
-        <th ng-if="vm.license.chat" class="bl text-center">
-          {{ 'CHAT.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.chat" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'CHAT.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.mail" class="bl text-center">
-          {{ 'MAIL.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.mail" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'MAIL.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.messaging" class="bl text-center">
-          {{ 'SMS.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.messaging" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'SMS.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.openchannel" class="bl text-center">
-          {{ 'OPENCHANNEL.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.openchannel" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'OPENCHANNEL.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.fax" class="bl text-center">
-          {{ 'FAX.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.fax" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'FAX.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.whatsapp" class="bl text-center">
-          {{ 'WHATSAPP.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.whatsapp" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'WHATSAPP.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-      </tr>
-    </thead>
-    <tbody md-body>
-      <tr md-row ng-hide="vm.order.length">
-        <td md-cell colspan="19">
-          <div layout="row" layout-align="center center">
-            <span>{{ 'MOTIONDIALER.NO_AGENT_ONLINE' | translate }}</span>
-          </div>
-        </td>
-      </tr>
-      <tr
-        md-select="vm.agents[value]"
-        md-select-id="id"
-        ng-repeat="(id, value) in vm.order"
-      >
-        <td class="bt padding-5">
-          <div layout="row" layout-align="start center">
-            <img
-              class="avatar"
-              ng-src="{{vm.agents[value].userpic && 'api/users/'+vm.agents[value].id+'/avatar' || 'assets/images/avatars/profile.png'}}"
-            />
-            <div layout="column">
-              <span>{{vm.agents[value].fullname}}</span>
-              <span>{{vm.agents[value].internal}}</span>
-            </div>
-          </div>
-        </td>
-        <td class="bt padding-5">
-          <div
-            layout="row"
-            layout-align="start center"
-            ng-if="vm.license.screenrecording && (vm.agents[value].phoneBarEnableScreenRecordingByAgent || vm.agents[value].phoneBarEnableAutomaticScreenRecording)"
-          >
-            <div class="column" ng-if="vm.agents[value].screenrecording">
-              <span>
-                <md-icon
-                  md-font-icon="icon-camcorder-box"
-                  style="color: green; font-size: 36px"
-                  aria-label="icon-camcorder-box26"
-                >
-                  <md-tooltip>
-                    {{ 'MOTIONDIALER.TOOLTIP_SCREENRECORDING_ON' | translate }}
-                  </md-tooltip>
-                </md-icon>
-              </span>
-            </div>
-            <div class="column" ng-if="!vm.agents[value].screenrecording">
-              <span>
-                <md-icon
-                  md-font-icon="icon-camcorder-box"
-                  style="color: gray"
-                  aria-label="icon-camcorder-box26"
-                >
-                  <md-tooltip>
-                    {{ 'MOTIONDIALER.TOOLTIP_SCREENRECORDING_OFF' | translate }}
-                  </md-tooltip>
-                </md-icon>
-              </span>
-            </div>
-          </div>
-        </td>
-
-        <td class="bt">
-          <span
-            class="text-boxed md-background-bg bl bt padding-5"
-            ng-class="{'idle':'lime-300-bg','busy':'indigo-100-bg','*pause':'amber-50-bg','pause':'amber-200-bg'}[vm.agents[value].globalStatus]"
-            >{{ vm.isPause(vm.agents[value].globalStatus) ? '' :
-            vm.agents[value].globalStatus | uppercase }} {{
-            vm.isPause(vm.agents[value].globalStatus) ?
-            (vm.isPartialPause(vm.agents[value].globalStatus) ?
-            '*'+vm.agents[value].pauseType || 'DEFAULT PAUSE' :
-            vm.agents[value].pauseType || 'DEFAULT PAUSE') : ''}}</span
-          >
-        </td>
-        <td class="bt custom-column">
-          <timer start-time="vm.agents[value].lastLoginAt" interval="1000"
-            >{{ days > 0 ? days + 'd' : '' }}
-            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
-          >
-        </td>
-        <td class="bt custom-column">
-          <timer
-            ng-if="vm.isPause(vm.agents[value].globalStatus) || vm.isPartialPause(vm.agents[value].globalStatus)"
-            start-time="vm.agents[value].lastPauseAt"
-            interval="1000"
-            >{{ days > 0 ? days + 'd' : '' }}
-            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
-          >
-        </td>
-        <td class="bt bl">
-          <div layout="row">
-            <span
-              ng-if="!vm.agents[value].onhold"
-              class="text-boxed md-background-bg bl bt padding-5"
-              ng-class="{'idle':'lime-300-bg','talking':'indigo-100-bg','ringing':'orange-400-bg','pause':'amber-200-bg'}[vm.agents[value].voiceStatus]"
-              >{{ vm.agents[value].voiceStatus | uppercase }}</span
-            >
-            <span
-              ng-if="vm.agents[value].onhold"
-              class="text-boxed md-background-bg bl bt padding-5 orange-400-bg"
-              >ONHOLD</span
-            >
-          </div>
-        </td>
-        <td class="bt bl">
-          <div layout="column">
-            <span
-              ng-if="vm.agents[value].queue"
-              class="padding-5"
-              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
-              >{{ vm.agents[value].queue }}</span
-            >
-            <span
-              ng-if="vm.agents[value].destconnectedlinenum"
-              class="padding-5"
-              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
-              >{{ vm.agents[value].destconnectedlinenum }}</span
-            >
-            <span
-              class="padding-5"
-              ng-if="vm.agents[value].queue || vm.agents[value].destconnectedlinenum"
-            >
-              <timer
-                start-time="vm.agents[value].voiceStatusTime"
-                interval="1000"
-                ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
-              >
-                {{hhours}}:{{mminutes}}:{{sseconds}}</timer
-              >
-            </span>
-          </div>
-        </td>
-
-        <td class="bt bl" ng-if="vm.license.chat">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].chatStatus]"
-                >{{ vm.agents[value].chatStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          md-number
-          class="bt text-center font-size-20"
-          ng-if="vm.license.chat"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].chatStatus]"
-        >
-          {{ vm.agents[value].chatCurrentCapacity }}
-        </td>
-
-        <td class="bl bt" ng-if="vm.license.mail">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].mailStatus]"
-                >{{ vm.agents[value].mailStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.mail"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].mailStatus]"
-        >
-          {{ vm.agents[value].mailCurrentCapacity }}
-        </td>
-
-        <td class="bl bt" ng-if="vm.license.messaging">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].smsStatus]"
-                >{{ vm.agents[value].smsStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.messaging"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].smsStatus]"
-        >
-          {{ vm.agents[value].smsCurrentCapacity }}
-        </td>
-
-        <td class="bt bl" ng-if="vm.license.openchannel">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].openchannelStatus]"
-                >{{ vm.agents[value].openchannelStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.openchannel"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].openchannelStatus]"
-        >
-          {{ vm.agents[value].openchannelCurrentCapacity }}
-        </td>
-
-        <td class="bt bl" ng-if="vm.license.fax">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].faxStatus]"
-                >{{ vm.agents[value].faxStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.fax"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].faxStatus]"
-        >
-          {{ vm.agents[value].faxCurrentCapacity }}
-        </td>
-
-        <td class="bl bt" ng-if="vm.license.whatsapp">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].whatsappStatus]"
-                >{{ vm.agents[value].whatsappStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.whatsapp"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].whatsappStatus]"
-        >
-          {{ vm.agents[value].whatsappCurrentCapacity }}
-        </td>
-
-        <td
-          class="bl bt padding-5 text-center"
-          ng-if="vm.crudPermissions.canEdit"
-        >
-          <md-menu>
-            <md-button
-              class="md-icon-button"
-              aria-label="More"
-              translate
-              translate-attr-aria-label="STAFF.MORE"
-              ng-click="$mdMenu.open($event)"
-            >
-              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-            </md-button>
-
-            <md-menu-content width="4">
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.logout(vm.agents[value], $event)"
-                  translate="MOTIONDIALER.LOGOUT"
-                >
-                  Logout
-                </md-button>
-              </md-menu-item>
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.queueAdd(vm.agents[value], $event)"
-                  translate="MOTIONDIALER.AGENTADD_QUEUE"
-                >
-                  Add Agent In Queue
-                </md-button>
-              </md-menu-item>
-
-              <md-menu-item
-                ng-if="vm.license.screenrecording && vm.agents[value].phoneBarEnableScreenRecordingByAgent"
-              >
-                <md-menu>
-                  <md-button
-                    ng-click="$mdMenu.open()"
-                    class="text-capitalize"
-                    translate="MOTIONDIALER.SCREENRECORDING"
-                    >Screen Recording
-                  </md-button>
-                  <md-menu-content>
-                    <md-menu-item ng-if="!vm.agents[value].screenrecording">
-                      <md-button
-                        ng-click="vm.screenRecording(vm.agents[value], true)"
-                        ><em translate="MOTIONDIALER.START_SCREENRECORDING"
-                          >Start Screen Recording</em
-                        ></md-button
-                      >
-                    </md-menu-item>
-                    <md-menu-item ng-if="vm.agents[value].screenrecording">
-                      <md-button
-                        ng-click="vm.screenRecording(vm.agents[value], false)"
-                        ><em translate="MOTIONDIALER.STOP_SCREENRECORDING"
-                          >Stop Screen Recording</em
-                        ></md-button
-                      >
-                    </md-menu-item>
-                  </md-menu-content>
-                </md-menu>
-              </md-menu-item>
-
-              <md-menu-item>
-                <md-menu>
-                  <md-button
-                    ng-click="$mdMenu.open()"
-                    class="text-capitalize"
-                    translate="MOTIONDIALER.PAUSE"
-                    >Pause</md-button
-                  >
-                  <md-menu-content>
-                    <md-menu-item>
-                      <md-button
-                        ng-disabled=" vm.agents[value].voicePause && 'DEFAULT PAUSE' === vm.agents[value].pauseType"
-                        ng-click="vm.pause(vm.agents[value])"
-                        ><em translate="MOTIONDIALER.DEFAULT_PAUSE"
-                          >Default Pause</em
-                        ></md-button
-                      >
-                    </md-menu-item>
-                    <md-menu-item
-                      ng-if="vm.pauses.rows.length"
-                      ng-repeat="pause in vm.pauses.rows"
-                    >
-                      <md-button
-                        ng-disabled="vm.agents[value].voicePause && pause.name === vm.agents[value].pauseType"
-                        ng-click="vm.pause(vm.agents[value], pause.name)"
-                        >{{pause.name}}
-                      </md-button>
-                    </md-menu-item>
-                  </md-menu-content>
-                </md-menu>
-              </md-menu-item>
-              <md-menu-item ng-if="vm.isPause(vm.agents[value].globalStatus)">
-                <md-button
-                  ng-click="vm.unPause(vm.agents[value])"
-                  translate="MOTIONDIALER.UNPAUSE"
-                >
-                  Unpause
-                </md-button>
-              </md-menu-item>
-            </md-menu-content>
-          </md-menu>
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</md-table-container>
-
-<md-table-pagination
-  md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
-  md-limit="vm.query.limit"
-  md-limit-options="[10, 15, 20, 50, 100, 250]"
-  md-page="vm.query.page"
-  md-total="{{vm.filteredAgents.length}}"
-  md-on-paginate="vm.onInit"
-  md-page-select
-></md-table-pagination>
-<!-- / AGENT TABLE -->
-<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/motiondialer/views/realtime/agents/view.html/view.html b/public/src/js/modules/main/apps/motiondialer/views/realtime/agents/view.html/view.html
new file mode 100644
index 0000000..8a08fb0
--- /dev/null
+++ b/public/src/js/modules/main/apps/motiondialer/views/realtime/agents/view.html/view.html
@@ -0,0 +1,519 @@
+<!-- MAIN -->
+<md-toolbar class="md-table-toolbar md-default">
+  <div class="md-toolbar-tools">
+    <span class="md-subhead" translate="MOTIONDIALER.AGENTS">Agents</span>
+    <div flex></div>
+    <ms-search-bar
+      on-search="vm.query.filter = query; vm.onInit()"
+      on-collapse="vm.query.filter = undefined; vm.onInit()"
+      debounce="300"
+    ></ms-search-bar>
+    <md-select
+      ng-model="vm.query.globalStatusFilter"
+      class="md-caption"
+      ng-change="vm.query.pauseTypeFilter = ''; vm.onInit()"
+    >
+      <md-option ng-value="''">{{ 'MOTIONDIALER.ALL' | translate }}</md-option>
+      <md-option value="pause"
+        >{{ 'MOTIONDIALER.PAUSE' | translate }}</md-option
+      >
+      <md-option value="*pause"
+        >{{ 'MOTIONDIALER.PARTIALPAUSE' | translate }}</md-option
+      >
+      <md-option value="busy">{{ 'MOTIONDIALER.BUSY' | translate }}</md-option>
+      <md-option value="idle">{{ 'MOTIONDIALER.IDLE' | translate }}</md-option>
+    </md-select>
+
+    <md-select
+      ng-if="vm.isPause(vm.query.globalStatusFilter)"
+      ng-model="vm.query.pauseTypeFilter"
+      class="md-caption"
+      ng-change="vm.onInit()"
+    >
+      <md-option ng-value="''">All</md-option>
+      <md-option value="DEFAULT PAUSE">DEFAULT PAUSE</md-option>
+      <md-option value="ACW">ACW</md-option>
+      <md-option value="LOGININPAUSE">LOGININPAUSE</md-option>
+      <md-option value="Auto-Pause">AUTOPAUSE</md-option>
+      <md-option ng-value="pause.name" ng-repeat="pause in vm.pauses.rows"
+        >{{pause.name}}</md-option
+      >
+    </md-select>
+  </div>
+</md-toolbar>
+
+<!-- AGENT TABLE -->
+<md-table-container>
+  <table md-table multiple md-progress="vm.promise">
+    <thead md-head md-order="vm.query.order" md-on-reorder="vm.onInit">
+      <tr md-row border="1">
+        <th class="bv text-center" colspan="5">
+          {{ 'MOTIONDIALER.AGENT' | translate }}
+        </th>
+        <th class="bv bl text-center" colspan="2">
+          {{ 'VOICE.VOICE' | translate }}
+        </th>
+        <th ng-if="vm.license.chat" class="bv bl text-center" colspan="2">
+          {{ 'CHAT.CHAT' | translate }}
+        </th>
+        <th ng-if="vm.license.mail" class="bv bl text-center" colspan="2">
+          {{ 'MAIL.MAIL' | translate }}
+        </th>
+        <th ng-if="vm.license.messaging" class="bv bl text-center" colspan="2">
+          {{ 'SMS.SMS' | translate }}
+        </th>
+        <th
+          ng-if="vm.license.openchannel"
+          class="bv bl text-center"
+          colspan="2"
+        >
+          {{ 'OPENCHANNEL.OPENCHANNEL' | translate }}
+        </th>
+        <th ng-if="vm.license.fax" class="bv bl text-center" colspan="2">
+          {{ 'FAX.FAX' | translate }}
+        </th>
+        <th ng-if="vm.license.whatsapp" class="bv bl text-center" colspan="2">
+          {{ 'WHATSAPP.WHATSAPP' | translate }}
+        </th>
+        <th width="10px" class="bt bl" rowspan="2"></th>
+      </tr>
+      <tr md-row>
+        <th class="bl" colspan="2" md-column md-order-by="fullname">
+          {{ 'MOTIONDIALER.NAME' | translate }}
+        </th>
+        <th class="bl custom-column" md-column md-order-by="globalStatus">
+          {{ 'MOTIONDIALER.STATUS' | translate }}
+        </th>
+        <th class="bl custom-column" md-column md-order-by="lastLoginAt">
+          {{ 'MOTIONDIALER.LOGIN_TIME' | translate }}
+        </th>
+        <th class="bl custom-column" md-column md-order-by="lastPauseAt">
+          {{ 'MOTIONDIALER.PAUSE_TIME' | translate }}
+        </th>
+
+        <th class="bl custom-column">{{ 'VOICE.STATUS' | translate }}</th>
+        <th class="bl custom-column">Info</th>
+
+        <th ng-if="vm.license.chat" class="bl text-center">
+          {{ 'CHAT.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.chat" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'CHAT.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.mail" class="bl text-center">
+          {{ 'MAIL.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.mail" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'MAIL.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.messaging" class="bl text-center">
+          {{ 'SMS.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.messaging" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'SMS.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.openchannel" class="bl text-center">
+          {{ 'OPENCHANNEL.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.openchannel" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'OPENCHANNEL.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.fax" class="bl text-center">
+          {{ 'FAX.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.fax" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'FAX.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.whatsapp" class="bl text-center">
+          {{ 'WHATSAPP.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.whatsapp" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'WHATSAPP.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+      </tr>
+    </thead>
+    <tbody md-body>
+      <tr md-row ng-hide="vm.order.length">
+        <td md-cell colspan="19">
+          <div layout="row" layout-align="center center">
+            <span>{{ 'MOTIONDIALER.NO_AGENT_ONLINE' | translate }}</span>
+          </div>
+        </td>
+      </tr>
+      <tr
+        md-select="vm.agents[value]"
+        md-select-id="id"
+        ng-repeat="(id, value) in vm.order"
+      >
+        <td class="bt padding-5">
+          <div layout="row" layout-align="start center">
+            <img
+              class="avatar"
+              ng-src="{{vm.agents[value].userpic && 'api/users/'+vm.agents[value].id+'/avatar' || 'assets/images/avatars/profile.png'}}"
+            />
+            <div layout="column">
+              <span>{{vm.agents[value].fullname}}</span>
+              <span>{{vm.agents[value].internal}}</span>
+            </div>
+          </div>
+        </td>
+        <td class="bt padding-5">
+          <div
+            layout="row"
+            layout-align="start center"
+            ng-if="vm.license.screenrecording && (vm.agents[value].phoneBarEnableScreenRecordingByAgent || vm.agents[value].phoneBarEnableAutomaticScreenRecording)"
+          >
+            <div class="column" ng-if="vm.agents[value].screenrecording">
+              <span>
+                <md-icon
+                  md-font-icon="icon-camcorder-box"
+                  style="color: green; font-size: 36px"
+                  aria-label="icon-camcorder-box26"
+                >
+                  <md-tooltip>
+                    {{ 'MOTIONDIALER.TOOLTIP_SCREENRECORDING_ON' | translate }}
+                  </md-tooltip>
+                </md-icon>
+              </span>
+            </div>
+            <div class="column" ng-if="!vm.agents[value].screenrecording">
+              <span>
+                <md-icon
+                  md-font-icon="icon-camcorder-box"
+                  style="color: gray"
+                  aria-label="icon-camcorder-box26"
+                >
+                  <md-tooltip>
+                    {{ 'MOTIONDIALER.TOOLTIP_SCREENRECORDING_OFF' | translate }}
+                  </md-tooltip>
+                </md-icon>
+              </span>
+            </div>
+          </div>
+        </td>
+
+        <td class="bt">
+          <span
+            class="text-boxed md-background-bg bl bt padding-5"
+            ng-class="{'idle':'lime-300-bg','busy':'indigo-100-bg','*pause':'amber-50-bg','pause':'amber-200-bg'}[vm.agents[value].globalStatus]"
+            >{{ vm.isPause(vm.agents[value].globalStatus) ? '' :
+            vm.agents[value].globalStatus | uppercase }} {{
+            vm.isPause(vm.agents[value].globalStatus) ?
+            (vm.isPartialPause(vm.agents[value].globalStatus) ?
+            '*'+vm.agents[value].pauseType || 'DEFAULT PAUSE' :
+            vm.agents[value].pauseType || 'DEFAULT PAUSE') : ''}}</span
+          >
+        </td>
+        <td class="bt custom-column">
+          <timer start-time="vm.agents[value].lastLoginAt" interval="1000"
+            >{{ days > 0 ? days + 'd' : '' }}
+            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
+          >
+        </td>
+        <td class="bt custom-column">
+          <timer
+            ng-if="vm.isPause(vm.agents[value].globalStatus) || vm.isPartialPause(vm.agents[value].globalStatus)"
+            start-time="vm.agents[value].lastPauseAt"
+            interval="1000"
+            >{{ days > 0 ? days + 'd' : '' }}
+            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
+          >
+        </td>
+        <td class="bt bl">
+          <div layout="row">
+            <span
+              ng-if="!vm.agents[value].onhold"
+              class="text-boxed md-background-bg bl bt padding-5"
+              ng-class="{'idle':'lime-300-bg','talking':'indigo-100-bg','ringing':'orange-400-bg','pause':'amber-200-bg'}[vm.agents[value].voiceStatus]"
+              >{{ vm.agents[value].voiceStatus | uppercase }}</span
+            >
+            <span
+              ng-if="vm.agents[value].onhold"
+              class="text-boxed md-background-bg bl bt padding-5 orange-400-bg"
+              >ONHOLD</span
+            >
+          </div>
+        </td>
+        <td class="bt bl">
+          <div layout="column">
+            <span
+              ng-if="vm.agents[value].queue"
+              class="padding-5"
+              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
+              >{{ vm.agents[value].queue }}</span
+            >
+            <span
+              ng-if="vm.agents[value].destconnectedlinenum"
+              class="padding-5"
+              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
+              >{{ vm.agents[value].destconnectedlinenum }}</span
+            >
+            <span
+              class="padding-5"
+              ng-if="vm.agents[value].queue || vm.agents[value].destconnectedlinenum"
+            >
+              <timer
+                start-time="vm.agents[value].voiceStatusTime"
+                interval="1000"
+                ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
+              >
+                {{hhours}}:{{mminutes}}:{{sseconds}}</timer
+              >
+            </span>
+          </div>
+        </td>
+
+        <td class="bt bl" ng-if="vm.license.chat">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].chatStatus]"
+                >{{ vm.agents[value].chatStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          md-number
+          class="bt text-center font-size-20"
+          ng-if="vm.license.chat"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].chatStatus]"
+        >
+          {{ vm.agents[value].chatCurrentCapacity }}
+        </td>
+
+        <td class="bl bt" ng-if="vm.license.mail">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].mailStatus]"
+                >{{ vm.agents[value].mailStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.mail"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].mailStatus]"
+        >
+          {{ vm.agents[value].mailCurrentCapacity }}
+        </td>
+
+        <td class="bl bt" ng-if="vm.license.messaging">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].smsStatus]"
+                >{{ vm.agents[value].smsStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.messaging"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].smsStatus]"
+        >
+          {{ vm.agents[value].smsCurrentCapacity }}
+        </td>
+
+        <td class="bt bl" ng-if="vm.license.openchannel">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].openchannelStatus]"
+                >{{ vm.agents[value].openchannelStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.openchannel"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].openchannelStatus]"
+        >
+          {{ vm.agents[value].openchannelCurrentCapacity }}
+        </td>
+
+        <td class="bt bl" ng-if="vm.license.fax">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].faxStatus]"
+                >{{ vm.agents[value].faxStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.fax"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].faxStatus]"
+        >
+          {{ vm.agents[value].faxCurrentCapacity }}
+        </td>
+
+        <td class="bl bt" ng-if="vm.license.whatsapp">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].whatsappStatus]"
+                >{{ vm.agents[value].whatsappStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.whatsapp"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].whatsappStatus]"
+        >
+          {{ vm.agents[value].whatsappCurrentCapacity }}
+        </td>
+
+        <td
+          class="bl bt padding-5 text-center"
+          ng-if="vm.crudPermissions.canEdit"
+        >
+          <md-menu>
+            <md-button
+              class="md-icon-button"
+              aria-label="More"
+              translate
+              translate-attr-aria-label="STAFF.MORE"
+              ng-click="$mdMenu.open($event)"
+            >
+              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+            </md-button>
+
+            <md-menu-content width="4">
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.logout(vm.agents[value], $event)"
+                  translate="MOTIONDIALER.LOGOUT"
+                >
+                  Logout
+                </md-button>
+              </md-menu-item>
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.queueAdd(vm.agents[value], $event)"
+                  translate="MOTIONDIALER.AGENTADD_QUEUE"
+                >
+                  Add Agent In Queue
+                </md-button>
+              </md-menu-item>
+
+              <md-menu-item
+                ng-if="vm.license.screenrecording && vm.agents[value].phoneBarEnableScreenRecordingByAgent"
+              >
+                <md-menu>
+                  <md-button
+                    ng-click="$mdMenu.open()"
+                    class="text-capitalize"
+                    translate="MOTIONDIALER.SCREENRECORDING"
+                    >Screen Recording
+                  </md-button>
+                  <md-menu-content>
+                    <md-menu-item ng-if="!vm.agents[value].screenrecording">
+                      <md-button
+                        ng-click="vm.screenRecording(vm.agents[value], true)"
+                        ><em translate="MOTIONDIALER.START_SCREENRECORDING"
+                          >Start Screen Recording</em
+                        ></md-button
+                      >
+                    </md-menu-item>
+                    <md-menu-item ng-if="vm.agents[value].screenrecording">
+                      <md-button
+                        ng-click="vm.screenRecording(vm.agents[value], false)"
+                        ><em translate="MOTIONDIALER.STOP_SCREENRECORDING"
+                          >Stop Screen Recording</em
+                        ></md-button
+                      >
+                    </md-menu-item>
+                  </md-menu-content>
+                </md-menu>
+              </md-menu-item>
+
+              <md-menu-item>
+                <md-menu>
+                  <md-button
+                    ng-click="$mdMenu.open()"
+                    class="text-capitalize"
+                    translate="MOTIONDIALER.PAUSE"
+                    >Pause</md-button
+                  >
+                  <md-menu-content>
+                    <md-menu-item>
+                      <md-button
+                        ng-disabled=" vm.agents[value].voicePause && 'DEFAULT PAUSE' === vm.agents[value].pauseType"
+                        ng-click="vm.pause(vm.agents[value])"
+                        ><em translate="MOTIONDIALER.DEFAULT_PAUSE"
+                          >Default Pause</em
+                        ></md-button
+                      >
+                    </md-menu-item>
+                    <md-menu-item
+                      ng-if="vm.pauses.rows.length"
+                      ng-repeat="pause in vm.pauses.rows"
+                    >
+                      <md-button
+                        ng-disabled="vm.agents[value].voicePause && pause.name === vm.agents[value].pauseType"
+                        ng-click="vm.pause(vm.agents[value], pause.name)"
+                        >{{pause.name}}
+                      </md-button>
+                    </md-menu-item>
+                  </md-menu-content>
+                </md-menu>
+              </md-menu-item>
+              <md-menu-item ng-if="vm.isPause(vm.agents[value].globalStatus)">
+                <md-button
+                  ng-click="vm.unPause(vm.agents[value])"
+                  translate="MOTIONDIALER.UNPAUSE"
+                >
+                  Unpause
+                </md-button>
+              </md-menu-item>
+            </md-menu-content>
+          </md-menu>
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</md-table-container>
+
+<md-table-pagination
+  md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
+  md-limit="vm.query.limit"
+  md-limit-options="[10, 15, 20, 50, 100, 250]"
+  md-page="vm.query.page"
+  md-total="{{vm.filteredAgents.length}}"
+  md-on-paginate="vm.onInit"
+  md-page-select
+></md-table-pagination>
+<!-- / AGENT TABLE -->
+<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/motiondialer/views/realtime/ivr_campaigns/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/motiondialer/views/realtime/ivr_campaigns/view.html/view-[chunkhash].html
deleted file mode 100644
index 5116ea5..0000000
--- a/public/src/js/modules/main/apps/motiondialer/views/realtime/ivr_campaigns/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,124 +0,0 @@
-<!-- MAIN -->
-<md-toolbar class="md-table-toolbar md-default">
-  <div class="md-toolbar-tools">
-    <span class="md-subhead" translate="MOTIONDIALER.IVR_CAMPAIGNS"
-      >Ivr Campaigns</span
-    >
-    <div flex></div>
-    <ms-search-bar
-      on-search="vm.query.filter = query;"
-      on-collapse="vm.query.filter = undefined;"
-      debounce="300"
-    ></ms-search-bar>
-  </div>
-</md-toolbar>
-
-<!-- QUEUE TABLE -->
-<md-table-container>
-  <table md-table multiple md-progress="vm.promise">
-    <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getCampaigns">
-      <tr md-row>
-        <th md-column>{{'MOTIONDIALER.NAME' | translate}}</th>
-        <th md-column>{{'MOTIONDIALER.TOTAL' | translate}}</th>
-        <th md-column>{{'MOTIONDIALER.TOTAL_MANAGED' | translate}}</th>
-        <th md-column>{{'MOTIONDIALER.LIMITED' | translate}}</th>
-        <th md-column>{{'MOTIONDIALER.ORIGINATED' | translate}}</th>
-        <th md-column>{{'MOTIONDIALER.MESSAGE' | translate}}</th>
-        <th md-column>{{'MOTIONDIALER.CALLYSQUAREPROJECT' | translate}}</th>
-        <th md-column>{{ 'MOTIONDIALER.TRUNK' | translate }}</th>
-        <th md-column>{{ 'MOTIONDIALER.ACTIVE' | translate }}</th>
-      </tr>
-    </thead>
-    <tbody md-body>
-      <tr md-row ng-hide="vm.campaigns">
-        <td md-cell colspan="8">
-          <div layout="row" layout-align="center center">
-            <span translate="MOTIONDIALER.NO_AVAILABLE_INFO"
-              >No Available Info</span
-            >
-          </div>
-        </td>
-      </tr>
-      <tr md-row ng-repeat="(id, campaign) in vm.campaigns">
-        <td md-cell>
-          <span>{{campaign.name}}</span>
-        </td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{campaign.ivrTotalCallsDays || 0}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{campaign.ivrAnswerCallsDay || 0}} ({{(campaign.ivrTotalCallsDays)
-            ? (campaign.ivrAnswerCallsDay || 0) *
-            100/(campaign.ivrTotalCallsDays ) : 0 | number:1}}%)</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg">{{campaign.limitCalls || 0}}</span>
-        </td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg">{{campaign.originated || 0}}</span>
-        </td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{campaign.message ? ('MOTIONDIALER.'+campaign.message | translate)
-            : '--'}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{campaign.dialQueueProject || '--'}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-16 grey-fg"
-            >{{campaign.Trunk ? campaign.Trunk.name : '--'}}</span
-          >
-        </td>
-        <td md-cell>
-          <md-icon
-            md-colors="{color: {{campaign.active ? '\'green\'' : '\'red\''}}}"
-            md-font-icon="{{campaign.active ? 'icon-check' : 'icon-close'}}"
-          ></md-icon>
-        </td>
-        <td md-cell class="actions" ng-if="vm.crudPermissions.canEdit">
-          <md-menu>
-            <md-button
-              class="md-icon-button"
-              aria-label="More"
-              translate
-              translate-attr-aria-label="MOTIONDIALER.MORE"
-              ng-click="$mdMenu.open($event)"
-            >
-              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-            </md-button>
-            <md-menu-content width="3">
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.createOrEditIvrCampaign($event, campaign)"
-                  translate="MOTIONDIALER.EDIT_CAMPAIGN"
-                >
-                  Edit Campaign
-                </md-button>
-              </md-menu-item>
-            </md-menu-content>
-          </md-menu>
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</md-table-container>
-
-<md-table-pagination
-  md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
-  md-limit="vm.query.limit"
-  md-limit-options="[10, 15, 20, 50, 100, 250]"
-  md-page="vm.query.page"
-  md-total="{{vm.count}}"
-  md-on-paginate="vm.getCampaigns"
-  md-page-select
-></md-table-pagination>
-<!-- / QUEUE TABLE -->
-<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/motiondialer/views/realtime/ivr_campaigns/view.html/view.html b/public/src/js/modules/main/apps/motiondialer/views/realtime/ivr_campaigns/view.html/view.html
new file mode 100644
index 0000000..5116ea5
--- /dev/null
+++ b/public/src/js/modules/main/apps/motiondialer/views/realtime/ivr_campaigns/view.html/view.html
@@ -0,0 +1,124 @@
+<!-- MAIN -->
+<md-toolbar class="md-table-toolbar md-default">
+  <div class="md-toolbar-tools">
+    <span class="md-subhead" translate="MOTIONDIALER.IVR_CAMPAIGNS"
+      >Ivr Campaigns</span
+    >
+    <div flex></div>
+    <ms-search-bar
+      on-search="vm.query.filter = query;"
+      on-collapse="vm.query.filter = undefined;"
+      debounce="300"
+    ></ms-search-bar>
+  </div>
+</md-toolbar>
+
+<!-- QUEUE TABLE -->
+<md-table-container>
+  <table md-table multiple md-progress="vm.promise">
+    <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getCampaigns">
+      <tr md-row>
+        <th md-column>{{'MOTIONDIALER.NAME' | translate}}</th>
+        <th md-column>{{'MOTIONDIALER.TOTAL' | translate}}</th>
+        <th md-column>{{'MOTIONDIALER.TOTAL_MANAGED' | translate}}</th>
+        <th md-column>{{'MOTIONDIALER.LIMITED' | translate}}</th>
+        <th md-column>{{'MOTIONDIALER.ORIGINATED' | translate}}</th>
+        <th md-column>{{'MOTIONDIALER.MESSAGE' | translate}}</th>
+        <th md-column>{{'MOTIONDIALER.CALLYSQUAREPROJECT' | translate}}</th>
+        <th md-column>{{ 'MOTIONDIALER.TRUNK' | translate }}</th>
+        <th md-column>{{ 'MOTIONDIALER.ACTIVE' | translate }}</th>
+      </tr>
+    </thead>
+    <tbody md-body>
+      <tr md-row ng-hide="vm.campaigns">
+        <td md-cell colspan="8">
+          <div layout="row" layout-align="center center">
+            <span translate="MOTIONDIALER.NO_AVAILABLE_INFO"
+              >No Available Info</span
+            >
+          </div>
+        </td>
+      </tr>
+      <tr md-row ng-repeat="(id, campaign) in vm.campaigns">
+        <td md-cell>
+          <span>{{campaign.name}}</span>
+        </td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{campaign.ivrTotalCallsDays || 0}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{campaign.ivrAnswerCallsDay || 0}} ({{(campaign.ivrTotalCallsDays)
+            ? (campaign.ivrAnswerCallsDay || 0) *
+            100/(campaign.ivrTotalCallsDays ) : 0 | number:1}}%)</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg">{{campaign.limitCalls || 0}}</span>
+        </td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg">{{campaign.originated || 0}}</span>
+        </td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{campaign.message ? ('MOTIONDIALER.'+campaign.message | translate)
+            : '--'}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{campaign.dialQueueProject || '--'}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-16 grey-fg"
+            >{{campaign.Trunk ? campaign.Trunk.name : '--'}}</span
+          >
+        </td>
+        <td md-cell>
+          <md-icon
+            md-colors="{color: {{campaign.active ? '\'green\'' : '\'red\''}}}"
+            md-font-icon="{{campaign.active ? 'icon-check' : 'icon-close'}}"
+          ></md-icon>
+        </td>
+        <td md-cell class="actions" ng-if="vm.crudPermissions.canEdit">
+          <md-menu>
+            <md-button
+              class="md-icon-button"
+              aria-label="More"
+              translate
+              translate-attr-aria-label="MOTIONDIALER.MORE"
+              ng-click="$mdMenu.open($event)"
+            >
+              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+            </md-button>
+            <md-menu-content width="3">
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.createOrEditIvrCampaign($event, campaign)"
+                  translate="MOTIONDIALER.EDIT_CAMPAIGN"
+                >
+                  Edit Campaign
+                </md-button>
+              </md-menu-item>
+            </md-menu-content>
+          </md-menu>
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</md-table-container>
+
+<md-table-pagination
+  md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
+  md-limit="vm.query.limit"
+  md-limit-options="[10, 15, 20, 50, 100, 250]"
+  md-page="vm.query.page"
+  md-total="{{vm.count}}"
+  md-on-paginate="vm.getCampaigns"
+  md-page-select
+></md-table-pagination>
+<!-- / QUEUE TABLE -->
+<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/motiondialer/views/realtime/queue_calls/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/motiondialer/views/realtime/queue_calls/view.html/view-[chunkhash].html
deleted file mode 100644
index 11edf55..0000000
--- a/public/src/js/modules/main/apps/motiondialer/views/realtime/queue_calls/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,139 +0,0 @@
-<!-- MAIN -->
-<md-toolbar class="md-table-toolbar md-default">
-  <div class="md-toolbar-tools">
-    <span class="md-subhead" translate="MOTIONDIALER.QUEUE_CALLS"
-      >Queue Calls</span
-    >
-    <!-- <div flex></div>
-    <ms-search-bar on-search="vm.query.filter = query;" on-collapse="vm.query.filter = undefined;" debounce="300"></ms-search-bar> -->
-  </div>
-</md-toolbar>
-
-<!-- QUEUES TABLE -->
-<md-table-container>
-  <table md-table>
-    <thead md-head>
-      <tr md-row>
-        <th md-column width="30px"></th>
-        <th md-column>{{ 'MOTIONDIALER.DID' | translate }}</th>
-        <th md-column>{{ 'MOTIONDIALER.QUEUE' | translate }}</th>
-        <th md-column>{{ 'MOTIONDIALER.CALLER' | translate }}</th>
-        <th md-column>{{ 'MOTIONDIALER.AGENT' | translate }}</th>
-        <th md-column>{{ 'MOTIONDIALER.DURATION' | translate }}</th>
-        <th md-column width="10px"></th>
-      </tr>
-    </thead>
-    <tbody md-body>
-      <tr md-row ng-hide="vm.getSize(vm.rpcVoiceQueuesChannels)">
-        <td md-cell colspan="6">
-          <div layout="row" layout-align="center center">
-            <span translate="MOTIONDIALER.NO_AVAILABLE_INFO"
-              >No Available Info</span
-            >
-          </div>
-        </td>
-      </tr>
-      <tr
-        md-row
-        ng-repeat="(key, channel) in vm.rpcVoiceQueuesChannels | limitObjectFromTo: vm.queryChannels.limit:(vm.queryChannels.page - 1) * vm.queryChannels.limit"
-      >
-        <td md-cell>
-          <md-icon
-            ng-if="channel.queuecallerleaveAt"
-            md-font-icon="icon-phone-in-talk green-fg"
-          ></md-icon>
-          <md-icon
-            ng-if="!channel.queuecallerleaveAt"
-            md-font-icon="icon-phone-incoming md-accent"
-          ></md-icon>
-        </td>
-        <td md-cell>{{channel.exten}}</td>
-        <td md-cell>{{channel.queue}}</td>
-        <td md-cell>{{channel.calleridnum}}</td>
-        <td md-cell>
-          <span ng-if="channel.queuecallerleaveAt">
-            {{channel.connectedlinename}}, {{channel.connectedlinenum}}
-            <span class="text-boxed">
-              <timer start-time="channel.queuecallerleaveAt" interval="1000"
-                >{{hhours}}:{{mminutes}}:{{sseconds}}</timer
-              >
-            </span>
-          </span>
-          <span ng-if="!channel.queuecallerleaveAt" class="text-boxed">
-            {{ 'MOTIONDIALER.WAITING_FOR_AGENT' | translate }}
-            <timer start-time="channel.queuecallerjoinAt" interval="1000"
-              >{{hhours}}:{{mminutes}}:{{sseconds}}</timer
-            >
-          </span>
-        </td>
-        <td md-cell>
-          <span class="text-boxed">
-            <timer start-time="channel.queuecallerjoinAt" interval="1000"
-              >{{hhours}}:{{mminutes}}:{{sseconds}}</timer
-            >
-          </span>
-        </td>
-        <td md-cell class="actions" ng-if="vm.crudPermissions.canEdit">
-          <md-menu>
-            <md-button
-              class="md-icon-button"
-              aria-label="More"
-              translate
-              translate-attr-aria-label="STAFF.MORE"
-              ng-click="$mdMenu.open($event)"
-            >
-              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-            </md-button>
-
-            <md-menu-content width="2">
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.hangup(channel.uniqueid)"
-                  translate="MOTIONDIALER.HANGUP"
-                >
-                  Hangup
-                </md-button>
-              </md-menu-item>
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.redirectToNumber($event, channel.uniqueid)"
-                  translate="MOTIONDIALER.REDIRECT_TO_NUMBER"
-                >
-                  Number
-                </md-button>
-              </md-menu-item>
-              <md-menu-item>
-                <md-menu>
-                  <md-button
-                    ng-click="$mdMenu.open()"
-                    translate="MOTIONDIALER.REDIRECT_TO_AGENT"
-                    >Redirect to Agent</md-button
-                  >
-                  <md-menu-content>
-                    <md-menu-item ng-repeat="agent in vm.agents.rows">
-                      <md-button
-                        ng-click="vm.redirectToAgent(channel.uniqueid, agent.name, agent.context)"
-                        >{{agent.name}}</md-button
-                      >
-                    </md-menu-item>
-                  </md-menu-content>
-                </md-menu>
-              </md-menu-item>
-            </md-menu-content>
-          </md-menu>
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</md-table-container>
-
-<md-table-pagination
-  md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
-  md-limit="vm.queryChannels.limit"
-  md-page="vm.queryChannels.page"
-  md-limit-options="[10, 15, 20, 50, 100, 250]"
-  md-total="{{vm.getSize(vm.rpcVoiceQueuesChannels)}}"
-  md-page-select
-></md-table-pagination>
-<!-- / QUEUES TABLE -->
-<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/motiondialer/views/realtime/queue_calls/view.html/view.html b/public/src/js/modules/main/apps/motiondialer/views/realtime/queue_calls/view.html/view.html
new file mode 100644
index 0000000..11edf55
--- /dev/null
+++ b/public/src/js/modules/main/apps/motiondialer/views/realtime/queue_calls/view.html/view.html
@@ -0,0 +1,139 @@
+<!-- MAIN -->
+<md-toolbar class="md-table-toolbar md-default">
+  <div class="md-toolbar-tools">
+    <span class="md-subhead" translate="MOTIONDIALER.QUEUE_CALLS"
+      >Queue Calls</span
+    >
+    <!-- <div flex></div>
+    <ms-search-bar on-search="vm.query.filter = query;" on-collapse="vm.query.filter = undefined;" debounce="300"></ms-search-bar> -->
+  </div>
+</md-toolbar>
+
+<!-- QUEUES TABLE -->
+<md-table-container>
+  <table md-table>
+    <thead md-head>
+      <tr md-row>
+        <th md-column width="30px"></th>
+        <th md-column>{{ 'MOTIONDIALER.DID' | translate }}</th>
+        <th md-column>{{ 'MOTIONDIALER.QUEUE' | translate }}</th>
+        <th md-column>{{ 'MOTIONDIALER.CALLER' | translate }}</th>
+        <th md-column>{{ 'MOTIONDIALER.AGENT' | translate }}</th>
+        <th md-column>{{ 'MOTIONDIALER.DURATION' | translate }}</th>
+        <th md-column width="10px"></th>
+      </tr>
+    </thead>
+    <tbody md-body>
+      <tr md-row ng-hide="vm.getSize(vm.rpcVoiceQueuesChannels)">
+        <td md-cell colspan="6">
+          <div layout="row" layout-align="center center">
+            <span translate="MOTIONDIALER.NO_AVAILABLE_INFO"
+              >No Available Info</span
+            >
+          </div>
+        </td>
+      </tr>
+      <tr
+        md-row
+        ng-repeat="(key, channel) in vm.rpcVoiceQueuesChannels | limitObjectFromTo: vm.queryChannels.limit:(vm.queryChannels.page - 1) * vm.queryChannels.limit"
+      >
+        <td md-cell>
+          <md-icon
+            ng-if="channel.queuecallerleaveAt"
+            md-font-icon="icon-phone-in-talk green-fg"
+          ></md-icon>
+          <md-icon
+            ng-if="!channel.queuecallerleaveAt"
+            md-font-icon="icon-phone-incoming md-accent"
+          ></md-icon>
+        </td>
+        <td md-cell>{{channel.exten}}</td>
+        <td md-cell>{{channel.queue}}</td>
+        <td md-cell>{{channel.calleridnum}}</td>
+        <td md-cell>
+          <span ng-if="channel.queuecallerleaveAt">
+            {{channel.connectedlinename}}, {{channel.connectedlinenum}}
+            <span class="text-boxed">
+              <timer start-time="channel.queuecallerleaveAt" interval="1000"
+                >{{hhours}}:{{mminutes}}:{{sseconds}}</timer
+              >
+            </span>
+          </span>
+          <span ng-if="!channel.queuecallerleaveAt" class="text-boxed">
+            {{ 'MOTIONDIALER.WAITING_FOR_AGENT' | translate }}
+            <timer start-time="channel.queuecallerjoinAt" interval="1000"
+              >{{hhours}}:{{mminutes}}:{{sseconds}}</timer
+            >
+          </span>
+        </td>
+        <td md-cell>
+          <span class="text-boxed">
+            <timer start-time="channel.queuecallerjoinAt" interval="1000"
+              >{{hhours}}:{{mminutes}}:{{sseconds}}</timer
+            >
+          </span>
+        </td>
+        <td md-cell class="actions" ng-if="vm.crudPermissions.canEdit">
+          <md-menu>
+            <md-button
+              class="md-icon-button"
+              aria-label="More"
+              translate
+              translate-attr-aria-label="STAFF.MORE"
+              ng-click="$mdMenu.open($event)"
+            >
+              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+            </md-button>
+
+            <md-menu-content width="2">
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.hangup(channel.uniqueid)"
+                  translate="MOTIONDIALER.HANGUP"
+                >
+                  Hangup
+                </md-button>
+              </md-menu-item>
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.redirectToNumber($event, channel.uniqueid)"
+                  translate="MOTIONDIALER.REDIRECT_TO_NUMBER"
+                >
+                  Number
+                </md-button>
+              </md-menu-item>
+              <md-menu-item>
+                <md-menu>
+                  <md-button
+                    ng-click="$mdMenu.open()"
+                    translate="MOTIONDIALER.REDIRECT_TO_AGENT"
+                    >Redirect to Agent</md-button
+                  >
+                  <md-menu-content>
+                    <md-menu-item ng-repeat="agent in vm.agents.rows">
+                      <md-button
+                        ng-click="vm.redirectToAgent(channel.uniqueid, agent.name, agent.context)"
+                        >{{agent.name}}</md-button
+                      >
+                    </md-menu-item>
+                  </md-menu-content>
+                </md-menu>
+              </md-menu-item>
+            </md-menu-content>
+          </md-menu>
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</md-table-container>
+
+<md-table-pagination
+  md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
+  md-limit="vm.queryChannels.limit"
+  md-page="vm.queryChannels.page"
+  md-limit-options="[10, 15, 20, 50, 100, 250]"
+  md-total="{{vm.getSize(vm.rpcVoiceQueuesChannels)}}"
+  md-page-select
+></md-table-pagination>
+<!-- / QUEUES TABLE -->
+<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/motiondialer/views/realtime/queue_params/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/motiondialer/views/realtime/queue_params/view.html/view-[chunkhash].html
deleted file mode 100644
index 5326a6d..0000000
--- a/public/src/js/modules/main/apps/motiondialer/views/realtime/queue_params/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,119 +0,0 @@
-<!-- MAIN -->
-<md-toolbar class="md-table-toolbar md-default">
-  <div class="md-toolbar-tools">
-    <span class="md-subhead" translate="MOTIONDIALER.QUEUE_PARAMETERS"
-      >Params</span
-    >
-    <div flex></div>
-    <ms-search-bar
-      on-search="vm.query.filter = query;"
-      on-collapse="vm.query.filter = undefined;"
-      debounce="300"
-    ></ms-search-bar>
-  </div>
-</md-toolbar>
-
-<!-- QUEUE TABLE -->
-<md-table-container>
-  <table md-table multiple md-progress="vm.promise">
-    <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getQueues">
-      <tr md-row>
-        <th md-column>{{' MOTIONDIALER.NAME' | translate}}</th>
-        <th md-column>{{' MOTIONDIALER.TOTAL' | translate}}</th>
-        <th md-column>{{' MOTIONDIALER.TOTAL_OFFERED' | translate}}</th>
-        <th md-column>{{' MOTIONDIALER.MANAGED' | translate}}</th>
-        <th md-column>{{' MOTIONDIALER.ABANDONED' | translate}}</th>
-        <th md-column>{{' MOTIONDIALER.DROPPED' | translate}}</th>
-        <th md-column>{{' MOTIONDIALER.AVG_HOLD_TIME' | translate}}</th>
-        <th md-column>{{' MOTIONDIALER.AVG_DURATION' | translate}}</th>
-        <th md-column>{{' MOTIONDIALER.AVG_BILLABLE' | translate}}</th>
-      </tr>
-    </thead>
-    <tbody md-body>
-      <tr md-row ng-hide="vm.queues">
-        <td md-cell colspan="8">
-          <div layout="row" layout-align="center center">
-            <span translate="MOTIONDIALER.NO_AVAILABLE_INFO"
-              >No Available Info</span
-            >
-          </div>
-        </td>
-      </tr>
-      <tr md-row ng-repeat="(id, queue) in vm.queues">
-        <td md-cell>
-          <span>{{queue.name}}</span>
-        </td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{(queue.answered + queue.outboundNoAnswerCallsDay +
-            queue.outboundBusyCallsDay + queue.outboundCongestionCallsDay +
-            queue.outboundNoSuchCallsDay + queue.outboundUnknownCallsDay +
-            queue.outboundDropCallsDayTimeout +
-            queue.outboundDropCallsDayCallersExit +
-            queue.outboundBlacklistCallsDay +
-            queue.outboundOriginateFailureCallsDay +
-            queue.outboundAnswerAgiCallsDay + queue.outboundReCallsDay +
-            queue.outboundRejectCallsDay )|| 0}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg">{{queue.total || 0}}</span>
-        </td>
-        <td md-cell>
-          <span class="font-size-16 grey-fg"
-            >{{queue.answered || 0}} ({{(queue.answered) ? (100 -
-            (((queue.outboundDropCallsDayTimeout || 0) * 100/(queue.total)) |
-            number:1 ) - (((queue.outboundDropCallsDayCallersExit || 0) *
-            100/(queue.total )) | number:1 ) ) : 0 | number:1}}%)</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-16 grey-fg"
-            >{{queue.outboundDropCallsDayCallersExit || 0}}
-            ({{(queue.outboundDropCallsDayCallersExit) ?
-            (queue.outboundDropCallsDayCallersExit || 0) * 100/(queue.total ) :
-            0 | number:1}}%)</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-16 grey-fg"
-            >{{queue.outboundDropCallsDayTimeout || 0}}
-            ({{(queue.outboundDropCallsDayTimeout) ?
-            (queue.outboundDropCallsDayTimeout || 0) * 100/(queue.total) : 0 |
-            number:1}}%)</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-16 grey-fg"
-            >{{queue.total ? (queue.sumHoldTime / queue.total) : 0 | number: 0 |
-            secToTime | date:'HH:mm:ss'}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-16 grey-fg"
-            >{{queue.total ? (queue.sumDuration / queue.total) : 0 | number: 0 |
-            secToTime | date:'HH:mm:ss'}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-16 grey-fg"
-            >{{queue.answered ? ((queue.sumBillable || 0) / queue.answered) : 0
-            | number: 0 | secToTime | date:'HH:mm:ss'}}</span
-          >
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</md-table-container>
-
-<md-table-pagination
-  md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
-  md-limit="vm.query.limit"
-  md-limit-options="[10, 15, 20, 50, 100, 250]"
-  md-page="vm.query.page"
-  md-total="{{vm.count}}"
-  md-on-paginate="vm.getQueues"
-  md-page-select
-></md-table-pagination>
-<!-- / QUEUE TABLE -->
-<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/motiondialer/views/realtime/queue_params/view.html/view.html b/public/src/js/modules/main/apps/motiondialer/views/realtime/queue_params/view.html/view.html
new file mode 100644
index 0000000..5326a6d
--- /dev/null
+++ b/public/src/js/modules/main/apps/motiondialer/views/realtime/queue_params/view.html/view.html
@@ -0,0 +1,119 @@
+<!-- MAIN -->
+<md-toolbar class="md-table-toolbar md-default">
+  <div class="md-toolbar-tools">
+    <span class="md-subhead" translate="MOTIONDIALER.QUEUE_PARAMETERS"
+      >Params</span
+    >
+    <div flex></div>
+    <ms-search-bar
+      on-search="vm.query.filter = query;"
+      on-collapse="vm.query.filter = undefined;"
+      debounce="300"
+    ></ms-search-bar>
+  </div>
+</md-toolbar>
+
+<!-- QUEUE TABLE -->
+<md-table-container>
+  <table md-table multiple md-progress="vm.promise">
+    <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getQueues">
+      <tr md-row>
+        <th md-column>{{' MOTIONDIALER.NAME' | translate}}</th>
+        <th md-column>{{' MOTIONDIALER.TOTAL' | translate}}</th>
+        <th md-column>{{' MOTIONDIALER.TOTAL_OFFERED' | translate}}</th>
+        <th md-column>{{' MOTIONDIALER.MANAGED' | translate}}</th>
+        <th md-column>{{' MOTIONDIALER.ABANDONED' | translate}}</th>
+        <th md-column>{{' MOTIONDIALER.DROPPED' | translate}}</th>
+        <th md-column>{{' MOTIONDIALER.AVG_HOLD_TIME' | translate}}</th>
+        <th md-column>{{' MOTIONDIALER.AVG_DURATION' | translate}}</th>
+        <th md-column>{{' MOTIONDIALER.AVG_BILLABLE' | translate}}</th>
+      </tr>
+    </thead>
+    <tbody md-body>
+      <tr md-row ng-hide="vm.queues">
+        <td md-cell colspan="8">
+          <div layout="row" layout-align="center center">
+            <span translate="MOTIONDIALER.NO_AVAILABLE_INFO"
+              >No Available Info</span
+            >
+          </div>
+        </td>
+      </tr>
+      <tr md-row ng-repeat="(id, queue) in vm.queues">
+        <td md-cell>
+          <span>{{queue.name}}</span>
+        </td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{(queue.answered + queue.outboundNoAnswerCallsDay +
+            queue.outboundBusyCallsDay + queue.outboundCongestionCallsDay +
+            queue.outboundNoSuchCallsDay + queue.outboundUnknownCallsDay +
+            queue.outboundDropCallsDayTimeout +
+            queue.outboundDropCallsDayCallersExit +
+            queue.outboundBlacklistCallsDay +
+            queue.outboundOriginateFailureCallsDay +
+            queue.outboundAnswerAgiCallsDay + queue.outboundReCallsDay +
+            queue.outboundRejectCallsDay )|| 0}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg">{{queue.total || 0}}</span>
+        </td>
+        <td md-cell>
+          <span class="font-size-16 grey-fg"
+            >{{queue.answered || 0}} ({{(queue.answered) ? (100 -
+            (((queue.outboundDropCallsDayTimeout || 0) * 100/(queue.total)) |
+            number:1 ) - (((queue.outboundDropCallsDayCallersExit || 0) *
+            100/(queue.total )) | number:1 ) ) : 0 | number:1}}%)</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-16 grey-fg"
+            >{{queue.outboundDropCallsDayCallersExit || 0}}
+            ({{(queue.outboundDropCallsDayCallersExit) ?
+            (queue.outboundDropCallsDayCallersExit || 0) * 100/(queue.total ) :
+            0 | number:1}}%)</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-16 grey-fg"
+            >{{queue.outboundDropCallsDayTimeout || 0}}
+            ({{(queue.outboundDropCallsDayTimeout) ?
+            (queue.outboundDropCallsDayTimeout || 0) * 100/(queue.total) : 0 |
+            number:1}}%)</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-16 grey-fg"
+            >{{queue.total ? (queue.sumHoldTime / queue.total) : 0 | number: 0 |
+            secToTime | date:'HH:mm:ss'}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-16 grey-fg"
+            >{{queue.total ? (queue.sumDuration / queue.total) : 0 | number: 0 |
+            secToTime | date:'HH:mm:ss'}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-16 grey-fg"
+            >{{queue.answered ? ((queue.sumBillable || 0) / queue.answered) : 0
+            | number: 0 | secToTime | date:'HH:mm:ss'}}</span
+          >
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</md-table-container>
+
+<md-table-pagination
+  md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
+  md-limit="vm.query.limit"
+  md-limit-options="[10, 15, 20, 50, 100, 250]"
+  md-page="vm.query.page"
+  md-total="{{vm.count}}"
+  md-on-paginate="vm.getQueues"
+  md-page-select
+></md-table-pagination>
+<!-- / QUEUE TABLE -->
+<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/motiondialer/views/realtime/queues/predictive/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/motiondialer/views/realtime/queues/predictive/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 6d380a7..0000000
--- a/public/src/js/modules/main/apps/motiondialer/views/realtime/queues/predictive/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,233 +0,0 @@
-<md-dialog class="predictive-dialog" aria-label="New predictive">
-  <md-toolbar class="md-accent md-hue-2">
-    <div
-      class="md-toolbar-tools"
-      layout="row"
-      layout-align="space-between center"
-    >
-      <span class="title">{{ vm.queueCampaign.name }} Info</span>
-      <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-        <md-icon md-font-icon="icon-close" aria-label="Close dialog"></md-icon>
-      </md-button>
-    </div>
-  </md-toolbar>
-  <md-dialog-content class="text-center" ms-scroll>
-    <ds-widget-clock data-show-digital></ds-widget-clock>
-    <div
-      ng-if="!vm.queueCampaign.startProgressive && !vm.queueCampaign.startPredictive"
-    >
-      <div class="md-title">
-        <span translate="MOTIONDIALER.PREDICTIVE_IS_NOT_RUNNING"
-          >Predictive is not running</span
-        >
-      </div>
-    </div>
-
-    <div
-      ng-if="vm.queueCampaign.startProgressive && !vm.queueCampaign.startPredictive"
-      class="m-10"
-    >
-      <div layout="row">
-        <div flex="" class="column">
-          <div class="md-headline">
-            <span translate="MOTIONDIALER.DATA_COLLECTION_IN_PROGRESSIVE"
-              >Data collection in progressive</span
-            >
-          </div>
-          <div class="md-subhead">
-            ({{vm.queueCampaign.dialPredictiveInterval}} minutes)
-          </div>
-        </div>
-      </div>
-
-      <div layout="row">
-        <div flex="" class="column">
-          <div class="md-subhead">
-            <span translate="MOTIONDIALER.STARTTIME">Start Time</span>
-          </div>
-          <div class="md-headline">
-            {{ vm.setFormatTime(vm.queueCampaign.startProgressive) }}
-          </div>
-        </div>
-        <div flex="" class="column">
-          <div class="md-subhead">
-            <span translate="MOTIONDIALER.ENDTIME">End Time</span>
-          </div>
-          <div class="md-headline">
-            {{ vm.addMinutes(vm.queueCampaign.startProgressive,
-            vm.queueCampaign.dialPredictiveInterval) }}
-          </div>
-        </div>
-      </div>
-      <div>
-        <span class="text-boxed blue-bg white-fg">
-          {{vm.queueCampaign.message ? ('MOTIONDIALER.' +
-          vm.queueCampaign.message | translate) : '--'}}
-        </span>
-      </div>
-    </div>
-    <div ng-if="vm.queueCampaign.startPredictive" class="m-10">
-      <div layout="row">
-        <div flex="" class="column">
-          <div class="md-headline">
-            <span translate="MOTIONDIALER.PREDICTIVE_IS_RUNNING"
-              >Predictive is runnning</span
-            >
-          </div>
-          <div class="md-subhead">
-            ({{vm.queueCampaign.dialPredictiveInterval}} minutes)
-          </div>
-        </div>
-      </div>
-
-      <div layout="row">
-        <div flex="" class="column">
-          <div class="md-subhead">
-            <span translate="MOTIONDIALER.STARTTIME">Start Time</span>
-          </div>
-          <div class="md-headline">
-            {{ vm.setFormatTime(vm.queueCampaign.startPredictive) }}
-          </div>
-        </div>
-        <div flex="" class="column">
-          <div class="md-subhead">
-            <span translate="MOTIONDIALER.ENDTIME">End Time</span>
-          </div>
-          <div class="md-headline">
-            {{ vm.addMinutes(vm.queueCampaign.startPredictive,
-            vm.queueCampaign.dialPredictiveInterval) }}
-          </div>
-        </div>
-      </div>
-      <div>
-        <span class="text-boxed blue-bg white-fg">
-          {{vm.queueCampaign.message ? ('MOTIONDIALER.' +
-          vm.queueCampaign.message | translate) : '--'}}
-        </span>
-      </div>
-      <div class="row">
-        <md-card>
-          <md-toolbar class="md-table-toolbar md-default">
-            <div class="md-toolbar-tools">
-              <span class="md-subhead"
-                >Predictive - {{ 'MOTIONDIALER.PREVIOUS_INTERVAL' | translate
-                }}</span
-              >
-            </div>
-          </md-toolbar>
-          <md-table-container>
-            <table md-table>
-              <tbody md-body>
-                <tr md-row>
-                  <td md-cell>
-                    <span translate="MOTIONDIALER.TOTAL_CALLS"
-                      >Total Calls</span
-                    >
-                  </td>
-                  <td md-cell>
-                    {{ vm.queueCampaign.predictiveIntervalTotalCalls }}
-                  </td>
-                </tr>
-                <tr md-row>
-                  <td md-cell>
-                    <span translate="MOTIONDIALER.ANSWERED_CALLS"
-                      >Total Calls</span
-                    >
-                  </td>
-                  <td md-cell>
-                    {{ vm.queueCampaign.predictiveIntervalAnsweredCalls }}
-                  </td>
-                </tr>
-                <!-- Temporaneamente non mostrate perchè contengono anche i dati dell'intervallo corrente -->
-                <!-- <tr md-row>
-                                    <td md-cell>Dropped Calls Timeout</td>
-                                    <td md-cell>{{ vm.queueCampaign.predictiveIntervalDroppedCallsTimeout }}</td>
-                                </tr>
-                                <tr md-row>
-                                    <td md-cell>Dropped Calls Caller Exit</td>
-                                    <td md-cell>{{ vm.queueCampaign.predictiveIntervalDroppedCallsCallersExit }}
-                                    </td>
-                                </tr> -->
-                <tr md-row>
-                  <td md-cell>
-                    <span translate="MOTIONDIALER.AVG_HOLD_TIME"
-                      >AVG Hold Time</span
-                    >
-                  </td>
-                  <td md-cell>
-                    ~ {{ vm.queueCampaign.predictiveIntervalAvgHoldtime |
-                    number:0 }}s
-                  </td>
-                </tr>
-                <tr md-row>
-                  <td md-cell>
-                    <span translate="MOTIONDIALER.AVG_TALK_TIME"
-                      >AVG Talk Time</span
-                    >
-                  </td>
-                  <td md-cell>
-                    ~ {{ vm.queueCampaign.predictiveIntervalAvgTalktime |
-                    number:0 }}s
-                  </td>
-                </tr>
-              </tbody>
-            </table>
-          </md-table-container>
-        </md-card>
-        <md-card>
-          <md-toolbar class="md-table-toolbar md-default">
-            <div class="md-toolbar-tools">
-              <span class="md-subhead"
-                >ErlangB - {{ 'MOTIONDIALER.CURRENT_INTERVAL' | translate
-                }}</span
-              >
-            </div>
-          </md-toolbar>
-          <md-table-container>
-            <table md-table>
-              <tbody md-body>
-                <tr md-row>
-                  <td md-cell>
-                    <span translate="MOTIONDIALER.SCHEDULED_CALLS"
-                      >Scheduled Calls</span
-                    >
-                  </td>
-                  <td md-cell>{{ vm.queueCampaign.erlangCalls }}</td>
-                </tr>
-                <tr md-row>
-                  <td md-cell>
-                    <span translate="MOTIONDIALER.ONE_CALL_EVERY"
-                      >One call every</span
-                    >
-                  </td>
-                  <td md-cell>
-                    ~ {{ vm.queueCampaign.erlangCallToSecond | number:0 }}s
-                  </td>
-                </tr>
-                <tr md-row>
-                  <td md-cell>
-                    <span translate="MOTIONDIALER.DROPRATE">Drop Rate</span>
-                  </td>
-                  <td md-cell>
-                    {{ vm.queueCampaign.erlangAbandonmentRate * 100 | number:2
-                    }}%
-                  </td>
-                </tr>
-                <tr md-row>
-                  <td md-cell>
-                    <span translate="MOTIONDIALER.AGENTBUSYFACTOR"
-                      >Agent Busy Factor</span
-                    >
-                  </td>
-                  <td md-cell>
-                    {{ vm.queueCampaign.erlangBusyFactor * 100 | number:2 }}%
-                  </td>
-                </tr>
-              </tbody>
-            </table>
-          </md-table-container>
-        </md-card>
-      </div>
-    </div>
-  </md-dialog-content>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/realtime/queues/predictive/dialog.html/dialog.html b/public/src/js/modules/main/apps/motiondialer/views/realtime/queues/predictive/dialog.html/dialog.html
new file mode 100644
index 0000000..6d380a7
--- /dev/null
+++ b/public/src/js/modules/main/apps/motiondialer/views/realtime/queues/predictive/dialog.html/dialog.html
@@ -0,0 +1,233 @@
+<md-dialog class="predictive-dialog" aria-label="New predictive">
+  <md-toolbar class="md-accent md-hue-2">
+    <div
+      class="md-toolbar-tools"
+      layout="row"
+      layout-align="space-between center"
+    >
+      <span class="title">{{ vm.queueCampaign.name }} Info</span>
+      <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+        <md-icon md-font-icon="icon-close" aria-label="Close dialog"></md-icon>
+      </md-button>
+    </div>
+  </md-toolbar>
+  <md-dialog-content class="text-center" ms-scroll>
+    <ds-widget-clock data-show-digital></ds-widget-clock>
+    <div
+      ng-if="!vm.queueCampaign.startProgressive && !vm.queueCampaign.startPredictive"
+    >
+      <div class="md-title">
+        <span translate="MOTIONDIALER.PREDICTIVE_IS_NOT_RUNNING"
+          >Predictive is not running</span
+        >
+      </div>
+    </div>
+
+    <div
+      ng-if="vm.queueCampaign.startProgressive && !vm.queueCampaign.startPredictive"
+      class="m-10"
+    >
+      <div layout="row">
+        <div flex="" class="column">
+          <div class="md-headline">
+            <span translate="MOTIONDIALER.DATA_COLLECTION_IN_PROGRESSIVE"
+              >Data collection in progressive</span
+            >
+          </div>
+          <div class="md-subhead">
+            ({{vm.queueCampaign.dialPredictiveInterval}} minutes)
+          </div>
+        </div>
+      </div>
+
+      <div layout="row">
+        <div flex="" class="column">
+          <div class="md-subhead">
+            <span translate="MOTIONDIALER.STARTTIME">Start Time</span>
+          </div>
+          <div class="md-headline">
+            {{ vm.setFormatTime(vm.queueCampaign.startProgressive) }}
+          </div>
+        </div>
+        <div flex="" class="column">
+          <div class="md-subhead">
+            <span translate="MOTIONDIALER.ENDTIME">End Time</span>
+          </div>
+          <div class="md-headline">
+            {{ vm.addMinutes(vm.queueCampaign.startProgressive,
+            vm.queueCampaign.dialPredictiveInterval) }}
+          </div>
+        </div>
+      </div>
+      <div>
+        <span class="text-boxed blue-bg white-fg">
+          {{vm.queueCampaign.message ? ('MOTIONDIALER.' +
+          vm.queueCampaign.message | translate) : '--'}}
+        </span>
+      </div>
+    </div>
+    <div ng-if="vm.queueCampaign.startPredictive" class="m-10">
+      <div layout="row">
+        <div flex="" class="column">
+          <div class="md-headline">
+            <span translate="MOTIONDIALER.PREDICTIVE_IS_RUNNING"
+              >Predictive is runnning</span
+            >
+          </div>
+          <div class="md-subhead">
+            ({{vm.queueCampaign.dialPredictiveInterval}} minutes)
+          </div>
+        </div>
+      </div>
+
+      <div layout="row">
+        <div flex="" class="column">
+          <div class="md-subhead">
+            <span translate="MOTIONDIALER.STARTTIME">Start Time</span>
+          </div>
+          <div class="md-headline">
+            {{ vm.setFormatTime(vm.queueCampaign.startPredictive) }}
+          </div>
+        </div>
+        <div flex="" class="column">
+          <div class="md-subhead">
+            <span translate="MOTIONDIALER.ENDTIME">End Time</span>
+          </div>
+          <div class="md-headline">
+            {{ vm.addMinutes(vm.queueCampaign.startPredictive,
+            vm.queueCampaign.dialPredictiveInterval) }}
+          </div>
+        </div>
+      </div>
+      <div>
+        <span class="text-boxed blue-bg white-fg">
+          {{vm.queueCampaign.message ? ('MOTIONDIALER.' +
+          vm.queueCampaign.message | translate) : '--'}}
+        </span>
+      </div>
+      <div class="row">
+        <md-card>
+          <md-toolbar class="md-table-toolbar md-default">
+            <div class="md-toolbar-tools">
+              <span class="md-subhead"
+                >Predictive - {{ 'MOTIONDIALER.PREVIOUS_INTERVAL' | translate
+                }}</span
+              >
+            </div>
+          </md-toolbar>
+          <md-table-container>
+            <table md-table>
+              <tbody md-body>
+                <tr md-row>
+                  <td md-cell>
+                    <span translate="MOTIONDIALER.TOTAL_CALLS"
+                      >Total Calls</span
+                    >
+                  </td>
+                  <td md-cell>
+                    {{ vm.queueCampaign.predictiveIntervalTotalCalls }}
+                  </td>
+                </tr>
+                <tr md-row>
+                  <td md-cell>
+                    <span translate="MOTIONDIALER.ANSWERED_CALLS"
+                      >Total Calls</span
+                    >
+                  </td>
+                  <td md-cell>
+                    {{ vm.queueCampaign.predictiveIntervalAnsweredCalls }}
+                  </td>
+                </tr>
+                <!-- Temporaneamente non mostrate perchè contengono anche i dati dell'intervallo corrente -->
+                <!-- <tr md-row>
+                                    <td md-cell>Dropped Calls Timeout</td>
+                                    <td md-cell>{{ vm.queueCampaign.predictiveIntervalDroppedCallsTimeout }}</td>
+                                </tr>
+                                <tr md-row>
+                                    <td md-cell>Dropped Calls Caller Exit</td>
+                                    <td md-cell>{{ vm.queueCampaign.predictiveIntervalDroppedCallsCallersExit }}
+                                    </td>
+                                </tr> -->
+                <tr md-row>
+                  <td md-cell>
+                    <span translate="MOTIONDIALER.AVG_HOLD_TIME"
+                      >AVG Hold Time</span
+                    >
+                  </td>
+                  <td md-cell>
+                    ~ {{ vm.queueCampaign.predictiveIntervalAvgHoldtime |
+                    number:0 }}s
+                  </td>
+                </tr>
+                <tr md-row>
+                  <td md-cell>
+                    <span translate="MOTIONDIALER.AVG_TALK_TIME"
+                      >AVG Talk Time</span
+                    >
+                  </td>
+                  <td md-cell>
+                    ~ {{ vm.queueCampaign.predictiveIntervalAvgTalktime |
+                    number:0 }}s
+                  </td>
+                </tr>
+              </tbody>
+            </table>
+          </md-table-container>
+        </md-card>
+        <md-card>
+          <md-toolbar class="md-table-toolbar md-default">
+            <div class="md-toolbar-tools">
+              <span class="md-subhead"
+                >ErlangB - {{ 'MOTIONDIALER.CURRENT_INTERVAL' | translate
+                }}</span
+              >
+            </div>
+          </md-toolbar>
+          <md-table-container>
+            <table md-table>
+              <tbody md-body>
+                <tr md-row>
+                  <td md-cell>
+                    <span translate="MOTIONDIALER.SCHEDULED_CALLS"
+                      >Scheduled Calls</span
+                    >
+                  </td>
+                  <td md-cell>{{ vm.queueCampaign.erlangCalls }}</td>
+                </tr>
+                <tr md-row>
+                  <td md-cell>
+                    <span translate="MOTIONDIALER.ONE_CALL_EVERY"
+                      >One call every</span
+                    >
+                  </td>
+                  <td md-cell>
+                    ~ {{ vm.queueCampaign.erlangCallToSecond | number:0 }}s
+                  </td>
+                </tr>
+                <tr md-row>
+                  <td md-cell>
+                    <span translate="MOTIONDIALER.DROPRATE">Drop Rate</span>
+                  </td>
+                  <td md-cell>
+                    {{ vm.queueCampaign.erlangAbandonmentRate * 100 | number:2
+                    }}%
+                  </td>
+                </tr>
+                <tr md-row>
+                  <td md-cell>
+                    <span translate="MOTIONDIALER.AGENTBUSYFACTOR"
+                      >Agent Busy Factor</span
+                    >
+                  </td>
+                  <td md-cell>
+                    {{ vm.queueCampaign.erlangBusyFactor * 100 | number:2 }}%
+                  </td>
+                </tr>
+              </tbody>
+            </table>
+          </md-table-container>
+        </md-card>
+      </div>
+    </div>
+  </md-dialog-content>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/realtime/queues/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/motiondialer/views/realtime/queues/view.html/view-[chunkhash].html
deleted file mode 100644
index 8bd0514..0000000
--- a/public/src/js/modules/main/apps/motiondialer/views/realtime/queues/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,165 +0,0 @@
-<!-- MAIN -->
-<md-toolbar class="md-table-toolbar md-default">
-  <div class="md-toolbar-tools">
-    <span class="md-subhead" translate="MOTIONDIALER.QUEUES">Queues</span>
-    <div flex></div>
-    <ms-search-bar
-      on-search="vm.query.filter = query;"
-      on-collapse="vm.query.filter = undefined;"
-      debounce="300"
-    ></ms-search-bar>
-  </div>
-</md-toolbar>
-
-<!-- QUEUE TABLE -->
-<md-table-container>
-  <table md-table multiple md-progress="vm.promise">
-    <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getQueues">
-      <tr md-row>
-        <th md-column md-order-by="name">
-          {{ 'MOTIONDIALER.NAME' | translate }}
-        </th>
-        <th md-column>{{ 'MOTIONDIALER.LOGGED_IN' | translate }}</th>
-        <th md-column>{{ 'MOTIONDIALER.PAUSED' | translate }}</th>
-        <th md-column>{{ 'MOTIONDIALER.READY' | translate }}</th>
-        <th md-column>{{ 'MOTIONDIALER.WAITING' | translate }}</th>
-        <th md-column>{{ 'MOTIONDIALER.TALKING' | translate }}</th>
-        <th md-column>{{ 'MOTIONDIALER.ORIGINATED' | translate }}</th>
-        <th md-column>{{ 'MOTIONDIALER.MESSAGE' | translate }}</th>
-        <th md-column>{{ 'MOTIONDIALER.METHOD' | translate }}</th>
-        <th md-column>{{ 'MOTIONDIALER.TRUNK' | translate }}</th>
-        <th md-column md-order-by="dialActive">
-          {{ 'MOTIONDIALER.ACTIVE' | translate }}
-        </th>
-        <th md-column width="10px"></th>
-      </tr>
-    </thead>
-    <tbody md-body>
-      <tr md-row ng-hide="vm.queues">
-        <td md-cell colspan="12">
-          <div layout="row" layout-align="center center">
-            <span translate="MOTIONDIALER.NO_AVAILABLE_INFO"
-              >No Available Info</span
-            >
-          </div>
-        </td>
-      </tr>
-      <tr
-        md-row
-        md-select="vm.queues[value]"
-        md-select-id="id"
-        ng-repeat="(id, value) in vm.order"
-      >
-        <td md-cell>{{vm.queues[value].name}}</td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{vm.queues[value].loggedInDb || 0}} ({{vm.queues[value].loggedIn
-            || 0}})</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{vm.queues[value].paused || 0}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-16 grey-fg"
-            >{{vm.queues[value].available || 0}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{vm.queues[value].waiting || 0}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-16 grey-fg"
-            >{{(vm.queues[value].talking || 0) + (vm.queues[value].pTalking ||
-            0)}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-16 grey-fg"
-            >{{vm.queues[value].originated || 0}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-16 grey-fg"
-            >{{vm.queues[value].message ?
-            ('MOTIONDIALER.'+vm.queues[value].message | translate) :
-            '--'}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-16 grey-fg"
-            >{{vm.queues[value].dialMethod || 0}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-16 grey-fg"
-            >{{vm.queues[value].Trunk ? vm.queues[value].Trunk.name :
-            '--'}}</span
-          >
-        </td>
-        <td md-cell>
-          <md-icon
-            md-colors="{color: {{vm.queues[value].dialActive ? '\'green\'' : '\'red\''}}}"
-            md-font-icon="{{vm.queues[value].dialActive ? 'icon-check' : 'icon-close'}}"
-          ></md-icon>
-        </td>
-        <td md-cell class="actions" ng-if="vm.crudPermissions.canEdit">
-          <md-menu>
-            <md-button
-              class="md-icon-button"
-              aria-label="More"
-              translate
-              translate-attr-aria-label="MOTIONDIALER.MORE"
-              ng-click="$mdMenu.open($event)"
-            >
-              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-            </md-button>
-
-            <md-menu-content width="3">
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.createOrEditMotionDialerQueue($event, vm.queues[value])"
-                  translate="MOTIONDIALER.EDIT_QUEUE"
-                >
-                  Edit Queue
-                </md-button>
-              </md-menu-item>
-              <md-menu-item ng-if="vm.queues[value].dialMethod == 'predictive'">
-                <md-button
-                  ng-click="vm.showPredictiveQueueCampaignInfo($event, vm.queues[value])"
-                  translate="MOTIONDIALER.SHOW_PREDICTIVE_QUEUE_CAMPAIGN_INFO"
-                >
-                  Show Predictive Info
-                </md-button>
-              </md-menu-item>
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.agentAdd($event, vm.queues[value])"
-                  translate="MOTIONDIALER.AGENTSADD_QUEUE"
-                >
-                  Add Agents to queue
-                </md-button>
-              </md-menu-item>
-            </md-menu-content>
-          </md-menu>
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</md-table-container>
-
-<md-table-pagination
-  md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
-  md-limit="vm.query.limit"
-  md-limit-options="[10, 15, 20, 50, 100, 250]"
-  md-page="vm.query.page"
-  md-total="{{vm.count}}"
-  md-on-paginate="vm.getQueues"
-  md-page-select
-></md-table-pagination>
-<!-- / QUEUE TABLE -->
-<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/motiondialer/views/realtime/queues/view.html/view.html b/public/src/js/modules/main/apps/motiondialer/views/realtime/queues/view.html/view.html
new file mode 100644
index 0000000..8bd0514
--- /dev/null
+++ b/public/src/js/modules/main/apps/motiondialer/views/realtime/queues/view.html/view.html
@@ -0,0 +1,165 @@
+<!-- MAIN -->
+<md-toolbar class="md-table-toolbar md-default">
+  <div class="md-toolbar-tools">
+    <span class="md-subhead" translate="MOTIONDIALER.QUEUES">Queues</span>
+    <div flex></div>
+    <ms-search-bar
+      on-search="vm.query.filter = query;"
+      on-collapse="vm.query.filter = undefined;"
+      debounce="300"
+    ></ms-search-bar>
+  </div>
+</md-toolbar>
+
+<!-- QUEUE TABLE -->
+<md-table-container>
+  <table md-table multiple md-progress="vm.promise">
+    <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getQueues">
+      <tr md-row>
+        <th md-column md-order-by="name">
+          {{ 'MOTIONDIALER.NAME' | translate }}
+        </th>
+        <th md-column>{{ 'MOTIONDIALER.LOGGED_IN' | translate }}</th>
+        <th md-column>{{ 'MOTIONDIALER.PAUSED' | translate }}</th>
+        <th md-column>{{ 'MOTIONDIALER.READY' | translate }}</th>
+        <th md-column>{{ 'MOTIONDIALER.WAITING' | translate }}</th>
+        <th md-column>{{ 'MOTIONDIALER.TALKING' | translate }}</th>
+        <th md-column>{{ 'MOTIONDIALER.ORIGINATED' | translate }}</th>
+        <th md-column>{{ 'MOTIONDIALER.MESSAGE' | translate }}</th>
+        <th md-column>{{ 'MOTIONDIALER.METHOD' | translate }}</th>
+        <th md-column>{{ 'MOTIONDIALER.TRUNK' | translate }}</th>
+        <th md-column md-order-by="dialActive">
+          {{ 'MOTIONDIALER.ACTIVE' | translate }}
+        </th>
+        <th md-column width="10px"></th>
+      </tr>
+    </thead>
+    <tbody md-body>
+      <tr md-row ng-hide="vm.queues">
+        <td md-cell colspan="12">
+          <div layout="row" layout-align="center center">
+            <span translate="MOTIONDIALER.NO_AVAILABLE_INFO"
+              >No Available Info</span
+            >
+          </div>
+        </td>
+      </tr>
+      <tr
+        md-row
+        md-select="vm.queues[value]"
+        md-select-id="id"
+        ng-repeat="(id, value) in vm.order"
+      >
+        <td md-cell>{{vm.queues[value].name}}</td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{vm.queues[value].loggedInDb || 0}} ({{vm.queues[value].loggedIn
+            || 0}})</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{vm.queues[value].paused || 0}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-16 grey-fg"
+            >{{vm.queues[value].available || 0}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{vm.queues[value].waiting || 0}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-16 grey-fg"
+            >{{(vm.queues[value].talking || 0) + (vm.queues[value].pTalking ||
+            0)}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-16 grey-fg"
+            >{{vm.queues[value].originated || 0}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-16 grey-fg"
+            >{{vm.queues[value].message ?
+            ('MOTIONDIALER.'+vm.queues[value].message | translate) :
+            '--'}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-16 grey-fg"
+            >{{vm.queues[value].dialMethod || 0}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-16 grey-fg"
+            >{{vm.queues[value].Trunk ? vm.queues[value].Trunk.name :
+            '--'}}</span
+          >
+        </td>
+        <td md-cell>
+          <md-icon
+            md-colors="{color: {{vm.queues[value].dialActive ? '\'green\'' : '\'red\''}}}"
+            md-font-icon="{{vm.queues[value].dialActive ? 'icon-check' : 'icon-close'}}"
+          ></md-icon>
+        </td>
+        <td md-cell class="actions" ng-if="vm.crudPermissions.canEdit">
+          <md-menu>
+            <md-button
+              class="md-icon-button"
+              aria-label="More"
+              translate
+              translate-attr-aria-label="MOTIONDIALER.MORE"
+              ng-click="$mdMenu.open($event)"
+            >
+              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+            </md-button>
+
+            <md-menu-content width="3">
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.createOrEditMotionDialerQueue($event, vm.queues[value])"
+                  translate="MOTIONDIALER.EDIT_QUEUE"
+                >
+                  Edit Queue
+                </md-button>
+              </md-menu-item>
+              <md-menu-item ng-if="vm.queues[value].dialMethod == 'predictive'">
+                <md-button
+                  ng-click="vm.showPredictiveQueueCampaignInfo($event, vm.queues[value])"
+                  translate="MOTIONDIALER.SHOW_PREDICTIVE_QUEUE_CAMPAIGN_INFO"
+                >
+                  Show Predictive Info
+                </md-button>
+              </md-menu-item>
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.agentAdd($event, vm.queues[value])"
+                  translate="MOTIONDIALER.AGENTSADD_QUEUE"
+                >
+                  Add Agents to queue
+                </md-button>
+              </md-menu-item>
+            </md-menu-content>
+          </md-menu>
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</md-table-container>
+
+<md-table-pagination
+  md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
+  md-limit="vm.query.limit"
+  md-limit-options="[10, 15, 20, 50, 100, 250]"
+  md-page="vm.query.page"
+  md-total="{{vm.count}}"
+  md-on-paginate="vm.getQueues"
+  md-page-select
+></md-table-pagination>
+<!-- / QUEUE TABLE -->
+<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/motiondialer/views/realtime/realtime.html/realtime-[chunkhash].html b/public/src/js/modules/main/apps/motiondialer/views/realtime/realtime.html/realtime-[chunkhash].html
deleted file mode 100644
index 046a1da..0000000
--- a/public/src/js/modules/main/apps/motiondialer/views/realtime/realtime.html/realtime-[chunkhash].html
+++ /dev/null
@@ -1,48 +0,0 @@
-<div id="realtime" class="page-layout simple tabbed" layout="column" ng-cloak>
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="MOTIONDIALER.AGENTS">Agents</span>
-        </md-tab-label>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="MOTIONDIALER.QUEUES">Queues</span>
-        </md-tab-label>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="MOTIONDIALER.QUEUE_CALLS">Queue Calls</span>
-        </md-tab-label>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="MOTIONDIALER.ABANDONEDCALLS"
-            >Abandoned Queue Calls</span
-          >
-        </md-tab-label>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="MOTIONDIALER.QUEUE_PARAMS">Queue Parameters</span>
-        </md-tab-label>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="MOTIONDIALER.IVR_CAMPAIGNS">Ivr Campaigns</span>
-        </md-tab-label>
-      </md-tab>
-    </md-tabs>
-
-    <md-card ui-view></md-card>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/motiondialer/views/realtime/realtime.html/realtime.html b/public/src/js/modules/main/apps/motiondialer/views/realtime/realtime.html/realtime.html
new file mode 100644
index 0000000..046a1da
--- /dev/null
+++ b/public/src/js/modules/main/apps/motiondialer/views/realtime/realtime.html/realtime.html
@@ -0,0 +1,48 @@
+<div id="realtime" class="page-layout simple tabbed" layout="column" ng-cloak>
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="MOTIONDIALER.AGENTS">Agents</span>
+        </md-tab-label>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="MOTIONDIALER.QUEUES">Queues</span>
+        </md-tab-label>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="MOTIONDIALER.QUEUE_CALLS">Queue Calls</span>
+        </md-tab-label>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="MOTIONDIALER.ABANDONEDCALLS"
+            >Abandoned Queue Calls</span
+          >
+        </md-tab-label>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="MOTIONDIALER.QUEUE_PARAMS">Queue Parameters</span>
+        </md-tab-label>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="MOTIONDIALER.IVR_CAMPAIGNS">Ivr Campaigns</span>
+        </md-tab-label>
+      </md-tab>
+    </md-tabs>
+
+    <md-card ui-view></md-card>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index f7ea94b..0000000
--- a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,242 +0,0 @@
-<md-dialog
-  class="openchannelAccount-dialog"
-  aria-label="New OpenchannelAccount"
->
-  <form name="openchannelAccountForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="OPENCHANNEL.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.openchannelAccount.name"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.newOpenchannelAccount"
-        />
-
-        <div
-          ng-messages="openchannelAccountForm['name'].$error"
-          ng-show="openchannelAccountForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="OPENCHANNEL.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="OPENCHANNEL.KEY">key</label>
-        <input
-          type="text"
-          name="key"
-          ng-model="vm.openchannelAccount.key"
-          md-maxlength="5"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="openchannelAccountForm['key'].$error"
-          ng-show="openchannelAccountForm['key'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="OPENCHANNEL.ERRORS.KEY_REQUIRED"
-              >key field is required</span
-            >
-          </div>
-          <div ng-message="md-maxlength">
-            <span
-              translate="OPENCHANNEL.ERRORS.KEY_MAX_LENGTH"
-              translate-values="{max: 5}"
-              >key must have a maximum length equal to 5</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="OPENCHANNEL.REPLYURI">replyUri</label>
-        <input
-          type="url"
-          name="replyUri"
-          ng-model="vm.openchannelAccount.replyUri"
-        />
-
-        <div class="hint">
-          <span translate="OPENCHANNEL.HELP.REPLYURI"></span>
-        </div>
-        <div
-          ng-messages="openchannelAccountForm['replyUri'].$error"
-          ng-show="openchannelAccountForm['replyUri'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="OPENCHANNEL.ERRORS.REPLYURI_REQUIRED"
-              >replyUri field is required</span
-            >
-          </div>
-          <div ng-message="url">
-            <span translate="OPENCHANNEL.ERRORS.REPLYURI_MUST_VALID_URL"
-              >replyUri must be a valid url http://www.xcally.com</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="OPENCHANNEL.LIST">List</label>
-        <md-select
-          name="ListId"
-          ng-model="vm.openchannelAccount.ListId"
-          required
-        >
-          <md-option
-            ng-value="ListId.id"
-            ng-repeat="ListId in vm.lists"
-            ng-disabled="ListId.canSelect === false"
-            >{{ ListId.name }}</md-option
-          >
-        </md-select>
-        <div class="hint"><span translate="OPENCHANNEL.HELP.LIST"></span></div>
-        <div
-          ng-messages="openchannelAccountForm['ListId'].$error"
-          ng-show="openchannelAccountForm['ListId'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="OPENCHANNEL.ERRORS.LIST_REQUIRED"
-              >List field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="OPENCHANNEL.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.openchannelAccount.description"
-        />
-
-        <div
-          ng-messages="openchannelAccountForm['description'].$error"
-          ng-show="openchannelAccountForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="OPENCHANNEL.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newOpenchannelAccount"
-          ng-click="vm.saveOpenchannelAccount()"
-          class="send-button md-accent md-raised"
-          ng-disabled="openchannelAccountForm.$invalid || openchannelAccountForm.$pristine"
-          aria-label="SAVE"
-          translate="OPENCHANNEL.SAVE"
-          translate-attr-aria-label="OPENCHANNEL.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newOpenchannelAccount"
-          ng-click="vm.addNewOpenchannelAccount()"
-          class="send-button md-accent md-raised"
-          ng-disabled="openchannelAccountForm.$invalid"
-          aria-label="ADD"
-          translate="OPENCHANNEL.ADD_OPENCHANNELACCOUNT"
-          translate-attr-aria-label="OPENCHANNEL.ADD_OPENCHANNELACCOUNT"
-        >
-          ADD OPENCHANNELACCOUNT
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newOpenchannelAccount"
-          ng-click="vm.deleteOpenchannelAccount($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="OPENCHANNEL.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="OPENCHANNEL.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/create/dialog.html/dialog.html
new file mode 100644
index 0000000..f7ea94b
--- /dev/null
+++ b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/create/dialog.html/dialog.html
@@ -0,0 +1,242 @@
+<md-dialog
+  class="openchannelAccount-dialog"
+  aria-label="New OpenchannelAccount"
+>
+  <form name="openchannelAccountForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="OPENCHANNEL.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.openchannelAccount.name"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.newOpenchannelAccount"
+        />
+
+        <div
+          ng-messages="openchannelAccountForm['name'].$error"
+          ng-show="openchannelAccountForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="OPENCHANNEL.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="OPENCHANNEL.KEY">key</label>
+        <input
+          type="text"
+          name="key"
+          ng-model="vm.openchannelAccount.key"
+          md-maxlength="5"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="openchannelAccountForm['key'].$error"
+          ng-show="openchannelAccountForm['key'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="OPENCHANNEL.ERRORS.KEY_REQUIRED"
+              >key field is required</span
+            >
+          </div>
+          <div ng-message="md-maxlength">
+            <span
+              translate="OPENCHANNEL.ERRORS.KEY_MAX_LENGTH"
+              translate-values="{max: 5}"
+              >key must have a maximum length equal to 5</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="OPENCHANNEL.REPLYURI">replyUri</label>
+        <input
+          type="url"
+          name="replyUri"
+          ng-model="vm.openchannelAccount.replyUri"
+        />
+
+        <div class="hint">
+          <span translate="OPENCHANNEL.HELP.REPLYURI"></span>
+        </div>
+        <div
+          ng-messages="openchannelAccountForm['replyUri'].$error"
+          ng-show="openchannelAccountForm['replyUri'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="OPENCHANNEL.ERRORS.REPLYURI_REQUIRED"
+              >replyUri field is required</span
+            >
+          </div>
+          <div ng-message="url">
+            <span translate="OPENCHANNEL.ERRORS.REPLYURI_MUST_VALID_URL"
+              >replyUri must be a valid url http://www.xcally.com</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="OPENCHANNEL.LIST">List</label>
+        <md-select
+          name="ListId"
+          ng-model="vm.openchannelAccount.ListId"
+          required
+        >
+          <md-option
+            ng-value="ListId.id"
+            ng-repeat="ListId in vm.lists"
+            ng-disabled="ListId.canSelect === false"
+            >{{ ListId.name }}</md-option
+          >
+        </md-select>
+        <div class="hint"><span translate="OPENCHANNEL.HELP.LIST"></span></div>
+        <div
+          ng-messages="openchannelAccountForm['ListId'].$error"
+          ng-show="openchannelAccountForm['ListId'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="OPENCHANNEL.ERRORS.LIST_REQUIRED"
+              >List field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="OPENCHANNEL.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.openchannelAccount.description"
+        />
+
+        <div
+          ng-messages="openchannelAccountForm['description'].$error"
+          ng-show="openchannelAccountForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="OPENCHANNEL.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newOpenchannelAccount"
+          ng-click="vm.saveOpenchannelAccount()"
+          class="send-button md-accent md-raised"
+          ng-disabled="openchannelAccountForm.$invalid || openchannelAccountForm.$pristine"
+          aria-label="SAVE"
+          translate="OPENCHANNEL.SAVE"
+          translate-attr-aria-label="OPENCHANNEL.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newOpenchannelAccount"
+          ng-click="vm.addNewOpenchannelAccount()"
+          class="send-button md-accent md-raised"
+          ng-disabled="openchannelAccountForm.$invalid"
+          aria-label="ADD"
+          translate="OPENCHANNEL.ADD_OPENCHANNELACCOUNT"
+          translate-attr-aria-label="OPENCHANNEL.ADD_OPENCHANNELACCOUNT"
+        >
+          ADD OPENCHANNELACCOUNT
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newOpenchannelAccount"
+          ng-click="vm.deleteOpenchannelAccount($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="OPENCHANNEL.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="OPENCHANNEL.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/agentadd/agentadd.html/agentadd-[chunkhash].html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
deleted file mode 100644
index be01dcd..0000000
--- a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
+++ /dev/null
@@ -1,46 +0,0 @@
-<md-dialog
-  class="openchannelAccount-dialog"
-  aria-label="openchannelAccount"
-  ng-init="vm.onInit()"
->
-  <form name="openchannelAccountForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="OPENCHANNEL.AGENTADD_OPENCHANNELACCOUNT">
-          Add Agent to openchannelAccount
-        </h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <ms-dual-multiselect
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveAgents()"
-        class="send-button md-accent md-raised"
-        ng-disabled="!vm.pendingChanges"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/agentadd/agentadd.html/agentadd.html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/agentadd/agentadd.html/agentadd.html
new file mode 100644
index 0000000..be01dcd
--- /dev/null
+++ b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/agentadd/agentadd.html/agentadd.html
@@ -0,0 +1,46 @@
+<md-dialog
+  class="openchannelAccount-dialog"
+  aria-label="openchannelAccount"
+  ng-init="vm.onInit()"
+>
+  <form name="openchannelAccountForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="OPENCHANNEL.AGENTADD_OPENCHANNELACCOUNT">
+          Add Agent to openchannelAccount
+        </h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <ms-dual-multiselect
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveAgents()"
+        class="send-button md-accent md-raised"
+        ng-disabled="!vm.pendingChanges"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/agent/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/agent/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 5287509..0000000
--- a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/agent/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,152 +0,0 @@
-<md-dialog
-  class="openchannelAccount-dialog"
-  aria-label="New OpenchannelAccount"
->
-  <form name="openchannelAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="OPENCHANNEL.AGENT">Agent</label>
-        <md-select
-          name="agent"
-          ng-model="vm.agent.agent"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="agent.name"
-            ng-repeat="agent in vm.agents"
-            ng-disabled="agent.canSelect === false"
-            >{{ agent.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="openchannelAccountFormApp['agent'].$error"
-          ng-show="openchannelAccountFormApp['agent'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="OPENCHANNEL.ERRORS.AGENT_REQUIRED"
-              >Agent field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="OPENCHANNEL.TIMEOUT">Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.agent.timeout"
-          min="0"
-          max="2147483"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="openchannelAccountFormApp['timeout'].$error"
-          ng-show="openchannelAccountFormApp['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="OPENCHANNEL.ERRORS.TIMEOUT_REQUIRED"
-              >Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="OPENCHANNEL.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-          <div ng-message="max">
-            <span
-              translate="OPENCHANNEL.ERRORS.TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>2147483</span>
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveOpenchannelAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="openchannelAccountFormApp.$invalid || openchannelAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="OPENCHANNEL.SAVE"
-          translate-attr-aria-label="OPENCHANNEL.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/agent/dialog.html/dialog.html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/agent/dialog.html/dialog.html
new file mode 100644
index 0000000..5287509
--- /dev/null
+++ b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/agent/dialog.html/dialog.html
@@ -0,0 +1,152 @@
+<md-dialog
+  class="openchannelAccount-dialog"
+  aria-label="New OpenchannelAccount"
+>
+  <form name="openchannelAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="OPENCHANNEL.AGENT">Agent</label>
+        <md-select
+          name="agent"
+          ng-model="vm.agent.agent"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="agent.name"
+            ng-repeat="agent in vm.agents"
+            ng-disabled="agent.canSelect === false"
+            >{{ agent.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="openchannelAccountFormApp['agent'].$error"
+          ng-show="openchannelAccountFormApp['agent'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="OPENCHANNEL.ERRORS.AGENT_REQUIRED"
+              >Agent field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="OPENCHANNEL.TIMEOUT">Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.agent.timeout"
+          min="0"
+          max="2147483"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="openchannelAccountFormApp['timeout'].$error"
+          ng-show="openchannelAccountFormApp['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="OPENCHANNEL.ERRORS.TIMEOUT_REQUIRED"
+              >Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="OPENCHANNEL.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+          <div ng-message="max">
+            <span
+              translate="OPENCHANNEL.ERRORS.TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>2147483</span>
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveOpenchannelAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="openchannelAccountFormApp.$invalid || openchannelAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="OPENCHANNEL.SAVE"
+          translate-attr-aria-label="OPENCHANNEL.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/autoreply/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/autoreply/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index f82f592..0000000
--- a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/autoreply/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,126 +0,0 @@
-<md-dialog
-  class="openchannelAccount-dialog"
-  aria-label="New OpenchannelAccount"
->
-  <form name="openchannelAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="OPENCHANNEL.TIMES">times</label>
-        <md-select
-          name="times"
-          ng-model="vm.autoreply.times"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="1">One Time</md-option>
-          <md-option ng-value="0">Always</md-option>
-        </md-select>
-        <div
-          ng-messages="openchannelAccountFormApp['times'].$error"
-          ng-show="openchannelAccountFormApp['times'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="OPENCHANNEL.ERRORS.TIMES_REQUIRED"
-              >times field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="OPENCHANNEL.TEXT">Text</label>
-        <textarea name="text" ng-model="vm.autoreply.text" required></textarea>
-
-        <div
-          ng-messages="openchannelAccountFormApp['text'].$error"
-          ng-show="openchannelAccountFormApp['text'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="OPENCHANNEL.ERRORS.TEXT_REQUIRED"
-              >Text field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveOpenchannelAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="openchannelAccountFormApp.$invalid || openchannelAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="OPENCHANNEL.SAVE"
-          translate-attr-aria-label="OPENCHANNEL.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/autoreply/dialog.html/dialog.html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/autoreply/dialog.html/dialog.html
new file mode 100644
index 0000000..f82f592
--- /dev/null
+++ b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/autoreply/dialog.html/dialog.html
@@ -0,0 +1,126 @@
+<md-dialog
+  class="openchannelAccount-dialog"
+  aria-label="New OpenchannelAccount"
+>
+  <form name="openchannelAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="OPENCHANNEL.TIMES">times</label>
+        <md-select
+          name="times"
+          ng-model="vm.autoreply.times"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="1">One Time</md-option>
+          <md-option ng-value="0">Always</md-option>
+        </md-select>
+        <div
+          ng-messages="openchannelAccountFormApp['times'].$error"
+          ng-show="openchannelAccountFormApp['times'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="OPENCHANNEL.ERRORS.TIMES_REQUIRED"
+              >times field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="OPENCHANNEL.TEXT">Text</label>
+        <textarea name="text" ng-model="vm.autoreply.text" required></textarea>
+
+        <div
+          ng-messages="openchannelAccountFormApp['text'].$error"
+          ng-show="openchannelAccountFormApp['text'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="OPENCHANNEL.ERRORS.TEXT_REQUIRED"
+              >Text field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveOpenchannelAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="openchannelAccountFormApp.$invalid || openchannelAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="OPENCHANNEL.SAVE"
+          translate-attr-aria-label="OPENCHANNEL.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/close/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/close/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 79fb25e..0000000
--- a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/close/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,109 +0,0 @@
-<md-dialog
-  class="openchannelAccount-dialog"
-  aria-label="New OpenchannelAccount"
->
-  <form name="openchannelAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="OPENCHANNEL.DISPOSITION">Disposition</label>
-        <input
-          type="text"
-          name="disposition"
-          ng-model="vm.close.disposition"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="openchannelAccountFormApp['disposition'].$error"
-          ng-show="openchannelAccountFormApp['disposition'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="OPENCHANNEL.ERRORS.DISPOSITION_REQUIRED"
-              >Disposition field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveOpenchannelAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="openchannelAccountFormApp.$invalid || openchannelAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="OPENCHANNEL.SAVE"
-          translate-attr-aria-label="OPENCHANNEL.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/close/dialog.html/dialog.html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/close/dialog.html/dialog.html
new file mode 100644
index 0000000..79fb25e
--- /dev/null
+++ b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/close/dialog.html/dialog.html
@@ -0,0 +1,109 @@
+<md-dialog
+  class="openchannelAccount-dialog"
+  aria-label="New OpenchannelAccount"
+>
+  <form name="openchannelAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="OPENCHANNEL.DISPOSITION">Disposition</label>
+        <input
+          type="text"
+          name="disposition"
+          ng-model="vm.close.disposition"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="openchannelAccountFormApp['disposition'].$error"
+          ng-show="openchannelAccountFormApp['disposition'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="OPENCHANNEL.ERRORS.DISPOSITION_REQUIRED"
+              >Disposition field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveOpenchannelAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="openchannelAccountFormApp.$invalid || openchannelAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="OPENCHANNEL.SAVE"
+          translate-attr-aria-label="OPENCHANNEL.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/gotoif/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/gotoif/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 91dc0e6..0000000
--- a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/gotoif/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,169 +0,0 @@
-<md-dialog
-  class="openchannelAccount-dialog"
-  aria-label="New OpenchannelAccount"
->
-  <form name="openchannelAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="OPENCHANNEL.CONDITION">Condition</label>
-        <input
-          type="text"
-          name="condition"
-          ng-model="vm.gotoif.condition"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="openchannelAccountFormApp['condition'].$error"
-          ng-show="openchannelAccountFormApp['condition'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="OPENCHANNEL.ERRORS.CONDITION_REQUIRED"
-              >Condition field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="OPENCHANNEL.TRUEPRIORITY">truepriority</label>
-        <input
-          type="number"
-          name="truepriority"
-          ng-model="vm.gotoif.truepriority"
-          min="1"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="openchannelAccountFormApp['truepriority'].$error"
-          ng-show="openchannelAccountFormApp['truepriority'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="OPENCHANNEL.ERRORS.TRUEPRIORITY_REQUIRED"
-              >truepriority field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="OPENCHANNEL.ERRORS.TRUEPRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >truepriority must be a valid greater or equal than</span
-            >
-            <span>1</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="OPENCHANNEL.FALSEPRIORITY">falsepriority</label>
-        <input
-          type="number"
-          name="falsepriority"
-          ng-model="vm.gotoif.falsepriority"
-          min="1"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="openchannelAccountFormApp['falsepriority'].$error"
-          ng-show="openchannelAccountFormApp['falsepriority'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="OPENCHANNEL.ERRORS.FALSEPRIORITY_REQUIRED"
-              >falsepriority field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="OPENCHANNEL.ERRORS.FALSEPRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >falsepriority must be a valid greater or equal than</span
-            >
-            <span>1</span>
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveOpenchannelAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="openchannelAccountFormApp.$invalid || openchannelAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="OPENCHANNEL.SAVE"
-          translate-attr-aria-label="OPENCHANNEL.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/gotoif/dialog.html/dialog.html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/gotoif/dialog.html/dialog.html
new file mode 100644
index 0000000..91dc0e6
--- /dev/null
+++ b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/gotoif/dialog.html/dialog.html
@@ -0,0 +1,169 @@
+<md-dialog
+  class="openchannelAccount-dialog"
+  aria-label="New OpenchannelAccount"
+>
+  <form name="openchannelAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="OPENCHANNEL.CONDITION">Condition</label>
+        <input
+          type="text"
+          name="condition"
+          ng-model="vm.gotoif.condition"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="openchannelAccountFormApp['condition'].$error"
+          ng-show="openchannelAccountFormApp['condition'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="OPENCHANNEL.ERRORS.CONDITION_REQUIRED"
+              >Condition field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="OPENCHANNEL.TRUEPRIORITY">truepriority</label>
+        <input
+          type="number"
+          name="truepriority"
+          ng-model="vm.gotoif.truepriority"
+          min="1"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="openchannelAccountFormApp['truepriority'].$error"
+          ng-show="openchannelAccountFormApp['truepriority'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="OPENCHANNEL.ERRORS.TRUEPRIORITY_REQUIRED"
+              >truepriority field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="OPENCHANNEL.ERRORS.TRUEPRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >truepriority must be a valid greater or equal than</span
+            >
+            <span>1</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="OPENCHANNEL.FALSEPRIORITY">falsepriority</label>
+        <input
+          type="number"
+          name="falsepriority"
+          ng-model="vm.gotoif.falsepriority"
+          min="1"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="openchannelAccountFormApp['falsepriority'].$error"
+          ng-show="openchannelAccountFormApp['falsepriority'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="OPENCHANNEL.ERRORS.FALSEPRIORITY_REQUIRED"
+              >falsepriority field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="OPENCHANNEL.ERRORS.FALSEPRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >falsepriority must be a valid greater or equal than</span
+            >
+            <span>1</span>
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveOpenchannelAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="openchannelAccountFormApp.$invalid || openchannelAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="OPENCHANNEL.SAVE"
+          translate-attr-aria-label="OPENCHANNEL.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/gotop/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/gotop/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 5cf30e4..0000000
--- a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/gotop/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,117 +0,0 @@
-<md-dialog
-  class="openchannelAccount-dialog"
-  aria-label="New OpenchannelAccount"
->
-  <form name="openchannelAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="OPENCHANNEL.PRIORITY">Priority</label>
-        <input
-          type="number"
-          name="priority"
-          ng-model="vm.gotop.priority"
-          min="0"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="openchannelAccountFormApp['priority'].$error"
-          ng-show="openchannelAccountFormApp['priority'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="OPENCHANNEL.ERRORS.PRIORITY_REQUIRED"
-              >Priority field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="OPENCHANNEL.ERRORS.PRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Priority must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveOpenchannelAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="openchannelAccountFormApp.$invalid || openchannelAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="OPENCHANNEL.SAVE"
-          translate-attr-aria-label="OPENCHANNEL.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/gotop/dialog.html/dialog.html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/gotop/dialog.html/dialog.html
new file mode 100644
index 0000000..5cf30e4
--- /dev/null
+++ b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/gotop/dialog.html/dialog.html
@@ -0,0 +1,117 @@
+<md-dialog
+  class="openchannelAccount-dialog"
+  aria-label="New OpenchannelAccount"
+>
+  <form name="openchannelAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="OPENCHANNEL.PRIORITY">Priority</label>
+        <input
+          type="number"
+          name="priority"
+          ng-model="vm.gotop.priority"
+          min="0"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="openchannelAccountFormApp['priority'].$error"
+          ng-show="openchannelAccountFormApp['priority'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="OPENCHANNEL.ERRORS.PRIORITY_REQUIRED"
+              >Priority field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="OPENCHANNEL.ERRORS.PRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Priority must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveOpenchannelAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="openchannelAccountFormApp.$invalid || openchannelAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="OPENCHANNEL.SAVE"
+          translate-attr-aria-label="OPENCHANNEL.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/interval/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/interval/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index ca0ed91..0000000
--- a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/interval/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,313 +0,0 @@
-<md-dialog class="inboundroute-dialog" aria-label="New Interval">
-  <form name="intervalForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <md-input-container class="md-block">
-        <label translate="TOOLS.TYPE">Type</label>
-        <md-select
-          ng-model="vm.type"
-          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="type" ng-repeat="type in vm.types"
-            >{{ type | ucfirst }}</md-option
-          >
-        </md-select>
-      </md-input-container>
-
-      <md-input-container class="md-block" ng-if="vm.type === 'list'">
-        <label translate="TOOLS.INTERVALS">Intervals</label>
-        <md-select
-          ng-model="vm.interval.IntervalId"
-          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="interval.id" ng-repeat="interval in vm.intervals"
-            >{{ interval.name }}</md-option
-          >
-        </md-select>
-      </md-input-container>
-
-      <!-- TIMERANGE START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.TIME_RANGE"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <div class="md-block" flex>
-          <mdp-time-picker
-            name="timeRangeFrom"
-            mdp-placeholder="FROM"
-            ng-model="vm.timeRangeFrom"
-            mdp-format="HH:mm"
-            mdp-auto-switch="true"
-            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <div
-              ng-messages="intervalForm.timeRangeFrom.$error"
-              ng-show="intervalForm.timeRangeFrom.$touched"
-              role="alert"
-            >
-              <div ng-message="format">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_FROM_INVALID"
-                  >Time Range From field is invalid</span
-                >
-              </div>
-            </div>
-          </mdp-time-picker>
-        </div>
-        <div class="md-block" flex ng-if="vm.timeRangeFrom">
-          <mdp-time-picker
-            name="timeRangeTo"
-            mdp-placeholder="TO*"
-            ng-model="vm.timeRangeTo"
-            mdp-format="HH:mm"
-            mdp-auto-switch="true"
-            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-            required
-          >
-            <div
-              ng-messages="intervalForm.timeRangeTo.$error"
-              ng-show="intervalForm.timeRangeTo.$invalid"
-              role="alert"
-            >
-              <div ng-message="format">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_INVALID"
-                  >Time Range To field is invalid</span
-                >
-              </div>
-              <div ng-message="required">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_REQUIRED"
-                  >Time Range To field is required</span
-                >
-              </div>
-            </div>
-          </mdp-time-picker>
-        </div>
-      </div>
-      <!-- TIMERANGE END -->
-
-      <!-- DAYSOFWEEK START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.WEEK_DAYS"
-        >Week Days</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.dayOfWeekFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
-              ><span translate="TOOLS.{{day.value | uppercase}}"
-                >{{ day.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container flex class="md-block" ng-if="vm.dayOfWeekFrom">
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="dayOfWeekTo"
-            ng-model="vm.dayOfWeekTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
-              ><span translate="TOOLS.{{day.value | uppercase}}"
-                >{{ day.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.dayOfWeekTo.$error"
-            ng-show="intervalForm.dayOfWeekTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- DAYSOFWEEK END -->
-
-      <!-- MONTHDAY START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTH_DAYS"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex layout="column" class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.monthDayFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
-              >{{ month }}</md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container
-          flex
-          layout="column"
-          class="md-block"
-          ng-if="vm.monthDayFrom"
-        >
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="monthDayTo"
-            ng-model="vm.monthDayTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
-              >{{ month }}</md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.monthDayTo.$error"
-            ng-show="intervalForm.monthDayTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- MONTHDAY END -->
-
-      <!-- MONTH START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTHS"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex layout="column" class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.monthFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
-              ><span translate="TOOLS.{{month.value | uppercase}}"
-                >{{ month.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container
-          flex
-          layout="column"
-          class="md-block"
-          ng-if="vm.monthFrom"
-        >
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="monthTo"
-            ng-model="vm.monthTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
-              ><span translate="TOOLS.{{month.value | uppercase}}"
-                >{{ month.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.monthTo.$error"
-            ng-show="intervalForm.monthTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- MONTH END -->
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="!vm.newInterval && vm.crudPermissions.canEdit"
-          ng-click="vm.saveInterval()"
-          class="send-button md-accent md-raised"
-          ng-disabled="intervalForm.$invalid || intervalForm.$pristine"
-          aria-label="SAVE"
-          translate="TOOLS.SAVE"
-          translate-attr-aria-label="TOOLS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.newInterval && vm.crudPermissions.canEdit"
-          ng-click="vm.addNewInterval()"
-          class="send-button md-accent md-raised"
-          ng-disabled="intervalForm.$invalid"
-          aria-label="ADD"
-          translate="TOOLS.ADD_INTERVAL"
-          translate-attr-aria-label="TOOLS.ADD_INTERVAL"
-        >
-          ADD INTERVAL
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/interval/dialog.html/dialog.html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/interval/dialog.html/dialog.html
new file mode 100644
index 0000000..ca0ed91
--- /dev/null
+++ b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/interval/dialog.html/dialog.html
@@ -0,0 +1,313 @@
+<md-dialog class="inboundroute-dialog" aria-label="New Interval">
+  <form name="intervalForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <md-input-container class="md-block">
+        <label translate="TOOLS.TYPE">Type</label>
+        <md-select
+          ng-model="vm.type"
+          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="type" ng-repeat="type in vm.types"
+            >{{ type | ucfirst }}</md-option
+          >
+        </md-select>
+      </md-input-container>
+
+      <md-input-container class="md-block" ng-if="vm.type === 'list'">
+        <label translate="TOOLS.INTERVALS">Intervals</label>
+        <md-select
+          ng-model="vm.interval.IntervalId"
+          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="interval.id" ng-repeat="interval in vm.intervals"
+            >{{ interval.name }}</md-option
+          >
+        </md-select>
+      </md-input-container>
+
+      <!-- TIMERANGE START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.TIME_RANGE"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <div class="md-block" flex>
+          <mdp-time-picker
+            name="timeRangeFrom"
+            mdp-placeholder="FROM"
+            ng-model="vm.timeRangeFrom"
+            mdp-format="HH:mm"
+            mdp-auto-switch="true"
+            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <div
+              ng-messages="intervalForm.timeRangeFrom.$error"
+              ng-show="intervalForm.timeRangeFrom.$touched"
+              role="alert"
+            >
+              <div ng-message="format">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_FROM_INVALID"
+                  >Time Range From field is invalid</span
+                >
+              </div>
+            </div>
+          </mdp-time-picker>
+        </div>
+        <div class="md-block" flex ng-if="vm.timeRangeFrom">
+          <mdp-time-picker
+            name="timeRangeTo"
+            mdp-placeholder="TO*"
+            ng-model="vm.timeRangeTo"
+            mdp-format="HH:mm"
+            mdp-auto-switch="true"
+            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+            required
+          >
+            <div
+              ng-messages="intervalForm.timeRangeTo.$error"
+              ng-show="intervalForm.timeRangeTo.$invalid"
+              role="alert"
+            >
+              <div ng-message="format">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_INVALID"
+                  >Time Range To field is invalid</span
+                >
+              </div>
+              <div ng-message="required">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_REQUIRED"
+                  >Time Range To field is required</span
+                >
+              </div>
+            </div>
+          </mdp-time-picker>
+        </div>
+      </div>
+      <!-- TIMERANGE END -->
+
+      <!-- DAYSOFWEEK START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.WEEK_DAYS"
+        >Week Days</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.dayOfWeekFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
+              ><span translate="TOOLS.{{day.value | uppercase}}"
+                >{{ day.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container flex class="md-block" ng-if="vm.dayOfWeekFrom">
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="dayOfWeekTo"
+            ng-model="vm.dayOfWeekTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
+              ><span translate="TOOLS.{{day.value | uppercase}}"
+                >{{ day.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.dayOfWeekTo.$error"
+            ng-show="intervalForm.dayOfWeekTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- DAYSOFWEEK END -->
+
+      <!-- MONTHDAY START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTH_DAYS"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex layout="column" class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.monthDayFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
+              >{{ month }}</md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container
+          flex
+          layout="column"
+          class="md-block"
+          ng-if="vm.monthDayFrom"
+        >
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="monthDayTo"
+            ng-model="vm.monthDayTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
+              >{{ month }}</md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.monthDayTo.$error"
+            ng-show="intervalForm.monthDayTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- MONTHDAY END -->
+
+      <!-- MONTH START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTHS"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex layout="column" class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.monthFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
+              ><span translate="TOOLS.{{month.value | uppercase}}"
+                >{{ month.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container
+          flex
+          layout="column"
+          class="md-block"
+          ng-if="vm.monthFrom"
+        >
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="monthTo"
+            ng-model="vm.monthTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
+              ><span translate="TOOLS.{{month.value | uppercase}}"
+                >{{ month.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.monthTo.$error"
+            ng-show="intervalForm.monthTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- MONTH END -->
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="!vm.newInterval && vm.crudPermissions.canEdit"
+          ng-click="vm.saveInterval()"
+          class="send-button md-accent md-raised"
+          ng-disabled="intervalForm.$invalid || intervalForm.$pristine"
+          aria-label="SAVE"
+          translate="TOOLS.SAVE"
+          translate-attr-aria-label="TOOLS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.newInterval && vm.crudPermissions.canEdit"
+          ng-click="vm.addNewInterval()"
+          class="send-button md-accent md-raised"
+          ng-disabled="intervalForm.$invalid"
+          aria-label="ADD"
+          translate="TOOLS.ADD_INTERVAL"
+          translate-attr-aria-label="TOOLS.ADD_INTERVAL"
+        >
+          ADD INTERVAL
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/noop/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/noop/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 00b4a60..0000000
--- a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/noop/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,108 +0,0 @@
-<md-dialog
-  class="openchannelAccount-dialog"
-  aria-label="New OpenchannelAccount"
->
-  <form name="openchannelAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="OPENCHANNEL.VALUE">Value</label>
-        <input
-          type="text"
-          name="value"
-          ng-model="vm.noop.value"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="openchannelAccountFormApp['value'].$error"
-          ng-show="openchannelAccountFormApp['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="OPENCHANNEL.ERRORS.VALUE_REQUIRED"
-              >Value field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveOpenchannelAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="openchannelAccountFormApp.$invalid || openchannelAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="OPENCHANNEL.SAVE"
-          translate-attr-aria-label="OPENCHANNEL.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/noop/dialog.html/dialog.html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/noop/dialog.html/dialog.html
new file mode 100644
index 0000000..00b4a60
--- /dev/null
+++ b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/noop/dialog.html/dialog.html
@@ -0,0 +1,108 @@
+<md-dialog
+  class="openchannelAccount-dialog"
+  aria-label="New OpenchannelAccount"
+>
+  <form name="openchannelAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="OPENCHANNEL.VALUE">Value</label>
+        <input
+          type="text"
+          name="value"
+          ng-model="vm.noop.value"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="openchannelAccountFormApp['value'].$error"
+          ng-show="openchannelAccountFormApp['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="OPENCHANNEL.ERRORS.VALUE_REQUIRED"
+              >Value field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveOpenchannelAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="openchannelAccountFormApp.$invalid || openchannelAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="OPENCHANNEL.SAVE"
+          translate-attr-aria-label="OPENCHANNEL.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/queue/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/queue/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 22d3404..0000000
--- a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/queue/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,152 +0,0 @@
-<md-dialog
-  class="openchannelAccount-dialog"
-  aria-label="New OpenchannelAccount"
->
-  <form name="openchannelAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="OPENCHANNEL.QUEUE">Queue</label>
-        <md-select
-          name="queue"
-          ng-model="vm.queue.queue"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="queue.name"
-            ng-repeat="queue in vm.queues"
-            ng-disabled="queue.canSelect === false"
-            >{{ queue.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="openchannelAccountFormApp['queue'].$error"
-          ng-show="openchannelAccountFormApp['queue'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="OPENCHANNEL.ERRORS.QUEUE_REQUIRED"
-              >Queue field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="OPENCHANNEL.TIMEOUT">Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.queue.timeout"
-          min="0"
-          max="2147483"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="openchannelAccountFormApp['timeout'].$error"
-          ng-show="openchannelAccountFormApp['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="OPENCHANNEL.ERRORS.TIMEOUT_REQUIRED"
-              >Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="OPENCHANNEL.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-          <div ng-message="max">
-            <span
-              translate="OPENCHANNEL.ERRORS.TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>2147483</span>
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveOpenchannelAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="openchannelAccountFormApp.$invalid || openchannelAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="OPENCHANNEL.SAVE"
-          translate-attr-aria-label="OPENCHANNEL.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/queue/dialog.html/dialog.html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/queue/dialog.html/dialog.html
new file mode 100644
index 0000000..22d3404
--- /dev/null
+++ b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/queue/dialog.html/dialog.html
@@ -0,0 +1,152 @@
+<md-dialog
+  class="openchannelAccount-dialog"
+  aria-label="New OpenchannelAccount"
+>
+  <form name="openchannelAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="OPENCHANNEL.QUEUE">Queue</label>
+        <md-select
+          name="queue"
+          ng-model="vm.queue.queue"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="queue.name"
+            ng-repeat="queue in vm.queues"
+            ng-disabled="queue.canSelect === false"
+            >{{ queue.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="openchannelAccountFormApp['queue'].$error"
+          ng-show="openchannelAccountFormApp['queue'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="OPENCHANNEL.ERRORS.QUEUE_REQUIRED"
+              >Queue field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="OPENCHANNEL.TIMEOUT">Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.queue.timeout"
+          min="0"
+          max="2147483"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="openchannelAccountFormApp['timeout'].$error"
+          ng-show="openchannelAccountFormApp['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="OPENCHANNEL.ERRORS.TIMEOUT_REQUIRED"
+              >Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="OPENCHANNEL.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+          <div ng-message="max">
+            <span
+              translate="OPENCHANNEL.ERRORS.TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>2147483</span>
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveOpenchannelAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="openchannelAccountFormApp.$invalid || openchannelAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="OPENCHANNEL.SAVE"
+          translate-attr-aria-label="OPENCHANNEL.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/system/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/system/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 9e9d77e..0000000
--- a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/system/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,136 +0,0 @@
-<md-dialog
-  class="openchannelAccount-dialog"
-  aria-label="New OpenchannelAccount"
->
-  <form name="openchannelAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="OPENCHANNEL.COMMAND">Command</label>
-        <input
-          type="text"
-          name="command"
-          ng-model="vm.system.command"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="openchannelAccountFormApp['command'].$error"
-          ng-show="openchannelAccountFormApp['command'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="OPENCHANNEL.ERRORS.COMMAND_REQUIRED"
-              >Command field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="OPENCHANNEL.VARIABLE">Variable</label>
-        <md-select
-          name="variable"
-          ng-model="vm.system.variable"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="''">None</md-option>
-          <md-option
-            ng-value="variable.name"
-            ng-repeat="variable in vm.variables"
-            ng-disabled="variable.canSelect === false"
-            >{{ variable.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="openchannelAccountFormApp['variable'].$error"
-          ng-show="openchannelAccountFormApp['variable'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="OPENCHANNEL.ERRORS.VARIABLE_REQUIRED"
-              >Variable field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveOpenchannelAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="openchannelAccountFormApp.$invalid || openchannelAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="OPENCHANNEL.SAVE"
-          translate-attr-aria-label="OPENCHANNEL.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/system/dialog.html/dialog.html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/system/dialog.html/dialog.html
new file mode 100644
index 0000000..9e9d77e
--- /dev/null
+++ b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/system/dialog.html/dialog.html
@@ -0,0 +1,136 @@
+<md-dialog
+  class="openchannelAccount-dialog"
+  aria-label="New OpenchannelAccount"
+>
+  <form name="openchannelAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="OPENCHANNEL.COMMAND">Command</label>
+        <input
+          type="text"
+          name="command"
+          ng-model="vm.system.command"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="openchannelAccountFormApp['command'].$error"
+          ng-show="openchannelAccountFormApp['command'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="OPENCHANNEL.ERRORS.COMMAND_REQUIRED"
+              >Command field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="OPENCHANNEL.VARIABLE">Variable</label>
+        <md-select
+          name="variable"
+          ng-model="vm.system.variable"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="''">None</md-option>
+          <md-option
+            ng-value="variable.name"
+            ng-repeat="variable in vm.variables"
+            ng-disabled="variable.canSelect === false"
+            >{{ variable.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="openchannelAccountFormApp['variable'].$error"
+          ng-show="openchannelAccountFormApp['variable'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="OPENCHANNEL.ERRORS.VARIABLE_REQUIRED"
+              >Variable field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveOpenchannelAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="openchannelAccountFormApp.$invalid || openchannelAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="OPENCHANNEL.SAVE"
+          translate-attr-aria-label="OPENCHANNEL.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/tag/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/tag/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index a1a76bf..0000000
--- a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/tag/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,114 +0,0 @@
-<md-dialog
-  class="openchannelAccount-dialog"
-  aria-label="New OpenchannelAccount"
->
-  <form name="openchannelAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="OPENCHANNEL.TAG">Tag</label>
-        <md-select
-          name="tag"
-          ng-model="vm.tag.tag"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="tag.name"
-            ng-repeat="tag in vm.tags"
-            ng-disabled="tag.canSelect === false"
-            >{{ tag.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="openchannelAccountFormApp['tag'].$error"
-          ng-show="openchannelAccountFormApp['tag'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="OPENCHANNEL.ERRORS.TAG_REQUIRED"
-              >Tag field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveOpenchannelAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="openchannelAccountFormApp.$invalid || openchannelAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="OPENCHANNEL.SAVE"
-          translate-attr-aria-label="OPENCHANNEL.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/tag/dialog.html/dialog.html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/tag/dialog.html/dialog.html
new file mode 100644
index 0000000..a1a76bf
--- /dev/null
+++ b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/apps/tag/dialog.html/dialog.html
@@ -0,0 +1,114 @@
+<md-dialog
+  class="openchannelAccount-dialog"
+  aria-label="New OpenchannelAccount"
+>
+  <form name="openchannelAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="OPENCHANNEL.TAG">Tag</label>
+        <md-select
+          name="tag"
+          ng-model="vm.tag.tag"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="tag.name"
+            ng-repeat="tag in vm.tags"
+            ng-disabled="tag.canSelect === false"
+            >{{ tag.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="openchannelAccountFormApp['tag'].$error"
+          ng-show="openchannelAccountFormApp['tag'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="OPENCHANNEL.ERRORS.TAG_REQUIRED"
+              >Tag field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveOpenchannelAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="openchannelAccountFormApp.$invalid || openchannelAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="OPENCHANNEL.SAVE"
+          translate-attr-aria-label="OPENCHANNEL.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/openchannelCannedAnswers/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/openchannelCannedAnswers/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 062e070..0000000
--- a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/openchannelCannedAnswers/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,178 +0,0 @@
-<md-dialog
-  class="openchannelCannedAnswer-dialog"
-  aria-label="New OpenchannelCannedAnswer"
->
-  <form name="openchannelCannedAnswerForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="OPENCHANNEL.KEY">Key</label>
-        <input
-          type=""
-          name="key"
-          ng-model="vm.openchannelCannedAnswer.key"
-          md-maxlength="255"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="openchannelCannedAnswerForm['key'].$error"
-          ng-show="openchannelCannedAnswerForm['key'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="OPENCHANNEL.ERRORS.KEY_REQUIRED"
-              >Key field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="OPENCHANNEL.VALUE">Value</label>
-        <textarea
-          name="value"
-          ng-model="vm.openchannelCannedAnswer.value"
-          required
-        ></textarea>
-
-        <div
-          ng-messages="openchannelCannedAnswerForm['value'].$error"
-          ng-show="openchannelCannedAnswerForm['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="OPENCHANNEL.ERRORS.VALUE_REQUIRED"
-              >Value field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="OPENCHANNEL.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.openchannelCannedAnswer.description"
-        />
-
-        <div
-          ng-messages="openchannelCannedAnswerForm['description'].$error"
-          ng-show="openchannelCannedAnswerForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="OPENCHANNEL.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newOpenchannelCannedAnswer"
-          ng-click="vm.saveOpenchannelCannedAnswer()"
-          class="send-button md-accent md-raised"
-          ng-disabled="openchannelCannedAnswerForm.$invalid || openchannelCannedAnswerForm.$pristine"
-          aria-label="SAVE"
-          translate="OPENCHANNEL.SAVE"
-          translate-attr-aria-label="OPENCHANNEL.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newOpenchannelCannedAnswer"
-          ng-click="vm.addNewOpenchannelCannedAnswer()"
-          class="send-button md-accent md-raised"
-          ng-disabled="openchannelCannedAnswerForm.$invalid"
-          aria-label="ADD"
-          translate="OPENCHANNEL.ADD_OPENCHANNELCANNEDANSWER"
-          translate-attr-aria-label="OPENCHANNEL.ADD_OPENCHANNELCANNEDANSWER"
-        >
-          ADD OPENCHANNELCANNEDANSWER
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newOpenchannelCannedAnswer"
-          ng-click="vm.deleteOpenchannelCannedAnswer($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="OPENCHANNEL.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="OPENCHANNEL.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/openchannelCannedAnswers/dialog.html/dialog.html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/openchannelCannedAnswers/dialog.html/dialog.html
new file mode 100644
index 0000000..062e070
--- /dev/null
+++ b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/openchannelCannedAnswers/dialog.html/dialog.html
@@ -0,0 +1,178 @@
+<md-dialog
+  class="openchannelCannedAnswer-dialog"
+  aria-label="New OpenchannelCannedAnswer"
+>
+  <form name="openchannelCannedAnswerForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="OPENCHANNEL.KEY">Key</label>
+        <input
+          type=""
+          name="key"
+          ng-model="vm.openchannelCannedAnswer.key"
+          md-maxlength="255"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="openchannelCannedAnswerForm['key'].$error"
+          ng-show="openchannelCannedAnswerForm['key'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="OPENCHANNEL.ERRORS.KEY_REQUIRED"
+              >Key field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="OPENCHANNEL.VALUE">Value</label>
+        <textarea
+          name="value"
+          ng-model="vm.openchannelCannedAnswer.value"
+          required
+        ></textarea>
+
+        <div
+          ng-messages="openchannelCannedAnswerForm['value'].$error"
+          ng-show="openchannelCannedAnswerForm['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="OPENCHANNEL.ERRORS.VALUE_REQUIRED"
+              >Value field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="OPENCHANNEL.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.openchannelCannedAnswer.description"
+        />
+
+        <div
+          ng-messages="openchannelCannedAnswerForm['description'].$error"
+          ng-show="openchannelCannedAnswerForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="OPENCHANNEL.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newOpenchannelCannedAnswer"
+          ng-click="vm.saveOpenchannelCannedAnswer()"
+          class="send-button md-accent md-raised"
+          ng-disabled="openchannelCannedAnswerForm.$invalid || openchannelCannedAnswerForm.$pristine"
+          aria-label="SAVE"
+          translate="OPENCHANNEL.SAVE"
+          translate-attr-aria-label="OPENCHANNEL.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newOpenchannelCannedAnswer"
+          ng-click="vm.addNewOpenchannelCannedAnswer()"
+          class="send-button md-accent md-raised"
+          ng-disabled="openchannelCannedAnswerForm.$invalid"
+          aria-label="ADD"
+          translate="OPENCHANNEL.ADD_OPENCHANNELCANNEDANSWER"
+          translate-attr-aria-label="OPENCHANNEL.ADD_OPENCHANNELCANNEDANSWER"
+        >
+          ADD OPENCHANNELCANNEDANSWER
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newOpenchannelCannedAnswer"
+          ng-click="vm.deleteOpenchannelCannedAnswer($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="OPENCHANNEL.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="OPENCHANNEL.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index f4f126a..0000000
--- a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,1701 +0,0 @@
-<div
-  id="openchannel-openchannelAccount"
-  class="page-layout simple tabbed"
-  layout="column"
->
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-openchannelAccounts-button md-icon-button"
-        aria-label="Go to openchannelAccounts"
-        ng-click="vm.gotoOpenchannelAccounts()"
-        translate
-        translate-attr-aria-label="OPENCHANNEL.GO_TO_OPENCHANNELACCOUNTS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="openchannelAccount-image" hide-xs>
-          <img ng-src="assets/images/business/openchannelAccounts.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.openchannelAccount.id}}
-            <span ng-if="vm.openchannelAccount.name"
-              >{{vm.openchannelAccount.name}}</span
-            >
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="OPENCHANNEL.CREATED_AT"></span>
-            <span>{{vm.openchannelAccount.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.agentadddialog(vm.openchannelAccount, $event)"
-        class="md-fab md-warn md-icon-button"
-        aria-label="agentadd"
-      >
-        <md-tooltip
-          ><span translate="OPENCHANNEL.AGENTADD_OPENCHANNELACCOUNT"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
-      </md-button>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveOpenchannelAccount()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (notificationForm.$invalid) || (transferForm.$invalid) || (proxyForm.$invalid) || (dispositionForm.$invalid) || (openchannelDispositionsForm.$invalid) || (openchannelCannedAnswersForm.$invalid) || (actionsForm.$invalid) || (interactionsForm.$invalid)"
-        translate="OPENCHANNEL.SAVE"
-        translate-attr-aria-label="OPENCHANNEL.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="OPENCHANNEL.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="openchannelAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="OPENCHANNEL.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="OPENCHANNEL.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.openchannelAccount.name"
-                  ng-required="true"
-                  autofocus
-                  disabled
-                />
-
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="OPENCHANNEL.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="OPENCHANNEL.KEY">key</label>
-                <input
-                  type="text"
-                  name="key"
-                  ng-model="vm.openchannelAccount.key"
-                  md-maxlength="5"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['key'].$error"
-                  ng-show="generalForm['key'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="OPENCHANNEL.ERRORS.KEY_REQUIRED"
-                      >key field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="OPENCHANNEL.ERRORS.KEY_MAX_LENGTH"
-                      translate-values="{max: 5}"
-                      >key must have a maximum length equal to 5</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="OPENCHANNEL.REPLYURI">replyUri</label>
-                <input
-                  type="url"
-                  name="replyUri"
-                  ng-model="vm.openchannelAccount.replyUri"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="OPENCHANNEL.HELP.REPLYURI"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['replyUri'].$error"
-                  ng-show="generalForm['replyUri'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="OPENCHANNEL.ERRORS.REPLYURI_REQUIRED"
-                      >replyUri field is required</span
-                    >
-                  </div>
-                  <div ng-message="url">
-                    <span translate="OPENCHANNEL.ERRORS.REPLYURI_MUST_VALID_URL"
-                      >replyUri must be a valid url http://www.xcally.com</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="OPENCHANNEL.LIST">List</label>
-                <md-select
-                  name="ListId"
-                  ng-model="vm.openchannelAccount.ListId"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="ListId.id"
-                    ng-repeat="ListId in vm.lists"
-                    ng-disabled="ListId.canSelect === false"
-                    >{{ ListId.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span translate="OPENCHANNEL.HELP.LIST"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['ListId'].$error"
-                  ng-show="generalForm['ListId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="OPENCHANNEL.ERRORS.LIST_REQUIRED"
-                      >List field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="OPENCHANNEL.WAITFORTHEASSIGNEDAGENT"
-                  >WaitForTheAssignedAgent</label
-                >
-                <input
-                  type="number"
-                  name="waitForTheAssignedAgent"
-                  ng-model="vm.openchannelAccount.waitForTheAssignedAgent"
-                  min="1"
-                  max="2147483"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['waitForTheAssignedAgent'].$error"
-                  ng-show="generalForm['waitForTheAssignedAgent'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="OPENCHANNEL.ERRORS.WAITFORTHEASSIGNEDAGENT_REQUIRED"
-                      >WaitForTheAssignedAgent field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="OPENCHANNEL.ERRORS.WAITFORTHEASSIGNEDAGENT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >WaitForTheAssignedAgent must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="OPENCHANNEL.ERRORS.WAITFORTHEASSIGNEDAGENT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >WaitForTheAssignedAgent must be a valid greater or equal
-                      than</span
-                    >
-                    <span>2147483</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="OPENCHANNEL.MAPKEY">MapKey</label>
-                <md-select
-                  name="mapKey"
-                  ng-model="vm.openchannelAccount.mapKey"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="''">None</md-option>
-                  <md-optgroup label="standard">
-                    <md-option
-                      ng-value="mapKey.columnName"
-                      ng-repeat="mapKey in vm.fields"
-                      ng-if="!mapKey.columnName.toString().startsWith('cf_')"
-                      ng-disabled="mapKey.canSelect === false"
-                      >{{ mapKey.displayName }}</md-option
-                    >
-                  </md-optgroup>
-                  <md-optgroup label="custom">
-                    <md-option
-                      ng-value="mapKey.columnName"
-                      ng-repeat="mapKey in vm.fields"
-                      ng-if="mapKey.columnName.toString().startsWith('cf_')"
-                      ng-disabled="mapKey.canSelect === false"
-                      >{{ mapKey.displayName }}</md-option
-                    >
-                  </md-optgroup>
-                </md-select>
-                <div
-                  ng-messages="generalForm['mapKey'].$error"
-                  ng-show="generalForm['mapKey'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="OPENCHANNEL.ERRORS.MAPKEY_REQUIRED"
-                      >MapKey field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="OPENCHANNEL.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.openchannelAccount.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="OPENCHANNEL.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="OPENCHANNEL.RECEIVEURI">receiveUri</label>
-                <div layout="row" layout-align="center center">
-                  <button
-                    class="md-button md-fab md-mini md-primary"
-                    ngclipboard
-                    data-clipboard-target="#copytoclipboard-receiveUri"
-                    ngclipboard-success="vm.alert({title: 'copied to clipboard', msg: e.text});"
-                    ngclipboard-error="vm.alert({title: 'error', msg: 'copy to clipboard failed'});"
-                  >
-                    <md-icon md-font-icon="icon-clipboard-text"></md-icon>
-                  </button>
-                  <input
-                    class="md-input"
-                    type="text"
-                    id="copytoclipboard-receiveUri"
-                    name="receiveUri"
-                    ng-value="vm.location + '/api/openchannel/accounts/' + vm.openchannelAccount.id + '/notify'"
-                    ng-readonly="true"
-                  />
-                </div>
-                <div class="hint">
-                  <span translate="OPENCHANNEL.HELP.RECEIVEURI"></span>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="openchannelAccount-detail-form-container notification md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div
-                class="h2 secondary-text"
-                translate="OPENCHANNEL.NOTIFICATION"
-              >
-                NOTIFICATION
-              </div>
-            </div>
-            <form name="notificationForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.openchannelAccount.notificationSound"
-                  aria-label="notificationSound"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="OPENCHANNEL.NOTIFICATIONSOUND"
-                    >notificationSound</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.openchannelAccount.notificationShake"
-                  aria-label="notificationShake"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="OPENCHANNEL.NOTIFICATIONSHAKE"
-                    >notificationShake</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <div class="md-block">
-                <label
-                  class="md-caption grey-fg"
-                  translate="OPENCHANNEL.NOTIFICATIONTEMPLATE"
-                  >notificationTemplate</label
-                >
-                <textarea
-                  aria-label="notificationTemplate notificationTemplate"
-                  ckeditor="{ skin: 'office2013', language: 'en', allowedContent: true, extraPlugins: 'font,colorbutton,autoembed,autocorrect,googlethisterm,pastebase64', toolbarGroups: [{ name: 'styles', groups: ['styles'] }, { name: 'clipboard', groups: ['undo'] }, { name: 'colors', groups: ['colors'] }, { name: 'basicstyles', groups: ['basicstyles'] }, { name: 'paragraph', groups: ['list', 'indent', 'align'] }, { name: 'mode' }], autocorrect_enabled: true, disableNativeSpellChecker: false, fontSize_sizes: '8/8pt;9/9pt;10/10pt;11/11pt;12/12pt;14/14pt;16/16pt;18/18pt;20/20pt;22/22pt;24/24pt;26/26pt;28/28pt;36/36pt;48/48pt;72/72pt',  removePlugins: 'magicline' }"
-                  ng-model="vm.openchannelAccount.notificationTemplate"
-                ></textarea>
-              </div>
-            </form>
-          </div>
-          <div
-            class="openchannelAccount-detail-form-container transfer md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="OPENCHANNEL.TRANSFER">
-                TRANSFER
-              </div>
-            </div>
-            <form name="transferForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.openchannelAccount.queueTransfer"
-                  aria-label="queueTransfer"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="OPENCHANNEL.QUEUETRANSFER"
-                    >queueTransfer</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.openchannelAccount.queueTransfer == true"
-                class="md-block"
-              >
-                <label translate="OPENCHANNEL.QUEUETRANSFERTIMEOUT"
-                  >queueTransferTimeout</label
-                >
-                <input
-                  type="number"
-                  name="queueTransferTimeout"
-                  ng-model="vm.openchannelAccount.queueTransferTimeout"
-                  min="1"
-                  max="2147483"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="transferForm['queueTransferTimeout'].$error"
-                  ng-show="transferForm['queueTransferTimeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="OPENCHANNEL.ERRORS.QUEUETRANSFERTIMEOUT_REQUIRED"
-                      >queueTransferTimeout field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="OPENCHANNEL.ERRORS.QUEUETRANSFERTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >queueTransferTimeout must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="OPENCHANNEL.ERRORS.QUEUETRANSFERTIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >queueTransferTimeout must be a valid greater or equal
-                      than</span
-                    >
-                    <span>2147483</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.openchannelAccount.agentTransfer"
-                  aria-label="agentTransfer"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="OPENCHANNEL.AGENTTRANSFER"
-                    >agentTransfer</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.openchannelAccount.agentTransfer == true"
-                class="md-block"
-              >
-                <label translate="OPENCHANNEL.AGENTTRANSFERTIMEOUT"
-                  >agentTransferTimeout</label
-                >
-                <input
-                  type="number"
-                  name="agentTransferTimeout"
-                  ng-model="vm.openchannelAccount.agentTransferTimeout"
-                  min="1"
-                  max="2147483"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="transferForm['agentTransferTimeout'].$error"
-                  ng-show="transferForm['agentTransferTimeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="OPENCHANNEL.ERRORS.AGENTTRANSFERTIMEOUT_REQUIRED"
-                      >agentTransferTimeout field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="OPENCHANNEL.ERRORS.AGENTTRANSFERTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >agentTransferTimeout must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="OPENCHANNEL.ERRORS.AGENTTRANSFERTIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >agentTransferTimeout must be a valid greater or equal
-                      than</span
-                    >
-                    <span>2147483</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="OPENCHANNEL.ADVANCED">ADVANCED</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="openchannelAccount-detail-form-container proxy md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="OPENCHANNEL.PROXY">
-                PROXY
-              </div>
-            </div>
-            <form name="proxyForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="OPENCHANNEL.TOKEN">token</label>
-                <input
-                  type="text"
-                  name="token"
-                  ng-model="vm.openchannelAccount.token"
-                  autofocus
-                  disabled
-                />
-
-                <div class="hint">
-                  <span translate="OPENCHANNEL.HELP.TOKEN"></span>
-                </div>
-                <div
-                  ng-messages="proxyForm['token'].$error"
-                  ng-show="proxyForm['token'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="OPENCHANNEL.ERRORS.TOKEN_REQUIRED"
-                      >token field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="openchannelAccount-detail-form-container disposition md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div
-                class="h2 secondary-text"
-                translate="OPENCHANNEL.DISPOSITION"
-              >
-                DISPOSITION
-              </div>
-            </div>
-            <form name="dispositionForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.openchannelAccount.mandatoryDisposition"
-                  aria-label="MandatoryDisposition"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="OPENCHANNEL.MANDATORYDISPOSITION"
-                    >MandatoryDisposition</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.openchannelAccount.mandatoryDisposition"
-                class="md-block"
-              >
-                <label translate="OPENCHANNEL.MANDATORYDISPOSITIONPAUSEID"
-                  >MandatoryDispositionPauseId</label
-                >
-                <md-select
-                  name="mandatoryDispositionPauseId"
-                  ng-model="vm.openchannelAccount.mandatoryDispositionPauseId"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="mandatoryDispositionPauseId.id"
-                    ng-repeat="mandatoryDispositionPauseId in vm.pauses"
-                    ng-disabled="mandatoryDispositionPauseId.canSelect === false"
-                    >{{ mandatoryDispositionPauseId.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span
-                    translate="OPENCHANNEL.HELP.MANDATORYDISPOSITIONPAUSEID"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="dispositionForm['mandatoryDispositionPauseId'].$error"
-                  ng-show="dispositionForm['mandatoryDispositionPauseId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="OPENCHANNEL.ERRORS.MANDATORYDISPOSITIONPAUSEID_REQUIRED"
-                      >MandatoryDispositionPauseId field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="OPENCHANNEL.DISPOSITIONS">DISPOSITIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            ng-controller="OpenchannelAccountDispositionsController as vm_dc"
-            ng-init="vm_dc.init(vm.openchannelAccount, vm.crudPermissions)"
-          >
-            <div layout="row">
-              <div class="column" flex="20">
-                <md-card class="mt-0">
-                  <md-card-content>
-                    <button
-                      layout-align="center center"
-                      md-mini-fab
-                      ng-click="vm_dc.query.level = null; vm_dc.getDispositions()"
-                    >
-                      <div layout="row" layout-align="start center">
-                        <md-icon md-font-icon="icon-refresh"></md-icon>
-                        <span class="ph-5"
-                          >{{ 'TOOLS.ALL_DISPOSITIONS' | translate }}</span
-                        >
-                      </div>
-                    </button>
-                  </md-card-content>
-                </md-card>
-                <md-card>
-                  <md-card-content>
-                    <md-input-container class="md-block" flex-gt-sm="">
-                      <label translate="TOOLS.SELECT_LEVEL"
-                        >Select a level</label
-                      >
-                      <md-select
-                        placeholder="{{ 'TOOLS.SELECT_LEVEL' | translate }}"
-                        ng-model="vm_dc.query.level"
-                        ng-change="vm_dc.getDispositions()"
-                      >
-                        <md-option ng-value="null"
-                          ><em translate="TOOLS.ALL">All</em></md-option
-                        >
-                        <md-option
-                          ng-value="key"
-                          ng-repeat="(key, value) in vm_dc.levels"
-                          >{{ value }}</md-option
-                        >
-                      </md-select>
-                    </md-input-container>
-                  </md-card-content>
-                </md-card>
-              </div>
-              <div
-                class="openchannelAccount-detail-form-container openchanneldispositions md-background-bg md-whiteframe-1dp"
-                flex="80"
-              >
-                <md-toolbar
-                  class="md-table-toolbar md-default"
-                  ng-hide="vm_dc.selectedOpenchannelAccountDispositions.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span
-                      class="md-subhead"
-                      translate="OPENCHANNEL.DISPOSITIONS"
-                      >Dispositions</span
-                    >
-                    <ms-search-bar
-                      on-search="vm_dc.query.filter = query"
-                      on-collapse="vm_dc.query.filter = undefined"
-                      debounce="300"
-                      direction="down"
-                    ></ms-search-bar>
-                    <div flex></div>
-                    <md-button
-                      ng-if="vm_dc.crudPermissions.canEdit"
-                      class="md-icon-button"
-                      ng-click="vm_dc.createOrEditDisposition($event)"
-                      aria-label="Add openchannel dispositions"
-                      translate
-                      translate-attr-label="OPENCHANNEL.ADD_DISPOSITION"
-                    >
-                      <md-icon md-font-icon="icon-plus"></md-icon>
-                    </md-button>
-                  </div>
-                </md-toolbar>
-                <md-toolbar
-                  class="md-table-toolbar md-accent"
-                  ng-show="vm_dc.selectedDispositions.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead"
-                      >{{vm_dc.selectedDispositions.length}}
-                      {{vm_dc.selectedDispositions.length > 1 ? 'items' :
-                      'item'}} selected</span
-                    >
-                    <div flex></div>
-                    <button
-                      class="md-icon-button"
-                      ng-csv="vm_dc.exportSelectedDispositions"
-                      csv-label="true"
-                      filename="openchannelAccounts.csv"
-                    >
-                      <md-icon md-font-icon="icon-file-excel"></md-icon>
-                    </button>
-                    <md-button
-                      ng-if="vm_dc.crudPermissions.canDelete"
-                      class="md-icon-button"
-                      ng-click="vm_dc.deleteSelectedDispositions($event)"
-                      aria-label="delete selected"
-                      translate
-                      translate-attr-label="OPENCHANNEL.DELETE_SELECTED"
-                    >
-                      <md-icon md-font-icon="icon-delete"></md-icon>
-                    </md-button>
-                  </div>
-                </md-toolbar>
-                <md-table-container>
-                  <table
-                    md-table
-                    md-row-select
-                    multiple
-                    ng-model="vm_dc.selectedDispositions"
-                    md-progress="vm_dc.promise"
-                  >
-                    <thead
-                      md-head
-                      md-order="vm_dc.query.sort"
-                      md-on-reorder="vm_dc.getDispositions"
-                    >
-                      <tr md-row>
-                        <th md-column md-order-by="id">
-                          {{ 'OPENCHANNEL.ID' | translate }}
-                        </th>
-                        <th md-column md-order-by="level">
-                          {{ 'TOOLS.LEVEL' | translate }}
-                        </th>
-                        <th md-column md-order-by="name">
-                          {{ 'OPENCHANNEL.NAME' | translate }}
-                        </th>
-                        <th md-column md-order-by="description">
-                          {{ 'OPENCHANNEL.DESCRIPTION' | translate }}
-                        </th>
-                        <th md-column width="10px"></th>
-                      </tr>
-                    </thead>
-                    <tbody md-body>
-                      <tr md-row ng-hide="vm_dc.dispositions.rows.length">
-                        <td md-cell colspan="5">
-                          <div layout="row" layout-align="center center">
-                            <span translate="OPENCHANNEL.NO_AVAILABLE_INFO"
-                              >No Available Info</span
-                            >
-                          </div>
-                        </td>
-                      </tr>
-                      <tr
-                        md-row
-                        md-select="disposition"
-                        md-select-id="id"
-                        ng-repeat="disposition in vm_dc.dispositions.rows"
-                      >
-                        <td
-                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                          md-cell
-                          class="id"
-                        >
-                          {{disposition.id}}
-                        </td>
-                        <td
-                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                          md-cell
-                          class="level"
-                        >
-                          {{ vm_dc.levels[disposition.level] }}
-                        </td>
-                        <td
-                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                          md-cell
-                          class="name"
-                        >
-                          {{disposition.name}}
-                        </td>
-                        <td
-                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                          md-cell
-                          class="description"
-                        >
-                          {{disposition.description}}
-                        </td>
-                        <td
-                          md-cell
-                          class="actions"
-                          ng-if="!vm_dc.crudPermissions.readOnly"
-                        >
-                          <md-menu>
-                            <md-button
-                              class="md-icon-button"
-                              aria-label="More"
-                              translate
-                              translate-attr-aria-label="OPENCHANNEL.MORE"
-                              ng-click="$mdOpenMenu($event)"
-                            >
-                              <md-icon
-                                md-font-icon="icon-dots-vertical"
-                              ></md-icon>
-                            </md-button>
-                            <md-menu-content width="3">
-                              <!-- SUBACTIONS -->
-                              <!-- ACTIONS -->
-                              <md-menu-item
-                                ng-if="vm_dc.crudPermissions.canEdit"
-                              >
-                                <md-button
-                                  ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                                  translate="TOOLS.EDIT_DISPOSITION"
-                                >
-                                  Edit Disposition
-                                </md-button>
-                              </md-menu-item>
-                              <!-- SUBACTIONS -->
-                              <!-- ACTIONS -->
-                              <md-menu-item
-                                ng-if="vm_dc.crudPermissions.canDelete"
-                              >
-                                <md-button
-                                  ng-click="vm_dc.deleteConfirm(disposition, $event)"
-                                  translate="TOOLS.DELETE_DISPOSITION"
-                                >
-                                  Delete Disposition
-                                </md-button>
-                              </md-menu-item>
-                            </md-menu-content>
-                          </md-menu>
-                        </td>
-                      </tr>
-                    </tbody>
-                  </table>
-                </md-table-container>
-                <md-table-pagination
-                  md-label="{page: '{{'OPENCHANNEL.PAGE' | translate}}:', rowsPerPage: '{{'OPENCHANNEL.ROWSPERPAGE' | translate}}:', of: '{{'OPENCHANNEL.OF' | translate}}'}"
-                  md-limit="vm_dc.query.limit"
-                  md-limit-options="[10, 15, 20, 50, 100, 250]"
-                  md-page="vm_dc.query.page"
-                  md-total="{{vm_dc.dispositions.count}}"
-                  md-on-paginate="vm_dc.getDispositions"
-                  md-page-select
-                >
-                </md-table-pagination>
-              </div>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="OPENCHANNEL.CANNEDANSWERS">CANNEDANSWERS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="openchannelAccount-detail-form-container openchannelcannedanswers md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="OpenchannelAccountOpenchannelCannedAnswersController as vm_dc"
-              ng-init="vm_dc.init(vm.openchannelAccount, vm.crudPermissions)"
-            >
-              <md-toolbar
-                class="md-table-toolbar md-default"
-                ng-hide="vm_dc.selectedOpenchannelAccountOpenchannelCannedAnswers.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span
-                    class="md-subhead"
-                    translate="OPENCHANNEL.OPENCHANNELCANNEDANSWERS"
-                    >OpenchannelCannedAnswers</span
-                  >
-                  <ms-search-bar
-                    on-search="vm_dc.query.filter = query"
-                    on-collapse="vm_dc.query.filter = undefined"
-                    debounce="300"
-                    direction="down"
-                  ></ms-search-bar>
-                  <div flex></div>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canEdit"
-                    class="md-icon-button"
-                    ng-click="vm_dc.createOrEditOpenchannelAccountOpenchannelCannedAnswer($event)"
-                    aria-label="add openchannelCannedAnswer"
-                    translate
-                    translate-attr-label="OPENCHANNEL.ADD_OPENCHANNELCANNEDANSWER"
-                  >
-                    <md-icon md-font-icon="icon-plus"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-toolbar
-                class="md-table-toolbar md-accent"
-                ng-show="vm_dc.selectedOpenchannelAccountOpenchannelCannedAnswers.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead"
-                    >{{vm_dc.selectedOpenchannelAccountOpenchannelCannedAnswers.length}}
-                    {{vm_dc.selectedOpenchannelAccountOpenchannelCannedAnswers.length
-                    > 1 ? 'items' : 'item'}} selected</span
-                  >
-                  <div flex></div>
-                  <button
-                    class="md-icon-button"
-                    ng-csv="vm_dc.exportSelectedOpenchannelAccountOpenchannelCannedAnswers"
-                    csv-label="true"
-                    filename="openchannelAccounts.csv"
-                  >
-                    <md-icon md-font-icon="icon-file-excel"></md-icon>
-                  </button>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canDelete"
-                    class="md-icon-button"
-                    ng-click="vm_dc.deleteSelectedOpenchannelAccountOpenchannelCannedAnswers($event)"
-                    aria-label="delete selected"
-                    translate
-                    translate-attr-label="OPENCHANNEL.DELETE_SELECTED"
-                  >
-                    <md-icon md-font-icon="icon-delete"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-table-container class="font-size-12">
-                <table
-                  md-table
-                  md-row-select
-                  multiple
-                  ng-model="vm_dc.selectedOpenchannelAccountOpenchannelCannedAnswers"
-                  md-progress="vm_dc.promise"
-                >
-                  <thead
-                    md-head
-                    md-order="vm_dc.query.sort"
-                    md-on-reorder="vm_dc.getOpenchannelAccountOpenchannelCannedAnswers"
-                  >
-                    <tr md-row>
-                      <th md-column md-order-by="id">
-                        {{ 'OPENCHANNEL.ID' | translate }}
-                      </th>
-                      <th md-column md-order-by="key">
-                        {{ 'OPENCHANNEL.KEY' | translate }}
-                      </th>
-                      <th md-column md-order-by="value">
-                        {{ 'OPENCHANNEL.VALUE' | translate }}
-                      </th>
-                      <th md-column md-order-by="description">
-                        {{ 'OPENCHANNEL.DESCRIPTION' | translate }}
-                      </th>
-                      <th md-column md-order-by="createdAt">
-                        {{ 'OPENCHANNEL.CREATED_AT' | translate }}
-                      </th>
-                      <th md-column width="10px"></th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr
-                      md-row
-                      md-select="openchannelCannedAnswer"
-                      md-select-id="id"
-                      ng-repeat="openchannelCannedAnswer in vm_dc.openchannelAccountOpenchannelCannedAnswers.rows"
-                    >
-                      <td
-                        ng-click="vm_dc.createOrEditOpenchannelAccountOpenchannelCannedAnswer($event, openchannelCannedAnswer)"
-                        md-cell
-                      >
-                        {{openchannelCannedAnswer.id}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditOpenchannelAccountOpenchannelCannedAnswer($event, openchannelCannedAnswer)"
-                        md-cell
-                      >
-                        {{openchannelCannedAnswer.key}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditOpenchannelAccountOpenchannelCannedAnswer($event, openchannelCannedAnswer)"
-                        md-cell
-                      >
-                        {{openchannelCannedAnswer.value}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditOpenchannelAccountOpenchannelCannedAnswer($event, openchannelCannedAnswer)"
-                        md-cell
-                      >
-                        {{openchannelCannedAnswer.description}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditOpenchannelAccountOpenchannelCannedAnswer($event, openchannelCannedAnswer)"
-                        md-cell
-                      >
-                        {{ openchannelCannedAnswer.createdAt | formatdate }}
-                      </td>
-                      <td
-                        md-cell
-                        class="actions"
-                        ng-if="!vm_dc.crudPermissions.readOnly"
-                      >
-                        <md-menu>
-                          <md-button
-                            class="md-icon-button"
-                            aria-label="More"
-                            translate
-                            translate-attr-aria-label="OPENCHANNEL.MORE"
-                            ng-click="$mdOpenMenu($event)"
-                          >
-                            <md-icon
-                              md-font-icon="icon-dots-vertical"
-                            ></md-icon>
-                          </md-button>
-
-                          <md-menu-content width="3">
-                            <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
-                              <md-button
-                                ng-click="vm_dc.createOrEditOpenchannelAccountOpenchannelCannedAnswer($event, openchannelCannedAnswer)"
-                                translate="OPENCHANNEL.EDIT_OPENCHANNELCANNEDANSWER"
-                              >
-                                Edit OpenchannelCannedAnswer
-                              </md-button>
-                            </md-menu-item>
-                            <md-menu-item
-                              ng-if="vm_dc.crudPermissions.canDelete"
-                            >
-                              <md-button
-                                ng-click="vm_dc.deleteConfirm(openchannelCannedAnswer, $event)"
-                                translate="OPENCHANNEL.DELETE_OPENCHANNELCANNEDANSWER"
-                              >
-                                Delete OpenchannelCannedAnswer
-                              </md-button>
-                            </md-menu-item>
-                          </md-menu-content>
-                        </md-menu>
-                      </td>
-                    </tr>
-                    <tr
-                      md-row
-                      ng-if="!vm_dc.openchannelAccountOpenchannelCannedAnswers.rows.length"
-                    >
-                      <td md-cell colspan="7">
-                        <div layout="row" layout-align="center center">
-                          <span
-                            class="text-boxed-light"
-                            translate="OPENCHANNEL.NO_OPENCHANNELCANNEDANSWER_AVAILABLE"
-                            >No openchannelcannedanswer available</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-              <md-table-pagination
-                md-label="{page: '{{'OPENCHANNEL.PAGE' | translate}}:', rowsPerPage: '{{'OPENCHANNEL.ROWSPERPAGE' | translate}}:', of: '{{'OPENCHANNEL.OF' | translate}}'}"
-                md-limit="vm_dc.query.limit"
-                md-limit-options="[10, 15, 20, 50, 100, 250]"
-                md-page="vm_dc.query.page"
-                md-total="{{vm_dc.openchannelAccountOpenchannelCannedAnswers.count}}"
-                md-on-paginate="vm_dc.getOpenchannelAccountOpenchannelCannedAnswers"
-                md-page-select
-              ></md-table-pagination>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="OPENCHANNEL.ACTIONS">ACTIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="openchannelAccount-detail-form-container actions md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="OpenchannelAccountActionsController as vm_ac"
-              ng-init="vm_ac.init(vm.openchannelAccount, vm.crudPermissions)"
-              class="content"
-              md-background-bg
-              layout="row"
-              layout-align="start start"
-            >
-              <!-- SIDENAV -->
-              <div
-                class="navigation-simple sidenav main-sidenav md-background-bg md-whiteframe-1dp"
-                ms-scroll
-                layout="column"
-                flex="20"
-                ng-if="vm_ac.crudPermissions.canEdit"
-              >
-                <!-- SIDENAV CONTENT -->
-                <md-list class="no-padding">
-                  <md-subheader class="md-no-sticky">
-                    <span translate="VOICE.APPLICATIONS_LIST">
-                      Applications List
-                    </span>
-                  </md-subheader>
-                </md-list>
-                <md-divider></md-divider>
-                <md-list ng-sortable="vm_ac.list">
-                  <md-list-item class="handle" ng-repeat="a in vm_ac.apps">
-                    <md-icon md-font-icon="{{a.icon}}" class="s16"></md-icon>
-                    <p
-                      class="text-truncate"
-                      translate="OPENCHANNEL.{{(a.alias || a.appType) | uppercase}}"
-                    >
-                      {{a.alias || a.appType}}
-                    </p>
-                  </md-list-item>
-                </md-list>
-                <!-- / SIDENAV CONTENT -->
-              </div>
-              <!-- / SIDENAV -->
-              <div flex></div>
-              <!-- MAIN -->
-              <div
-                class="main scrollable md-background-bg md-whiteframe-1dp"
-                ms-scroll
-                layout="column"
-                flex="{{vm_ac.crudPermissions.canEdit ? 75 : 100}}"
-              >
-                <md-toolbar
-                  class="md-table-toolbar md-default"
-                  ng-hide="vm_ac.selectedOpenchannelAccountApps.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead">Drag & Drop Routing</span>
-                    <div flex></div>
-                    <ms-search-bar
-                      on-search="vm_ac.query.filter = query"
-                      on-collapse="vm_ac.query.filter = undefined"
-                      debounce="300"
-                    ></ms-search-bar>
-                  </div>
-                </md-toolbar>
-                <md-toolbar
-                  class="md-table-toolbar md-accent"
-                  ng-show="vm_ac.selectedOpenchannelAccountApps.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead"
-                      >{{vm_ac.selectedOpenchannelAccountApps.length}}
-                      {{vm_ac.selectedOpenchannelAccountApps.length > 1 ?
-                      'items' : 'item'}} selected</span
-                    >
-                    <div flex></div>
-                    <md-button
-                      ng-if="vm_ac.crudPermissions.canDelete"
-                      class="md-icon-button"
-                      ng-click="vm_ac.deleteSelectedOpenchannelAccountApps($event)"
-                      aria-label="delete selected"
-                      translate
-                      translate-attr-label="OPENCHANNEL.DELETE_SELECTED"
-                    >
-                      <md-icon md-font-icon="icon-delete"></md-icon>
-                    </md-button>
-                  </div>
-                </md-toolbar>
-
-                <!-- QUEUES TABLE -->
-                <md-table-container>
-                  <table
-                    md-table
-                    md-row-select
-                    multiple
-                    ng-model="vm_ac.selectedOpenchannelAccountApps"
-                  >
-                    <thead md-head>
-                      <tr md-row>
-                        <th md-column width="10px"></th>
-                        <th md-column width="10px">
-                          <span translate="VOICE.PRIORITY">Priority</span>
-                        </th>
-                        <th md-column>
-                          <span>Type</span>
-                        </th>
-                        <th md-column>
-                          <span>Appdata</span>
-                        </th>
-                        <th md-column>
-                          <span>Interval</span>
-                        </th>
-                        <th md-column width="10px"></th>
-                        <th md-column width="10px"></th>
-                      </tr>
-                    </thead>
-                    <tbody md-body ng-sortable="vm_ac.applications">
-                      <tr
-                        md-row
-                        md-select="app"
-                        md-select-id="id"
-                        ng-repeat="app in vm_ac.openchannelAccountApps.rows | filter: vm_ac.query.filter"
-                      >
-                        <td md-cell>
-                          <md-icon
-                            md-font-icon="icon-drag-vertical"
-                            class="s16 handle"
-                          ></md-icon>
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editOpenchannelAccountApp($event, $index)"
-                        >
-                          <span>{{app.priority}}</span>
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editOpenchannelAccountApp($event, $index)"
-                        >
-                          {{app.app.toLowerCase() === 'agi' ? 'Cally-Square' :
-                          app.app | ucfirst}}<span
-                            ng-if="app.appType.toLowerCase() === 'custom'"
-                            >*</span
-                          >
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editOpenchannelAccountApp($event, $index)"
-                        >
-                          <span class="text-truncate" style="width: 200px"
-                            >{{app.appdata}}</span
-                          >
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editInterval($event, $index)"
-                        >
-                          {{app.IntervalId ? 'From List' : app.interval}}
-                        </td>
-                        <td md-cell>
-                          <md-button
-                            ng-click="vm_ac.editInterval($event, $index)"
-                            class="md-icon-button"
-                            aria-label="Interval"
-                          >
-                            <md-icon md-font-icon="icon-timer"></md-icon>
-                            <md-tooltip>
-                              {{app.IntervalId ? 'From List' : (app.interval ===
-                              '*,*,*,*' ? 'Always' : 'Custom')}}
-                            </md-tooltip>
-                          </md-button>
-                        </td>
-                        <td
-                          md-cell
-                          class="actions"
-                          ng-if="!vm_ac.crudPermissions.readOnly"
-                        >
-                          <md-menu>
-                            <md-button
-                              class="md-icon-button"
-                              aria-label="More"
-                              translate
-                              translate-attr-aria-label="VOICE.MORE"
-                              ng-click="$mdOpenMenu($event)"
-                            >
-                              <md-icon
-                                md-font-icon="icon-dots-vertical"
-                              ></md-icon>
-                            </md-button>
-
-                            <md-menu-content width="3">
-                              <md-menu-item
-                                ng-if="vm_ac.crudPermissions.canEdit"
-                              >
-                                <md-button
-                                  ng-click="vm_ac.editOpenchannelAccountApp($event, $index)"
-                                  translate="VOICE.EDIT_APP"
-                                >
-                                  Edit App
-                                </md-button>
-                              </md-menu-item>
-                              <md-menu-item
-                                ng-if="vm_ac.crudPermissions.canEdit"
-                              >
-                                <md-button
-                                  ng-click="vm_ac.editInterval($event, $index)"
-                                  translate="VOICE.EDIT_INTERVAL"
-                                >
-                                  Edit Interval
-                                </md-button>
-                              </md-menu-item>
-                              <md-menu-item
-                                ng-if="vm_ac.crudPermissions.canDelete"
-                              >
-                                <md-button
-                                  ng-click="vm_ac.deleteConfirm(app, $index, $event)"
-                                  translate="VOICE.DELETE_APP"
-                                >
-                                  Delete App
-                                </md-button>
-                              </md-menu-item>
-                            </md-menu-content>
-                          </md-menu>
-                        </td>
-                      </tr>
-                      <tr
-                        md-row
-                        ng-hide="vm_ac.openchannelAccountApps.rows.length"
-                      >
-                        <td md-cell colspan="7">
-                          <span
-                            class="text-boxed-light"
-                            translate="VOICE.NO_APPS_AVAILABLE"
-                            >No apps available</span
-                          >
-                        </td>
-                      </tr>
-                    </tbody>
-                  </table>
-                </md-table-container>
-                <!-- / QUEUES TABLE -->
-
-                <!-- NO RESULTS -->
-
-                <!-- / NO RESULTS -->
-              </div>
-              <!-- / MAIN -->
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="OPENCHANNEL.INTERACTIONS">INTERACTIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="openchannelAccount-detail-form-container interactions md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="OpenchannelAccountInteractionsController as vm_dc"
-              ng-init="vm_dc.init(vm.openchannelAccount, vm.crudPermissions)"
-            >
-              <md-toolbar
-                class="md-table-toolbar md-default"
-                ng-hide="vm_dc.selectedOpenchannelAccountInteractions.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead" translate="OPENCHANNEL.INTERACTIONS"
-                    >Interactions</span
-                  >
-                  <ms-search-bar
-                    on-search="vm_dc.query.filter = query"
-                    on-collapse="vm_dc.query.filter = undefined"
-                    debounce="300"
-                    direction="down"
-                  ></ms-search-bar>
-                  <div flex></div>
-                  <ms-quick-filter
-                    filters="vm_dc.quickFilters"
-                    query="vm_dc.query"
-                    search="vm_dc.getOpenchannelAccountInteractions()"
-                  ></ms-quick-filter>
-                  <div layout="column">
-                    <md-button
-                      class="md-icon-button advanced-search"
-                      ng-class="{ 'md-fab md-mini md-accent-bg': vm_dc.query.search }"
-                      aria-label="Filter"
-                      translate
-                      translate-attr-aria-label="DASHBOARDS.FILTER"
-                      ng-click="vm_dc.openAdvancedSearch()"
-                    >
-                      <md-icon
-                        md-font-icon="{{ vm_dc.query.search ? 'icon-filter' : 'icon-filter-outline' }}"
-                        ng-class="{ 'blink': vm_dc.query.search }"
-                      ></md-icon>
-                    </md-button>
-                  </div>
-                  <md-button
-                    class="md-icon-button"
-                    ng-click="vm_dc.getOpenchannelAccountInteractions()"
-                    aria-label="refresh Interactions"
-                    translate
-                    translate-attr-label="OPENCHANNEL.REFRESH_INTERACTIONS"
-                  >
-                    <md-icon md-font-icon="icon-refresh"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-toolbar
-                class="md-table-toolbar md-accent"
-                ng-show="vm_dc.selectedOpenchannelAccountInteractions.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead"
-                    >{{vm_dc.selectedOpenchannelAccountInteractions.length}}
-                    {{vm_dc.selectedOpenchannelAccountInteractions.length > 1 ?
-                    'items' : 'item'}} selected</span
-                  >
-                  <div flex></div>
-                  <button
-                    class="md-icon-button"
-                    ng-csv="vm_dc.exportSelectedOpenchannelAccountInteractions"
-                    csv-label="true"
-                    filename="openchannelAccounts.csv"
-                  >
-                    <md-icon md-font-icon="icon-file-excel"></md-icon>
-                  </button>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canDelete"
-                    class="md-icon-button"
-                    ng-click="vm_dc.deleteSelectedOpenchannelAccountInteractions($event)"
-                    aria-label="delete selected"
-                    translate
-                    translate-attr-label="OPENCHANNEL.DELETE_SELECTED"
-                  >
-                    <md-icon md-font-icon="icon-delete"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-table-container class="font-size-12">
-                <table
-                  md-table
-                  md-row-select
-                  multiple
-                  ng-model="vm_dc.selectedOpenchannelAccountInteractions"
-                  md-progress="vm_dc.promise"
-                >
-                  <thead
-                    md-head
-                    md-order="vm_dc.query.sort"
-                    md-on-reorder="vm_dc.getOpenchannelAccountInteractions"
-                  >
-                    <tr md-row>
-                      <th md-column md-order-by="id">
-                        {{ 'OPENCHANNEL.ID' | translate }}
-                      </th>
-                      <th md-column class="no-padding">
-                        <md-icon md-font-icon="icon-eye" class="s16"></md-icon>
-                      </th>
-                      <th md-column class="no-padding"></th>
-                      <th md-column class="no-padding"></th>
-                      <th md-column>{{ 'OPENCHANNEL.CONTACT' | translate }}</th>
-                      <th md-column md-order-by="createdAt">
-                        {{ 'OPENCHANNEL.STARTEDAT' | translate }}
-                      </th>
-                      <th md-column md-order-by="lastMsgAt">
-                        {{ 'OPENCHANNEL.LASTMESSAGE' | translate }}
-                      </th>
-                      <th md-column md-order-by="closed">
-                        {{ 'OPENCHANNEL.STATUS' | translate }}
-                      </th>
-                      <th md-column>{{ 'OPENCHANNEL.AGENT' | translate }}</th>
-                      <th md-column md-order-by="tag">
-                        {{ 'OPENCHANNEL.TAGS' | translate }}
-                      </th>
-                      <th md-column width="10px"></th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr
-                      md-row
-                      md-select="interaction"
-                      md-select-id="id"
-                      ng-repeat="interaction in vm_dc.openchannelAccountInteractions.rows"
-                      ng-class="{'text-bold text-italic': interaction.unreadMessages > 0}"
-                    >
-                      <td md-cell>{{interaction.id}}</td>
-                      <td md-cell class="no-padding">
-                        <div
-                          ng-if="!interaction.closed && interaction.Users.length"
-                        >
-                          <md-icon
-                            md-font-icon="icon-eye"
-                            class="s16"
-                          ></md-icon>
-                          <md-tooltip>
-                            <span ng-repeat="user in interaction.Users"
-                              >{{ user.fullname | translate }}
-                              <span ng-if="!$last">, </span>
-                            </span>
-                          </md-tooltip>
-                        </div>
-                      </td>
-                      <td md-cell class="no-padding">
-                        <div
-                          ng-if="interaction.unreadMessages > 0"
-                          layout="row"
-                          layout-align="start center"
-                        >
-                          <span
-                            class="badge white-fg md-primary-bg"
-                            layout-margin
-                            >{{ interaction.unreadMessages}}</span
-                          >
-                        </div>
-                      </td>
-                      <td md-cell class="no-padding">
-                        <div ng-if="interaction.attach">
-                          <md-icon
-                            md-font-icon="icon-paperclip"
-                            class="s16"
-                          ></md-icon>
-                        </div>
-                      </td>
-                      <td md-cell>
-                        <div layout="column" layout-align="start start">
-                          <span
-                            class="font-size-12 text-truncate contact-text"
-                            ng-class="{'margin-bottom-0' : interaction.contactInfo}"
-                            layout-margin
-                            >{{ interaction.contactName }}</span
-                          >
-                          <span
-                            ng-if="interaction.contactInfo"
-                            class="font-size-12 text-truncate contact-text margin-top-0"
-                            layout-margin
-                            >{{ interaction.contactInfo }}</span
-                          >
-                        </div>
-                      </td>
-                      <td md-cell>{{ interaction.createdAt | formatdate }}</td>
-                      <td md-cell>
-                        <div layout="row">
-                          <span>
-                            <md-icon
-                              md-font-icon="{{interaction.lastMsgDirection == 'in' ? 'icon-arrow-down-bold blue-grey-800-fg' : 'icon-arrow-up-bold blue-grey-300-fg'}}"
-                            ></md-icon>
-                          </span>
-                          <div layout="column" layout-align="center center">
-                            <span class="text-truncate"
-                              >{{ interaction.lastMsgAt | formatdate }}</span
-                            >
-                          </div>
-                        </div>
-                      </td>
-                      <td md-cell>
-                        <span ng-if="interaction.closed === 0" class="green-fg">
-                          {{ 'OPENCHANNEL.OPENED' | translate }}
-                          <span ng-if="interaction.substatus">
-                            - {{ interaction.substatus }}
-                          </span>
-                        </span>
-                        <span ng-if="interaction.closed === 1" class="red-fg">
-                          {{ 'OPENCHANNEL.CLOSED' | translate }}
-                          <span ng-if="interaction.disposition">
-                            - {{ interaction.thirdDisposition ||
-                            interaction.secondDisposition ||
-                            interaction.disposition }}
-                          </span>
-                          <md-tooltip class="multiline">
-                            <div layout="column">
-                              <div layout="column">
-                                <span
-                                  >{{ 'DASHBOARDS.CLOSED_AT' |
-                                  translate}}:</span
-                                >
-                                <span class="text-bold"
-                                  >{{ interaction.closedAt | formatdate }}</span
-                                >
-                              </div>
-                              <div
-                                ng-if="interaction.disposition"
-                                layout="column"
-                              >
-                                <span
-                                  >{{ 'DASHBOARDS.DISPOSITION' |
-                                  translate}}:</span
-                                >
-                                <span class="text-bold"
-                                  >{{ interaction.disposition }}</span
-                                >
-                              </div>
-                              <div
-                                ng-if="interaction.secondDisposition"
-                                layout="column"
-                              >
-                                <span
-                                  >{{ 'DASHBOARDS.SECOND_LEVEL_DISPOSITION' |
-                                  translate}}:</span
-                                >
-                                <span class="text-bold"
-                                  >{{ interaction.secondDisposition }}</span
-                                >
-                              </div>
-                              <div
-                                ng-if="interaction.thirdDisposition"
-                                layout="column"
-                              >
-                                <span
-                                  >{{ 'DASHBOARDS.THIRD_LEVEL_DISPOSITION' |
-                                  translate}}:</span
-                                >
-                                <span class="text-bold"
-                                  >{{ interaction.thirdDisposition }}</span
-                                >
-                              </div>
-                            </div>
-                          </md-tooltip>
-                        </span>
-                      </td>
-
-                      <td md-cell>{{interaction.Owner.name}}</td>
-                      <td md-cell>
-                        <div ng-if="interaction.Tags.length">
-                          <md-tooltip md-direction="left" layout="row">
-                            <span ng-repeat="tag in interaction.Tags"
-                              >{{tag.name}}<span ng-if="!$last">, </span></span
-                            >
-                          </md-tooltip>
-                          <md-icon
-                            md-font-icon="icon-tag"
-                            ng-style="{'color': interaction.Tags.length == 1 && interaction.Tags[0].color }"
-                          >
-                          </md-icon>
-                        </div>
-                      </td>
-                      <td md-cell class="actions">
-                        <md-menu>
-                          <md-button
-                            class="md-icon-button"
-                            aria-label="More"
-                            translate
-                            translate-attr-aria-label="OPENCHANNEL.MORE"
-                            ng-click="$mdOpenMenu($event)"
-                          >
-                            <md-icon
-                              md-font-icon="icon-dots-vertical"
-                            ></md-icon>
-                          </md-button>
-
-                          <md-menu-content width="3">
-                            <md-menu-item>
-                              <md-button
-                                ng-click="vm_dc.spyopenchannelInteraction($event, interaction)"
-                                translate="OPENCHANNEL.SPYINTERACTION"
-                              >
-                                Spy Interaction
-                              </md-button>
-                            </md-menu-item>
-                            <md-menu-item>
-                              <md-button
-                                class="md-primary"
-                                ng-click="vm_dc.openchannelInteractionDownload(interaction, $event, true)"
-                                translate="OPENCHANNEL.DOWNLOAD_WITH_ATTACHMENTS"
-                              >
-                                Download with attachments
-                              </md-button>
-                            </md-menu-item>
-                            <md-menu-item>
-                              <md-button
-                                class="md-primary"
-                                ng-click="vm_dc.openchannelInteractionDownload(interaction, $event)"
-                                translate="OPENCHANNEL.DOWNLOAD_WITHOUT_ATTACHMENTS"
-                              >
-                                Download without attachments
-                              </md-button>
-                            </md-menu-item>
-                            <md-menu-item
-                              ng-if="vm_dc.crudPermissions.canDelete"
-                            >
-                              <md-button
-                                ng-click="vm_dc.deleteConfirm(interaction, $event)"
-                                translate="OPENCHANNEL.DELETE_INTERACTION"
-                              >
-                                Delete Interaction
-                              </md-button>
-                            </md-menu-item>
-                          </md-menu-content>
-                        </md-menu>
-                      </td>
-                    </tr>
-                    <tr
-                      md-row
-                      ng-if="!vm_dc.openchannelAccountInteractions.rows.length"
-                    >
-                      <td md-cell colspan="12">
-                        <div layout="row" layout-align="center center">
-                          <span
-                            class="text-boxed-light"
-                            translate="OPENCHANNEL.NO_INTERACTION_AVAILABLE"
-                            >No interaction available</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-              <md-table-pagination
-                md-label="{page: '{{'OPENCHANNEL.PAGE' | translate}}:', rowsPerPage: '{{'OPENCHANNEL.ROWSPERPAGE' | translate}}:', of: '{{'OPENCHANNEL.OF' | translate}}'}"
-                md-limit="vm_dc.query.limit"
-                md-limit-options="[10, 15, 20, 50, 100, 250]"
-                md-page="vm_dc.query.page"
-                md-total="{{vm_dc.openchannelAccountInteractions.count}}"
-                md-on-paginate="vm_dc.getOpenchannelAccountInteractions"
-                md-page-select
-              ></md-table-pagination>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/view.html/view.html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/view.html/view.html
new file mode 100644
index 0000000..f4f126a
--- /dev/null
+++ b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/edit/view.html/view.html
@@ -0,0 +1,1701 @@
+<div
+  id="openchannel-openchannelAccount"
+  class="page-layout simple tabbed"
+  layout="column"
+>
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-openchannelAccounts-button md-icon-button"
+        aria-label="Go to openchannelAccounts"
+        ng-click="vm.gotoOpenchannelAccounts()"
+        translate
+        translate-attr-aria-label="OPENCHANNEL.GO_TO_OPENCHANNELACCOUNTS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="openchannelAccount-image" hide-xs>
+          <img ng-src="assets/images/business/openchannelAccounts.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.openchannelAccount.id}}
+            <span ng-if="vm.openchannelAccount.name"
+              >{{vm.openchannelAccount.name}}</span
+            >
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="OPENCHANNEL.CREATED_AT"></span>
+            <span>{{vm.openchannelAccount.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.agentadddialog(vm.openchannelAccount, $event)"
+        class="md-fab md-warn md-icon-button"
+        aria-label="agentadd"
+      >
+        <md-tooltip
+          ><span translate="OPENCHANNEL.AGENTADD_OPENCHANNELACCOUNT"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
+      </md-button>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveOpenchannelAccount()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (notificationForm.$invalid) || (transferForm.$invalid) || (proxyForm.$invalid) || (dispositionForm.$invalid) || (openchannelDispositionsForm.$invalid) || (openchannelCannedAnswersForm.$invalid) || (actionsForm.$invalid) || (interactionsForm.$invalid)"
+        translate="OPENCHANNEL.SAVE"
+        translate-attr-aria-label="OPENCHANNEL.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="OPENCHANNEL.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="openchannelAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="OPENCHANNEL.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="OPENCHANNEL.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.openchannelAccount.name"
+                  ng-required="true"
+                  autofocus
+                  disabled
+                />
+
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="OPENCHANNEL.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="OPENCHANNEL.KEY">key</label>
+                <input
+                  type="text"
+                  name="key"
+                  ng-model="vm.openchannelAccount.key"
+                  md-maxlength="5"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['key'].$error"
+                  ng-show="generalForm['key'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="OPENCHANNEL.ERRORS.KEY_REQUIRED"
+                      >key field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="OPENCHANNEL.ERRORS.KEY_MAX_LENGTH"
+                      translate-values="{max: 5}"
+                      >key must have a maximum length equal to 5</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="OPENCHANNEL.REPLYURI">replyUri</label>
+                <input
+                  type="url"
+                  name="replyUri"
+                  ng-model="vm.openchannelAccount.replyUri"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="OPENCHANNEL.HELP.REPLYURI"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['replyUri'].$error"
+                  ng-show="generalForm['replyUri'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="OPENCHANNEL.ERRORS.REPLYURI_REQUIRED"
+                      >replyUri field is required</span
+                    >
+                  </div>
+                  <div ng-message="url">
+                    <span translate="OPENCHANNEL.ERRORS.REPLYURI_MUST_VALID_URL"
+                      >replyUri must be a valid url http://www.xcally.com</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="OPENCHANNEL.LIST">List</label>
+                <md-select
+                  name="ListId"
+                  ng-model="vm.openchannelAccount.ListId"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="ListId.id"
+                    ng-repeat="ListId in vm.lists"
+                    ng-disabled="ListId.canSelect === false"
+                    >{{ ListId.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span translate="OPENCHANNEL.HELP.LIST"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['ListId'].$error"
+                  ng-show="generalForm['ListId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="OPENCHANNEL.ERRORS.LIST_REQUIRED"
+                      >List field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="OPENCHANNEL.WAITFORTHEASSIGNEDAGENT"
+                  >WaitForTheAssignedAgent</label
+                >
+                <input
+                  type="number"
+                  name="waitForTheAssignedAgent"
+                  ng-model="vm.openchannelAccount.waitForTheAssignedAgent"
+                  min="1"
+                  max="2147483"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['waitForTheAssignedAgent'].$error"
+                  ng-show="generalForm['waitForTheAssignedAgent'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="OPENCHANNEL.ERRORS.WAITFORTHEASSIGNEDAGENT_REQUIRED"
+                      >WaitForTheAssignedAgent field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="OPENCHANNEL.ERRORS.WAITFORTHEASSIGNEDAGENT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >WaitForTheAssignedAgent must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="OPENCHANNEL.ERRORS.WAITFORTHEASSIGNEDAGENT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >WaitForTheAssignedAgent must be a valid greater or equal
+                      than</span
+                    >
+                    <span>2147483</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="OPENCHANNEL.MAPKEY">MapKey</label>
+                <md-select
+                  name="mapKey"
+                  ng-model="vm.openchannelAccount.mapKey"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="''">None</md-option>
+                  <md-optgroup label="standard">
+                    <md-option
+                      ng-value="mapKey.columnName"
+                      ng-repeat="mapKey in vm.fields"
+                      ng-if="!mapKey.columnName.toString().startsWith('cf_')"
+                      ng-disabled="mapKey.canSelect === false"
+                      >{{ mapKey.displayName }}</md-option
+                    >
+                  </md-optgroup>
+                  <md-optgroup label="custom">
+                    <md-option
+                      ng-value="mapKey.columnName"
+                      ng-repeat="mapKey in vm.fields"
+                      ng-if="mapKey.columnName.toString().startsWith('cf_')"
+                      ng-disabled="mapKey.canSelect === false"
+                      >{{ mapKey.displayName }}</md-option
+                    >
+                  </md-optgroup>
+                </md-select>
+                <div
+                  ng-messages="generalForm['mapKey'].$error"
+                  ng-show="generalForm['mapKey'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="OPENCHANNEL.ERRORS.MAPKEY_REQUIRED"
+                      >MapKey field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="OPENCHANNEL.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.openchannelAccount.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="OPENCHANNEL.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="OPENCHANNEL.RECEIVEURI">receiveUri</label>
+                <div layout="row" layout-align="center center">
+                  <button
+                    class="md-button md-fab md-mini md-primary"
+                    ngclipboard
+                    data-clipboard-target="#copytoclipboard-receiveUri"
+                    ngclipboard-success="vm.alert({title: 'copied to clipboard', msg: e.text});"
+                    ngclipboard-error="vm.alert({title: 'error', msg: 'copy to clipboard failed'});"
+                  >
+                    <md-icon md-font-icon="icon-clipboard-text"></md-icon>
+                  </button>
+                  <input
+                    class="md-input"
+                    type="text"
+                    id="copytoclipboard-receiveUri"
+                    name="receiveUri"
+                    ng-value="vm.location + '/api/openchannel/accounts/' + vm.openchannelAccount.id + '/notify'"
+                    ng-readonly="true"
+                  />
+                </div>
+                <div class="hint">
+                  <span translate="OPENCHANNEL.HELP.RECEIVEURI"></span>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="openchannelAccount-detail-form-container notification md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div
+                class="h2 secondary-text"
+                translate="OPENCHANNEL.NOTIFICATION"
+              >
+                NOTIFICATION
+              </div>
+            </div>
+            <form name="notificationForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.openchannelAccount.notificationSound"
+                  aria-label="notificationSound"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="OPENCHANNEL.NOTIFICATIONSOUND"
+                    >notificationSound</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.openchannelAccount.notificationShake"
+                  aria-label="notificationShake"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="OPENCHANNEL.NOTIFICATIONSHAKE"
+                    >notificationShake</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <div class="md-block">
+                <label
+                  class="md-caption grey-fg"
+                  translate="OPENCHANNEL.NOTIFICATIONTEMPLATE"
+                  >notificationTemplate</label
+                >
+                <textarea
+                  aria-label="notificationTemplate notificationTemplate"
+                  ckeditor="{ skin: 'office2013', language: 'en', allowedContent: true, extraPlugins: 'font,colorbutton,autoembed,autocorrect,googlethisterm,pastebase64', toolbarGroups: [{ name: 'styles', groups: ['styles'] }, { name: 'clipboard', groups: ['undo'] }, { name: 'colors', groups: ['colors'] }, { name: 'basicstyles', groups: ['basicstyles'] }, { name: 'paragraph', groups: ['list', 'indent', 'align'] }, { name: 'mode' }], autocorrect_enabled: true, disableNativeSpellChecker: false, fontSize_sizes: '8/8pt;9/9pt;10/10pt;11/11pt;12/12pt;14/14pt;16/16pt;18/18pt;20/20pt;22/22pt;24/24pt;26/26pt;28/28pt;36/36pt;48/48pt;72/72pt',  removePlugins: 'magicline' }"
+                  ng-model="vm.openchannelAccount.notificationTemplate"
+                ></textarea>
+              </div>
+            </form>
+          </div>
+          <div
+            class="openchannelAccount-detail-form-container transfer md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="OPENCHANNEL.TRANSFER">
+                TRANSFER
+              </div>
+            </div>
+            <form name="transferForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.openchannelAccount.queueTransfer"
+                  aria-label="queueTransfer"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="OPENCHANNEL.QUEUETRANSFER"
+                    >queueTransfer</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.openchannelAccount.queueTransfer == true"
+                class="md-block"
+              >
+                <label translate="OPENCHANNEL.QUEUETRANSFERTIMEOUT"
+                  >queueTransferTimeout</label
+                >
+                <input
+                  type="number"
+                  name="queueTransferTimeout"
+                  ng-model="vm.openchannelAccount.queueTransferTimeout"
+                  min="1"
+                  max="2147483"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="transferForm['queueTransferTimeout'].$error"
+                  ng-show="transferForm['queueTransferTimeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="OPENCHANNEL.ERRORS.QUEUETRANSFERTIMEOUT_REQUIRED"
+                      >queueTransferTimeout field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="OPENCHANNEL.ERRORS.QUEUETRANSFERTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >queueTransferTimeout must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="OPENCHANNEL.ERRORS.QUEUETRANSFERTIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >queueTransferTimeout must be a valid greater or equal
+                      than</span
+                    >
+                    <span>2147483</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.openchannelAccount.agentTransfer"
+                  aria-label="agentTransfer"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="OPENCHANNEL.AGENTTRANSFER"
+                    >agentTransfer</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.openchannelAccount.agentTransfer == true"
+                class="md-block"
+              >
+                <label translate="OPENCHANNEL.AGENTTRANSFERTIMEOUT"
+                  >agentTransferTimeout</label
+                >
+                <input
+                  type="number"
+                  name="agentTransferTimeout"
+                  ng-model="vm.openchannelAccount.agentTransferTimeout"
+                  min="1"
+                  max="2147483"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="transferForm['agentTransferTimeout'].$error"
+                  ng-show="transferForm['agentTransferTimeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="OPENCHANNEL.ERRORS.AGENTTRANSFERTIMEOUT_REQUIRED"
+                      >agentTransferTimeout field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="OPENCHANNEL.ERRORS.AGENTTRANSFERTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >agentTransferTimeout must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="OPENCHANNEL.ERRORS.AGENTTRANSFERTIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >agentTransferTimeout must be a valid greater or equal
+                      than</span
+                    >
+                    <span>2147483</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="OPENCHANNEL.ADVANCED">ADVANCED</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="openchannelAccount-detail-form-container proxy md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="OPENCHANNEL.PROXY">
+                PROXY
+              </div>
+            </div>
+            <form name="proxyForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="OPENCHANNEL.TOKEN">token</label>
+                <input
+                  type="text"
+                  name="token"
+                  ng-model="vm.openchannelAccount.token"
+                  autofocus
+                  disabled
+                />
+
+                <div class="hint">
+                  <span translate="OPENCHANNEL.HELP.TOKEN"></span>
+                </div>
+                <div
+                  ng-messages="proxyForm['token'].$error"
+                  ng-show="proxyForm['token'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="OPENCHANNEL.ERRORS.TOKEN_REQUIRED"
+                      >token field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="openchannelAccount-detail-form-container disposition md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div
+                class="h2 secondary-text"
+                translate="OPENCHANNEL.DISPOSITION"
+              >
+                DISPOSITION
+              </div>
+            </div>
+            <form name="dispositionForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.openchannelAccount.mandatoryDisposition"
+                  aria-label="MandatoryDisposition"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="OPENCHANNEL.MANDATORYDISPOSITION"
+                    >MandatoryDisposition</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.openchannelAccount.mandatoryDisposition"
+                class="md-block"
+              >
+                <label translate="OPENCHANNEL.MANDATORYDISPOSITIONPAUSEID"
+                  >MandatoryDispositionPauseId</label
+                >
+                <md-select
+                  name="mandatoryDispositionPauseId"
+                  ng-model="vm.openchannelAccount.mandatoryDispositionPauseId"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="mandatoryDispositionPauseId.id"
+                    ng-repeat="mandatoryDispositionPauseId in vm.pauses"
+                    ng-disabled="mandatoryDispositionPauseId.canSelect === false"
+                    >{{ mandatoryDispositionPauseId.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span
+                    translate="OPENCHANNEL.HELP.MANDATORYDISPOSITIONPAUSEID"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="dispositionForm['mandatoryDispositionPauseId'].$error"
+                  ng-show="dispositionForm['mandatoryDispositionPauseId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="OPENCHANNEL.ERRORS.MANDATORYDISPOSITIONPAUSEID_REQUIRED"
+                      >MandatoryDispositionPauseId field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="OPENCHANNEL.DISPOSITIONS">DISPOSITIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            ng-controller="OpenchannelAccountDispositionsController as vm_dc"
+            ng-init="vm_dc.init(vm.openchannelAccount, vm.crudPermissions)"
+          >
+            <div layout="row">
+              <div class="column" flex="20">
+                <md-card class="mt-0">
+                  <md-card-content>
+                    <button
+                      layout-align="center center"
+                      md-mini-fab
+                      ng-click="vm_dc.query.level = null; vm_dc.getDispositions()"
+                    >
+                      <div layout="row" layout-align="start center">
+                        <md-icon md-font-icon="icon-refresh"></md-icon>
+                        <span class="ph-5"
+                          >{{ 'TOOLS.ALL_DISPOSITIONS' | translate }}</span
+                        >
+                      </div>
+                    </button>
+                  </md-card-content>
+                </md-card>
+                <md-card>
+                  <md-card-content>
+                    <md-input-container class="md-block" flex-gt-sm="">
+                      <label translate="TOOLS.SELECT_LEVEL"
+                        >Select a level</label
+                      >
+                      <md-select
+                        placeholder="{{ 'TOOLS.SELECT_LEVEL' | translate }}"
+                        ng-model="vm_dc.query.level"
+                        ng-change="vm_dc.getDispositions()"
+                      >
+                        <md-option ng-value="null"
+                          ><em translate="TOOLS.ALL">All</em></md-option
+                        >
+                        <md-option
+                          ng-value="key"
+                          ng-repeat="(key, value) in vm_dc.levels"
+                          >{{ value }}</md-option
+                        >
+                      </md-select>
+                    </md-input-container>
+                  </md-card-content>
+                </md-card>
+              </div>
+              <div
+                class="openchannelAccount-detail-form-container openchanneldispositions md-background-bg md-whiteframe-1dp"
+                flex="80"
+              >
+                <md-toolbar
+                  class="md-table-toolbar md-default"
+                  ng-hide="vm_dc.selectedOpenchannelAccountDispositions.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span
+                      class="md-subhead"
+                      translate="OPENCHANNEL.DISPOSITIONS"
+                      >Dispositions</span
+                    >
+                    <ms-search-bar
+                      on-search="vm_dc.query.filter = query"
+                      on-collapse="vm_dc.query.filter = undefined"
+                      debounce="300"
+                      direction="down"
+                    ></ms-search-bar>
+                    <div flex></div>
+                    <md-button
+                      ng-if="vm_dc.crudPermissions.canEdit"
+                      class="md-icon-button"
+                      ng-click="vm_dc.createOrEditDisposition($event)"
+                      aria-label="Add openchannel dispositions"
+                      translate
+                      translate-attr-label="OPENCHANNEL.ADD_DISPOSITION"
+                    >
+                      <md-icon md-font-icon="icon-plus"></md-icon>
+                    </md-button>
+                  </div>
+                </md-toolbar>
+                <md-toolbar
+                  class="md-table-toolbar md-accent"
+                  ng-show="vm_dc.selectedDispositions.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead"
+                      >{{vm_dc.selectedDispositions.length}}
+                      {{vm_dc.selectedDispositions.length > 1 ? 'items' :
+                      'item'}} selected</span
+                    >
+                    <div flex></div>
+                    <button
+                      class="md-icon-button"
+                      ng-csv="vm_dc.exportSelectedDispositions"
+                      csv-label="true"
+                      filename="openchannelAccounts.csv"
+                    >
+                      <md-icon md-font-icon="icon-file-excel"></md-icon>
+                    </button>
+                    <md-button
+                      ng-if="vm_dc.crudPermissions.canDelete"
+                      class="md-icon-button"
+                      ng-click="vm_dc.deleteSelectedDispositions($event)"
+                      aria-label="delete selected"
+                      translate
+                      translate-attr-label="OPENCHANNEL.DELETE_SELECTED"
+                    >
+                      <md-icon md-font-icon="icon-delete"></md-icon>
+                    </md-button>
+                  </div>
+                </md-toolbar>
+                <md-table-container>
+                  <table
+                    md-table
+                    md-row-select
+                    multiple
+                    ng-model="vm_dc.selectedDispositions"
+                    md-progress="vm_dc.promise"
+                  >
+                    <thead
+                      md-head
+                      md-order="vm_dc.query.sort"
+                      md-on-reorder="vm_dc.getDispositions"
+                    >
+                      <tr md-row>
+                        <th md-column md-order-by="id">
+                          {{ 'OPENCHANNEL.ID' | translate }}
+                        </th>
+                        <th md-column md-order-by="level">
+                          {{ 'TOOLS.LEVEL' | translate }}
+                        </th>
+                        <th md-column md-order-by="name">
+                          {{ 'OPENCHANNEL.NAME' | translate }}
+                        </th>
+                        <th md-column md-order-by="description">
+                          {{ 'OPENCHANNEL.DESCRIPTION' | translate }}
+                        </th>
+                        <th md-column width="10px"></th>
+                      </tr>
+                    </thead>
+                    <tbody md-body>
+                      <tr md-row ng-hide="vm_dc.dispositions.rows.length">
+                        <td md-cell colspan="5">
+                          <div layout="row" layout-align="center center">
+                            <span translate="OPENCHANNEL.NO_AVAILABLE_INFO"
+                              >No Available Info</span
+                            >
+                          </div>
+                        </td>
+                      </tr>
+                      <tr
+                        md-row
+                        md-select="disposition"
+                        md-select-id="id"
+                        ng-repeat="disposition in vm_dc.dispositions.rows"
+                      >
+                        <td
+                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                          md-cell
+                          class="id"
+                        >
+                          {{disposition.id}}
+                        </td>
+                        <td
+                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                          md-cell
+                          class="level"
+                        >
+                          {{ vm_dc.levels[disposition.level] }}
+                        </td>
+                        <td
+                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                          md-cell
+                          class="name"
+                        >
+                          {{disposition.name}}
+                        </td>
+                        <td
+                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                          md-cell
+                          class="description"
+                        >
+                          {{disposition.description}}
+                        </td>
+                        <td
+                          md-cell
+                          class="actions"
+                          ng-if="!vm_dc.crudPermissions.readOnly"
+                        >
+                          <md-menu>
+                            <md-button
+                              class="md-icon-button"
+                              aria-label="More"
+                              translate
+                              translate-attr-aria-label="OPENCHANNEL.MORE"
+                              ng-click="$mdOpenMenu($event)"
+                            >
+                              <md-icon
+                                md-font-icon="icon-dots-vertical"
+                              ></md-icon>
+                            </md-button>
+                            <md-menu-content width="3">
+                              <!-- SUBACTIONS -->
+                              <!-- ACTIONS -->
+                              <md-menu-item
+                                ng-if="vm_dc.crudPermissions.canEdit"
+                              >
+                                <md-button
+                                  ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                                  translate="TOOLS.EDIT_DISPOSITION"
+                                >
+                                  Edit Disposition
+                                </md-button>
+                              </md-menu-item>
+                              <!-- SUBACTIONS -->
+                              <!-- ACTIONS -->
+                              <md-menu-item
+                                ng-if="vm_dc.crudPermissions.canDelete"
+                              >
+                                <md-button
+                                  ng-click="vm_dc.deleteConfirm(disposition, $event)"
+                                  translate="TOOLS.DELETE_DISPOSITION"
+                                >
+                                  Delete Disposition
+                                </md-button>
+                              </md-menu-item>
+                            </md-menu-content>
+                          </md-menu>
+                        </td>
+                      </tr>
+                    </tbody>
+                  </table>
+                </md-table-container>
+                <md-table-pagination
+                  md-label="{page: '{{'OPENCHANNEL.PAGE' | translate}}:', rowsPerPage: '{{'OPENCHANNEL.ROWSPERPAGE' | translate}}:', of: '{{'OPENCHANNEL.OF' | translate}}'}"
+                  md-limit="vm_dc.query.limit"
+                  md-limit-options="[10, 15, 20, 50, 100, 250]"
+                  md-page="vm_dc.query.page"
+                  md-total="{{vm_dc.dispositions.count}}"
+                  md-on-paginate="vm_dc.getDispositions"
+                  md-page-select
+                >
+                </md-table-pagination>
+              </div>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="OPENCHANNEL.CANNEDANSWERS">CANNEDANSWERS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="openchannelAccount-detail-form-container openchannelcannedanswers md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="OpenchannelAccountOpenchannelCannedAnswersController as vm_dc"
+              ng-init="vm_dc.init(vm.openchannelAccount, vm.crudPermissions)"
+            >
+              <md-toolbar
+                class="md-table-toolbar md-default"
+                ng-hide="vm_dc.selectedOpenchannelAccountOpenchannelCannedAnswers.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span
+                    class="md-subhead"
+                    translate="OPENCHANNEL.OPENCHANNELCANNEDANSWERS"
+                    >OpenchannelCannedAnswers</span
+                  >
+                  <ms-search-bar
+                    on-search="vm_dc.query.filter = query"
+                    on-collapse="vm_dc.query.filter = undefined"
+                    debounce="300"
+                    direction="down"
+                  ></ms-search-bar>
+                  <div flex></div>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canEdit"
+                    class="md-icon-button"
+                    ng-click="vm_dc.createOrEditOpenchannelAccountOpenchannelCannedAnswer($event)"
+                    aria-label="add openchannelCannedAnswer"
+                    translate
+                    translate-attr-label="OPENCHANNEL.ADD_OPENCHANNELCANNEDANSWER"
+                  >
+                    <md-icon md-font-icon="icon-plus"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-toolbar
+                class="md-table-toolbar md-accent"
+                ng-show="vm_dc.selectedOpenchannelAccountOpenchannelCannedAnswers.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead"
+                    >{{vm_dc.selectedOpenchannelAccountOpenchannelCannedAnswers.length}}
+                    {{vm_dc.selectedOpenchannelAccountOpenchannelCannedAnswers.length
+                    > 1 ? 'items' : 'item'}} selected</span
+                  >
+                  <div flex></div>
+                  <button
+                    class="md-icon-button"
+                    ng-csv="vm_dc.exportSelectedOpenchannelAccountOpenchannelCannedAnswers"
+                    csv-label="true"
+                    filename="openchannelAccounts.csv"
+                  >
+                    <md-icon md-font-icon="icon-file-excel"></md-icon>
+                  </button>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canDelete"
+                    class="md-icon-button"
+                    ng-click="vm_dc.deleteSelectedOpenchannelAccountOpenchannelCannedAnswers($event)"
+                    aria-label="delete selected"
+                    translate
+                    translate-attr-label="OPENCHANNEL.DELETE_SELECTED"
+                  >
+                    <md-icon md-font-icon="icon-delete"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-table-container class="font-size-12">
+                <table
+                  md-table
+                  md-row-select
+                  multiple
+                  ng-model="vm_dc.selectedOpenchannelAccountOpenchannelCannedAnswers"
+                  md-progress="vm_dc.promise"
+                >
+                  <thead
+                    md-head
+                    md-order="vm_dc.query.sort"
+                    md-on-reorder="vm_dc.getOpenchannelAccountOpenchannelCannedAnswers"
+                  >
+                    <tr md-row>
+                      <th md-column md-order-by="id">
+                        {{ 'OPENCHANNEL.ID' | translate }}
+                      </th>
+                      <th md-column md-order-by="key">
+                        {{ 'OPENCHANNEL.KEY' | translate }}
+                      </th>
+                      <th md-column md-order-by="value">
+                        {{ 'OPENCHANNEL.VALUE' | translate }}
+                      </th>
+                      <th md-column md-order-by="description">
+                        {{ 'OPENCHANNEL.DESCRIPTION' | translate }}
+                      </th>
+                      <th md-column md-order-by="createdAt">
+                        {{ 'OPENCHANNEL.CREATED_AT' | translate }}
+                      </th>
+                      <th md-column width="10px"></th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr
+                      md-row
+                      md-select="openchannelCannedAnswer"
+                      md-select-id="id"
+                      ng-repeat="openchannelCannedAnswer in vm_dc.openchannelAccountOpenchannelCannedAnswers.rows"
+                    >
+                      <td
+                        ng-click="vm_dc.createOrEditOpenchannelAccountOpenchannelCannedAnswer($event, openchannelCannedAnswer)"
+                        md-cell
+                      >
+                        {{openchannelCannedAnswer.id}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditOpenchannelAccountOpenchannelCannedAnswer($event, openchannelCannedAnswer)"
+                        md-cell
+                      >
+                        {{openchannelCannedAnswer.key}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditOpenchannelAccountOpenchannelCannedAnswer($event, openchannelCannedAnswer)"
+                        md-cell
+                      >
+                        {{openchannelCannedAnswer.value}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditOpenchannelAccountOpenchannelCannedAnswer($event, openchannelCannedAnswer)"
+                        md-cell
+                      >
+                        {{openchannelCannedAnswer.description}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditOpenchannelAccountOpenchannelCannedAnswer($event, openchannelCannedAnswer)"
+                        md-cell
+                      >
+                        {{ openchannelCannedAnswer.createdAt | formatdate }}
+                      </td>
+                      <td
+                        md-cell
+                        class="actions"
+                        ng-if="!vm_dc.crudPermissions.readOnly"
+                      >
+                        <md-menu>
+                          <md-button
+                            class="md-icon-button"
+                            aria-label="More"
+                            translate
+                            translate-attr-aria-label="OPENCHANNEL.MORE"
+                            ng-click="$mdOpenMenu($event)"
+                          >
+                            <md-icon
+                              md-font-icon="icon-dots-vertical"
+                            ></md-icon>
+                          </md-button>
+
+                          <md-menu-content width="3">
+                            <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
+                              <md-button
+                                ng-click="vm_dc.createOrEditOpenchannelAccountOpenchannelCannedAnswer($event, openchannelCannedAnswer)"
+                                translate="OPENCHANNEL.EDIT_OPENCHANNELCANNEDANSWER"
+                              >
+                                Edit OpenchannelCannedAnswer
+                              </md-button>
+                            </md-menu-item>
+                            <md-menu-item
+                              ng-if="vm_dc.crudPermissions.canDelete"
+                            >
+                              <md-button
+                                ng-click="vm_dc.deleteConfirm(openchannelCannedAnswer, $event)"
+                                translate="OPENCHANNEL.DELETE_OPENCHANNELCANNEDANSWER"
+                              >
+                                Delete OpenchannelCannedAnswer
+                              </md-button>
+                            </md-menu-item>
+                          </md-menu-content>
+                        </md-menu>
+                      </td>
+                    </tr>
+                    <tr
+                      md-row
+                      ng-if="!vm_dc.openchannelAccountOpenchannelCannedAnswers.rows.length"
+                    >
+                      <td md-cell colspan="7">
+                        <div layout="row" layout-align="center center">
+                          <span
+                            class="text-boxed-light"
+                            translate="OPENCHANNEL.NO_OPENCHANNELCANNEDANSWER_AVAILABLE"
+                            >No openchannelcannedanswer available</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+              <md-table-pagination
+                md-label="{page: '{{'OPENCHANNEL.PAGE' | translate}}:', rowsPerPage: '{{'OPENCHANNEL.ROWSPERPAGE' | translate}}:', of: '{{'OPENCHANNEL.OF' | translate}}'}"
+                md-limit="vm_dc.query.limit"
+                md-limit-options="[10, 15, 20, 50, 100, 250]"
+                md-page="vm_dc.query.page"
+                md-total="{{vm_dc.openchannelAccountOpenchannelCannedAnswers.count}}"
+                md-on-paginate="vm_dc.getOpenchannelAccountOpenchannelCannedAnswers"
+                md-page-select
+              ></md-table-pagination>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="OPENCHANNEL.ACTIONS">ACTIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="openchannelAccount-detail-form-container actions md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="OpenchannelAccountActionsController as vm_ac"
+              ng-init="vm_ac.init(vm.openchannelAccount, vm.crudPermissions)"
+              class="content"
+              md-background-bg
+              layout="row"
+              layout-align="start start"
+            >
+              <!-- SIDENAV -->
+              <div
+                class="navigation-simple sidenav main-sidenav md-background-bg md-whiteframe-1dp"
+                ms-scroll
+                layout="column"
+                flex="20"
+                ng-if="vm_ac.crudPermissions.canEdit"
+              >
+                <!-- SIDENAV CONTENT -->
+                <md-list class="no-padding">
+                  <md-subheader class="md-no-sticky">
+                    <span translate="VOICE.APPLICATIONS_LIST">
+                      Applications List
+                    </span>
+                  </md-subheader>
+                </md-list>
+                <md-divider></md-divider>
+                <md-list ng-sortable="vm_ac.list">
+                  <md-list-item class="handle" ng-repeat="a in vm_ac.apps">
+                    <md-icon md-font-icon="{{a.icon}}" class="s16"></md-icon>
+                    <p
+                      class="text-truncate"
+                      translate="OPENCHANNEL.{{(a.alias || a.appType) | uppercase}}"
+                    >
+                      {{a.alias || a.appType}}
+                    </p>
+                  </md-list-item>
+                </md-list>
+                <!-- / SIDENAV CONTENT -->
+              </div>
+              <!-- / SIDENAV -->
+              <div flex></div>
+              <!-- MAIN -->
+              <div
+                class="main scrollable md-background-bg md-whiteframe-1dp"
+                ms-scroll
+                layout="column"
+                flex="{{vm_ac.crudPermissions.canEdit ? 75 : 100}}"
+              >
+                <md-toolbar
+                  class="md-table-toolbar md-default"
+                  ng-hide="vm_ac.selectedOpenchannelAccountApps.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead">Drag & Drop Routing</span>
+                    <div flex></div>
+                    <ms-search-bar
+                      on-search="vm_ac.query.filter = query"
+                      on-collapse="vm_ac.query.filter = undefined"
+                      debounce="300"
+                    ></ms-search-bar>
+                  </div>
+                </md-toolbar>
+                <md-toolbar
+                  class="md-table-toolbar md-accent"
+                  ng-show="vm_ac.selectedOpenchannelAccountApps.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead"
+                      >{{vm_ac.selectedOpenchannelAccountApps.length}}
+                      {{vm_ac.selectedOpenchannelAccountApps.length > 1 ?
+                      'items' : 'item'}} selected</span
+                    >
+                    <div flex></div>
+                    <md-button
+                      ng-if="vm_ac.crudPermissions.canDelete"
+                      class="md-icon-button"
+                      ng-click="vm_ac.deleteSelectedOpenchannelAccountApps($event)"
+                      aria-label="delete selected"
+                      translate
+                      translate-attr-label="OPENCHANNEL.DELETE_SELECTED"
+                    >
+                      <md-icon md-font-icon="icon-delete"></md-icon>
+                    </md-button>
+                  </div>
+                </md-toolbar>
+
+                <!-- QUEUES TABLE -->
+                <md-table-container>
+                  <table
+                    md-table
+                    md-row-select
+                    multiple
+                    ng-model="vm_ac.selectedOpenchannelAccountApps"
+                  >
+                    <thead md-head>
+                      <tr md-row>
+                        <th md-column width="10px"></th>
+                        <th md-column width="10px">
+                          <span translate="VOICE.PRIORITY">Priority</span>
+                        </th>
+                        <th md-column>
+                          <span>Type</span>
+                        </th>
+                        <th md-column>
+                          <span>Appdata</span>
+                        </th>
+                        <th md-column>
+                          <span>Interval</span>
+                        </th>
+                        <th md-column width="10px"></th>
+                        <th md-column width="10px"></th>
+                      </tr>
+                    </thead>
+                    <tbody md-body ng-sortable="vm_ac.applications">
+                      <tr
+                        md-row
+                        md-select="app"
+                        md-select-id="id"
+                        ng-repeat="app in vm_ac.openchannelAccountApps.rows | filter: vm_ac.query.filter"
+                      >
+                        <td md-cell>
+                          <md-icon
+                            md-font-icon="icon-drag-vertical"
+                            class="s16 handle"
+                          ></md-icon>
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editOpenchannelAccountApp($event, $index)"
+                        >
+                          <span>{{app.priority}}</span>
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editOpenchannelAccountApp($event, $index)"
+                        >
+                          {{app.app.toLowerCase() === 'agi' ? 'Cally-Square' :
+                          app.app | ucfirst}}<span
+                            ng-if="app.appType.toLowerCase() === 'custom'"
+                            >*</span
+                          >
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editOpenchannelAccountApp($event, $index)"
+                        >
+                          <span class="text-truncate" style="width: 200px"
+                            >{{app.appdata}}</span
+                          >
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editInterval($event, $index)"
+                        >
+                          {{app.IntervalId ? 'From List' : app.interval}}
+                        </td>
+                        <td md-cell>
+                          <md-button
+                            ng-click="vm_ac.editInterval($event, $index)"
+                            class="md-icon-button"
+                            aria-label="Interval"
+                          >
+                            <md-icon md-font-icon="icon-timer"></md-icon>
+                            <md-tooltip>
+                              {{app.IntervalId ? 'From List' : (app.interval ===
+                              '*,*,*,*' ? 'Always' : 'Custom')}}
+                            </md-tooltip>
+                          </md-button>
+                        </td>
+                        <td
+                          md-cell
+                          class="actions"
+                          ng-if="!vm_ac.crudPermissions.readOnly"
+                        >
+                          <md-menu>
+                            <md-button
+                              class="md-icon-button"
+                              aria-label="More"
+                              translate
+                              translate-attr-aria-label="VOICE.MORE"
+                              ng-click="$mdOpenMenu($event)"
+                            >
+                              <md-icon
+                                md-font-icon="icon-dots-vertical"
+                              ></md-icon>
+                            </md-button>
+
+                            <md-menu-content width="3">
+                              <md-menu-item
+                                ng-if="vm_ac.crudPermissions.canEdit"
+                              >
+                                <md-button
+                                  ng-click="vm_ac.editOpenchannelAccountApp($event, $index)"
+                                  translate="VOICE.EDIT_APP"
+                                >
+                                  Edit App
+                                </md-button>
+                              </md-menu-item>
+                              <md-menu-item
+                                ng-if="vm_ac.crudPermissions.canEdit"
+                              >
+                                <md-button
+                                  ng-click="vm_ac.editInterval($event, $index)"
+                                  translate="VOICE.EDIT_INTERVAL"
+                                >
+                                  Edit Interval
+                                </md-button>
+                              </md-menu-item>
+                              <md-menu-item
+                                ng-if="vm_ac.crudPermissions.canDelete"
+                              >
+                                <md-button
+                                  ng-click="vm_ac.deleteConfirm(app, $index, $event)"
+                                  translate="VOICE.DELETE_APP"
+                                >
+                                  Delete App
+                                </md-button>
+                              </md-menu-item>
+                            </md-menu-content>
+                          </md-menu>
+                        </td>
+                      </tr>
+                      <tr
+                        md-row
+                        ng-hide="vm_ac.openchannelAccountApps.rows.length"
+                      >
+                        <td md-cell colspan="7">
+                          <span
+                            class="text-boxed-light"
+                            translate="VOICE.NO_APPS_AVAILABLE"
+                            >No apps available</span
+                          >
+                        </td>
+                      </tr>
+                    </tbody>
+                  </table>
+                </md-table-container>
+                <!-- / QUEUES TABLE -->
+
+                <!-- NO RESULTS -->
+
+                <!-- / NO RESULTS -->
+              </div>
+              <!-- / MAIN -->
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="OPENCHANNEL.INTERACTIONS">INTERACTIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="openchannelAccount-detail-form-container interactions md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="OpenchannelAccountInteractionsController as vm_dc"
+              ng-init="vm_dc.init(vm.openchannelAccount, vm.crudPermissions)"
+            >
+              <md-toolbar
+                class="md-table-toolbar md-default"
+                ng-hide="vm_dc.selectedOpenchannelAccountInteractions.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead" translate="OPENCHANNEL.INTERACTIONS"
+                    >Interactions</span
+                  >
+                  <ms-search-bar
+                    on-search="vm_dc.query.filter = query"
+                    on-collapse="vm_dc.query.filter = undefined"
+                    debounce="300"
+                    direction="down"
+                  ></ms-search-bar>
+                  <div flex></div>
+                  <ms-quick-filter
+                    filters="vm_dc.quickFilters"
+                    query="vm_dc.query"
+                    search="vm_dc.getOpenchannelAccountInteractions()"
+                  ></ms-quick-filter>
+                  <div layout="column">
+                    <md-button
+                      class="md-icon-button advanced-search"
+                      ng-class="{ 'md-fab md-mini md-accent-bg': vm_dc.query.search }"
+                      aria-label="Filter"
+                      translate
+                      translate-attr-aria-label="DASHBOARDS.FILTER"
+                      ng-click="vm_dc.openAdvancedSearch()"
+                    >
+                      <md-icon
+                        md-font-icon="{{ vm_dc.query.search ? 'icon-filter' : 'icon-filter-outline' }}"
+                        ng-class="{ 'blink': vm_dc.query.search }"
+                      ></md-icon>
+                    </md-button>
+                  </div>
+                  <md-button
+                    class="md-icon-button"
+                    ng-click="vm_dc.getOpenchannelAccountInteractions()"
+                    aria-label="refresh Interactions"
+                    translate
+                    translate-attr-label="OPENCHANNEL.REFRESH_INTERACTIONS"
+                  >
+                    <md-icon md-font-icon="icon-refresh"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-toolbar
+                class="md-table-toolbar md-accent"
+                ng-show="vm_dc.selectedOpenchannelAccountInteractions.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead"
+                    >{{vm_dc.selectedOpenchannelAccountInteractions.length}}
+                    {{vm_dc.selectedOpenchannelAccountInteractions.length > 1 ?
+                    'items' : 'item'}} selected</span
+                  >
+                  <div flex></div>
+                  <button
+                    class="md-icon-button"
+                    ng-csv="vm_dc.exportSelectedOpenchannelAccountInteractions"
+                    csv-label="true"
+                    filename="openchannelAccounts.csv"
+                  >
+                    <md-icon md-font-icon="icon-file-excel"></md-icon>
+                  </button>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canDelete"
+                    class="md-icon-button"
+                    ng-click="vm_dc.deleteSelectedOpenchannelAccountInteractions($event)"
+                    aria-label="delete selected"
+                    translate
+                    translate-attr-label="OPENCHANNEL.DELETE_SELECTED"
+                  >
+                    <md-icon md-font-icon="icon-delete"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-table-container class="font-size-12">
+                <table
+                  md-table
+                  md-row-select
+                  multiple
+                  ng-model="vm_dc.selectedOpenchannelAccountInteractions"
+                  md-progress="vm_dc.promise"
+                >
+                  <thead
+                    md-head
+                    md-order="vm_dc.query.sort"
+                    md-on-reorder="vm_dc.getOpenchannelAccountInteractions"
+                  >
+                    <tr md-row>
+                      <th md-column md-order-by="id">
+                        {{ 'OPENCHANNEL.ID' | translate }}
+                      </th>
+                      <th md-column class="no-padding">
+                        <md-icon md-font-icon="icon-eye" class="s16"></md-icon>
+                      </th>
+                      <th md-column class="no-padding"></th>
+                      <th md-column class="no-padding"></th>
+                      <th md-column>{{ 'OPENCHANNEL.CONTACT' | translate }}</th>
+                      <th md-column md-order-by="createdAt">
+                        {{ 'OPENCHANNEL.STARTEDAT' | translate }}
+                      </th>
+                      <th md-column md-order-by="lastMsgAt">
+                        {{ 'OPENCHANNEL.LASTMESSAGE' | translate }}
+                      </th>
+                      <th md-column md-order-by="closed">
+                        {{ 'OPENCHANNEL.STATUS' | translate }}
+                      </th>
+                      <th md-column>{{ 'OPENCHANNEL.AGENT' | translate }}</th>
+                      <th md-column md-order-by="tag">
+                        {{ 'OPENCHANNEL.TAGS' | translate }}
+                      </th>
+                      <th md-column width="10px"></th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr
+                      md-row
+                      md-select="interaction"
+                      md-select-id="id"
+                      ng-repeat="interaction in vm_dc.openchannelAccountInteractions.rows"
+                      ng-class="{'text-bold text-italic': interaction.unreadMessages > 0}"
+                    >
+                      <td md-cell>{{interaction.id}}</td>
+                      <td md-cell class="no-padding">
+                        <div
+                          ng-if="!interaction.closed && interaction.Users.length"
+                        >
+                          <md-icon
+                            md-font-icon="icon-eye"
+                            class="s16"
+                          ></md-icon>
+                          <md-tooltip>
+                            <span ng-repeat="user in interaction.Users"
+                              >{{ user.fullname | translate }}
+                              <span ng-if="!$last">, </span>
+                            </span>
+                          </md-tooltip>
+                        </div>
+                      </td>
+                      <td md-cell class="no-padding">
+                        <div
+                          ng-if="interaction.unreadMessages > 0"
+                          layout="row"
+                          layout-align="start center"
+                        >
+                          <span
+                            class="badge white-fg md-primary-bg"
+                            layout-margin
+                            >{{ interaction.unreadMessages}}</span
+                          >
+                        </div>
+                      </td>
+                      <td md-cell class="no-padding">
+                        <div ng-if="interaction.attach">
+                          <md-icon
+                            md-font-icon="icon-paperclip"
+                            class="s16"
+                          ></md-icon>
+                        </div>
+                      </td>
+                      <td md-cell>
+                        <div layout="column" layout-align="start start">
+                          <span
+                            class="font-size-12 text-truncate contact-text"
+                            ng-class="{'margin-bottom-0' : interaction.contactInfo}"
+                            layout-margin
+                            >{{ interaction.contactName }}</span
+                          >
+                          <span
+                            ng-if="interaction.contactInfo"
+                            class="font-size-12 text-truncate contact-text margin-top-0"
+                            layout-margin
+                            >{{ interaction.contactInfo }}</span
+                          >
+                        </div>
+                      </td>
+                      <td md-cell>{{ interaction.createdAt | formatdate }}</td>
+                      <td md-cell>
+                        <div layout="row">
+                          <span>
+                            <md-icon
+                              md-font-icon="{{interaction.lastMsgDirection == 'in' ? 'icon-arrow-down-bold blue-grey-800-fg' : 'icon-arrow-up-bold blue-grey-300-fg'}}"
+                            ></md-icon>
+                          </span>
+                          <div layout="column" layout-align="center center">
+                            <span class="text-truncate"
+                              >{{ interaction.lastMsgAt | formatdate }}</span
+                            >
+                          </div>
+                        </div>
+                      </td>
+                      <td md-cell>
+                        <span ng-if="interaction.closed === 0" class="green-fg">
+                          {{ 'OPENCHANNEL.OPENED' | translate }}
+                          <span ng-if="interaction.substatus">
+                            - {{ interaction.substatus }}
+                          </span>
+                        </span>
+                        <span ng-if="interaction.closed === 1" class="red-fg">
+                          {{ 'OPENCHANNEL.CLOSED' | translate }}
+                          <span ng-if="interaction.disposition">
+                            - {{ interaction.thirdDisposition ||
+                            interaction.secondDisposition ||
+                            interaction.disposition }}
+                          </span>
+                          <md-tooltip class="multiline">
+                            <div layout="column">
+                              <div layout="column">
+                                <span
+                                  >{{ 'DASHBOARDS.CLOSED_AT' |
+                                  translate}}:</span
+                                >
+                                <span class="text-bold"
+                                  >{{ interaction.closedAt | formatdate }}</span
+                                >
+                              </div>
+                              <div
+                                ng-if="interaction.disposition"
+                                layout="column"
+                              >
+                                <span
+                                  >{{ 'DASHBOARDS.DISPOSITION' |
+                                  translate}}:</span
+                                >
+                                <span class="text-bold"
+                                  >{{ interaction.disposition }}</span
+                                >
+                              </div>
+                              <div
+                                ng-if="interaction.secondDisposition"
+                                layout="column"
+                              >
+                                <span
+                                  >{{ 'DASHBOARDS.SECOND_LEVEL_DISPOSITION' |
+                                  translate}}:</span
+                                >
+                                <span class="text-bold"
+                                  >{{ interaction.secondDisposition }}</span
+                                >
+                              </div>
+                              <div
+                                ng-if="interaction.thirdDisposition"
+                                layout="column"
+                              >
+                                <span
+                                  >{{ 'DASHBOARDS.THIRD_LEVEL_DISPOSITION' |
+                                  translate}}:</span
+                                >
+                                <span class="text-bold"
+                                  >{{ interaction.thirdDisposition }}</span
+                                >
+                              </div>
+                            </div>
+                          </md-tooltip>
+                        </span>
+                      </td>
+
+                      <td md-cell>{{interaction.Owner.name}}</td>
+                      <td md-cell>
+                        <div ng-if="interaction.Tags.length">
+                          <md-tooltip md-direction="left" layout="row">
+                            <span ng-repeat="tag in interaction.Tags"
+                              >{{tag.name}}<span ng-if="!$last">, </span></span
+                            >
+                          </md-tooltip>
+                          <md-icon
+                            md-font-icon="icon-tag"
+                            ng-style="{'color': interaction.Tags.length == 1 && interaction.Tags[0].color }"
+                          >
+                          </md-icon>
+                        </div>
+                      </td>
+                      <td md-cell class="actions">
+                        <md-menu>
+                          <md-button
+                            class="md-icon-button"
+                            aria-label="More"
+                            translate
+                            translate-attr-aria-label="OPENCHANNEL.MORE"
+                            ng-click="$mdOpenMenu($event)"
+                          >
+                            <md-icon
+                              md-font-icon="icon-dots-vertical"
+                            ></md-icon>
+                          </md-button>
+
+                          <md-menu-content width="3">
+                            <md-menu-item>
+                              <md-button
+                                ng-click="vm_dc.spyopenchannelInteraction($event, interaction)"
+                                translate="OPENCHANNEL.SPYINTERACTION"
+                              >
+                                Spy Interaction
+                              </md-button>
+                            </md-menu-item>
+                            <md-menu-item>
+                              <md-button
+                                class="md-primary"
+                                ng-click="vm_dc.openchannelInteractionDownload(interaction, $event, true)"
+                                translate="OPENCHANNEL.DOWNLOAD_WITH_ATTACHMENTS"
+                              >
+                                Download with attachments
+                              </md-button>
+                            </md-menu-item>
+                            <md-menu-item>
+                              <md-button
+                                class="md-primary"
+                                ng-click="vm_dc.openchannelInteractionDownload(interaction, $event)"
+                                translate="OPENCHANNEL.DOWNLOAD_WITHOUT_ATTACHMENTS"
+                              >
+                                Download without attachments
+                              </md-button>
+                            </md-menu-item>
+                            <md-menu-item
+                              ng-if="vm_dc.crudPermissions.canDelete"
+                            >
+                              <md-button
+                                ng-click="vm_dc.deleteConfirm(interaction, $event)"
+                                translate="OPENCHANNEL.DELETE_INTERACTION"
+                              >
+                                Delete Interaction
+                              </md-button>
+                            </md-menu-item>
+                          </md-menu-content>
+                        </md-menu>
+                      </td>
+                    </tr>
+                    <tr
+                      md-row
+                      ng-if="!vm_dc.openchannelAccountInteractions.rows.length"
+                    >
+                      <td md-cell colspan="12">
+                        <div layout="row" layout-align="center center">
+                          <span
+                            class="text-boxed-light"
+                            translate="OPENCHANNEL.NO_INTERACTION_AVAILABLE"
+                            >No interaction available</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+              <md-table-pagination
+                md-label="{page: '{{'OPENCHANNEL.PAGE' | translate}}:', rowsPerPage: '{{'OPENCHANNEL.ROWSPERPAGE' | translate}}:', of: '{{'OPENCHANNEL.OF' | translate}}'}"
+                md-limit="vm_dc.query.limit"
+                md-limit-options="[10, 15, 20, 50, 100, 250]"
+                md-page="vm_dc.query.page"
+                md-total="{{vm_dc.openchannelAccountInteractions.count}}"
+                md-on-paginate="vm_dc.getOpenchannelAccountInteractions"
+                md-page-select
+              ></md-table-pagination>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/openchannelAccounts.html/openchannelAccounts-[chunkhash].html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/openchannelAccounts.html/openchannelAccounts-[chunkhash].html
deleted file mode 100644
index ea52b16..0000000
--- a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/openchannelAccounts.html/openchannelAccounts-[chunkhash].html
+++ /dev/null
@@ -1,357 +0,0 @@
-<div
-  id="openchannelAccounts"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-google-earth" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="OPENCHANNEL.OPENCHANNELACCOUNTS"
-          >OpenchannelAccounts</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="OPENCHANNEL.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedOpenchannelAccounts.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div
-      class="close-button-wrapper"
-      ng-click="vm.selectedOpenchannelAccounts =[]"
-    >
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="OPENCHANNEL.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-openchannelAccounts-count">
-          <span>{{vm.selectedOpenchannelAccounts.length}}</span>
-          <span translate="OPENCHANNEL.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="OPENCHANNEL.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllOpenchannelAccounts()"
-                translate="OPENCHANNEL.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectOpenchannelAccounts()"
-                translate="OPENCHANNEL.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedOpenchannelAccounts"
-          csv-label="true"
-          filename="openchannelAccounts.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedOpenchannelAccounts($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="OPENCHANNEL.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- OPENCHANNELACCOUNT TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedOpenchannelAccounts"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getOpenchannelAccounts"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">
-                  {{ 'OPENCHANNEL.ID' | translate }}
-                </th>
-                <th md-column md-order-by="name">
-                  {{ 'OPENCHANNEL.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="key">
-                  {{ 'OPENCHANNEL.KEY' | translate }}
-                </th>
-                <th md-column md-order-by="replyUri">
-                  {{ 'OPENCHANNEL.REPLYURI' | translate }}
-                </th>
-                <th md-column md-order-by="ListId">
-                  {{ 'OPENCHANNEL.LIST' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'OPENCHANNEL.DESCRIPTION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.openchannelAccounts.rows.length">
-                <td md-cell colspan="7">
-                  <div layout="row" layout-align="center center">
-                    <span translate="OPENCHANNEL.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="openchannelAccount"
-                md-select-id="id"
-                ng-repeat="openchannelAccount in vm.openchannelAccounts.rows"
-              >
-                <td md-cell ng-if="openchannelAccount.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{openchannelAccount.name}}"
-                    ng-src="api/users/{{openchannelAccount.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!openchannelAccount.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{openchannelAccount.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(openchannelAccount, ev) : vm.createOrEditOpenchannelAccount($event, openchannelAccount)"
-                  md-cell
-                  class="id"
-                >
-                  {{openchannelAccount.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(openchannelAccount, ev) : vm.createOrEditOpenchannelAccount($event, openchannelAccount)"
-                  md-cell
-                  class="name"
-                >
-                  {{openchannelAccount.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(openchannelAccount, ev) : vm.createOrEditOpenchannelAccount($event, openchannelAccount)"
-                  md-cell
-                  class="key"
-                >
-                  {{openchannelAccount.key}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(openchannelAccount, ev) : vm.createOrEditOpenchannelAccount($event, openchannelAccount)"
-                  md-cell
-                  class="replyUri"
-                >
-                  {{openchannelAccount.replyUri}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(openchannelAccount, ev) : vm.createOrEditOpenchannelAccount($event, openchannelAccount)"
-                  md-cell
-                  class="ListId"
-                >
-                  {{ (vm.lists | filter : {'id':openchannelAccount.ListId} :
-                  true)[0].name }}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(openchannelAccount, ev) : vm.createOrEditOpenchannelAccount($event, openchannelAccount)"
-                  md-cell
-                  class="description"
-                >
-                  {{openchannelAccount.description}}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="OPENCHANNEL.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(openchannelAccount, $event    )"
-                          translate="OPENCHANNEL.EDIT_OPENCHANNELACCOUNT"
-                        >
-                          Edit OpenchannelAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.interactionsgoto(openchannelAccount, $event    )"
-                          translate="OPENCHANNEL.INTERACTIONS_OPENCHANNELACCOUNT"
-                        >
-                          Interactions OpenchannelAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.agentadddialog(openchannelAccount, $event    )"
-                          translate="OPENCHANNEL.AGENTADD_OPENCHANNELACCOUNT"
-                        >
-                          AgentAdd OpenchannelAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(openchannelAccount, $event    )"
-                          translate="OPENCHANNEL.DELETE_OPENCHANNELACCOUNT"
-                        >
-                          Delete OpenchannelAccount
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'OPENCHANNEL.PAGE' | translate}}:', rowsPerPage: '{{'OPENCHANNEL.ROWSPERPAGE' | translate}}:', of: '{{'OPENCHANNEL.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.openchannelAccounts.count}}"
-          md-on-paginate="vm.getOpenchannelAccounts"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / OPENCHANNELACCOUNT TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD OPENCHANNELACCOUNT BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-openchannelAccount-button"
-    ng-click="vm.createOrEditOpenchannelAccount($event)"
-    aria-label="add openchannelAccount"
-    translate
-    translate-attr-aria-label="OPENCHANNEL.ADD_OPENCHANNELACCOUNT"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD OPENCHANNELACCOUNT BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/openchannelAccounts.html/openchannelAccounts.html b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/openchannelAccounts.html/openchannelAccounts.html
new file mode 100644
index 0000000..ea52b16
--- /dev/null
+++ b/public/src/js/modules/main/apps/openchannel/views/openchannelAccounts/openchannelAccounts.html/openchannelAccounts.html
@@ -0,0 +1,357 @@
+<div
+  id="openchannelAccounts"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-google-earth" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="OPENCHANNEL.OPENCHANNELACCOUNTS"
+          >OpenchannelAccounts</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="OPENCHANNEL.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedOpenchannelAccounts.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div
+      class="close-button-wrapper"
+      ng-click="vm.selectedOpenchannelAccounts =[]"
+    >
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="OPENCHANNEL.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-openchannelAccounts-count">
+          <span>{{vm.selectedOpenchannelAccounts.length}}</span>
+          <span translate="OPENCHANNEL.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="OPENCHANNEL.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllOpenchannelAccounts()"
+                translate="OPENCHANNEL.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectOpenchannelAccounts()"
+                translate="OPENCHANNEL.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedOpenchannelAccounts"
+          csv-label="true"
+          filename="openchannelAccounts.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedOpenchannelAccounts($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="OPENCHANNEL.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- OPENCHANNELACCOUNT TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedOpenchannelAccounts"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getOpenchannelAccounts"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">
+                  {{ 'OPENCHANNEL.ID' | translate }}
+                </th>
+                <th md-column md-order-by="name">
+                  {{ 'OPENCHANNEL.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="key">
+                  {{ 'OPENCHANNEL.KEY' | translate }}
+                </th>
+                <th md-column md-order-by="replyUri">
+                  {{ 'OPENCHANNEL.REPLYURI' | translate }}
+                </th>
+                <th md-column md-order-by="ListId">
+                  {{ 'OPENCHANNEL.LIST' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'OPENCHANNEL.DESCRIPTION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.openchannelAccounts.rows.length">
+                <td md-cell colspan="7">
+                  <div layout="row" layout-align="center center">
+                    <span translate="OPENCHANNEL.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="openchannelAccount"
+                md-select-id="id"
+                ng-repeat="openchannelAccount in vm.openchannelAccounts.rows"
+              >
+                <td md-cell ng-if="openchannelAccount.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{openchannelAccount.name}}"
+                    ng-src="api/users/{{openchannelAccount.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!openchannelAccount.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{openchannelAccount.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(openchannelAccount, ev) : vm.createOrEditOpenchannelAccount($event, openchannelAccount)"
+                  md-cell
+                  class="id"
+                >
+                  {{openchannelAccount.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(openchannelAccount, ev) : vm.createOrEditOpenchannelAccount($event, openchannelAccount)"
+                  md-cell
+                  class="name"
+                >
+                  {{openchannelAccount.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(openchannelAccount, ev) : vm.createOrEditOpenchannelAccount($event, openchannelAccount)"
+                  md-cell
+                  class="key"
+                >
+                  {{openchannelAccount.key}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(openchannelAccount, ev) : vm.createOrEditOpenchannelAccount($event, openchannelAccount)"
+                  md-cell
+                  class="replyUri"
+                >
+                  {{openchannelAccount.replyUri}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(openchannelAccount, ev) : vm.createOrEditOpenchannelAccount($event, openchannelAccount)"
+                  md-cell
+                  class="ListId"
+                >
+                  {{ (vm.lists | filter : {'id':openchannelAccount.ListId} :
+                  true)[0].name }}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(openchannelAccount, ev) : vm.createOrEditOpenchannelAccount($event, openchannelAccount)"
+                  md-cell
+                  class="description"
+                >
+                  {{openchannelAccount.description}}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="OPENCHANNEL.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(openchannelAccount, $event    )"
+                          translate="OPENCHANNEL.EDIT_OPENCHANNELACCOUNT"
+                        >
+                          Edit OpenchannelAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.interactionsgoto(openchannelAccount, $event    )"
+                          translate="OPENCHANNEL.INTERACTIONS_OPENCHANNELACCOUNT"
+                        >
+                          Interactions OpenchannelAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.agentadddialog(openchannelAccount, $event    )"
+                          translate="OPENCHANNEL.AGENTADD_OPENCHANNELACCOUNT"
+                        >
+                          AgentAdd OpenchannelAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(openchannelAccount, $event    )"
+                          translate="OPENCHANNEL.DELETE_OPENCHANNELACCOUNT"
+                        >
+                          Delete OpenchannelAccount
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'OPENCHANNEL.PAGE' | translate}}:', rowsPerPage: '{{'OPENCHANNEL.ROWSPERPAGE' | translate}}:', of: '{{'OPENCHANNEL.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.openchannelAccounts.count}}"
+          md-on-paginate="vm.getOpenchannelAccounts"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / OPENCHANNELACCOUNT TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD OPENCHANNELACCOUNT BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-openchannelAccount-button"
+    ng-click="vm.createOrEditOpenchannelAccount($event)"
+    aria-label="add openchannelAccount"
+    translate
+    translate-attr-aria-label="OPENCHANNEL.ADD_OPENCHANNELACCOUNT"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD OPENCHANNELACCOUNT BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 44b6cef..0000000
--- a/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,223 +0,0 @@
-<md-dialog class="openchannelQueue-dialog" aria-label="New OpenchannelQueue">
-  <form name="openchannelQueueForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="OPENCHANNEL.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.openchannelQueue.name"
-          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.newOpenchannelQueue"
-        />
-
-        <div class="hint"><span translate="OPENCHANNEL.HELP.NAME"></span></div>
-        <div
-          ng-messages="openchannelQueueForm['name'].$error"
-          ng-show="openchannelQueueForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="OPENCHANNEL.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span
-              translate="OPENCHANNEL.ERRORS.NAME_MUST_VALID_PATTERN"
-              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-              >Name must be valid pattern
-            </span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="OPENCHANNEL.STRATEGY">Strategy</label>
-        <md-select
-          name="strategy"
-          ng-model="vm.openchannelQueue.strategy"
-          required
-        >
-          <md-option ng-value="'beepall'">Beepall</md-option>
-          <md-option ng-value="'rrmemory'">RR Memory</md-option>
-        </md-select>
-        <div
-          ng-messages="openchannelQueueForm['strategy'].$error"
-          ng-show="openchannelQueueForm['strategy'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="OPENCHANNEL.ERRORS.STRATEGY_REQUIRED"
-              >Strategy field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="OPENCHANNEL.AGENT_TIMEOUT">Agent_Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.openchannelQueue.timeout"
-          min="1"
-          max="2147483"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="openchannelQueueForm['timeout'].$error"
-          ng-show="openchannelQueueForm['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="OPENCHANNEL.ERRORS.AGENT_TIMEOUT_REQUIRED"
-              >Agent_Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="OPENCHANNEL.ERRORS.AGENT_TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Agent_Timeout must be a valid greater or equal than</span
-            >
-            <span>1</span>
-          </div>
-          <div ng-message="max">
-            <span
-              translate="OPENCHANNEL.ERRORS.AGENT_TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-              >Agent_Timeout must be a valid greater or equal than</span
-            >
-            <span>2147483</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="OPENCHANNEL.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.openchannelQueue.description"
-        />
-
-        <div
-          ng-messages="openchannelQueueForm['description'].$error"
-          ng-show="openchannelQueueForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="OPENCHANNEL.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newOpenchannelQueue"
-          ng-click="vm.saveOpenchannelQueue()"
-          class="send-button md-accent md-raised"
-          ng-disabled="openchannelQueueForm.$invalid || openchannelQueueForm.$pristine"
-          aria-label="SAVE"
-          translate="OPENCHANNEL.SAVE"
-          translate-attr-aria-label="OPENCHANNEL.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newOpenchannelQueue"
-          ng-click="vm.addNewOpenchannelQueue()"
-          class="send-button md-accent md-raised"
-          ng-disabled="openchannelQueueForm.$invalid"
-          aria-label="ADD"
-          translate="OPENCHANNEL.ADD_OPENCHANNELQUEUE"
-          translate-attr-aria-label="OPENCHANNEL.ADD_OPENCHANNELQUEUE"
-        >
-          ADD OPENCHANNELQUEUE
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newOpenchannelQueue"
-          ng-click="vm.deleteOpenchannelQueue($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="OPENCHANNEL.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="OPENCHANNEL.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/create/dialog.html/dialog.html
new file mode 100644
index 0000000..44b6cef
--- /dev/null
+++ b/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/create/dialog.html/dialog.html
@@ -0,0 +1,223 @@
+<md-dialog class="openchannelQueue-dialog" aria-label="New OpenchannelQueue">
+  <form name="openchannelQueueForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="OPENCHANNEL.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.openchannelQueue.name"
+          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.newOpenchannelQueue"
+        />
+
+        <div class="hint"><span translate="OPENCHANNEL.HELP.NAME"></span></div>
+        <div
+          ng-messages="openchannelQueueForm['name'].$error"
+          ng-show="openchannelQueueForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="OPENCHANNEL.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span
+              translate="OPENCHANNEL.ERRORS.NAME_MUST_VALID_PATTERN"
+              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+              >Name must be valid pattern
+            </span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="OPENCHANNEL.STRATEGY">Strategy</label>
+        <md-select
+          name="strategy"
+          ng-model="vm.openchannelQueue.strategy"
+          required
+        >
+          <md-option ng-value="'beepall'">Beepall</md-option>
+          <md-option ng-value="'rrmemory'">RR Memory</md-option>
+        </md-select>
+        <div
+          ng-messages="openchannelQueueForm['strategy'].$error"
+          ng-show="openchannelQueueForm['strategy'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="OPENCHANNEL.ERRORS.STRATEGY_REQUIRED"
+              >Strategy field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="OPENCHANNEL.AGENT_TIMEOUT">Agent_Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.openchannelQueue.timeout"
+          min="1"
+          max="2147483"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="openchannelQueueForm['timeout'].$error"
+          ng-show="openchannelQueueForm['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="OPENCHANNEL.ERRORS.AGENT_TIMEOUT_REQUIRED"
+              >Agent_Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="OPENCHANNEL.ERRORS.AGENT_TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Agent_Timeout must be a valid greater or equal than</span
+            >
+            <span>1</span>
+          </div>
+          <div ng-message="max">
+            <span
+              translate="OPENCHANNEL.ERRORS.AGENT_TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+              >Agent_Timeout must be a valid greater or equal than</span
+            >
+            <span>2147483</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="OPENCHANNEL.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.openchannelQueue.description"
+        />
+
+        <div
+          ng-messages="openchannelQueueForm['description'].$error"
+          ng-show="openchannelQueueForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="OPENCHANNEL.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newOpenchannelQueue"
+          ng-click="vm.saveOpenchannelQueue()"
+          class="send-button md-accent md-raised"
+          ng-disabled="openchannelQueueForm.$invalid || openchannelQueueForm.$pristine"
+          aria-label="SAVE"
+          translate="OPENCHANNEL.SAVE"
+          translate-attr-aria-label="OPENCHANNEL.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newOpenchannelQueue"
+          ng-click="vm.addNewOpenchannelQueue()"
+          class="send-button md-accent md-raised"
+          ng-disabled="openchannelQueueForm.$invalid"
+          aria-label="ADD"
+          translate="OPENCHANNEL.ADD_OPENCHANNELQUEUE"
+          translate-attr-aria-label="OPENCHANNEL.ADD_OPENCHANNELQUEUE"
+        >
+          ADD OPENCHANNELQUEUE
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newOpenchannelQueue"
+          ng-click="vm.deleteOpenchannelQueue($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="OPENCHANNEL.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="OPENCHANNEL.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/edit/agentadd/agentadd.html/agentadd-[chunkhash].html b/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
deleted file mode 100644
index 65cdb49..0000000
--- a/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
+++ /dev/null
@@ -1,46 +0,0 @@
-<md-dialog
-  class="openchannelQueue-dialog"
-  aria-label="openchannelQueue"
-  ng-init="vm.onInit()"
->
-  <form name="openchannelQueueForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="OPENCHANNEL.AGENTADD_OPENCHANNELQUEUE">
-          Add Agent to openchannelQueue
-        </h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <ms-dual-multiselect
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveAgents()"
-        class="send-button md-accent md-raised"
-        ng-disabled="!vm.pendingChanges"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/edit/agentadd/agentadd.html/agentadd.html b/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/edit/agentadd/agentadd.html/agentadd.html
new file mode 100644
index 0000000..65cdb49
--- /dev/null
+++ b/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/edit/agentadd/agentadd.html/agentadd.html
@@ -0,0 +1,46 @@
+<md-dialog
+  class="openchannelQueue-dialog"
+  aria-label="openchannelQueue"
+  ng-init="vm.onInit()"
+>
+  <form name="openchannelQueueForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="OPENCHANNEL.AGENTADD_OPENCHANNELQUEUE">
+          Add Agent to openchannelQueue
+        </h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <ms-dual-multiselect
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveAgents()"
+        class="send-button md-accent md-raised"
+        ng-disabled="!vm.pendingChanges"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/edit/teamadd/teamadd.html/teamadd-[chunkhash].html b/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/edit/teamadd/teamadd.html/teamadd-[chunkhash].html
deleted file mode 100644
index daf7246..0000000
--- a/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/edit/teamadd/teamadd.html/teamadd-[chunkhash].html
+++ /dev/null
@@ -1,44 +0,0 @@
-<md-dialog
-  class="openchannelQueue-dialog"
-  aria-label="openchannelQueue"
-  ng-init="vm.onInit()"
->
-  <form name="openchannelQueueForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="OPENCHANNEL.TEAMS_ASSOCIATION">Teams Association</h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <ms-dual-multiselect
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveTeams()"
-        ng-disabled="!vm.pendingChanges"
-        class="send-button md-accent md-raised"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/edit/teamadd/teamadd.html/teamadd.html b/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/edit/teamadd/teamadd.html/teamadd.html
new file mode 100644
index 0000000..daf7246
--- /dev/null
+++ b/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/edit/teamadd/teamadd.html/teamadd.html
@@ -0,0 +1,44 @@
+<md-dialog
+  class="openchannelQueue-dialog"
+  aria-label="openchannelQueue"
+  ng-init="vm.onInit()"
+>
+  <form name="openchannelQueueForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="OPENCHANNEL.TEAMS_ASSOCIATION">Teams Association</h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <ms-dual-multiselect
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveTeams()"
+        ng-disabled="!vm.pendingChanges"
+        class="send-button md-accent md-raised"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index 1aa5ccb..0000000
--- a/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,228 +0,0 @@
-<div
-  id="openchannel-openchannelQueue"
-  class="page-layout simple tabbed"
-  layout="column"
->
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-openchannelQueues-button md-icon-button"
-        aria-label="Go to openchannelQueues"
-        ng-click="vm.gotoOpenchannelQueues()"
-        translate
-        translate-attr-aria-label="OPENCHANNEL.GO_TO_OPENCHANNELQUEUES"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="openchannelQueue-image" hide-xs>
-          <img ng-src="assets/images/business/openchannelQueues.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.openchannelQueue.id}}
-            <span ng-if="vm.openchannelQueue.name"
-              >{{vm.openchannelQueue.name}}</span
-            >
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="OPENCHANNEL.CREATED_AT"></span>
-            <span>{{vm.openchannelQueue.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.teamadddialog(vm.openchannelQueue, $event)"
-        class="md-fab md-orange-500-bg md-icon-button"
-        aria-label="teamadd"
-      >
-        <md-tooltip
-          ><span translate="OPENCHANNEL.TEAMADD_OPENCHANNELQUEUE"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
-      </md-button>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.agentadddialog(vm.openchannelQueue, $event)"
-        class="md-fab md-purple-500-bg md-icon-button"
-        aria-label="agentadd"
-      >
-        <md-tooltip
-          ><span translate="OPENCHANNEL.AGENTADD_OPENCHANNELQUEUE"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-account-plus"></md-icon>
-      </md-button>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveOpenchannelQueue()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid)"
-        translate="OPENCHANNEL.SAVE"
-        translate-attr-aria-label="OPENCHANNEL.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="OPENCHANNEL.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="openchannelQueue-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="OPENCHANNEL.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="OPENCHANNEL.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.openchannelQueue.name"
-                  ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-                  ng-required="true"
-                  autofocus
-                  disabled
-                />
-
-                <div class="hint">
-                  <span translate="OPENCHANNEL.HELP.NAME"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="OPENCHANNEL.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                  <div ng-message="pattern">
-                    <span
-                      translate="OPENCHANNEL.ERRORS.NAME_MUST_VALID_PATTERN"
-                      translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-                      >Name must be valid pattern
-                    </span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="OPENCHANNEL.STRATEGY">Strategy</label>
-                <md-select
-                  name="strategy"
-                  ng-model="vm.openchannelQueue.strategy"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'beepall'">Beepall</md-option>
-                  <md-option ng-value="'rrmemory'">RR Memory</md-option>
-                </md-select>
-                <div
-                  ng-messages="generalForm['strategy'].$error"
-                  ng-show="generalForm['strategy'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="OPENCHANNEL.ERRORS.STRATEGY_REQUIRED"
-                      >Strategy field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="OPENCHANNEL.AGENT_TIMEOUT"
-                  >Agent_Timeout</label
-                >
-                <input
-                  type="number"
-                  name="timeout"
-                  ng-model="vm.openchannelQueue.timeout"
-                  min="1"
-                  max="2147483"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['timeout'].$error"
-                  ng-show="generalForm['timeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="OPENCHANNEL.ERRORS.AGENT_TIMEOUT_REQUIRED"
-                      >Agent_Timeout field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="OPENCHANNEL.ERRORS.AGENT_TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >Agent_Timeout must be a valid greater or equal than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="OPENCHANNEL.ERRORS.AGENT_TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >Agent_Timeout must be a valid greater or equal than</span
-                    >
-                    <span>2147483</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="OPENCHANNEL.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.openchannelQueue.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="OPENCHANNEL.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/edit/view.html/view.html b/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/edit/view.html/view.html
new file mode 100644
index 0000000..1aa5ccb
--- /dev/null
+++ b/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/edit/view.html/view.html
@@ -0,0 +1,228 @@
+<div
+  id="openchannel-openchannelQueue"
+  class="page-layout simple tabbed"
+  layout="column"
+>
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-openchannelQueues-button md-icon-button"
+        aria-label="Go to openchannelQueues"
+        ng-click="vm.gotoOpenchannelQueues()"
+        translate
+        translate-attr-aria-label="OPENCHANNEL.GO_TO_OPENCHANNELQUEUES"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="openchannelQueue-image" hide-xs>
+          <img ng-src="assets/images/business/openchannelQueues.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.openchannelQueue.id}}
+            <span ng-if="vm.openchannelQueue.name"
+              >{{vm.openchannelQueue.name}}</span
+            >
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="OPENCHANNEL.CREATED_AT"></span>
+            <span>{{vm.openchannelQueue.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.teamadddialog(vm.openchannelQueue, $event)"
+        class="md-fab md-orange-500-bg md-icon-button"
+        aria-label="teamadd"
+      >
+        <md-tooltip
+          ><span translate="OPENCHANNEL.TEAMADD_OPENCHANNELQUEUE"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
+      </md-button>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.agentadddialog(vm.openchannelQueue, $event)"
+        class="md-fab md-purple-500-bg md-icon-button"
+        aria-label="agentadd"
+      >
+        <md-tooltip
+          ><span translate="OPENCHANNEL.AGENTADD_OPENCHANNELQUEUE"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-account-plus"></md-icon>
+      </md-button>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveOpenchannelQueue()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid)"
+        translate="OPENCHANNEL.SAVE"
+        translate-attr-aria-label="OPENCHANNEL.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="OPENCHANNEL.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="openchannelQueue-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="OPENCHANNEL.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="OPENCHANNEL.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.openchannelQueue.name"
+                  ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+                  ng-required="true"
+                  autofocus
+                  disabled
+                />
+
+                <div class="hint">
+                  <span translate="OPENCHANNEL.HELP.NAME"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="OPENCHANNEL.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                  <div ng-message="pattern">
+                    <span
+                      translate="OPENCHANNEL.ERRORS.NAME_MUST_VALID_PATTERN"
+                      translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+                      >Name must be valid pattern
+                    </span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="OPENCHANNEL.STRATEGY">Strategy</label>
+                <md-select
+                  name="strategy"
+                  ng-model="vm.openchannelQueue.strategy"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'beepall'">Beepall</md-option>
+                  <md-option ng-value="'rrmemory'">RR Memory</md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['strategy'].$error"
+                  ng-show="generalForm['strategy'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="OPENCHANNEL.ERRORS.STRATEGY_REQUIRED"
+                      >Strategy field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="OPENCHANNEL.AGENT_TIMEOUT"
+                  >Agent_Timeout</label
+                >
+                <input
+                  type="number"
+                  name="timeout"
+                  ng-model="vm.openchannelQueue.timeout"
+                  min="1"
+                  max="2147483"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['timeout'].$error"
+                  ng-show="generalForm['timeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="OPENCHANNEL.ERRORS.AGENT_TIMEOUT_REQUIRED"
+                      >Agent_Timeout field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="OPENCHANNEL.ERRORS.AGENT_TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >Agent_Timeout must be a valid greater or equal than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="OPENCHANNEL.ERRORS.AGENT_TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >Agent_Timeout must be a valid greater or equal than</span
+                    >
+                    <span>2147483</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="OPENCHANNEL.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.openchannelQueue.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="OPENCHANNEL.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/openchannelQueues.html/openchannelQueues-[chunkhash].html b/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/openchannelQueues.html/openchannelQueues-[chunkhash].html
deleted file mode 100644
index 4f4a842..0000000
--- a/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/openchannelQueues.html/openchannelQueues-[chunkhash].html
+++ /dev/null
@@ -1,339 +0,0 @@
-<div
-  id="openchannelQueues"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-google-earth" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="OPENCHANNEL.OPENCHANNELQUEUES"
-          >OpenchannelQueues</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="OPENCHANNEL.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedOpenchannelQueues.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div
-      class="close-button-wrapper"
-      ng-click="vm.selectedOpenchannelQueues =[]"
-    >
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="OPENCHANNEL.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-openchannelQueues-count">
-          <span>{{vm.selectedOpenchannelQueues.length}}</span>
-          <span translate="OPENCHANNEL.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="OPENCHANNEL.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllOpenchannelQueues()"
-                translate="OPENCHANNEL.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectOpenchannelQueues()"
-                translate="OPENCHANNEL.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedOpenchannelQueues"
-          csv-label="true"
-          filename="openchannelQueues.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedOpenchannelQueues($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="OPENCHANNEL.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- OPENCHANNELQUEUE TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedOpenchannelQueues"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getOpenchannelQueues"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">
-                  {{ 'OPENCHANNEL.ID' | translate }}
-                </th>
-                <th md-column md-order-by="name">
-                  {{ 'OPENCHANNEL.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="strategy">
-                  {{ 'OPENCHANNEL.STRATEGY' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.openchannelQueues.rows.length">
-                <td md-cell colspan="4">
-                  <div layout="row" layout-align="center center">
-                    <span translate="OPENCHANNEL.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="openchannelQueue"
-                md-select-id="id"
-                ng-repeat="openchannelQueue in vm.openchannelQueues.rows"
-              >
-                <td md-cell ng-if="openchannelQueue.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{openchannelQueue.name}}"
-                    ng-src="api/users/{{openchannelQueue.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!openchannelQueue.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{openchannelQueue.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(openchannelQueue, ev) : vm.createOrEditOpenchannelQueue($event, openchannelQueue)"
-                  md-cell
-                  class="id"
-                >
-                  {{openchannelQueue.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(openchannelQueue, ev) : vm.createOrEditOpenchannelQueue($event, openchannelQueue)"
-                  md-cell
-                  class="name"
-                >
-                  {{openchannelQueue.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(openchannelQueue, ev) : vm.createOrEditOpenchannelQueue($event, openchannelQueue)"
-                  md-cell
-                  class="strategy"
-                >
-                  {{ vm.arraystrategy[openchannelQueue.strategy].option }}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="OPENCHANNEL.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(openchannelQueue, $event    )"
-                          translate="OPENCHANNEL.EDIT_OPENCHANNELQUEUE"
-                        >
-                          Edit OpenchannelQueue
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.teamadddialog(openchannelQueue, $event    )"
-                          translate="OPENCHANNEL.TEAMADD_OPENCHANNELQUEUE"
-                        >
-                          teamadd OpenchannelQueue
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.agentadddialog(openchannelQueue, $event    )"
-                          translate="OPENCHANNEL.AGENTADD_OPENCHANNELQUEUE"
-                        >
-                          agentadd OpenchannelQueue
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(openchannelQueue, $event    )"
-                          translate="OPENCHANNEL.DELETE_OPENCHANNELQUEUE"
-                        >
-                          Delete OpenchannelQueue
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.gotorealtimegoto(openchannelQueue, $event    )"
-                          translate="OPENCHANNEL.GOTOREALTIME_OPENCHANNELQUEUE"
-                        >
-                          goToRealtime OpenchannelQueue
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'OPENCHANNEL.PAGE' | translate}}:', rowsPerPage: '{{'OPENCHANNEL.ROWSPERPAGE' | translate}}:', of: '{{'OPENCHANNEL.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.openchannelQueues.count}}"
-          md-on-paginate="vm.getOpenchannelQueues"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / OPENCHANNELQUEUE TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD OPENCHANNELQUEUE BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-openchannelQueue-button"
-    ng-click="vm.createOrEditOpenchannelQueue($event)"
-    aria-label="add openchannelQueue"
-    translate
-    translate-attr-aria-label="OPENCHANNEL.ADD_OPENCHANNELQUEUE"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD OPENCHANNELQUEUE BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/openchannelQueues.html/openchannelQueues.html b/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/openchannelQueues.html/openchannelQueues.html
new file mode 100644
index 0000000..4f4a842
--- /dev/null
+++ b/public/src/js/modules/main/apps/openchannel/views/openchannelQueues/openchannelQueues.html/openchannelQueues.html
@@ -0,0 +1,339 @@
+<div
+  id="openchannelQueues"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-google-earth" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="OPENCHANNEL.OPENCHANNELQUEUES"
+          >OpenchannelQueues</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="OPENCHANNEL.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedOpenchannelQueues.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div
+      class="close-button-wrapper"
+      ng-click="vm.selectedOpenchannelQueues =[]"
+    >
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="OPENCHANNEL.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-openchannelQueues-count">
+          <span>{{vm.selectedOpenchannelQueues.length}}</span>
+          <span translate="OPENCHANNEL.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="OPENCHANNEL.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllOpenchannelQueues()"
+                translate="OPENCHANNEL.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectOpenchannelQueues()"
+                translate="OPENCHANNEL.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedOpenchannelQueues"
+          csv-label="true"
+          filename="openchannelQueues.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedOpenchannelQueues($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="OPENCHANNEL.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- OPENCHANNELQUEUE TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedOpenchannelQueues"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getOpenchannelQueues"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">
+                  {{ 'OPENCHANNEL.ID' | translate }}
+                </th>
+                <th md-column md-order-by="name">
+                  {{ 'OPENCHANNEL.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="strategy">
+                  {{ 'OPENCHANNEL.STRATEGY' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.openchannelQueues.rows.length">
+                <td md-cell colspan="4">
+                  <div layout="row" layout-align="center center">
+                    <span translate="OPENCHANNEL.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="openchannelQueue"
+                md-select-id="id"
+                ng-repeat="openchannelQueue in vm.openchannelQueues.rows"
+              >
+                <td md-cell ng-if="openchannelQueue.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{openchannelQueue.name}}"
+                    ng-src="api/users/{{openchannelQueue.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!openchannelQueue.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{openchannelQueue.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(openchannelQueue, ev) : vm.createOrEditOpenchannelQueue($event, openchannelQueue)"
+                  md-cell
+                  class="id"
+                >
+                  {{openchannelQueue.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(openchannelQueue, ev) : vm.createOrEditOpenchannelQueue($event, openchannelQueue)"
+                  md-cell
+                  class="name"
+                >
+                  {{openchannelQueue.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(openchannelQueue, ev) : vm.createOrEditOpenchannelQueue($event, openchannelQueue)"
+                  md-cell
+                  class="strategy"
+                >
+                  {{ vm.arraystrategy[openchannelQueue.strategy].option }}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="OPENCHANNEL.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(openchannelQueue, $event    )"
+                          translate="OPENCHANNEL.EDIT_OPENCHANNELQUEUE"
+                        >
+                          Edit OpenchannelQueue
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.teamadddialog(openchannelQueue, $event    )"
+                          translate="OPENCHANNEL.TEAMADD_OPENCHANNELQUEUE"
+                        >
+                          teamadd OpenchannelQueue
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.agentadddialog(openchannelQueue, $event    )"
+                          translate="OPENCHANNEL.AGENTADD_OPENCHANNELQUEUE"
+                        >
+                          agentadd OpenchannelQueue
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(openchannelQueue, $event    )"
+                          translate="OPENCHANNEL.DELETE_OPENCHANNELQUEUE"
+                        >
+                          Delete OpenchannelQueue
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.gotorealtimegoto(openchannelQueue, $event    )"
+                          translate="OPENCHANNEL.GOTOREALTIME_OPENCHANNELQUEUE"
+                        >
+                          goToRealtime OpenchannelQueue
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'OPENCHANNEL.PAGE' | translate}}:', rowsPerPage: '{{'OPENCHANNEL.ROWSPERPAGE' | translate}}:', of: '{{'OPENCHANNEL.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.openchannelQueues.count}}"
+          md-on-paginate="vm.getOpenchannelQueues"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / OPENCHANNELQUEUE TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD OPENCHANNELQUEUE BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-openchannelQueue-button"
+    ng-click="vm.createOrEditOpenchannelQueue($event)"
+    aria-label="add openchannelQueue"
+    translate
+    translate-attr-aria-label="OPENCHANNEL.ADD_OPENCHANNELQUEUE"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD OPENCHANNELQUEUE BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/openchannel/views/realtime/agents/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/openchannel/views/realtime/agents/view.html/view-[chunkhash].html
deleted file mode 100644
index f6ba223..0000000
--- a/public/src/js/modules/main/apps/openchannel/views/realtime/agents/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,517 +0,0 @@
-<!-- MAIN -->
-<md-toolbar class="md-table-toolbar md-default">
-  <div class="md-toolbar-tools">
-    <span class="md-subhead" translate="OPENCHANNEL.AGENTS">Agents</span>
-    <div flex></div>
-    <ms-search-bar
-      on-search="vm.query.filter = query; vm.onInit()"
-      on-collapse="vm.query.filter = undefined; vm.onInit()"
-      debounce="300"
-    ></ms-search-bar>
-    <md-select
-      ng-model="vm.query.globalStatusFilter"
-      class="md-caption"
-      ng-change="vm.query.pauseTypeFilter = ''; vm.onInit()"
-    >
-      <md-option ng-value="''">{{ 'OPENCHANNEL.ALL' | translate }}</md-option>
-      <md-option value="pause">{{ 'OPENCHANNEL.PAUSE' | translate }}</md-option>
-      <md-option value="*pause"
-        >{{ 'OPENCHANNEL.PARTIALPAUSE' | translate }}</md-option
-      >
-      <md-option value="busy">{{ 'OPENCHANNEL.BUSY' | translate }}</md-option>
-      <md-option value="idle">{{ 'OPENCHANNEL.IDLE' | translate }}</md-option>
-    </md-select>
-
-    <md-select
-      ng-if="vm.isPause(vm.query.globalStatusFilter)"
-      ng-model="vm.query.pauseTypeFilter"
-      class="md-caption"
-      ng-change="vm.onInit()"
-    >
-      <md-option ng-value="''">All</md-option>
-      <md-option value="DEFAULT PAUSE">DEFAULT PAUSE</md-option>
-      <md-option value="ACW">ACW</md-option>
-      <md-option value="LOGININPAUSE">LOGININPAUSE</md-option>
-      <md-option value="Auto-Pause">AUTOPAUSE</md-option>
-      <md-option ng-value="pause.name" ng-repeat="pause in vm.pauses.rows"
-        >{{pause.name}}</md-option
-      >
-    </md-select>
-  </div>
-</md-toolbar>
-
-<!-- AGENT TABLE -->
-<md-table-container>
-  <table md-table multiple md-progress="vm.promise">
-    <thead md-head md-order="vm.query.order" md-on-reorder="vm.onInit">
-      <tr md-row border="1">
-        <th class="bv text-center" colspan="5">
-          {{ 'OPENCHANNEL.AGENT' | translate }}
-        </th>
-        <th class="bv bl text-center" colspan="2">
-          {{ 'VOICE.VOICE' | translate }}
-        </th>
-        <th ng-if="vm.license.chat" class="bv bl text-center" colspan="2">
-          {{ 'CHAT.CHAT' | translate }}
-        </th>
-        <th ng-if="vm.license.mail" class="bv bl text-center" colspan="2">
-          {{ 'MAIL.MAIL' | translate }}
-        </th>
-        <th ng-if="vm.license.messaging" class="bv bl text-center" colspan="2">
-          {{ 'SMS.SMS' | translate }}
-        </th>
-        <th
-          ng-if="vm.license.openchannel"
-          class="bv bl text-center"
-          colspan="2"
-        >
-          {{ 'OPENCHANNEL.OPENCHANNEL' | translate }}
-        </th>
-        <th ng-if="vm.license.fax" class="bv bl text-center" colspan="2">
-          {{ 'FAX.FAX' | translate }}
-        </th>
-        <th ng-if="vm.license.whatsapp" class="bv bl text-center" colspan="2">
-          {{ 'WHATSAPP.WHATSAPP' | translate }}
-        </th>
-        <th width="10px" class="bt bl" rowspan="2"></th>
-      </tr>
-      <tr md-row>
-        <th class="bl" colspan="2" md-column md-order-by="fullname">
-          {{ 'OPENCHANNEL.NAME' | translate }}
-        </th>
-        <th class="bl custom-column" md-column md-order-by="globalStatus">
-          {{ 'OPENCHANNEL.STATUS' | translate }}
-        </th>
-        <th class="bl custom-column" md-column md-order-by="lastLoginAt">
-          {{ 'OPENCHANNEL.LOGIN_TIME' | translate }}
-        </th>
-        <th class="bl custom-column" md-column md-order-by="lastPauseAt">
-          {{ 'OPENCHANNEL.PAUSE_TIME' | translate }}
-        </th>
-
-        <th class="bl custom-column">{{ 'VOICE.STATUS' | translate }}</th>
-        <th class="bl custom-column">Info</th>
-
-        <th ng-if="vm.license.chat" class="bl text-center">
-          {{ 'CHAT.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.chat" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'CHAT.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.mail" class="bl text-center">
-          {{ 'MAIL.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.mail" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'MAIL.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.messaging" class="bl text-center">
-          {{ 'SMS.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.messaging" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'SMS.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.openchannel" class="bl text-center">
-          {{ 'OPENCHANNEL.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.openchannel" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'OPENCHANNEL.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.fax" class="bl text-center">
-          {{ 'FAX.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.fax" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'FAX.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.whatsapp" class="bl text-center">
-          {{ 'WHATSAPP.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.whatsapp" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'WHATSAPP.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-      </tr>
-    </thead>
-    <tbody md-body>
-      <tr md-row ng-hide="vm.order.length">
-        <td md-cell colspan="19">
-          <div layout="row" layout-align="center center">
-            <span>{{ 'OPENCHANNEL.NO_AGENT_ONLINE' | translate }}</span>
-          </div>
-        </td>
-      </tr>
-      <tr
-        md-select="vm.agents[value]"
-        md-select-id="id"
-        ng-repeat="(id, value) in vm.order"
-      >
-        <td class="bt padding-5">
-          <div layout="row" layout-align="start center">
-            <img
-              class="avatar"
-              ng-src="{{vm.agents[value].userpic && 'api/users/'+vm.agents[value].id+'/avatar' || 'assets/images/avatars/profile.png'}}"
-            />
-            <div layout="column">
-              <span>{{vm.agents[value].fullname}}</span>
-              <span>{{vm.agents[value].internal}}</span>
-            </div>
-          </div>
-        </td>
-        <td class="bt padding-5">
-          <div
-            layout="row"
-            layout-align="start center"
-            ng-if="vm.license.screenrecording && (vm.agents[value].phoneBarEnableScreenRecordingByAgent || vm.agents[value].phoneBarEnableAutomaticScreenRecording)"
-          >
-            <div class="column" ng-if="vm.agents[value].screenrecording">
-              <span>
-                <md-icon
-                  md-font-icon="icon-camcorder-box"
-                  style="color: green; font-size: 36px"
-                  aria-label="icon-camcorder-box26"
-                >
-                  <md-tooltip>
-                    {{ 'OPENCHANNEL.TOOLTIP_SCREENRECORDING_ON' | translate }}
-                  </md-tooltip>
-                </md-icon>
-              </span>
-            </div>
-            <div class="column" ng-if="!vm.agents[value].screenrecording">
-              <span>
-                <md-icon
-                  md-font-icon="icon-camcorder-box"
-                  style="color: gray"
-                  aria-label="icon-camcorder-box26"
-                >
-                  <md-tooltip>
-                    {{ 'OPENCHANNEL.TOOLTIP_SCREENRECORDING_OFF' | translate }}
-                  </md-tooltip>
-                </md-icon>
-              </span>
-            </div>
-          </div>
-        </td>
-
-        <td class="bt">
-          <span
-            class="text-boxed md-background-bg bl bt padding-5"
-            ng-class="{'idle':'lime-300-bg','busy':'indigo-100-bg','*pause':'amber-50-bg','pause':'amber-200-bg'}[vm.agents[value].globalStatus]"
-            >{{ vm.isPause(vm.agents[value].globalStatus) ? '' :
-            vm.agents[value].globalStatus | uppercase }} {{
-            vm.isPause(vm.agents[value].globalStatus) ?
-            (vm.isPartialPause(vm.agents[value].globalStatus) ?
-            '*'+vm.agents[value].pauseType || 'DEFAULT PAUSE' :
-            vm.agents[value].pauseType || 'DEFAULT PAUSE') : ''}}</span
-          >
-        </td>
-        <td class="bt custom-column">
-          <timer start-time="vm.agents[value].lastLoginAt" interval="1000"
-            >{{ days > 0 ? days + 'd' : '' }}
-            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
-          >
-        </td>
-        <td class="bt custom-column">
-          <timer
-            ng-if="vm.isPause(vm.agents[value].globalStatus) || vm.isPartialPause(vm.agents[value].globalStatus)"
-            start-time="vm.agents[value].lastPauseAt"
-            interval="1000"
-            >{{ days > 0 ? days + 'd' : '' }}
-            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
-          >
-        </td>
-        <td class="bt bl">
-          <div layout="row">
-            <span
-              ng-if="!vm.agents[value].onhold"
-              class="text-boxed md-background-bg bl bt padding-5"
-              ng-class="{'idle':'lime-300-bg','talking':'indigo-100-bg','ringing':'orange-400-bg','pause':'amber-200-bg'}[vm.agents[value].voiceStatus]"
-              >{{ vm.agents[value].voiceStatus | uppercase }}</span
-            >
-            <span
-              ng-if="vm.agents[value].onhold"
-              class="text-boxed md-background-bg bl bt padding-5 orange-400-bg"
-              >ONHOLD</span
-            >
-          </div>
-        </td>
-        <td class="bt bl">
-          <div layout="column">
-            <span
-              ng-if="vm.agents[value].queue"
-              class="padding-5"
-              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
-              >{{ vm.agents[value].queue }}</span
-            >
-            <span
-              ng-if="vm.agents[value].destconnectedlinenum"
-              class="padding-5"
-              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
-              >{{ vm.agents[value].destconnectedlinenum }}</span
-            >
-            <span
-              class="padding-5"
-              ng-if="vm.agents[value].queue || vm.agents[value].destconnectedlinenum"
-            >
-              <timer
-                start-time="vm.agents[value].voiceStatusTime"
-                interval="1000"
-                ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
-              >
-                {{hhours}}:{{mminutes}}:{{sseconds}}</timer
-              >
-            </span>
-          </div>
-        </td>
-
-        <td class="bt bl" ng-if="vm.license.chat">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].chatStatus]"
-                >{{ vm.agents[value].chatStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          md-number
-          class="bt text-center font-size-20"
-          ng-if="vm.license.chat"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].chatStatus]"
-        >
-          {{ vm.agents[value].chatCurrentCapacity }}
-        </td>
-
-        <td class="bl bt" ng-if="vm.license.mail">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].mailStatus]"
-                >{{ vm.agents[value].mailStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.mail"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].mailStatus]"
-        >
-          {{ vm.agents[value].mailCurrentCapacity }}
-        </td>
-
-        <td class="bl bt" ng-if="vm.license.messaging">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].smsStatus]"
-                >{{ vm.agents[value].smsStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.messaging"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].smsStatus]"
-        >
-          {{ vm.agents[value].smsCurrentCapacity }}
-        </td>
-
-        <td class="bt bl" ng-if="vm.license.openchannel">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].openchannelStatus]"
-                >{{ vm.agents[value].openchannelStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.openchannel"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].openchannelStatus]"
-        >
-          {{ vm.agents[value].openchannelCurrentCapacity }}
-        </td>
-
-        <td class="bt bl" ng-if="vm.license.fax">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].faxStatus]"
-                >{{ vm.agents[value].faxStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.fax"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].faxStatus]"
-        >
-          {{ vm.agents[value].faxCurrentCapacity }}
-        </td>
-
-        <td class="bl bt" ng-if="vm.license.whatsapp">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].whatsappStatus]"
-                >{{ vm.agents[value].whatsappStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.whatsapp"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].whatsappStatus]"
-        >
-          {{ vm.agents[value].whatsappCurrentCapacity }}
-        </td>
-
-        <td
-          class="bl bt padding-5 text-center"
-          ng-if="vm.crudPermissions.canEdit"
-        >
-          <md-menu>
-            <md-button
-              class="md-icon-button"
-              aria-label="More"
-              translate
-              translate-attr-aria-label="STAFF.MORE"
-              ng-click="$mdMenu.open($event)"
-            >
-              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-            </md-button>
-
-            <md-menu-content width="4">
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.logout(vm.agents[value], $event)"
-                  translate="OPENCHANNEL.LOGOUT"
-                >
-                  Logout
-                </md-button>
-              </md-menu-item>
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.queueAdd(vm.agents[value], $event)"
-                  translate="OPENCHANNEL.AGENTADD_QUEUE"
-                >
-                  Add Agent In Queue
-                </md-button>
-              </md-menu-item>
-
-              <md-menu-item
-                ng-if="vm.license.screenrecording && vm.agents[value].phoneBarEnableScreenRecordingByAgent"
-              >
-                <md-menu>
-                  <md-button
-                    ng-click="$mdMenu.open()"
-                    class="text-capitalize"
-                    translate="OPENCHANNEL.SCREENRECORDING"
-                    >Screen Recording
-                  </md-button>
-                  <md-menu-content>
-                    <md-menu-item ng-if="!vm.agents[value].screenrecording">
-                      <md-button
-                        ng-click="vm.screenRecording(vm.agents[value], true)"
-                        ><em translate="OPENCHANNEL.START_SCREENRECORDING"
-                          >Start Screen Recording</em
-                        ></md-button
-                      >
-                    </md-menu-item>
-                    <md-menu-item ng-if="vm.agents[value].screenrecording">
-                      <md-button
-                        ng-click="vm.screenRecording(vm.agents[value], false)"
-                        ><em translate="OPENCHANNEL.STOP_SCREENRECORDING"
-                          >Stop Screen Recording</em
-                        ></md-button
-                      >
-                    </md-menu-item>
-                  </md-menu-content>
-                </md-menu>
-              </md-menu-item>
-
-              <md-menu-item>
-                <md-menu>
-                  <md-button
-                    ng-click="$mdMenu.open()"
-                    class="text-capitalize"
-                    translate="OPENCHANNEL.PAUSE"
-                    >Pause</md-button
-                  >
-                  <md-menu-content>
-                    <md-menu-item>
-                      <md-button
-                        ng-disabled=" vm.agents[value].voicePause && 'DEFAULT PAUSE' === vm.agents[value].pauseType"
-                        ng-click="vm.pause(vm.agents[value])"
-                        ><em translate="OPENCHANNEL.DEFAULT_PAUSE"
-                          >Default Pause</em
-                        ></md-button
-                      >
-                    </md-menu-item>
-                    <md-menu-item
-                      ng-if="vm.pauses.rows.length"
-                      ng-repeat="pause in vm.pauses.rows"
-                    >
-                      <md-button
-                        ng-disabled="vm.agents[value].voicePause && pause.name === vm.agents[value].pauseType"
-                        ng-click="vm.pause(vm.agents[value], pause.name)"
-                        >{{pause.name}}
-                      </md-button>
-                    </md-menu-item>
-                  </md-menu-content>
-                </md-menu>
-              </md-menu-item>
-              <md-menu-item ng-if="vm.isPause(vm.agents[value].globalStatus)">
-                <md-button
-                  ng-click="vm.unPause(vm.agents[value])"
-                  translate="OPENCHANNEL.UNPAUSE"
-                >
-                  Unpause
-                </md-button>
-              </md-menu-item>
-            </md-menu-content>
-          </md-menu>
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</md-table-container>
-
-<md-table-pagination
-  md-label="{page: '{{'OPENCHANNEL.PAGE' | translate}}:', rowsPerPage: '{{'OPENCHANNEL.ROWSPERPAGE' | translate}}:', of: '{{'OPENCHANNEL.OF' | translate}}'}"
-  md-limit="vm.query.limit"
-  md-limit-options="[10, 15, 20, 50, 100, 250]"
-  md-page="vm.query.page"
-  md-total="{{vm.filteredAgents.length}}"
-  md-on-paginate="vm.onInit"
-  md-page-select
-></md-table-pagination>
-<!-- / AGENT TABLE -->
-<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/openchannel/views/realtime/agents/view.html/view.html b/public/src/js/modules/main/apps/openchannel/views/realtime/agents/view.html/view.html
new file mode 100644
index 0000000..f6ba223
--- /dev/null
+++ b/public/src/js/modules/main/apps/openchannel/views/realtime/agents/view.html/view.html
@@ -0,0 +1,517 @@
+<!-- MAIN -->
+<md-toolbar class="md-table-toolbar md-default">
+  <div class="md-toolbar-tools">
+    <span class="md-subhead" translate="OPENCHANNEL.AGENTS">Agents</span>
+    <div flex></div>
+    <ms-search-bar
+      on-search="vm.query.filter = query; vm.onInit()"
+      on-collapse="vm.query.filter = undefined; vm.onInit()"
+      debounce="300"
+    ></ms-search-bar>
+    <md-select
+      ng-model="vm.query.globalStatusFilter"
+      class="md-caption"
+      ng-change="vm.query.pauseTypeFilter = ''; vm.onInit()"
+    >
+      <md-option ng-value="''">{{ 'OPENCHANNEL.ALL' | translate }}</md-option>
+      <md-option value="pause">{{ 'OPENCHANNEL.PAUSE' | translate }}</md-option>
+      <md-option value="*pause"
+        >{{ 'OPENCHANNEL.PARTIALPAUSE' | translate }}</md-option
+      >
+      <md-option value="busy">{{ 'OPENCHANNEL.BUSY' | translate }}</md-option>
+      <md-option value="idle">{{ 'OPENCHANNEL.IDLE' | translate }}</md-option>
+    </md-select>
+
+    <md-select
+      ng-if="vm.isPause(vm.query.globalStatusFilter)"
+      ng-model="vm.query.pauseTypeFilter"
+      class="md-caption"
+      ng-change="vm.onInit()"
+    >
+      <md-option ng-value="''">All</md-option>
+      <md-option value="DEFAULT PAUSE">DEFAULT PAUSE</md-option>
+      <md-option value="ACW">ACW</md-option>
+      <md-option value="LOGININPAUSE">LOGININPAUSE</md-option>
+      <md-option value="Auto-Pause">AUTOPAUSE</md-option>
+      <md-option ng-value="pause.name" ng-repeat="pause in vm.pauses.rows"
+        >{{pause.name}}</md-option
+      >
+    </md-select>
+  </div>
+</md-toolbar>
+
+<!-- AGENT TABLE -->
+<md-table-container>
+  <table md-table multiple md-progress="vm.promise">
+    <thead md-head md-order="vm.query.order" md-on-reorder="vm.onInit">
+      <tr md-row border="1">
+        <th class="bv text-center" colspan="5">
+          {{ 'OPENCHANNEL.AGENT' | translate }}
+        </th>
+        <th class="bv bl text-center" colspan="2">
+          {{ 'VOICE.VOICE' | translate }}
+        </th>
+        <th ng-if="vm.license.chat" class="bv bl text-center" colspan="2">
+          {{ 'CHAT.CHAT' | translate }}
+        </th>
+        <th ng-if="vm.license.mail" class="bv bl text-center" colspan="2">
+          {{ 'MAIL.MAIL' | translate }}
+        </th>
+        <th ng-if="vm.license.messaging" class="bv bl text-center" colspan="2">
+          {{ 'SMS.SMS' | translate }}
+        </th>
+        <th
+          ng-if="vm.license.openchannel"
+          class="bv bl text-center"
+          colspan="2"
+        >
+          {{ 'OPENCHANNEL.OPENCHANNEL' | translate }}
+        </th>
+        <th ng-if="vm.license.fax" class="bv bl text-center" colspan="2">
+          {{ 'FAX.FAX' | translate }}
+        </th>
+        <th ng-if="vm.license.whatsapp" class="bv bl text-center" colspan="2">
+          {{ 'WHATSAPP.WHATSAPP' | translate }}
+        </th>
+        <th width="10px" class="bt bl" rowspan="2"></th>
+      </tr>
+      <tr md-row>
+        <th class="bl" colspan="2" md-column md-order-by="fullname">
+          {{ 'OPENCHANNEL.NAME' | translate }}
+        </th>
+        <th class="bl custom-column" md-column md-order-by="globalStatus">
+          {{ 'OPENCHANNEL.STATUS' | translate }}
+        </th>
+        <th class="bl custom-column" md-column md-order-by="lastLoginAt">
+          {{ 'OPENCHANNEL.LOGIN_TIME' | translate }}
+        </th>
+        <th class="bl custom-column" md-column md-order-by="lastPauseAt">
+          {{ 'OPENCHANNEL.PAUSE_TIME' | translate }}
+        </th>
+
+        <th class="bl custom-column">{{ 'VOICE.STATUS' | translate }}</th>
+        <th class="bl custom-column">Info</th>
+
+        <th ng-if="vm.license.chat" class="bl text-center">
+          {{ 'CHAT.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.chat" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'CHAT.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.mail" class="bl text-center">
+          {{ 'MAIL.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.mail" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'MAIL.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.messaging" class="bl text-center">
+          {{ 'SMS.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.messaging" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'SMS.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.openchannel" class="bl text-center">
+          {{ 'OPENCHANNEL.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.openchannel" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'OPENCHANNEL.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.fax" class="bl text-center">
+          {{ 'FAX.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.fax" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'FAX.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.whatsapp" class="bl text-center">
+          {{ 'WHATSAPP.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.whatsapp" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'WHATSAPP.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+      </tr>
+    </thead>
+    <tbody md-body>
+      <tr md-row ng-hide="vm.order.length">
+        <td md-cell colspan="19">
+          <div layout="row" layout-align="center center">
+            <span>{{ 'OPENCHANNEL.NO_AGENT_ONLINE' | translate }}</span>
+          </div>
+        </td>
+      </tr>
+      <tr
+        md-select="vm.agents[value]"
+        md-select-id="id"
+        ng-repeat="(id, value) in vm.order"
+      >
+        <td class="bt padding-5">
+          <div layout="row" layout-align="start center">
+            <img
+              class="avatar"
+              ng-src="{{vm.agents[value].userpic && 'api/users/'+vm.agents[value].id+'/avatar' || 'assets/images/avatars/profile.png'}}"
+            />
+            <div layout="column">
+              <span>{{vm.agents[value].fullname}}</span>
+              <span>{{vm.agents[value].internal}}</span>
+            </div>
+          </div>
+        </td>
+        <td class="bt padding-5">
+          <div
+            layout="row"
+            layout-align="start center"
+            ng-if="vm.license.screenrecording && (vm.agents[value].phoneBarEnableScreenRecordingByAgent || vm.agents[value].phoneBarEnableAutomaticScreenRecording)"
+          >
+            <div class="column" ng-if="vm.agents[value].screenrecording">
+              <span>
+                <md-icon
+                  md-font-icon="icon-camcorder-box"
+                  style="color: green; font-size: 36px"
+                  aria-label="icon-camcorder-box26"
+                >
+                  <md-tooltip>
+                    {{ 'OPENCHANNEL.TOOLTIP_SCREENRECORDING_ON' | translate }}
+                  </md-tooltip>
+                </md-icon>
+              </span>
+            </div>
+            <div class="column" ng-if="!vm.agents[value].screenrecording">
+              <span>
+                <md-icon
+                  md-font-icon="icon-camcorder-box"
+                  style="color: gray"
+                  aria-label="icon-camcorder-box26"
+                >
+                  <md-tooltip>
+                    {{ 'OPENCHANNEL.TOOLTIP_SCREENRECORDING_OFF' | translate }}
+                  </md-tooltip>
+                </md-icon>
+              </span>
+            </div>
+          </div>
+        </td>
+
+        <td class="bt">
+          <span
+            class="text-boxed md-background-bg bl bt padding-5"
+            ng-class="{'idle':'lime-300-bg','busy':'indigo-100-bg','*pause':'amber-50-bg','pause':'amber-200-bg'}[vm.agents[value].globalStatus]"
+            >{{ vm.isPause(vm.agents[value].globalStatus) ? '' :
+            vm.agents[value].globalStatus | uppercase }} {{
+            vm.isPause(vm.agents[value].globalStatus) ?
+            (vm.isPartialPause(vm.agents[value].globalStatus) ?
+            '*'+vm.agents[value].pauseType || 'DEFAULT PAUSE' :
+            vm.agents[value].pauseType || 'DEFAULT PAUSE') : ''}}</span
+          >
+        </td>
+        <td class="bt custom-column">
+          <timer start-time="vm.agents[value].lastLoginAt" interval="1000"
+            >{{ days > 0 ? days + 'd' : '' }}
+            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
+          >
+        </td>
+        <td class="bt custom-column">
+          <timer
+            ng-if="vm.isPause(vm.agents[value].globalStatus) || vm.isPartialPause(vm.agents[value].globalStatus)"
+            start-time="vm.agents[value].lastPauseAt"
+            interval="1000"
+            >{{ days > 0 ? days + 'd' : '' }}
+            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
+          >
+        </td>
+        <td class="bt bl">
+          <div layout="row">
+            <span
+              ng-if="!vm.agents[value].onhold"
+              class="text-boxed md-background-bg bl bt padding-5"
+              ng-class="{'idle':'lime-300-bg','talking':'indigo-100-bg','ringing':'orange-400-bg','pause':'amber-200-bg'}[vm.agents[value].voiceStatus]"
+              >{{ vm.agents[value].voiceStatus | uppercase }}</span
+            >
+            <span
+              ng-if="vm.agents[value].onhold"
+              class="text-boxed md-background-bg bl bt padding-5 orange-400-bg"
+              >ONHOLD</span
+            >
+          </div>
+        </td>
+        <td class="bt bl">
+          <div layout="column">
+            <span
+              ng-if="vm.agents[value].queue"
+              class="padding-5"
+              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
+              >{{ vm.agents[value].queue }}</span
+            >
+            <span
+              ng-if="vm.agents[value].destconnectedlinenum"
+              class="padding-5"
+              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
+              >{{ vm.agents[value].destconnectedlinenum }}</span
+            >
+            <span
+              class="padding-5"
+              ng-if="vm.agents[value].queue || vm.agents[value].destconnectedlinenum"
+            >
+              <timer
+                start-time="vm.agents[value].voiceStatusTime"
+                interval="1000"
+                ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
+              >
+                {{hhours}}:{{mminutes}}:{{sseconds}}</timer
+              >
+            </span>
+          </div>
+        </td>
+
+        <td class="bt bl" ng-if="vm.license.chat">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].chatStatus]"
+                >{{ vm.agents[value].chatStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          md-number
+          class="bt text-center font-size-20"
+          ng-if="vm.license.chat"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].chatStatus]"
+        >
+          {{ vm.agents[value].chatCurrentCapacity }}
+        </td>
+
+        <td class="bl bt" ng-if="vm.license.mail">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].mailStatus]"
+                >{{ vm.agents[value].mailStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.mail"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].mailStatus]"
+        >
+          {{ vm.agents[value].mailCurrentCapacity }}
+        </td>
+
+        <td class="bl bt" ng-if="vm.license.messaging">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].smsStatus]"
+                >{{ vm.agents[value].smsStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.messaging"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].smsStatus]"
+        >
+          {{ vm.agents[value].smsCurrentCapacity }}
+        </td>
+
+        <td class="bt bl" ng-if="vm.license.openchannel">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].openchannelStatus]"
+                >{{ vm.agents[value].openchannelStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.openchannel"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].openchannelStatus]"
+        >
+          {{ vm.agents[value].openchannelCurrentCapacity }}
+        </td>
+
+        <td class="bt bl" ng-if="vm.license.fax">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].faxStatus]"
+                >{{ vm.agents[value].faxStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.fax"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].faxStatus]"
+        >
+          {{ vm.agents[value].faxCurrentCapacity }}
+        </td>
+
+        <td class="bl bt" ng-if="vm.license.whatsapp">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].whatsappStatus]"
+                >{{ vm.agents[value].whatsappStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.whatsapp"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].whatsappStatus]"
+        >
+          {{ vm.agents[value].whatsappCurrentCapacity }}
+        </td>
+
+        <td
+          class="bl bt padding-5 text-center"
+          ng-if="vm.crudPermissions.canEdit"
+        >
+          <md-menu>
+            <md-button
+              class="md-icon-button"
+              aria-label="More"
+              translate
+              translate-attr-aria-label="STAFF.MORE"
+              ng-click="$mdMenu.open($event)"
+            >
+              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+            </md-button>
+
+            <md-menu-content width="4">
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.logout(vm.agents[value], $event)"
+                  translate="OPENCHANNEL.LOGOUT"
+                >
+                  Logout
+                </md-button>
+              </md-menu-item>
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.queueAdd(vm.agents[value], $event)"
+                  translate="OPENCHANNEL.AGENTADD_QUEUE"
+                >
+                  Add Agent In Queue
+                </md-button>
+              </md-menu-item>
+
+              <md-menu-item
+                ng-if="vm.license.screenrecording && vm.agents[value].phoneBarEnableScreenRecordingByAgent"
+              >
+                <md-menu>
+                  <md-button
+                    ng-click="$mdMenu.open()"
+                    class="text-capitalize"
+                    translate="OPENCHANNEL.SCREENRECORDING"
+                    >Screen Recording
+                  </md-button>
+                  <md-menu-content>
+                    <md-menu-item ng-if="!vm.agents[value].screenrecording">
+                      <md-button
+                        ng-click="vm.screenRecording(vm.agents[value], true)"
+                        ><em translate="OPENCHANNEL.START_SCREENRECORDING"
+                          >Start Screen Recording</em
+                        ></md-button
+                      >
+                    </md-menu-item>
+                    <md-menu-item ng-if="vm.agents[value].screenrecording">
+                      <md-button
+                        ng-click="vm.screenRecording(vm.agents[value], false)"
+                        ><em translate="OPENCHANNEL.STOP_SCREENRECORDING"
+                          >Stop Screen Recording</em
+                        ></md-button
+                      >
+                    </md-menu-item>
+                  </md-menu-content>
+                </md-menu>
+              </md-menu-item>
+
+              <md-menu-item>
+                <md-menu>
+                  <md-button
+                    ng-click="$mdMenu.open()"
+                    class="text-capitalize"
+                    translate="OPENCHANNEL.PAUSE"
+                    >Pause</md-button
+                  >
+                  <md-menu-content>
+                    <md-menu-item>
+                      <md-button
+                        ng-disabled=" vm.agents[value].voicePause && 'DEFAULT PAUSE' === vm.agents[value].pauseType"
+                        ng-click="vm.pause(vm.agents[value])"
+                        ><em translate="OPENCHANNEL.DEFAULT_PAUSE"
+                          >Default Pause</em
+                        ></md-button
+                      >
+                    </md-menu-item>
+                    <md-menu-item
+                      ng-if="vm.pauses.rows.length"
+                      ng-repeat="pause in vm.pauses.rows"
+                    >
+                      <md-button
+                        ng-disabled="vm.agents[value].voicePause && pause.name === vm.agents[value].pauseType"
+                        ng-click="vm.pause(vm.agents[value], pause.name)"
+                        >{{pause.name}}
+                      </md-button>
+                    </md-menu-item>
+                  </md-menu-content>
+                </md-menu>
+              </md-menu-item>
+              <md-menu-item ng-if="vm.isPause(vm.agents[value].globalStatus)">
+                <md-button
+                  ng-click="vm.unPause(vm.agents[value])"
+                  translate="OPENCHANNEL.UNPAUSE"
+                >
+                  Unpause
+                </md-button>
+              </md-menu-item>
+            </md-menu-content>
+          </md-menu>
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</md-table-container>
+
+<md-table-pagination
+  md-label="{page: '{{'OPENCHANNEL.PAGE' | translate}}:', rowsPerPage: '{{'OPENCHANNEL.ROWSPERPAGE' | translate}}:', of: '{{'OPENCHANNEL.OF' | translate}}'}"
+  md-limit="vm.query.limit"
+  md-limit-options="[10, 15, 20, 50, 100, 250]"
+  md-page="vm.query.page"
+  md-total="{{vm.filteredAgents.length}}"
+  md-on-paginate="vm.onInit"
+  md-page-select
+></md-table-pagination>
+<!-- / AGENT TABLE -->
+<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/openchannel/views/realtime/queues/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/openchannel/views/realtime/queues/view.html/view-[chunkhash].html
deleted file mode 100644
index b213b4d..0000000
--- a/public/src/js/modules/main/apps/openchannel/views/realtime/queues/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,114 +0,0 @@
-<!-- MAIN -->
-<md-toolbar class="md-table-toolbar md-default">
-  <div class="md-toolbar-tools">
-    <span class="md-subhead" translate="OPENCHANNEL.QUEUES">Queues</span>
-    <div flex></div>
-    <ms-search-bar
-      on-search="vm.query.filter = query;"
-      on-collapse="vm.query.filter = undefined;"
-      debounce="300"
-    ></ms-search-bar>
-  </div>
-</md-toolbar>
-
-<!-- QUEUE TABLE -->
-<md-table-container>
-  <table md-table multiple md-progress="vm.promise">
-    <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getQueues">
-      <tr md-row>
-        <th md-column md-order-by="name">
-          {{ 'OPENCHANNEL.NAME' | translate }}
-        </th>
-        <th md-column>{{ 'OPENCHANNEL.LOGGED_IN' | translate }}</th>
-        <th md-column>{{ 'OPENCHANNEL.PAUSED' | translate }}</th>
-        <th md-column>{{ 'OPENCHANNEL.READY' | translate }}</th>
-        <th md-column>{{ 'OPENCHANNEL.WAITING' | translate }}</th>
-        <th md-column width="10px"></th>
-      </tr>
-    </thead>
-    <tbody md-body>
-      <tr md-row ng-hide="vm.queues">
-        <td md-cell colspan="7">
-          <div layout="row" layout-align="center center">
-            <span translate="OPENCHANNEL.NO_AVAILABLE_INFO"
-              >No Available Info</span
-            >
-          </div>
-        </td>
-      </tr>
-      <tr
-        md-row
-        md-select="vm.queues[value]"
-        md-select-id="id"
-        ng-repeat="(id, value) in vm.order"
-      >
-        <td md-cell>{{vm.queues[value].name}}</td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{vm.queues[value].loggedInDb || 0}} ({{vm.queues[value].loggedIn
-            || 0}})</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{vm.queues[value].paused || 0}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-16 grey-fg"
-            >{{vm.queues[value].available || 0}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{vm.queues[value].waiting || 0}}</span
-          >
-        </td>
-        <td md-cell class="actions" ng-if="vm.crudPermissions.canEdit">
-          <md-menu>
-            <md-button
-              class="md-icon-button"
-              aria-label="More"
-              translate
-              translate-attr-aria-label="OPENCHANNEL.MORE"
-              ng-click="$mdMenu.open($event)"
-            >
-              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-            </md-button>
-
-            <md-menu-content width="3">
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.createOrEditOpenchannelQueue($event, vm.queues[value])"
-                  translate="OPENCHANNEL.EDIT_QUEUE"
-                >
-                  Edit Queue
-                </md-button>
-              </md-menu-item>
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.agentAdd($event, vm.queues[value])"
-                  translate="OPENCHANNEL.AGENTSADD_QUEUE"
-                >
-                  Add Agents to queue
-                </md-button>
-              </md-menu-item>
-            </md-menu-content>
-          </md-menu>
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</md-table-container>
-
-<md-table-pagination
-  md-label="{page: '{{'OPENCHANNEL.PAGE' | translate}}:', rowsPerPage: '{{'OPENCHANNEL.ROWSPERPAGE' | translate}}:', of: '{{'OPENCHANNEL.OF' | translate}}'}"
-  md-limit="vm.query.limit"
-  md-limit-options="[10, 15, 20, 50, 100, 250]"
-  md-page="vm.query.page"
-  md-total="{{vm.count}}"
-  md-on-paginate="vm.getQueues"
-  md-page-select
-></md-table-pagination>
-<!-- / QUEUE TABLE -->
-<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/openchannel/views/realtime/queues/view.html/view.html b/public/src/js/modules/main/apps/openchannel/views/realtime/queues/view.html/view.html
new file mode 100644
index 0000000..b213b4d
--- /dev/null
+++ b/public/src/js/modules/main/apps/openchannel/views/realtime/queues/view.html/view.html
@@ -0,0 +1,114 @@
+<!-- MAIN -->
+<md-toolbar class="md-table-toolbar md-default">
+  <div class="md-toolbar-tools">
+    <span class="md-subhead" translate="OPENCHANNEL.QUEUES">Queues</span>
+    <div flex></div>
+    <ms-search-bar
+      on-search="vm.query.filter = query;"
+      on-collapse="vm.query.filter = undefined;"
+      debounce="300"
+    ></ms-search-bar>
+  </div>
+</md-toolbar>
+
+<!-- QUEUE TABLE -->
+<md-table-container>
+  <table md-table multiple md-progress="vm.promise">
+    <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getQueues">
+      <tr md-row>
+        <th md-column md-order-by="name">
+          {{ 'OPENCHANNEL.NAME' | translate }}
+        </th>
+        <th md-column>{{ 'OPENCHANNEL.LOGGED_IN' | translate }}</th>
+        <th md-column>{{ 'OPENCHANNEL.PAUSED' | translate }}</th>
+        <th md-column>{{ 'OPENCHANNEL.READY' | translate }}</th>
+        <th md-column>{{ 'OPENCHANNEL.WAITING' | translate }}</th>
+        <th md-column width="10px"></th>
+      </tr>
+    </thead>
+    <tbody md-body>
+      <tr md-row ng-hide="vm.queues">
+        <td md-cell colspan="7">
+          <div layout="row" layout-align="center center">
+            <span translate="OPENCHANNEL.NO_AVAILABLE_INFO"
+              >No Available Info</span
+            >
+          </div>
+        </td>
+      </tr>
+      <tr
+        md-row
+        md-select="vm.queues[value]"
+        md-select-id="id"
+        ng-repeat="(id, value) in vm.order"
+      >
+        <td md-cell>{{vm.queues[value].name}}</td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{vm.queues[value].loggedInDb || 0}} ({{vm.queues[value].loggedIn
+            || 0}})</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{vm.queues[value].paused || 0}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-16 grey-fg"
+            >{{vm.queues[value].available || 0}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{vm.queues[value].waiting || 0}}</span
+          >
+        </td>
+        <td md-cell class="actions" ng-if="vm.crudPermissions.canEdit">
+          <md-menu>
+            <md-button
+              class="md-icon-button"
+              aria-label="More"
+              translate
+              translate-attr-aria-label="OPENCHANNEL.MORE"
+              ng-click="$mdMenu.open($event)"
+            >
+              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+            </md-button>
+
+            <md-menu-content width="3">
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.createOrEditOpenchannelQueue($event, vm.queues[value])"
+                  translate="OPENCHANNEL.EDIT_QUEUE"
+                >
+                  Edit Queue
+                </md-button>
+              </md-menu-item>
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.agentAdd($event, vm.queues[value])"
+                  translate="OPENCHANNEL.AGENTSADD_QUEUE"
+                >
+                  Add Agents to queue
+                </md-button>
+              </md-menu-item>
+            </md-menu-content>
+          </md-menu>
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</md-table-container>
+
+<md-table-pagination
+  md-label="{page: '{{'OPENCHANNEL.PAGE' | translate}}:', rowsPerPage: '{{'OPENCHANNEL.ROWSPERPAGE' | translate}}:', of: '{{'OPENCHANNEL.OF' | translate}}'}"
+  md-limit="vm.query.limit"
+  md-limit-options="[10, 15, 20, 50, 100, 250]"
+  md-page="vm.query.page"
+  md-total="{{vm.count}}"
+  md-on-paginate="vm.getQueues"
+  md-page-select
+></md-table-pagination>
+<!-- / QUEUE TABLE -->
+<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/openchannel/views/realtime/realtime.html/realtime-[chunkhash].html b/public/src/js/modules/main/apps/openchannel/views/realtime/realtime.html/realtime-[chunkhash].html
deleted file mode 100644
index b165c0a..0000000
--- a/public/src/js/modules/main/apps/openchannel/views/realtime/realtime.html/realtime-[chunkhash].html
+++ /dev/null
@@ -1,26 +0,0 @@
-<div id="realtime" class="page-layout simple tabbed" layout="column" ng-cloak>
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="OPENCHANNEL.AGENTS">Agents</span>
-        </md-tab-label>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="OPENCHANNEL.QUEUES">Queues</span>
-        </md-tab-label>
-      </md-tab>
-    </md-tabs>
-
-    <md-card ui-view></md-card>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/openchannel/views/realtime/realtime.html/realtime.html b/public/src/js/modules/main/apps/openchannel/views/realtime/realtime.html/realtime.html
new file mode 100644
index 0000000..b165c0a
--- /dev/null
+++ b/public/src/js/modules/main/apps/openchannel/views/realtime/realtime.html/realtime.html
@@ -0,0 +1,26 @@
+<div id="realtime" class="page-layout simple tabbed" layout="column" ng-cloak>
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="OPENCHANNEL.AGENTS">Agents</span>
+        </md-tab-label>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="OPENCHANNEL.QUEUES">Queues</span>
+        </md-tab-label>
+      </md-tab>
+    </md-tabs>
+
+    <md-card ui-view></md-card>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/plugins/views/plugin/plugin.html/plugin-[chunkhash].html b/public/src/js/modules/main/apps/plugins/views/plugin/plugin.html/plugin-[chunkhash].html
deleted file mode 100644
index 8fdf197..0000000
--- a/public/src/js/modules/main/apps/plugins/views/plugin/plugin.html/plugin-[chunkhash].html
+++ /dev/null
@@ -1,10 +0,0 @@
-<div ng-if="!vm.plugin">
-  <p>Plugin not available...</p>
-</div>
-<div id="plugin" ng-if="vm.plugin" ng-cloak layout-fill>
-  <iframe
-    ng-src="{{vm.getTrustedURL()}}"
-    frameborder="0"
-    style="border: 0px; width: 100%; height: 100%"
-  ></iframe>
-</div>
diff --git a/public/src/js/modules/main/apps/plugins/views/plugin/plugin.html/plugin.html b/public/src/js/modules/main/apps/plugins/views/plugin/plugin.html/plugin.html
new file mode 100644
index 0000000..8fdf197
--- /dev/null
+++ b/public/src/js/modules/main/apps/plugins/views/plugin/plugin.html/plugin.html
@@ -0,0 +1,10 @@
+<div ng-if="!vm.plugin">
+  <p>Plugin not available...</p>
+</div>
+<div id="plugin" ng-if="vm.plugin" ng-cloak layout-fill>
+  <iframe
+    ng-src="{{vm.getTrustedURL()}}"
+    frameborder="0"
+    style="border: 0px; width: 100%; height: 100%"
+  ></iframe>
+</div>
diff --git a/public/src/js/modules/main/apps/settings/views/cloudProviders/cloudProviders.html/cloudProviders-[chunkhash].html b/public/src/js/modules/main/apps/settings/views/cloudProviders/cloudProviders.html/cloudProviders-[chunkhash].html
deleted file mode 100644
index b02e18a..0000000
--- a/public/src/js/modules/main/apps/settings/views/cloudProviders/cloudProviders.html/cloudProviders-[chunkhash].html
+++ /dev/null
@@ -1,293 +0,0 @@
-<div
-  id="cloudProviders"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-cog" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="SETTINGS.AITOOLS">AiTools</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="SETTINGS.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedAiTools.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedAiTools =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="SETTINGS.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-cloudProviders-count">
-          <span>{{vm.selectedAiTools.length}}</span>
-          <span translate="SETTINGS.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="SETTINGS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllAiTools()"
-                translate="SETTINGS.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectAiTools()"
-                translate="SETTINGS.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedAiTools"
-          csv-label="true"
-          filename="cloudProviders.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-click="vm.deleteSelectedAiTools($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="SETTINGS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- CLOUDPROVIDER TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedAiTools"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getAiTools"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">
-                  {{ 'SETTINGS.ID' | translate }}
-                </th>
-                <th md-column md-order-by="name">
-                  {{ 'SETTINGS.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="service">
-                  {{ 'SETTINGS.SERVICE' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.cloudProviders.rows.length">
-                <td md-cell colspan="4">
-                  <div layout="row" layout-align="center center">
-                    <span translate="SETTINGS.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="cloudProvider"
-                md-select-id="id"
-                ng-repeat="cloudProvider in vm.cloudProviders.rows"
-              >
-                <td md-cell ng-if="cloudProvider.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{cloudProvider.name}}"
-                    ng-src="api/users/{{cloudProvider.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!cloudProvider.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{cloudProvider.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.createOrEditCloudProvider($event, cloudProvider)"
-                  md-cell
-                  class="id"
-                >
-                  {{cloudProvider.id}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditCloudProvider($event, cloudProvider)"
-                  md-cell
-                  class="name"
-                >
-                  {{cloudProvider.name}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditCloudProvider($event, cloudProvider)"
-                  md-cell
-                  class="service"
-                >
-                  {{ vm.arrayservice[cloudProvider.service].option }}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="SETTINGS.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.editdialog(cloudProvider, $event    )"
-                          translate="SETTINGS.EDIT_CLOUDPROVIDER"
-                        >
-                          Edit CloudProvider
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.deleteconfirm(cloudProvider, $event    )"
-                          translate="SETTINGS.DELETE_CLOUDPROVIDER"
-                        >
-                          Delete CloudProvider
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'SETTINGS.PAGE' | translate}}:', rowsPerPage: '{{'SETTINGS.ROWSPERPAGE' | translate}}:', of: '{{'SETTINGS.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.cloudProviders.count}}"
-          md-on-paginate="vm.getAiTools"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / CLOUDPROVIDER TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD CLOUDPROVIDER BUTTON -->
-  <md-button
-    class="md-fab md-accent add-item-button"
-    id="add-cloudProvider-button"
-    ng-click="vm.createOrEditCloudProvider($event)"
-    aria-label="add cloudProvider"
-    translate
-    translate-attr-aria-label="SETTINGS.ADD_CLOUDPROVIDER"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD CLOUDPROVIDER BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/settings/views/cloudProviders/cloudProviders.html/cloudProviders.html b/public/src/js/modules/main/apps/settings/views/cloudProviders/cloudProviders.html/cloudProviders.html
new file mode 100644
index 0000000..b02e18a
--- /dev/null
+++ b/public/src/js/modules/main/apps/settings/views/cloudProviders/cloudProviders.html/cloudProviders.html
@@ -0,0 +1,293 @@
+<div
+  id="cloudProviders"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-cog" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="SETTINGS.AITOOLS">AiTools</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="SETTINGS.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedAiTools.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedAiTools =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="SETTINGS.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-cloudProviders-count">
+          <span>{{vm.selectedAiTools.length}}</span>
+          <span translate="SETTINGS.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="SETTINGS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllAiTools()"
+                translate="SETTINGS.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectAiTools()"
+                translate="SETTINGS.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedAiTools"
+          csv-label="true"
+          filename="cloudProviders.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-click="vm.deleteSelectedAiTools($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="SETTINGS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- CLOUDPROVIDER TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedAiTools"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getAiTools"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">
+                  {{ 'SETTINGS.ID' | translate }}
+                </th>
+                <th md-column md-order-by="name">
+                  {{ 'SETTINGS.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="service">
+                  {{ 'SETTINGS.SERVICE' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.cloudProviders.rows.length">
+                <td md-cell colspan="4">
+                  <div layout="row" layout-align="center center">
+                    <span translate="SETTINGS.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="cloudProvider"
+                md-select-id="id"
+                ng-repeat="cloudProvider in vm.cloudProviders.rows"
+              >
+                <td md-cell ng-if="cloudProvider.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{cloudProvider.name}}"
+                    ng-src="api/users/{{cloudProvider.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!cloudProvider.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{cloudProvider.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.createOrEditCloudProvider($event, cloudProvider)"
+                  md-cell
+                  class="id"
+                >
+                  {{cloudProvider.id}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditCloudProvider($event, cloudProvider)"
+                  md-cell
+                  class="name"
+                >
+                  {{cloudProvider.name}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditCloudProvider($event, cloudProvider)"
+                  md-cell
+                  class="service"
+                >
+                  {{ vm.arrayservice[cloudProvider.service].option }}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="SETTINGS.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.editdialog(cloudProvider, $event    )"
+                          translate="SETTINGS.EDIT_CLOUDPROVIDER"
+                        >
+                          Edit CloudProvider
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.deleteconfirm(cloudProvider, $event    )"
+                          translate="SETTINGS.DELETE_CLOUDPROVIDER"
+                        >
+                          Delete CloudProvider
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'SETTINGS.PAGE' | translate}}:', rowsPerPage: '{{'SETTINGS.ROWSPERPAGE' | translate}}:', of: '{{'SETTINGS.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.cloudProviders.count}}"
+          md-on-paginate="vm.getAiTools"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / CLOUDPROVIDER TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD CLOUDPROVIDER BUTTON -->
+  <md-button
+    class="md-fab md-accent add-item-button"
+    id="add-cloudProvider-button"
+    ng-click="vm.createOrEditCloudProvider($event)"
+    aria-label="add cloudProvider"
+    translate
+    translate-attr-aria-label="SETTINGS.ADD_CLOUDPROVIDER"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD CLOUDPROVIDER BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/settings/views/cloudProviders/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/settings/views/cloudProviders/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index bf81b79..0000000
--- a/public/src/js/modules/main/apps/settings/views/cloudProviders/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,199 +0,0 @@
-<md-dialog class="cloudProvider-dialog" aria-label="New CloudProvider">
-  <form name="cloudProviderForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="SETTINGS.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.cloudProvider.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="cloudProviderForm['name'].$error"
-          ng-show="cloudProviderForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SETTINGS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="SETTINGS.SERVICE">Service</label>
-        <md-select
-          name="service"
-          ng-model="vm.cloudProvider.service"
-          required
-          ng-disabled="!vm.newCloudProvider"
-        >
-          <md-option ng-value="'AmazonAWS'">AmazonAWS</md-option>
-        </md-select>
-        <div
-          ng-messages="cloudProviderForm['service'].$error"
-          ng-show="cloudProviderForm['service'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SETTINGS.ERRORS.SERVICE_REQUIRED"
-              >Service field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.cloudProvider.service == 'AmazonAWS'"
-        class="md-block"
-      >
-        <label translate="SETTINGS.ACCESSKEY">AccessKey</label>
-        <input
-          type="text"
-          name="data2"
-          ng-model="vm.cloudProvider.data2"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="cloudProviderForm['data2'].$error"
-          ng-show="cloudProviderForm['data2'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SETTINGS.ERRORS.ACCESSKEY_REQUIRED"
-              >AccessKey field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.cloudProvider.service == 'AmazonAWS'"
-        class="md-block"
-      >
-        <label translate="SETTINGS.SECRETACCESSKEY">SecretAccesskey</label>
-        <input
-          type="text"
-          name="data1"
-          ng-model="vm.cloudProvider.data1"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="cloudProviderForm['data1'].$error"
-          ng-show="cloudProviderForm['data1'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SETTINGS.ERRORS.SECRETACCESSKEY_REQUIRED"
-              >SecretAccesskey field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="!vm.newCloudProvider"
-          ng-click="vm.saveCloudProvider()"
-          class="send-button md-accent md-raised"
-          ng-disabled="cloudProviderForm.$invalid || cloudProviderForm.$pristine"
-          aria-label="SAVE"
-          translate="SETTINGS.SAVE"
-          translate-attr-aria-label="SETTINGS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.newCloudProvider"
-          ng-click="vm.addNewCloudProvider()"
-          class="send-button md-accent md-raised"
-          ng-disabled="cloudProviderForm.$invalid"
-          aria-label="ADD"
-          translate="SETTINGS.ADD_CLOUDPROVIDER"
-          translate-attr-aria-label="SETTINGS.ADD_CLOUDPROVIDER"
-        >
-          ADD CLOUDPROVIDER
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-click="vm.deleteCloudProvider($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="SETTINGS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="SETTINGS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/settings/views/cloudProviders/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/settings/views/cloudProviders/create/dialog.html/dialog.html
new file mode 100644
index 0000000..bf81b79
--- /dev/null
+++ b/public/src/js/modules/main/apps/settings/views/cloudProviders/create/dialog.html/dialog.html
@@ -0,0 +1,199 @@
+<md-dialog class="cloudProvider-dialog" aria-label="New CloudProvider">
+  <form name="cloudProviderForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="SETTINGS.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.cloudProvider.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="cloudProviderForm['name'].$error"
+          ng-show="cloudProviderForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SETTINGS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="SETTINGS.SERVICE">Service</label>
+        <md-select
+          name="service"
+          ng-model="vm.cloudProvider.service"
+          required
+          ng-disabled="!vm.newCloudProvider"
+        >
+          <md-option ng-value="'AmazonAWS'">AmazonAWS</md-option>
+        </md-select>
+        <div
+          ng-messages="cloudProviderForm['service'].$error"
+          ng-show="cloudProviderForm['service'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SETTINGS.ERRORS.SERVICE_REQUIRED"
+              >Service field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.cloudProvider.service == 'AmazonAWS'"
+        class="md-block"
+      >
+        <label translate="SETTINGS.ACCESSKEY">AccessKey</label>
+        <input
+          type="text"
+          name="data2"
+          ng-model="vm.cloudProvider.data2"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="cloudProviderForm['data2'].$error"
+          ng-show="cloudProviderForm['data2'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SETTINGS.ERRORS.ACCESSKEY_REQUIRED"
+              >AccessKey field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.cloudProvider.service == 'AmazonAWS'"
+        class="md-block"
+      >
+        <label translate="SETTINGS.SECRETACCESSKEY">SecretAccesskey</label>
+        <input
+          type="text"
+          name="data1"
+          ng-model="vm.cloudProvider.data1"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="cloudProviderForm['data1'].$error"
+          ng-show="cloudProviderForm['data1'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SETTINGS.ERRORS.SECRETACCESSKEY_REQUIRED"
+              >SecretAccesskey field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="!vm.newCloudProvider"
+          ng-click="vm.saveCloudProvider()"
+          class="send-button md-accent md-raised"
+          ng-disabled="cloudProviderForm.$invalid || cloudProviderForm.$pristine"
+          aria-label="SAVE"
+          translate="SETTINGS.SAVE"
+          translate-attr-aria-label="SETTINGS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.newCloudProvider"
+          ng-click="vm.addNewCloudProvider()"
+          class="send-button md-accent md-raised"
+          ng-disabled="cloudProviderForm.$invalid"
+          aria-label="ADD"
+          translate="SETTINGS.ADD_CLOUDPROVIDER"
+          translate-attr-aria-label="SETTINGS.ADD_CLOUDPROVIDER"
+        >
+          ADD CLOUDPROVIDER
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-click="vm.deleteCloudProvider($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="SETTINGS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="SETTINGS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/settings/views/customizations/customizations.html/customizations-[chunkhash].html b/public/src/js/modules/main/apps/settings/views/customizations/customizations.html/customizations-[chunkhash].html
deleted file mode 100644
index 8532d1b..0000000
--- a/public/src/js/modules/main/apps/settings/views/customizations/customizations.html/customizations-[chunkhash].html
+++ /dev/null
@@ -1,511 +0,0 @@
-<div
-  id="customizations"
-  class="page-layout simple left-sidenav inner-sidenav motion-form"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-cog" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="SETTINGS.CUSTOMIZATIONS"
-          >Customizations</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveCustomization()"
-        ng-disabled="(customizationsForm.$pristine && logoForm.$pristine && logologinForm.$pristine && preferredForm.$pristine && faviconForm.$pristine) || (customizationsForm.$invalid || logoForm.$invalid || logologinForm.$invalid || preferredForm.$invalid || faviconForm.$invalid)"
-        class="send-button md-accent md-raised"
-        translate="SETTINGS.SAVE"
-        translate-attr-aria-label="SETTINGS.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <div
-        class="customization-detail-form-container customizations motion-form__detail-form-container md-background-bg md-whiteframe-1dp"
-      >
-        <div class="pb-16" layout="row" layout-align="start center">
-          <div class="h2 secondary-text" translate="SETTINGS.CUSTOMIZATIONS">
-            CUSTOMIZATIONS
-          </div>
-        </div>
-        <form name="customizationsForm" novalidate>
-          <md-input-container class="md-block">
-            <md-switch
-              ng-model="vm.customization.defaultLogo"
-              aria-label="Default_Logo"
-              ><span translate="SETTINGS.DEFAULT_LOGO"
-                >Default_Logo</span
-              ></md-switch
-            >
-          </md-input-container>
-          <md-input-container class="md-block">
-            <md-switch
-              ng-model="vm.customization.defaultLoginLogo"
-              aria-label="Default_Login_Logo"
-              ><span translate="SETTINGS.DEFAULT_LOGIN_LOGO"
-                >Default_Login_Logo</span
-              ></md-switch
-            >
-          </md-input-container>
-          <md-input-container class="md-block">
-            <md-switch
-              ng-model="vm.customization.defaultFavicon"
-              aria-label="Default_Favicon"
-              ><span translate="SETTINGS.DEFAULT_FAVICON"
-                >Default_Favicon</span
-              ></md-switch
-            >
-          </md-input-container>
-          <md-input-container class="md-block">
-            <md-switch
-              ng-model="vm.customization.defaultHeaderWhiteLabel"
-              aria-label="Default_Header_WhiteLabel"
-              ><span translate="SETTINGS.DEFAULT_HEADER_WHITELABEL"
-                >Default_Header_WhiteLabel</span
-              ></md-switch
-            >
-          </md-input-container>
-          <md-input-container
-            ng-if="!vm.customization.defaultHeaderWhiteLabel"
-            class="md-block"
-          >
-            <label translate="SETTINGS.HEADER_WHITELABEL"
-              >Header_WhiteLabel</label
-            >
-            <input
-              type="text"
-              name="headerWhiteLabel"
-              ng-model="vm.customization.headerWhiteLabel"
-              ng-required="true"
-            />
-
-            <div
-              ng-messages="customizationsForm['headerWhiteLabel'].$error"
-              ng-show="customizationsForm['headerWhiteLabel'].$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="SETTINGS.ERRORS.HEADER_WHITELABEL_REQUIRED"
-                  >Header_WhiteLabel field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container class="md-block">
-            <md-switch
-              ng-model="vm.customization.defaultPageTitle"
-              aria-label="Default_Page_Title"
-              ><span translate="SETTINGS.DEFAULT_PAGE_TITLE"
-                >Default_Page_Title</span
-              ></md-switch
-            >
-          </md-input-container>
-          <md-input-container
-            ng-if="!vm.customization.defaultPageTitle"
-            class="md-block"
-          >
-            <label translate="SETTINGS.PAGE_TITLE">Page_Title</label>
-            <input
-              type="text"
-              name="pageTitle"
-              ng-model="vm.customization.pageTitle"
-              ng-required="true"
-            />
-
-            <div
-              ng-messages="customizationsForm['pageTitle'].$error"
-              ng-show="customizationsForm['pageTitle'].$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="SETTINGS.ERRORS.PAGE_TITLE_REQUIRED"
-                  >Page_Title field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container ng-if="vm.license.preferred" class="md-block">
-            <md-switch
-              ng-model="vm.customization.defaultPreferred"
-              aria-label="Default_Preferred"
-              ><span translate="SETTINGS.DEFAULT_PREFERRED"
-                >Default_Preferred</span
-              ></md-switch
-            >
-          </md-input-container>
-        </form>
-      </div>
-
-      <div
-        ng-if="!vm.customization.defaultLogo"
-        class="customization-detail-form-container logo motion-form__detail-form-container md-background-bg md-whiteframe-1dp"
-      >
-        <div class="pb-16" layout="row" layout-align="start center">
-          <div class="h2 secondary-text" translate="SETTINGS.LOGO">LOGO</div>
-        </div>
-        <div
-          ng-controller="CustomizationlogoController as vm_cl"
-          ng-init="vm_cl.init(vm.customization)"
-          class="customization-detail-form-container md-background-bg md-whiteframe-1dp"
-        >
-          <div
-            id="customization-image-uploader motion-card-view__image-uploader"
-            flow-init="vm_cl.ngFlowOptions"
-            flow-name="vm_cl.ngFlow.flow"
-            flow-files-submitted="vm_cl.upload()"
-            flow-file-added="vm_cl.fileAdded($file)"
-            flow-file-success="vm_cl.fileSuccess($file, $message)"
-            flow-complete="vm_cl.uploadComplete()"
-            flow-drop
-            flow-drag-enter="vm_cl.dropping=true"
-            flow-drag-leave="vm_cl.dropping=false"
-            ng-class="{'dropping':vm.dropping}"
-          >
-            <div
-              class="drop-text hint-text"
-              layout="row"
-              layout-align="center center"
-            >
-              <span translate="EC.DROP_TO_UPLOAD">Drop to upload</span>
-            </div>
-
-            <div
-              class="upload-button"
-              layout="column"
-              layout-align="center center"
-            >
-              <md-button class="md-accent md-raised" flow-btn>
-                Upload
-              </md-button>
-              <span class="secondary-text mt-8"
-                >You can also drop images here to upload. Only PNG, JPG - Max.
-                8MB</span
-              >
-            </div>
-
-            <div layout="row" layout-align="start start" layout-wrap>
-              <div
-                ng-repeat="logoimage in vm_cl.customization.images"
-                ng-switch="logoimage.type"
-              >
-                <div
-                  class="customization-image motion-card-view__image uploading"
-                  ng-switch-when="uploading"
-                  layout="row"
-                  layout-align="center center"
-                >
-                  <div
-                    class="overlay"
-                    layout="column"
-                    layout-align="center center"
-                  >
-                    <md-progress-linear
-                      md-mode="determinate"
-                      value="{{logoimage.file.progress() * 100}}"
-                    >
-                    </md-progress-linear>
-                  </div>
-                  <img class="media" flow-img="logoimage.file" />
-                </div>
-
-                <div
-                  class="customization-image motion-card-view__image-uploader"
-                  ng-switch-when="image"
-                  layout="row"
-                  layout-align="center center"
-                >
-                  <img class="media" ng-src="{{logoimage.url}}" />
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-
-      <div
-        ng-if="!vm.customization.defaultLoginLogo"
-        class="customization-detail-form-container logologin motion-form__detail-form-container md-background-bg md-whiteframe-1dp"
-      >
-        <div class="pb-16" layout="row" layout-align="start center">
-          <div class="h2 secondary-text" translate="SETTINGS.LOGOLOGIN">
-            LOGOLOGIN
-          </div>
-        </div>
-        <div
-          ng-controller="CustomizationlogologinController as vm_cll"
-          ng-init="vm_cll.init(vm.customization)"
-          class="customization-detail-form-container md-background-bg md-whiteframe-1dp"
-        >
-          <div
-            id="customization-image-uploader motion-card-view__image-uploader"
-            flow-init="vm_cll.ngFlowOptions"
-            flow-name="vm_cll.ngFlow.flow"
-            flow-files-submitted="vm_cll.upload()"
-            flow-file-added="vm_cll.fileAdded($file)"
-            flow-file-success="vm_cll.fileSuccess($file, $message)"
-            flow-complete="vm_cll.uploadComplete()"
-            flow-drop
-            flow-drag-enter="vm_cll.dropping=true"
-            flow-drag-leave="vm_cll.dropping=false"
-            ng-class="{'dropping':vm.dropping}"
-          >
-            <div
-              class="drop-text hint-text"
-              layout="row"
-              layout-align="center center"
-            >
-              <span translate="EC.DROP_TO_UPLOAD">Drop to upload</span>
-            </div>
-
-            <div
-              class="upload-button"
-              layout="column"
-              layout-align="center center"
-            >
-              <md-button class="md-accent md-raised" flow-btn>
-                Upload
-              </md-button>
-              <span class="secondary-text mt-8"
-                >You can also drop images here to upload. Only PNG, JPG - Max.
-                8MB</span
-              >
-            </div>
-
-            <div layout="row" layout-align="start start" layout-wrap>
-              <div
-                ng-repeat="logologinimage in vm_cll.customization.images"
-                ng-switch="logologinimage.type"
-              >
-                <div
-                  class="customization-image motion-card-view__image uploading"
-                  ng-switch-when="uploading"
-                  layout="row"
-                  layout-align="center center"
-                >
-                  <div
-                    class="overlay"
-                    layout="column"
-                    layout-align="center center"
-                  >
-                    <md-progress-linear
-                      md-mode="determinate"
-                      value="{{logologinimage.file.progress() * 100}}"
-                    >
-                    </md-progress-linear>
-                  </div>
-                  <img class="media" flow-img="logologinimage.file" />
-                </div>
-
-                <div
-                  class="customization-image motion-card-view__image-uploader"
-                  ng-switch-when="image"
-                  layout="row"
-                  layout-align="center center"
-                >
-                  <img class="media" ng-src="{{logologinimage.url}}" />
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-
-      <div
-        ng-if="!vm.customization.defaultPreferred && vm.license.preferred"
-        class="customization-detail-form-container preferred motion-form__detail-form-container md-background-bg md-whiteframe-1dp"
-      >
-        <div class="pb-16" layout="row" layout-align="start center">
-          <div class="h2 secondary-text" translate="SETTINGS.PREFERRED">
-            PREFERRED
-          </div>
-        </div>
-        <div
-          ng-controller="CustomizationpreferredController as vm_cp"
-          ng-init="vm_cp.init(vm.customization)"
-          class="customization-detail-form-container md-background-bg md-whiteframe-1dp"
-        >
-          <div
-            id="customization-image-uploader motion-card-view__image-uploader"
-            flow-init="vm_cp.ngFlowOptions"
-            flow-name="vm_cp.ngFlow.flow"
-            flow-files-submitted="vm_cp.upload()"
-            flow-file-added="vm_cp.fileAdded($file)"
-            flow-file-success="vm_cp.fileSuccess($file, $message)"
-            flow-complete="vm_cp.uploadComplete()"
-            flow-drop
-            flow-drag-enter="vm_cp.dropping=true"
-            flow-drag-leave="vm_cp.dropping=false"
-            ng-class="{'dropping':vm.dropping}"
-          >
-            <div
-              class="drop-text hint-text"
-              layout="row"
-              layout-align="center center"
-            >
-              <span translate="EC.DROP_TO_UPLOAD">Drop to upload</span>
-            </div>
-
-            <div
-              class="upload-button"
-              layout="column"
-              layout-align="center center"
-            >
-              <md-button class="md-accent md-raised" flow-btn>
-                Upload
-              </md-button>
-              <span class="secondary-text mt-8"
-                >You can also drop images here to upload. Only PNG, JPG - Max.
-                8MB</span
-              >
-            </div>
-
-            <div layout="row" layout-align="start start" layout-wrap>
-              <div
-                ng-repeat="preferredimage in vm_cp.customization.images"
-                ng-switch="preferredimage.type"
-              >
-                <div
-                  class="customization-image motion-card-view__image uploading"
-                  ng-switch-when="uploading"
-                  layout="row"
-                  layout-align="center center"
-                >
-                  <div
-                    class="overlay"
-                    layout="column"
-                    layout-align="center center"
-                  >
-                    <md-progress-linear
-                      md-mode="determinate"
-                      value="{{preferredimage.file.progress() * 100}}"
-                    >
-                    </md-progress-linear>
-                  </div>
-                  <img class="media" flow-img="preferredimage.file" />
-                </div>
-
-                <div
-                  class="customization-image motion-card-view__image-uploader"
-                  ng-switch-when="image"
-                  layout="row"
-                  layout-align="center center"
-                >
-                  <img class="media" ng-src="{{preferredimage.url}}" />
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-
-      <div
-        ng-if="!vm.customization.defaultFavicon"
-        class="customization-detail-form-container favicon motion-form__detail-form-container md-background-bg md-whiteframe-1dp"
-      >
-        <div class="pb-16" layout="row" layout-align="start center">
-          <div class="h2 secondary-text" translate="SETTINGS.FAVICON">
-            FAVICON
-          </div>
-        </div>
-        <div
-          ng-controller="CustomizationfaviconController as vm_cf"
-          ng-init="vm_cf.init(vm.customization)"
-          class="customization-detail-form-container md-background-bg md-whiteframe-1dp"
-        >
-          <div
-            id="customization-image-uploader motion-card-view__image-uploader"
-            flow-init="vm_cf.ngFlowOptions"
-            flow-name="vm_cf.ngFlow.flow"
-            flow-files-submitted="vm_cf.upload()"
-            flow-file-added="vm_cf.fileAdded($file)"
-            flow-file-success="vm_cf.fileSuccess($file, $message)"
-            flow-complete="vm_cf.uploadComplete()"
-            flow-drop
-            flow-drag-enter="vm_cf.dropping=true"
-            flow-drag-leave="vm_cf.dropping=false"
-            ng-class="{'dropping':vm.dropping}"
-          >
-            <div
-              class="drop-text hint-text"
-              layout="row"
-              layout-align="center center"
-            >
-              <span translate="EC.DROP_TO_UPLOAD">Drop to upload</span>
-            </div>
-
-            <div
-              class="upload-button"
-              layout="column"
-              layout-align="center center"
-            >
-              <md-button class="md-accent md-raised" flow-btn>
-                Upload
-              </md-button>
-              <span class="secondary-text mt-8"
-                >You can also drop images here to upload. Only PNG, JPG, ICO -
-                Max. 8MB</span
-              >
-            </div>
-
-            <div layout="row" layout-align="start start" layout-wrap>
-              <div
-                ng-repeat="faviconimage in vm_cf.customization.images"
-                ng-switch="faviconimage.type"
-              >
-                <div
-                  class="customization-image motion-card-view__image uploading"
-                  ng-switch-when="uploading"
-                  layout="row"
-                  layout-align="center center"
-                >
-                  <div
-                    class="overlay"
-                    layout="column"
-                    layout-align="center center"
-                  >
-                    <md-progress-linear
-                      md-mode="determinate"
-                      value="{{faviconimage.file.progress() * 100}}"
-                    >
-                    </md-progress-linear>
-                  </div>
-                  <img class="media" flow-img="faviconimage.file" />
-                </div>
-
-                <div
-                  class="customization-image motion-card-view__image-uploader"
-                  ng-switch-when="image"
-                  layout="row"
-                  layout-align="center center"
-                >
-                  <img class="media" ng-src="{{faviconimage.url}}" />
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/settings/views/customizations/customizations.html/customizations.html b/public/src/js/modules/main/apps/settings/views/customizations/customizations.html/customizations.html
new file mode 100644
index 0000000..8532d1b
--- /dev/null
+++ b/public/src/js/modules/main/apps/settings/views/customizations/customizations.html/customizations.html
@@ -0,0 +1,511 @@
+<div
+  id="customizations"
+  class="page-layout simple left-sidenav inner-sidenav motion-form"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-cog" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="SETTINGS.CUSTOMIZATIONS"
+          >Customizations</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveCustomization()"
+        ng-disabled="(customizationsForm.$pristine && logoForm.$pristine && logologinForm.$pristine && preferredForm.$pristine && faviconForm.$pristine) || (customizationsForm.$invalid || logoForm.$invalid || logologinForm.$invalid || preferredForm.$invalid || faviconForm.$invalid)"
+        class="send-button md-accent md-raised"
+        translate="SETTINGS.SAVE"
+        translate-attr-aria-label="SETTINGS.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <div
+        class="customization-detail-form-container customizations motion-form__detail-form-container md-background-bg md-whiteframe-1dp"
+      >
+        <div class="pb-16" layout="row" layout-align="start center">
+          <div class="h2 secondary-text" translate="SETTINGS.CUSTOMIZATIONS">
+            CUSTOMIZATIONS
+          </div>
+        </div>
+        <form name="customizationsForm" novalidate>
+          <md-input-container class="md-block">
+            <md-switch
+              ng-model="vm.customization.defaultLogo"
+              aria-label="Default_Logo"
+              ><span translate="SETTINGS.DEFAULT_LOGO"
+                >Default_Logo</span
+              ></md-switch
+            >
+          </md-input-container>
+          <md-input-container class="md-block">
+            <md-switch
+              ng-model="vm.customization.defaultLoginLogo"
+              aria-label="Default_Login_Logo"
+              ><span translate="SETTINGS.DEFAULT_LOGIN_LOGO"
+                >Default_Login_Logo</span
+              ></md-switch
+            >
+          </md-input-container>
+          <md-input-container class="md-block">
+            <md-switch
+              ng-model="vm.customization.defaultFavicon"
+              aria-label="Default_Favicon"
+              ><span translate="SETTINGS.DEFAULT_FAVICON"
+                >Default_Favicon</span
+              ></md-switch
+            >
+          </md-input-container>
+          <md-input-container class="md-block">
+            <md-switch
+              ng-model="vm.customization.defaultHeaderWhiteLabel"
+              aria-label="Default_Header_WhiteLabel"
+              ><span translate="SETTINGS.DEFAULT_HEADER_WHITELABEL"
+                >Default_Header_WhiteLabel</span
+              ></md-switch
+            >
+          </md-input-container>
+          <md-input-container
+            ng-if="!vm.customization.defaultHeaderWhiteLabel"
+            class="md-block"
+          >
+            <label translate="SETTINGS.HEADER_WHITELABEL"
+              >Header_WhiteLabel</label
+            >
+            <input
+              type="text"
+              name="headerWhiteLabel"
+              ng-model="vm.customization.headerWhiteLabel"
+              ng-required="true"
+            />
+
+            <div
+              ng-messages="customizationsForm['headerWhiteLabel'].$error"
+              ng-show="customizationsForm['headerWhiteLabel'].$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="SETTINGS.ERRORS.HEADER_WHITELABEL_REQUIRED"
+                  >Header_WhiteLabel field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container class="md-block">
+            <md-switch
+              ng-model="vm.customization.defaultPageTitle"
+              aria-label="Default_Page_Title"
+              ><span translate="SETTINGS.DEFAULT_PAGE_TITLE"
+                >Default_Page_Title</span
+              ></md-switch
+            >
+          </md-input-container>
+          <md-input-container
+            ng-if="!vm.customization.defaultPageTitle"
+            class="md-block"
+          >
+            <label translate="SETTINGS.PAGE_TITLE">Page_Title</label>
+            <input
+              type="text"
+              name="pageTitle"
+              ng-model="vm.customization.pageTitle"
+              ng-required="true"
+            />
+
+            <div
+              ng-messages="customizationsForm['pageTitle'].$error"
+              ng-show="customizationsForm['pageTitle'].$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="SETTINGS.ERRORS.PAGE_TITLE_REQUIRED"
+                  >Page_Title field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container ng-if="vm.license.preferred" class="md-block">
+            <md-switch
+              ng-model="vm.customization.defaultPreferred"
+              aria-label="Default_Preferred"
+              ><span translate="SETTINGS.DEFAULT_PREFERRED"
+                >Default_Preferred</span
+              ></md-switch
+            >
+          </md-input-container>
+        </form>
+      </div>
+
+      <div
+        ng-if="!vm.customization.defaultLogo"
+        class="customization-detail-form-container logo motion-form__detail-form-container md-background-bg md-whiteframe-1dp"
+      >
+        <div class="pb-16" layout="row" layout-align="start center">
+          <div class="h2 secondary-text" translate="SETTINGS.LOGO">LOGO</div>
+        </div>
+        <div
+          ng-controller="CustomizationlogoController as vm_cl"
+          ng-init="vm_cl.init(vm.customization)"
+          class="customization-detail-form-container md-background-bg md-whiteframe-1dp"
+        >
+          <div
+            id="customization-image-uploader motion-card-view__image-uploader"
+            flow-init="vm_cl.ngFlowOptions"
+            flow-name="vm_cl.ngFlow.flow"
+            flow-files-submitted="vm_cl.upload()"
+            flow-file-added="vm_cl.fileAdded($file)"
+            flow-file-success="vm_cl.fileSuccess($file, $message)"
+            flow-complete="vm_cl.uploadComplete()"
+            flow-drop
+            flow-drag-enter="vm_cl.dropping=true"
+            flow-drag-leave="vm_cl.dropping=false"
+            ng-class="{'dropping':vm.dropping}"
+          >
+            <div
+              class="drop-text hint-text"
+              layout="row"
+              layout-align="center center"
+            >
+              <span translate="EC.DROP_TO_UPLOAD">Drop to upload</span>
+            </div>
+
+            <div
+              class="upload-button"
+              layout="column"
+              layout-align="center center"
+            >
+              <md-button class="md-accent md-raised" flow-btn>
+                Upload
+              </md-button>
+              <span class="secondary-text mt-8"
+                >You can also drop images here to upload. Only PNG, JPG - Max.
+                8MB</span
+              >
+            </div>
+
+            <div layout="row" layout-align="start start" layout-wrap>
+              <div
+                ng-repeat="logoimage in vm_cl.customization.images"
+                ng-switch="logoimage.type"
+              >
+                <div
+                  class="customization-image motion-card-view__image uploading"
+                  ng-switch-when="uploading"
+                  layout="row"
+                  layout-align="center center"
+                >
+                  <div
+                    class="overlay"
+                    layout="column"
+                    layout-align="center center"
+                  >
+                    <md-progress-linear
+                      md-mode="determinate"
+                      value="{{logoimage.file.progress() * 100}}"
+                    >
+                    </md-progress-linear>
+                  </div>
+                  <img class="media" flow-img="logoimage.file" />
+                </div>
+
+                <div
+                  class="customization-image motion-card-view__image-uploader"
+                  ng-switch-when="image"
+                  layout="row"
+                  layout-align="center center"
+                >
+                  <img class="media" ng-src="{{logoimage.url}}" />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <div
+        ng-if="!vm.customization.defaultLoginLogo"
+        class="customization-detail-form-container logologin motion-form__detail-form-container md-background-bg md-whiteframe-1dp"
+      >
+        <div class="pb-16" layout="row" layout-align="start center">
+          <div class="h2 secondary-text" translate="SETTINGS.LOGOLOGIN">
+            LOGOLOGIN
+          </div>
+        </div>
+        <div
+          ng-controller="CustomizationlogologinController as vm_cll"
+          ng-init="vm_cll.init(vm.customization)"
+          class="customization-detail-form-container md-background-bg md-whiteframe-1dp"
+        >
+          <div
+            id="customization-image-uploader motion-card-view__image-uploader"
+            flow-init="vm_cll.ngFlowOptions"
+            flow-name="vm_cll.ngFlow.flow"
+            flow-files-submitted="vm_cll.upload()"
+            flow-file-added="vm_cll.fileAdded($file)"
+            flow-file-success="vm_cll.fileSuccess($file, $message)"
+            flow-complete="vm_cll.uploadComplete()"
+            flow-drop
+            flow-drag-enter="vm_cll.dropping=true"
+            flow-drag-leave="vm_cll.dropping=false"
+            ng-class="{'dropping':vm.dropping}"
+          >
+            <div
+              class="drop-text hint-text"
+              layout="row"
+              layout-align="center center"
+            >
+              <span translate="EC.DROP_TO_UPLOAD">Drop to upload</span>
+            </div>
+
+            <div
+              class="upload-button"
+              layout="column"
+              layout-align="center center"
+            >
+              <md-button class="md-accent md-raised" flow-btn>
+                Upload
+              </md-button>
+              <span class="secondary-text mt-8"
+                >You can also drop images here to upload. Only PNG, JPG - Max.
+                8MB</span
+              >
+            </div>
+
+            <div layout="row" layout-align="start start" layout-wrap>
+              <div
+                ng-repeat="logologinimage in vm_cll.customization.images"
+                ng-switch="logologinimage.type"
+              >
+                <div
+                  class="customization-image motion-card-view__image uploading"
+                  ng-switch-when="uploading"
+                  layout="row"
+                  layout-align="center center"
+                >
+                  <div
+                    class="overlay"
+                    layout="column"
+                    layout-align="center center"
+                  >
+                    <md-progress-linear
+                      md-mode="determinate"
+                      value="{{logologinimage.file.progress() * 100}}"
+                    >
+                    </md-progress-linear>
+                  </div>
+                  <img class="media" flow-img="logologinimage.file" />
+                </div>
+
+                <div
+                  class="customization-image motion-card-view__image-uploader"
+                  ng-switch-when="image"
+                  layout="row"
+                  layout-align="center center"
+                >
+                  <img class="media" ng-src="{{logologinimage.url}}" />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <div
+        ng-if="!vm.customization.defaultPreferred && vm.license.preferred"
+        class="customization-detail-form-container preferred motion-form__detail-form-container md-background-bg md-whiteframe-1dp"
+      >
+        <div class="pb-16" layout="row" layout-align="start center">
+          <div class="h2 secondary-text" translate="SETTINGS.PREFERRED">
+            PREFERRED
+          </div>
+        </div>
+        <div
+          ng-controller="CustomizationpreferredController as vm_cp"
+          ng-init="vm_cp.init(vm.customization)"
+          class="customization-detail-form-container md-background-bg md-whiteframe-1dp"
+        >
+          <div
+            id="customization-image-uploader motion-card-view__image-uploader"
+            flow-init="vm_cp.ngFlowOptions"
+            flow-name="vm_cp.ngFlow.flow"
+            flow-files-submitted="vm_cp.upload()"
+            flow-file-added="vm_cp.fileAdded($file)"
+            flow-file-success="vm_cp.fileSuccess($file, $message)"
+            flow-complete="vm_cp.uploadComplete()"
+            flow-drop
+            flow-drag-enter="vm_cp.dropping=true"
+            flow-drag-leave="vm_cp.dropping=false"
+            ng-class="{'dropping':vm.dropping}"
+          >
+            <div
+              class="drop-text hint-text"
+              layout="row"
+              layout-align="center center"
+            >
+              <span translate="EC.DROP_TO_UPLOAD">Drop to upload</span>
+            </div>
+
+            <div
+              class="upload-button"
+              layout="column"
+              layout-align="center center"
+            >
+              <md-button class="md-accent md-raised" flow-btn>
+                Upload
+              </md-button>
+              <span class="secondary-text mt-8"
+                >You can also drop images here to upload. Only PNG, JPG - Max.
+                8MB</span
+              >
+            </div>
+
+            <div layout="row" layout-align="start start" layout-wrap>
+              <div
+                ng-repeat="preferredimage in vm_cp.customization.images"
+                ng-switch="preferredimage.type"
+              >
+                <div
+                  class="customization-image motion-card-view__image uploading"
+                  ng-switch-when="uploading"
+                  layout="row"
+                  layout-align="center center"
+                >
+                  <div
+                    class="overlay"
+                    layout="column"
+                    layout-align="center center"
+                  >
+                    <md-progress-linear
+                      md-mode="determinate"
+                      value="{{preferredimage.file.progress() * 100}}"
+                    >
+                    </md-progress-linear>
+                  </div>
+                  <img class="media" flow-img="preferredimage.file" />
+                </div>
+
+                <div
+                  class="customization-image motion-card-view__image-uploader"
+                  ng-switch-when="image"
+                  layout="row"
+                  layout-align="center center"
+                >
+                  <img class="media" ng-src="{{preferredimage.url}}" />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <div
+        ng-if="!vm.customization.defaultFavicon"
+        class="customization-detail-form-container favicon motion-form__detail-form-container md-background-bg md-whiteframe-1dp"
+      >
+        <div class="pb-16" layout="row" layout-align="start center">
+          <div class="h2 secondary-text" translate="SETTINGS.FAVICON">
+            FAVICON
+          </div>
+        </div>
+        <div
+          ng-controller="CustomizationfaviconController as vm_cf"
+          ng-init="vm_cf.init(vm.customization)"
+          class="customization-detail-form-container md-background-bg md-whiteframe-1dp"
+        >
+          <div
+            id="customization-image-uploader motion-card-view__image-uploader"
+            flow-init="vm_cf.ngFlowOptions"
+            flow-name="vm_cf.ngFlow.flow"
+            flow-files-submitted="vm_cf.upload()"
+            flow-file-added="vm_cf.fileAdded($file)"
+            flow-file-success="vm_cf.fileSuccess($file, $message)"
+            flow-complete="vm_cf.uploadComplete()"
+            flow-drop
+            flow-drag-enter="vm_cf.dropping=true"
+            flow-drag-leave="vm_cf.dropping=false"
+            ng-class="{'dropping':vm.dropping}"
+          >
+            <div
+              class="drop-text hint-text"
+              layout="row"
+              layout-align="center center"
+            >
+              <span translate="EC.DROP_TO_UPLOAD">Drop to upload</span>
+            </div>
+
+            <div
+              class="upload-button"
+              layout="column"
+              layout-align="center center"
+            >
+              <md-button class="md-accent md-raised" flow-btn>
+                Upload
+              </md-button>
+              <span class="secondary-text mt-8"
+                >You can also drop images here to upload. Only PNG, JPG, ICO -
+                Max. 8MB</span
+              >
+            </div>
+
+            <div layout="row" layout-align="start start" layout-wrap>
+              <div
+                ng-repeat="faviconimage in vm_cf.customization.images"
+                ng-switch="faviconimage.type"
+              >
+                <div
+                  class="customization-image motion-card-view__image uploading"
+                  ng-switch-when="uploading"
+                  layout="row"
+                  layout-align="center center"
+                >
+                  <div
+                    class="overlay"
+                    layout="column"
+                    layout-align="center center"
+                  >
+                    <md-progress-linear
+                      md-mode="determinate"
+                      value="{{faviconimage.file.progress() * 100}}"
+                    >
+                    </md-progress-linear>
+                  </div>
+                  <img class="media" flow-img="faviconimage.file" />
+                </div>
+
+                <div
+                  class="customization-image motion-card-view__image-uploader"
+                  ng-switch-when="image"
+                  layout="row"
+                  layout-align="center center"
+                >
+                  <img class="media" ng-src="{{faviconimage.url}}" />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/settings/views/generals/generals.html/generals-[chunkhash].html b/public/src/js/modules/main/apps/settings/views/generals/generals.html/generals-[chunkhash].html
deleted file mode 100644
index cfdce16..0000000
--- a/public/src/js/modules/main/apps/settings/views/generals/generals.html/generals-[chunkhash].html
+++ /dev/null
@@ -1,872 +0,0 @@
-<div id="generals" class="page-layout simple left-sidenav inner-sidenav">
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-cog" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="SETTINGS.GENERAL">General</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveGeneral()"
-        ng-disabled="(globalForm.$pristine && motionbarForm.$pristine && reportForm.$pristine && agentOmniDesktopInterfaceForm.$pristine && screenRecordingForm.$pristine && securityForm.$pristine && imapGeneralSettingsForm.$pristine && SSOForm.$pristine && aiToolsForm.$pristine) || (globalForm.$invalid || motionbarForm.$invalid || reportForm.$invalid || agentOmniDesktopInterfaceForm.$invalid || screenRecordingForm.$invalid || securityForm.$invalid || imapGeneralSettingsForm.$invalid || SSOForm.$invalid || aiToolsForm.$invalid)"
-        class="send-button md-accent md-raised"
-        translate="SETTINGS.SAVE"
-        translate-attr-aria-label="SETTINGS.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <div
-        class="general-detail-form-container global md-background-bg md-whiteframe-1dp"
-      >
-        <div class="pb-16" layout="row" layout-align="start center">
-          <div class="h2 secondary-text" translate="SETTINGS.GLOBAL">
-            GLOBAL
-          </div>
-        </div>
-        <form name="globalForm" novalidate>
-          <md-input-container class="md-block">
-            <label translate="SETTINGS.MIN_INTERNAL">Min_Internal</label>
-            <input
-              type="number"
-              name="min_internal"
-              ng-model="vm.general.min_internal"
-              min="0"
-              ng-required="true"
-              autofocus
-            />
-
-            <div
-              ng-messages="globalForm['min_internal'].$error"
-              ng-show="globalForm['min_internal'].$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="SETTINGS.ERRORS.MIN_INTERNAL_REQUIRED"
-                  >Min_Internal field is required</span
-                >
-              </div>
-              <div ng-message="min">
-                <span
-                  translate="SETTINGS.ERRORS.MIN_INTERNAL_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                  >Min_Internal must be a valid greater or equal than</span
-                >
-                <span>0</span>
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container class="md-block">
-            <label translate="SETTINGS.CHATTIMEOUT">chatTimeout</label>
-            <input
-              type="number"
-              name="chatTimeout"
-              ng-model="vm.general.chatTimeout"
-              min="0"
-              ng-required="true"
-            />
-
-            <div
-              ng-messages="globalForm['chatTimeout'].$error"
-              ng-show="globalForm['chatTimeout'].$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="SETTINGS.ERRORS.CHATTIMEOUT_REQUIRED"
-                  >chatTimeout field is required</span
-                >
-              </div>
-              <div ng-message="min">
-                <span
-                  translate="SETTINGS.ERRORS.CHATTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                  >chatTimeout must be a valid greater or equal than</span
-                >
-                <span>0</span>
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container class="md-block">
-            <md-switch ng-model="vm.general.rtlSupport" aria-label="RtlSupport"
-              ><span translate="SETTINGS.RTLSUPPORT"
-                >RtlSupport</span
-              ></md-switch
-            >
-
-            <div class="hint">
-              <span translate="SETTINGS.HELP.RTLSUPPORT"></span>
-            </div>
-          </md-input-container>
-        </form>
-      </div>
-
-      <div
-        class="general-detail-form-container motionbar md-background-bg md-whiteframe-1dp"
-      >
-        <div class="pb-16" layout="row" layout-align="start center">
-          <div class="h2 secondary-text" translate="SETTINGS.MOTIONBAR">
-            MOTIONBAR
-          </div>
-        </div>
-        <form name="motionbarForm" novalidate>
-          <md-input-container class="md-block">
-            <md-switch
-              ng-model="vm.general.phoneBarAutoUpdater"
-              aria-label="MotionbarAutoUpdater"
-              ><span translate="SETTINGS.MOTIONBARAUTOUPDATER"
-                >MotionbarAutoUpdater</span
-              ></md-switch
-            >
-          </md-input-container>
-          <md-input-container
-            ng-if="vm.general.phoneBarAutoUpdater"
-            class="md-block"
-          >
-            <label translate="SETTINGS.MOTIONBARAUTOUPDATERURL"
-              >MotionbarAutoUpdaterUrl</label
-            >
-            <input
-              type="url"
-              name="phoneBarAutoUpdaterUrl"
-              ng-model="vm.general.phoneBarAutoUpdaterUrl"
-              ng-required="vm.general.phoneBarAutoUpdater"
-            />
-
-            <div
-              ng-messages="motionbarForm['phoneBarAutoUpdaterUrl'].$error"
-              ng-show="motionbarForm['phoneBarAutoUpdaterUrl'].$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span
-                  translate="SETTINGS.ERRORS.MOTIONBARAUTOUPDATERURL_REQUIRED"
-                  >MotionbarAutoUpdaterUrl field is required</span
-                >
-              </div>
-              <div ng-message="url">
-                <span
-                  translate="SETTINGS.ERRORS.MOTIONBARAUTOUPDATERURL_MUST_VALID_URL"
-                  >MotionbarAutoUpdaterUrl must be a valid url
-                  http://www.xcally.com</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container class="md-block">
-            <md-switch
-              ng-model="vm.general.phoneBarRememberMeEnabled"
-              aria-label="MotionbarRememberMe"
-              ><span translate="SETTINGS.MOTIONBARREMEMBERME"
-                >MotionbarRememberMe</span
-              ></md-switch
-            >
-
-            <div class="hint">
-              <span translate="SETTINGS.HELP.MOTIONBARREMEMBERME"></span>
-            </div>
-          </md-input-container>
-        </form>
-      </div>
-
-      <div
-        class="general-detail-form-container report md-background-bg md-whiteframe-1dp"
-      >
-        <div class="pb-16" layout="row" layout-align="start center">
-          <div class="h2 secondary-text" translate="SETTINGS.REPORT">
-            REPORT
-          </div>
-        </div>
-        <form name="reportForm" novalidate>
-          <md-input-container class="md-block">
-            <md-switch ng-model="vm.general.split" aria-label="Split"
-              ><span translate="SETTINGS.SPLIT">Split</span></md-switch
-            >
-          </md-input-container>
-          <md-input-container ng-if="vm.general.split" class="md-block">
-            <label translate="SETTINGS.SPLITSIZECSV">SplitSizeCsv</label>
-            <input
-              type="number"
-              name="splitSizeCsv"
-              ng-model="vm.general.splitSizeCsv"
-            />
-
-            <div
-              ng-messages="reportForm['splitSizeCsv'].$error"
-              ng-show="reportForm['splitSizeCsv'].$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="SETTINGS.ERRORS.SPLITSIZECSV_REQUIRED"
-                  >SplitSizeCsv field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container ng-if="vm.general.split" class="md-block">
-            <label translate="SETTINGS.SPLITSIZEPDF">SplitSizePdf</label>
-            <input
-              type="number"
-              name="splitSizePdf"
-              ng-model="vm.general.splitSizePdf"
-            />
-
-            <div
-              ng-messages="reportForm['splitSizePdf'].$error"
-              ng-show="reportForm['splitSizePdf'].$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="SETTINGS.ERRORS.SPLITSIZEPDF_REQUIRED"
-                  >SplitSizePdf field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container ng-if="vm.general.split" class="md-block">
-            <label translate="SETTINGS.SPLITSIZEXLSX">SplitSizeXlsx</label>
-            <input
-              type="number"
-              name="splitSizeXlsx"
-              ng-model="vm.general.splitSizeXlsx"
-            />
-
-            <div
-              ng-messages="reportForm['splitSizeXlsx'].$error"
-              ng-show="reportForm['splitSizeXlsx'].$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="SETTINGS.ERRORS.SPLITSIZEXLSX_REQUIRED"
-                  >SplitSizeXlsx field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-        </form>
-      </div>
-
-      <div
-        class="general-detail-form-container agentomnidesktopinterface md-background-bg md-whiteframe-1dp"
-      >
-        <div class="pb-16" layout="row" layout-align="start center">
-          <div
-            class="h2 secondary-text"
-            translate="SETTINGS.AGENTOMNIDESKTOPINTERFACE"
-          >
-            AGENTOMNIDESKTOPINTERFACE
-          </div>
-        </div>
-        <form name="agentOmniDesktopInterfaceForm" novalidate>
-          <md-input-container class="md-block">
-            <md-switch
-              ng-model="vm.general.enableEmailPreview"
-              aria-label="EnableEmailPreview"
-              ><span translate="SETTINGS.ENABLEEMAILPREVIEW"
-                >EnableEmailPreview</span
-              ></md-switch
-            >
-          </md-input-container>
-          <md-input-container class="md-block">
-            <label translate="SETTINGS.MESSAGESALIGNMENT"
-              >messagesAlignment</label
-            >
-            <md-select
-              name="messagesAlignment"
-              ng-model="vm.general.messagesAlignment"
-            >
-              <md-option ng-value="'alternate'">Alternate</md-option>
-              <md-option ng-value="'left'">Left</md-option>
-              <md-option ng-value="'right'">Right</md-option>
-            </md-select>
-            <div
-              ng-messages="agentOmniDesktopInterfaceForm['messagesAlignment'].$error"
-              ng-show="agentOmniDesktopInterfaceForm['messagesAlignment'].$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="SETTINGS.ERRORS.MESSAGESALIGNMENT_REQUIRED"
-                  >messagesAlignment field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-        </form>
-      </div>
-
-      <div
-        ng-if="vm.license.screenrecording"
-        class="general-detail-form-container screenrecording md-background-bg md-whiteframe-1dp"
-      >
-        <div class="pb-16" layout="row" layout-align="start center">
-          <div class="h2 secondary-text" translate="SETTINGS.SCREENRECORDING">
-            SCREENRECORDING
-          </div>
-        </div>
-        <form name="screenRecordingForm" novalidate>
-          <md-input-container class="md-block">
-            <label translate="SETTINGS.DEFAULTSCREENRECORDINGPATH"
-              >defaultScreenRecordingPath</label
-            >
-            <input
-              type="text"
-              name="defaultScreenRecordingPath"
-              ng-model="vm.general.defaultScreenRecordingPath"
-              autofocus
-            />
-
-            <div class="hint">
-              <span translate="SETTINGS.HELP.DEFAULTSCREENRECORDINGPATH"></span>
-            </div>
-            <div
-              ng-messages="screenRecordingForm['defaultScreenRecordingPath'].$error"
-              ng-show="screenRecordingForm['defaultScreenRecordingPath'].$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span
-                  translate="SETTINGS.ERRORS.DEFAULTSCREENRECORDINGPATH_REQUIRED"
-                  >defaultScreenRecordingPath field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-        </form>
-      </div>
-
-      <div
-        class="general-detail-form-container security md-background-bg md-whiteframe-1dp"
-      >
-        <div class="pb-16" layout="row" layout-align="start center">
-          <div class="h2 secondary-text" translate="SETTINGS.SECURITY">
-            SECURITY
-          </div>
-        </div>
-        <form name="securityForm" novalidate>
-          <md-input-container class="md-block">
-            <md-switch
-              ng-model="vm.general.securePassword"
-              aria-label="Security_Suite"
-              ><span translate="SETTINGS.SECURITY_SUITE"
-                >Security_Suite</span
-              ></md-switch
-            >
-
-            <div class="hint">
-              <span translate="SETTINGS.HELP.SECURITY_SUITE"></span>
-            </div>
-          </md-input-container>
-          <md-input-container class="md-block">
-            <md-switch
-              ng-model="vm.general.callRecordingEncryption"
-              aria-label="Call_Recording_Encryption"
-              ><span translate="SETTINGS.CALL_RECORDING_ENCRYPTION"
-                >Call_Recording_Encryption</span
-              ></md-switch
-            >
-          </md-input-container>
-          <md-input-container class="md-block">
-            <label translate="SETTINGS.ALLOWEDLOGINATTEMPTS"
-              >allowedLoginAttempts</label
-            >
-            <input
-              type="number"
-              name="allowedLoginAttempts"
-              ng-model="vm.general.allowedLoginAttempts"
-              ng-required="true"
-            />
-
-            <div
-              ng-messages="securityForm['allowedLoginAttempts'].$error"
-              ng-show="securityForm['allowedLoginAttempts'].$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="SETTINGS.ERRORS.ALLOWEDLOGINATTEMPTS_REQUIRED"
-                  >allowedLoginAttempts field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container class="md-block">
-            <label translate="SETTINGS.BLOCKDURATION">blockDuration</label>
-            <input
-              type="number"
-              name="blockDuration"
-              ng-model="vm.general.blockDuration"
-              ng-required="true"
-            />
-
-            <div
-              ng-messages="securityForm['blockDuration'].$error"
-              ng-show="securityForm['blockDuration'].$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="SETTINGS.ERRORS.BLOCKDURATION_REQUIRED"
-                  >blockDuration field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container class="md-block">
-            <md-switch
-              ng-model="vm.general.enforcePasswordHistory"
-              aria-label="Enforce_Password_History"
-              ><span translate="SETTINGS.ENFORCE_PASSWORD_HISTORY"
-                >Enforce_Password_History</span
-              ></md-switch
-            >
-
-            <div class="hint">
-              <span translate="SETTINGS.HELP.ENFORCE_PASSWORD_HISTORY"></span>
-            </div>
-          </md-input-container>
-          <md-input-container
-            ng-if="vm.general.enforcePasswordHistory"
-            class="md-block"
-          >
-            <label translate="SETTINGS.PASSWORD_HISTORY_LIMIT"
-              >Password_History_Limit</label
-            >
-            <input
-              type="number"
-              name="passwordHistoryLimit"
-              ng-model="vm.general.passwordHistoryLimit"
-              min="2"
-              max="5"
-            />
-
-            <div class="hint">
-              <span translate="SETTINGS.HELP.PASSWORD_HISTORY_LIMIT"></span>
-            </div>
-            <div
-              ng-messages="securityForm['passwordHistoryLimit'].$error"
-              ng-show="securityForm['passwordHistoryLimit'].$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span
-                  translate="SETTINGS.ERRORS.PASSWORD_HISTORY_LIMIT_REQUIRED"
-                  >Password_History_Limit field is required</span
-                >
-              </div>
-              <div ng-message="min">
-                <span
-                  translate="SETTINGS.ERRORS.PASSWORD_HISTORY_LIMIT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                  >Password_History_Limit must be a valid greater or equal
-                  than</span
-                >
-                <span>2</span>
-              </div>
-              <div ng-message="max">
-                <span
-                  translate="SETTINGS.ERRORS.PASSWORD_HISTORY_LIMIT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                  >Password_History_Limit must be a valid greater or equal
-                  than</span
-                >
-                <span>5</span>
-              </div>
-            </div>
-          </md-input-container>
-        </form>
-      </div>
-
-      <div
-        class="general-detail-form-container imapgeneralsettings md-background-bg md-whiteframe-1dp"
-      >
-        <div class="pb-16" layout="row" layout-align="start center">
-          <div
-            class="h2 secondary-text"
-            translate="SETTINGS.IMAPGENERALSETTINGS"
-          >
-            IMAPGENERALSETTINGS
-          </div>
-        </div>
-        <form name="imapGeneralSettingsForm" novalidate>
-          <md-input-container class="md-block">
-            <label translate="SETTINGS.LOGINMAILFREQUENCY"
-              >loginMailFrequency</label
-            >
-            <input
-              type="number"
-              name="loginMailFrequency"
-              ng-model="vm.general.loginMailFrequency"
-              min="10"
-              ng-required="true"
-              autofocus
-            />
-
-            <div class="hint">
-              <span translate="SETTINGS.HELP.LOGINMAILFREQUENCY"></span>
-            </div>
-            <div
-              ng-messages="imapGeneralSettingsForm['loginMailFrequency'].$error"
-              ng-show="imapGeneralSettingsForm['loginMailFrequency'].$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="SETTINGS.ERRORS.LOGINMAILFREQUENCY_REQUIRED"
-                  >loginMailFrequency field is required</span
-                >
-              </div>
-              <div ng-message="min">
-                <span
-                  translate="SETTINGS.ERRORS.LOGINMAILFREQUENCY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                  >loginMailFrequency must be a valid greater or equal
-                  than</span
-                >
-                <span>10</span>
-              </div>
-            </div>
-          </md-input-container>
-        </form>
-      </div>
-
-      <div
-        class="general-detail-form-container sso md-background-bg md-whiteframe-1dp"
-      >
-        <div class="pb-16" layout="row" layout-align="start center">
-          <div class="h2 secondary-text" translate="SETTINGS.SSO">SSO</div>
-        </div>
-        <form name="SSOForm" novalidate>
-          <md-input-container class="md-block">
-            <md-switch
-              ng-model="vm.general.googleSsoEnabled"
-              aria-label="Google_SSO_enabled"
-              ><span translate="SETTINGS.GOOGLE_SSO_ENABLED"
-                >Google_SSO_enabled</span
-              ></md-switch
-            >
-          </md-input-container>
-        </form>
-      </div>
-
-      <div
-        ng-if="vm.license.ai"
-        class="general-detail-form-container aitools md-background-bg md-whiteframe-1dp"
-      >
-        <div class="pb-16" layout="row" layout-align="start center">
-          <div class="h2 secondary-text" translate="SETTINGS.AITOOLS">
-            AITOOLS
-          </div>
-        </div>
-        <form name="aiToolsForm" novalidate>
-          <md-input-container class="md-block">
-            <label translate="SETTINGS.LANGUAGE">Language</label>
-            <md-select
-              name="language"
-              ng-model="vm.general.language"
-              autofocus
-              required
-            >
-              <md-option ng-value="'en-US'">US English</md-option>
-              <md-option ng-value="'en-AU'">Australian English</md-option>
-              <md-option ng-value="'en-GB'">British English</md-option>
-              <md-option ng-value="'en-AB'">Scottish English</md-option>
-              <md-option ng-value="'en-WL'">Welsh English</md-option>
-              <md-option ng-value="'en-IE'">English (Ireland)</md-option>
-              <md-option ng-value="'en-IN'">Indian English</md-option>
-              <md-option ng-value="'hi-IN'">Hindi (India)</md-option>
-              <md-option ng-value="'fr-CA'">Canadian French</md-option>
-              <md-option ng-value="'fr-FR'">French</md-option>
-              <md-option ng-value="'de-DE'">German</md-option>
-              <md-option ng-value="'de-CH'">German (Switzerland)</md-option>
-              <md-option ng-value="'it-IT'">Italian</md-option>
-              <md-option ng-value="'es-ES'">Spanish</md-option>
-              <md-option ng-value="'es-Us'">US Spanish</md-option>
-              <md-option ng-value="'pt-BR'">Brazilian Portuguese</md-option>
-              <md-option ng-value="'pt-PT'">Portuguese(Portugal)</md-option>
-              <md-option ng-value="'ar-SA'">Modern Standard Arabic</md-option>
-              <md-option ng-value="'ar-AE'">Arabic</md-option>
-              <md-option ng-value="'zh-CN'"
-                >Chinese Mandarin - Mainland</md-option
-              >
-              <md-option ng-value="'ja-JP'">Japanese (Japan)</md-option>
-              <md-option ng-value="'ko-KR'">Korean (Korea)</md-option>
-              <md-option ng-value="'he-IL'"
-                >Hebrew (Israel) - This language is not available for the
-                Sentiment Analysis</md-option
-              >
-              <md-option ng-value="'ms-MY'"
-                >Malay (Malaysia) - This language is not available for the
-                Sentiment Analysis</md-option
-              >
-              <md-option ng-value="'fa-IR'"
-                >Farsi (Iran) - This language is not available for the Sentiment
-                Analysis</md-option
-              >
-              <md-option ng-value="'ru-RU'"
-                >Russian (Russia) - This language is not available for the
-                Sentiment Analysis</md-option
-              >
-              <md-option ng-value="'te-IN'"
-                >Telugu(India) - This language is not available for the
-                Sentiment Analysis</md-option
-              >
-              <md-option ng-value="'ta-IN'"
-                >Tamil - This language is not available for the Sentiment
-                Analysis</md-option
-              >
-              <md-option ng-value="'nl-NL'"
-                >Dutch - This language is not available for the Sentiment
-                Analysis</md-option
-              >
-              <md-option ng-value="'tr-TR'"
-                >Turkish (Turkey) - This language is not available for the
-                Sentiment Analysis</md-option
-              >
-              <md-option ng-value="'id-ID'"
-                >Indonesian(Indonesia) - This language is not available for the
-                Sentiment Analysis</md-option
-              >
-            </md-select>
-            <div
-              ng-messages="aiToolsForm['language'].$error"
-              ng-show="aiToolsForm['language'].$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="SETTINGS.ERRORS.LANGUAGE_REQUIRED"
-                  >Language field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container class="md-block">
-            <label translate="SETTINGS.BUCKET">Bucket</label>
-            <input
-              type="text"
-              name="bucket"
-              ng-model="vm.general.bucket"
-              ng-required="true"
-            />
-
-            <div
-              ng-messages="aiToolsForm['bucket'].$error"
-              ng-show="aiToolsForm['bucket'].$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="SETTINGS.ERRORS.BUCKET_REQUIRED"
-                  >Bucket field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container class="md-block">
-            <md-switch ng-model="vm.general.transcribe" aria-label="Transcribe"
-              ><span translate="SETTINGS.TRANSCRIBE"
-                >Transcribe</span
-              ></md-switch
-            >
-          </md-input-container>
-          <md-input-container
-            ng-if="vm.general.transcribe == true"
-            class="md-block"
-          >
-            <label translate="SETTINGS.TRANSCRIBEREGION"
-              >TranscribeRegion</label
-            >
-            <md-select
-              name="transcribeRegion"
-              ng-model="vm.general.transcribeRegion"
-              required
-            >
-              <md-option ng-value="'us-east-1'"
-                >US East (N. Virginia)</md-option
-              >
-              <md-option ng-value="'us-east-2'">US East (Ohio)</md-option>
-              <md-option ng-value="'us-east-2'"
-                >US West (N. California)</md-option
-              >
-              <md-option ng-value="'us-west-2'">US West (Oregon)</md-option>
-              <md-option ng-value="'ap-south-1'"
-                >Asia Pacific (Mumbai)</md-option
-              >
-              <md-option ng-value="'ap-east-1'"
-                >Asia Pacific (Hong Kong)</md-option
-              >
-              <md-option ng-value="'ap-northeast-2'"
-                >Asia Pacific (Seoul)</md-option
-              >
-              <md-option ng-value="'ap-southeast-1'"
-                >Asia Pacific (Singapore)</md-option
-              >
-              <md-option ng-value="'ap-southeast-2'"
-                >Asia Pacific (Sydney)</md-option
-              >
-              <md-option ng-value="'ap-northeast-1'"
-                >Asia Pacific (Tokyo)</md-option
-              >
-              <md-option ng-value="'ca-central-1'">Canada (Central)</md-option>
-              <md-option ng-value="'eu-central-1'"
-                >Europe (Frankfurt)</md-option
-              >
-              <md-option ng-value="'eu-west-1'">Europe (Ireland)</md-option>
-              <md-option ng-value="'eu-west-2'">Europe (London)</md-option>
-              <md-option ng-value="'eu-west-3'">Europe (Paris)</md-option>
-              <md-option ng-value="'me-south-1'"
-                >Middle East (Bahrain)</md-option
-              >
-              <md-option ng-value="'sa-east-1'"
-                >South America (São Paulo)</md-option
-              >
-            </md-select>
-            <div
-              ng-messages="aiToolsForm['transcribeRegion'].$error"
-              ng-show="aiToolsForm['transcribeRegion'].$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="SETTINGS.ERRORS.TRANSCRIBEREGION_REQUIRED"
-                  >TranscribeRegion field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container
-            ng-if="vm.general.transcribe == true"
-            class="md-block"
-          >
-            <label translate="SETTINGS.TRANSCRIBEACCOUNT"
-              >TranscribeAccount</label
-            >
-            <md-select
-              name="transcribeAccountId"
-              ng-model="vm.general.transcribeAccountId"
-              required
-            >
-              <md-option
-                ng-value="transcribeAccountId.id"
-                ng-repeat="transcribeAccountId in vm.cloudProviders"
-                ng-disabled="transcribeAccountId.canSelect === false"
-                >{{ transcribeAccountId.name }}</md-option
-              >
-            </md-select>
-            <div
-              ng-messages="aiToolsForm['transcribeAccountId'].$error"
-              ng-show="aiToolsForm['transcribeAccountId'].$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="SETTINGS.ERRORS.TRANSCRIBEACCOUNT_REQUIRED"
-                  >TranscribeAccount field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container
-            ng-if="vm.general.transcribe == true && vm.general.language != 'he-IL' && vm.general.language != 'ms-MY' && vm.general.language != 'fa-IR' && vm.general.language != 'ru-RU' && vm.general.language != 'te-IN' && vm.general.language != 'ta-IN' && vm.general.language != 'nl-NL' && vm.general.language != 'tr-TR' && vm.general.language != 'id-ID'"
-            class="md-block"
-          >
-            <md-switch
-              ng-model="vm.general.sentiment"
-              aria-label="SentimentAnalysis"
-              ><span translate="SETTINGS.SENTIMENTANALYSIS"
-                >SentimentAnalysis</span
-              ></md-switch
-            >
-          </md-input-container>
-          <md-input-container
-            ng-if="vm.general.sentiment == true && vm.general.transcribe == true && vm.general.language != 'he-IL' && vm.general.language != 'ms-MY' && vm.general.language != 'fa-IR' && vm.general.language != 'ru-RU' && vm.general.language != 'te-IN' && vm.general.language != 'ta-IN' && vm.general.language != 'nl-NL' && vm.general.language != 'tr-TR' && vm.general.language != 'id-ID'"
-            class="md-block"
-          >
-            <label translate="SETTINGS.SENTIMENTREGION">SentimentRegion</label>
-            <md-select
-              name="sentimentRegion"
-              ng-model="vm.general.sentimentRegion"
-              required
-            >
-              <md-option ng-value="'us-east-1'"
-                >US East (N. Virginia)</md-option
-              >
-              <md-option ng-value="'us-east-2'">US East (Ohio)</md-option>
-              <md-option ng-value="'us-west-2'">US West (Oregon)</md-option>
-              <md-option ng-value="'ap-south-1'"
-                >Asia Pacific (Mumbai)</md-option
-              >
-              <md-option ng-value="'ap-northeast-2'"
-                >Asia Pacific (Seoul)</md-option
-              >
-              <md-option ng-value="'ap-southeast-1'"
-                >Asia Pacific (Singapore)</md-option
-              >
-              <md-option ng-value="'ap-southeast-2'"
-                >Asia Pacific (Sydney)</md-option
-              >
-              <md-option ng-value="'ap-northeast-1'"
-                >Asia Pacific (Tokyo)</md-option
-              >
-              <md-option ng-value="'ca-central-1'">Canada (Central)</md-option>
-              <md-option ng-value="'eu-central-1'"
-                >Europe (Frankfurt)</md-option
-              >
-              <md-option ng-value="'eu-west-1'">Europe (Ireland)</md-option>
-              <md-option ng-value="'eu-west-2'">Europe (London)</md-option>
-            </md-select>
-            <div
-              ng-messages="aiToolsForm['sentimentRegion'].$error"
-              ng-show="aiToolsForm['sentimentRegion'].$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="SETTINGS.ERRORS.SENTIMENTREGION_REQUIRED"
-                  >SentimentRegion field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container
-            ng-if="vm.general.sentiment == true && vm.general.transcribe == true && vm.general.language != 'he-IL' && vm.general.language != 'ms-MY' && vm.general.language != 'fa-IR' && vm.general.language != 'ru-RU' && vm.general.language != 'te-IN' && vm.general.language != 'ta-IN' && vm.general.language != 'nl-NL' && vm.general.language != 'tr-TR' && vm.general.language != 'id-ID'"
-            class="md-block"
-          >
-            <label translate="SETTINGS.SENTIMENTACCOUNT"
-              >SentimentAccount</label
-            >
-            <md-select
-              name="sentimentAccountId"
-              ng-model="vm.general.sentimentAccountId"
-              required
-            >
-              <md-option
-                ng-value="sentimentAccountId.id"
-                ng-repeat="sentimentAccountId in vm.cloudProviders"
-                ng-disabled="sentimentAccountId.canSelect === false"
-                >{{ sentimentAccountId.name }}</md-option
-              >
-            </md-select>
-            <div
-              ng-messages="aiToolsForm['sentimentAccountId'].$error"
-              ng-show="aiToolsForm['sentimentAccountId'].$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="SETTINGS.ERRORS.SENTIMENTACCOUNT_REQUIRED"
-                  >SentimentAccount field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-        </form>
-      </div>
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/settings/views/generals/generals.html/generals.html b/public/src/js/modules/main/apps/settings/views/generals/generals.html/generals.html
new file mode 100644
index 0000000..cfdce16
--- /dev/null
+++ b/public/src/js/modules/main/apps/settings/views/generals/generals.html/generals.html
@@ -0,0 +1,872 @@
+<div id="generals" class="page-layout simple left-sidenav inner-sidenav">
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-cog" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="SETTINGS.GENERAL">General</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveGeneral()"
+        ng-disabled="(globalForm.$pristine && motionbarForm.$pristine && reportForm.$pristine && agentOmniDesktopInterfaceForm.$pristine && screenRecordingForm.$pristine && securityForm.$pristine && imapGeneralSettingsForm.$pristine && SSOForm.$pristine && aiToolsForm.$pristine) || (globalForm.$invalid || motionbarForm.$invalid || reportForm.$invalid || agentOmniDesktopInterfaceForm.$invalid || screenRecordingForm.$invalid || securityForm.$invalid || imapGeneralSettingsForm.$invalid || SSOForm.$invalid || aiToolsForm.$invalid)"
+        class="send-button md-accent md-raised"
+        translate="SETTINGS.SAVE"
+        translate-attr-aria-label="SETTINGS.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <div
+        class="general-detail-form-container global md-background-bg md-whiteframe-1dp"
+      >
+        <div class="pb-16" layout="row" layout-align="start center">
+          <div class="h2 secondary-text" translate="SETTINGS.GLOBAL">
+            GLOBAL
+          </div>
+        </div>
+        <form name="globalForm" novalidate>
+          <md-input-container class="md-block">
+            <label translate="SETTINGS.MIN_INTERNAL">Min_Internal</label>
+            <input
+              type="number"
+              name="min_internal"
+              ng-model="vm.general.min_internal"
+              min="0"
+              ng-required="true"
+              autofocus
+            />
+
+            <div
+              ng-messages="globalForm['min_internal'].$error"
+              ng-show="globalForm['min_internal'].$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="SETTINGS.ERRORS.MIN_INTERNAL_REQUIRED"
+                  >Min_Internal field is required</span
+                >
+              </div>
+              <div ng-message="min">
+                <span
+                  translate="SETTINGS.ERRORS.MIN_INTERNAL_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                  >Min_Internal must be a valid greater or equal than</span
+                >
+                <span>0</span>
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container class="md-block">
+            <label translate="SETTINGS.CHATTIMEOUT">chatTimeout</label>
+            <input
+              type="number"
+              name="chatTimeout"
+              ng-model="vm.general.chatTimeout"
+              min="0"
+              ng-required="true"
+            />
+
+            <div
+              ng-messages="globalForm['chatTimeout'].$error"
+              ng-show="globalForm['chatTimeout'].$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="SETTINGS.ERRORS.CHATTIMEOUT_REQUIRED"
+                  >chatTimeout field is required</span
+                >
+              </div>
+              <div ng-message="min">
+                <span
+                  translate="SETTINGS.ERRORS.CHATTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                  >chatTimeout must be a valid greater or equal than</span
+                >
+                <span>0</span>
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container class="md-block">
+            <md-switch ng-model="vm.general.rtlSupport" aria-label="RtlSupport"
+              ><span translate="SETTINGS.RTLSUPPORT"
+                >RtlSupport</span
+              ></md-switch
+            >
+
+            <div class="hint">
+              <span translate="SETTINGS.HELP.RTLSUPPORT"></span>
+            </div>
+          </md-input-container>
+        </form>
+      </div>
+
+      <div
+        class="general-detail-form-container motionbar md-background-bg md-whiteframe-1dp"
+      >
+        <div class="pb-16" layout="row" layout-align="start center">
+          <div class="h2 secondary-text" translate="SETTINGS.MOTIONBAR">
+            MOTIONBAR
+          </div>
+        </div>
+        <form name="motionbarForm" novalidate>
+          <md-input-container class="md-block">
+            <md-switch
+              ng-model="vm.general.phoneBarAutoUpdater"
+              aria-label="MotionbarAutoUpdater"
+              ><span translate="SETTINGS.MOTIONBARAUTOUPDATER"
+                >MotionbarAutoUpdater</span
+              ></md-switch
+            >
+          </md-input-container>
+          <md-input-container
+            ng-if="vm.general.phoneBarAutoUpdater"
+            class="md-block"
+          >
+            <label translate="SETTINGS.MOTIONBARAUTOUPDATERURL"
+              >MotionbarAutoUpdaterUrl</label
+            >
+            <input
+              type="url"
+              name="phoneBarAutoUpdaterUrl"
+              ng-model="vm.general.phoneBarAutoUpdaterUrl"
+              ng-required="vm.general.phoneBarAutoUpdater"
+            />
+
+            <div
+              ng-messages="motionbarForm['phoneBarAutoUpdaterUrl'].$error"
+              ng-show="motionbarForm['phoneBarAutoUpdaterUrl'].$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span
+                  translate="SETTINGS.ERRORS.MOTIONBARAUTOUPDATERURL_REQUIRED"
+                  >MotionbarAutoUpdaterUrl field is required</span
+                >
+              </div>
+              <div ng-message="url">
+                <span
+                  translate="SETTINGS.ERRORS.MOTIONBARAUTOUPDATERURL_MUST_VALID_URL"
+                  >MotionbarAutoUpdaterUrl must be a valid url
+                  http://www.xcally.com</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container class="md-block">
+            <md-switch
+              ng-model="vm.general.phoneBarRememberMeEnabled"
+              aria-label="MotionbarRememberMe"
+              ><span translate="SETTINGS.MOTIONBARREMEMBERME"
+                >MotionbarRememberMe</span
+              ></md-switch
+            >
+
+            <div class="hint">
+              <span translate="SETTINGS.HELP.MOTIONBARREMEMBERME"></span>
+            </div>
+          </md-input-container>
+        </form>
+      </div>
+
+      <div
+        class="general-detail-form-container report md-background-bg md-whiteframe-1dp"
+      >
+        <div class="pb-16" layout="row" layout-align="start center">
+          <div class="h2 secondary-text" translate="SETTINGS.REPORT">
+            REPORT
+          </div>
+        </div>
+        <form name="reportForm" novalidate>
+          <md-input-container class="md-block">
+            <md-switch ng-model="vm.general.split" aria-label="Split"
+              ><span translate="SETTINGS.SPLIT">Split</span></md-switch
+            >
+          </md-input-container>
+          <md-input-container ng-if="vm.general.split" class="md-block">
+            <label translate="SETTINGS.SPLITSIZECSV">SplitSizeCsv</label>
+            <input
+              type="number"
+              name="splitSizeCsv"
+              ng-model="vm.general.splitSizeCsv"
+            />
+
+            <div
+              ng-messages="reportForm['splitSizeCsv'].$error"
+              ng-show="reportForm['splitSizeCsv'].$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="SETTINGS.ERRORS.SPLITSIZECSV_REQUIRED"
+                  >SplitSizeCsv field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container ng-if="vm.general.split" class="md-block">
+            <label translate="SETTINGS.SPLITSIZEPDF">SplitSizePdf</label>
+            <input
+              type="number"
+              name="splitSizePdf"
+              ng-model="vm.general.splitSizePdf"
+            />
+
+            <div
+              ng-messages="reportForm['splitSizePdf'].$error"
+              ng-show="reportForm['splitSizePdf'].$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="SETTINGS.ERRORS.SPLITSIZEPDF_REQUIRED"
+                  >SplitSizePdf field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container ng-if="vm.general.split" class="md-block">
+            <label translate="SETTINGS.SPLITSIZEXLSX">SplitSizeXlsx</label>
+            <input
+              type="number"
+              name="splitSizeXlsx"
+              ng-model="vm.general.splitSizeXlsx"
+            />
+
+            <div
+              ng-messages="reportForm['splitSizeXlsx'].$error"
+              ng-show="reportForm['splitSizeXlsx'].$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="SETTINGS.ERRORS.SPLITSIZEXLSX_REQUIRED"
+                  >SplitSizeXlsx field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+        </form>
+      </div>
+
+      <div
+        class="general-detail-form-container agentomnidesktopinterface md-background-bg md-whiteframe-1dp"
+      >
+        <div class="pb-16" layout="row" layout-align="start center">
+          <div
+            class="h2 secondary-text"
+            translate="SETTINGS.AGENTOMNIDESKTOPINTERFACE"
+          >
+            AGENTOMNIDESKTOPINTERFACE
+          </div>
+        </div>
+        <form name="agentOmniDesktopInterfaceForm" novalidate>
+          <md-input-container class="md-block">
+            <md-switch
+              ng-model="vm.general.enableEmailPreview"
+              aria-label="EnableEmailPreview"
+              ><span translate="SETTINGS.ENABLEEMAILPREVIEW"
+                >EnableEmailPreview</span
+              ></md-switch
+            >
+          </md-input-container>
+          <md-input-container class="md-block">
+            <label translate="SETTINGS.MESSAGESALIGNMENT"
+              >messagesAlignment</label
+            >
+            <md-select
+              name="messagesAlignment"
+              ng-model="vm.general.messagesAlignment"
+            >
+              <md-option ng-value="'alternate'">Alternate</md-option>
+              <md-option ng-value="'left'">Left</md-option>
+              <md-option ng-value="'right'">Right</md-option>
+            </md-select>
+            <div
+              ng-messages="agentOmniDesktopInterfaceForm['messagesAlignment'].$error"
+              ng-show="agentOmniDesktopInterfaceForm['messagesAlignment'].$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="SETTINGS.ERRORS.MESSAGESALIGNMENT_REQUIRED"
+                  >messagesAlignment field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+        </form>
+      </div>
+
+      <div
+        ng-if="vm.license.screenrecording"
+        class="general-detail-form-container screenrecording md-background-bg md-whiteframe-1dp"
+      >
+        <div class="pb-16" layout="row" layout-align="start center">
+          <div class="h2 secondary-text" translate="SETTINGS.SCREENRECORDING">
+            SCREENRECORDING
+          </div>
+        </div>
+        <form name="screenRecordingForm" novalidate>
+          <md-input-container class="md-block">
+            <label translate="SETTINGS.DEFAULTSCREENRECORDINGPATH"
+              >defaultScreenRecordingPath</label
+            >
+            <input
+              type="text"
+              name="defaultScreenRecordingPath"
+              ng-model="vm.general.defaultScreenRecordingPath"
+              autofocus
+            />
+
+            <div class="hint">
+              <span translate="SETTINGS.HELP.DEFAULTSCREENRECORDINGPATH"></span>
+            </div>
+            <div
+              ng-messages="screenRecordingForm['defaultScreenRecordingPath'].$error"
+              ng-show="screenRecordingForm['defaultScreenRecordingPath'].$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span
+                  translate="SETTINGS.ERRORS.DEFAULTSCREENRECORDINGPATH_REQUIRED"
+                  >defaultScreenRecordingPath field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+        </form>
+      </div>
+
+      <div
+        class="general-detail-form-container security md-background-bg md-whiteframe-1dp"
+      >
+        <div class="pb-16" layout="row" layout-align="start center">
+          <div class="h2 secondary-text" translate="SETTINGS.SECURITY">
+            SECURITY
+          </div>
+        </div>
+        <form name="securityForm" novalidate>
+          <md-input-container class="md-block">
+            <md-switch
+              ng-model="vm.general.securePassword"
+              aria-label="Security_Suite"
+              ><span translate="SETTINGS.SECURITY_SUITE"
+                >Security_Suite</span
+              ></md-switch
+            >
+
+            <div class="hint">
+              <span translate="SETTINGS.HELP.SECURITY_SUITE"></span>
+            </div>
+          </md-input-container>
+          <md-input-container class="md-block">
+            <md-switch
+              ng-model="vm.general.callRecordingEncryption"
+              aria-label="Call_Recording_Encryption"
+              ><span translate="SETTINGS.CALL_RECORDING_ENCRYPTION"
+                >Call_Recording_Encryption</span
+              ></md-switch
+            >
+          </md-input-container>
+          <md-input-container class="md-block">
+            <label translate="SETTINGS.ALLOWEDLOGINATTEMPTS"
+              >allowedLoginAttempts</label
+            >
+            <input
+              type="number"
+              name="allowedLoginAttempts"
+              ng-model="vm.general.allowedLoginAttempts"
+              ng-required="true"
+            />
+
+            <div
+              ng-messages="securityForm['allowedLoginAttempts'].$error"
+              ng-show="securityForm['allowedLoginAttempts'].$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="SETTINGS.ERRORS.ALLOWEDLOGINATTEMPTS_REQUIRED"
+                  >allowedLoginAttempts field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container class="md-block">
+            <label translate="SETTINGS.BLOCKDURATION">blockDuration</label>
+            <input
+              type="number"
+              name="blockDuration"
+              ng-model="vm.general.blockDuration"
+              ng-required="true"
+            />
+
+            <div
+              ng-messages="securityForm['blockDuration'].$error"
+              ng-show="securityForm['blockDuration'].$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="SETTINGS.ERRORS.BLOCKDURATION_REQUIRED"
+                  >blockDuration field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container class="md-block">
+            <md-switch
+              ng-model="vm.general.enforcePasswordHistory"
+              aria-label="Enforce_Password_History"
+              ><span translate="SETTINGS.ENFORCE_PASSWORD_HISTORY"
+                >Enforce_Password_History</span
+              ></md-switch
+            >
+
+            <div class="hint">
+              <span translate="SETTINGS.HELP.ENFORCE_PASSWORD_HISTORY"></span>
+            </div>
+          </md-input-container>
+          <md-input-container
+            ng-if="vm.general.enforcePasswordHistory"
+            class="md-block"
+          >
+            <label translate="SETTINGS.PASSWORD_HISTORY_LIMIT"
+              >Password_History_Limit</label
+            >
+            <input
+              type="number"
+              name="passwordHistoryLimit"
+              ng-model="vm.general.passwordHistoryLimit"
+              min="2"
+              max="5"
+            />
+
+            <div class="hint">
+              <span translate="SETTINGS.HELP.PASSWORD_HISTORY_LIMIT"></span>
+            </div>
+            <div
+              ng-messages="securityForm['passwordHistoryLimit'].$error"
+              ng-show="securityForm['passwordHistoryLimit'].$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span
+                  translate="SETTINGS.ERRORS.PASSWORD_HISTORY_LIMIT_REQUIRED"
+                  >Password_History_Limit field is required</span
+                >
+              </div>
+              <div ng-message="min">
+                <span
+                  translate="SETTINGS.ERRORS.PASSWORD_HISTORY_LIMIT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                  >Password_History_Limit must be a valid greater or equal
+                  than</span
+                >
+                <span>2</span>
+              </div>
+              <div ng-message="max">
+                <span
+                  translate="SETTINGS.ERRORS.PASSWORD_HISTORY_LIMIT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                  >Password_History_Limit must be a valid greater or equal
+                  than</span
+                >
+                <span>5</span>
+              </div>
+            </div>
+          </md-input-container>
+        </form>
+      </div>
+
+      <div
+        class="general-detail-form-container imapgeneralsettings md-background-bg md-whiteframe-1dp"
+      >
+        <div class="pb-16" layout="row" layout-align="start center">
+          <div
+            class="h2 secondary-text"
+            translate="SETTINGS.IMAPGENERALSETTINGS"
+          >
+            IMAPGENERALSETTINGS
+          </div>
+        </div>
+        <form name="imapGeneralSettingsForm" novalidate>
+          <md-input-container class="md-block">
+            <label translate="SETTINGS.LOGINMAILFREQUENCY"
+              >loginMailFrequency</label
+            >
+            <input
+              type="number"
+              name="loginMailFrequency"
+              ng-model="vm.general.loginMailFrequency"
+              min="10"
+              ng-required="true"
+              autofocus
+            />
+
+            <div class="hint">
+              <span translate="SETTINGS.HELP.LOGINMAILFREQUENCY"></span>
+            </div>
+            <div
+              ng-messages="imapGeneralSettingsForm['loginMailFrequency'].$error"
+              ng-show="imapGeneralSettingsForm['loginMailFrequency'].$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="SETTINGS.ERRORS.LOGINMAILFREQUENCY_REQUIRED"
+                  >loginMailFrequency field is required</span
+                >
+              </div>
+              <div ng-message="min">
+                <span
+                  translate="SETTINGS.ERRORS.LOGINMAILFREQUENCY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                  >loginMailFrequency must be a valid greater or equal
+                  than</span
+                >
+                <span>10</span>
+              </div>
+            </div>
+          </md-input-container>
+        </form>
+      </div>
+
+      <div
+        class="general-detail-form-container sso md-background-bg md-whiteframe-1dp"
+      >
+        <div class="pb-16" layout="row" layout-align="start center">
+          <div class="h2 secondary-text" translate="SETTINGS.SSO">SSO</div>
+        </div>
+        <form name="SSOForm" novalidate>
+          <md-input-container class="md-block">
+            <md-switch
+              ng-model="vm.general.googleSsoEnabled"
+              aria-label="Google_SSO_enabled"
+              ><span translate="SETTINGS.GOOGLE_SSO_ENABLED"
+                >Google_SSO_enabled</span
+              ></md-switch
+            >
+          </md-input-container>
+        </form>
+      </div>
+
+      <div
+        ng-if="vm.license.ai"
+        class="general-detail-form-container aitools md-background-bg md-whiteframe-1dp"
+      >
+        <div class="pb-16" layout="row" layout-align="start center">
+          <div class="h2 secondary-text" translate="SETTINGS.AITOOLS">
+            AITOOLS
+          </div>
+        </div>
+        <form name="aiToolsForm" novalidate>
+          <md-input-container class="md-block">
+            <label translate="SETTINGS.LANGUAGE">Language</label>
+            <md-select
+              name="language"
+              ng-model="vm.general.language"
+              autofocus
+              required
+            >
+              <md-option ng-value="'en-US'">US English</md-option>
+              <md-option ng-value="'en-AU'">Australian English</md-option>
+              <md-option ng-value="'en-GB'">British English</md-option>
+              <md-option ng-value="'en-AB'">Scottish English</md-option>
+              <md-option ng-value="'en-WL'">Welsh English</md-option>
+              <md-option ng-value="'en-IE'">English (Ireland)</md-option>
+              <md-option ng-value="'en-IN'">Indian English</md-option>
+              <md-option ng-value="'hi-IN'">Hindi (India)</md-option>
+              <md-option ng-value="'fr-CA'">Canadian French</md-option>
+              <md-option ng-value="'fr-FR'">French</md-option>
+              <md-option ng-value="'de-DE'">German</md-option>
+              <md-option ng-value="'de-CH'">German (Switzerland)</md-option>
+              <md-option ng-value="'it-IT'">Italian</md-option>
+              <md-option ng-value="'es-ES'">Spanish</md-option>
+              <md-option ng-value="'es-Us'">US Spanish</md-option>
+              <md-option ng-value="'pt-BR'">Brazilian Portuguese</md-option>
+              <md-option ng-value="'pt-PT'">Portuguese(Portugal)</md-option>
+              <md-option ng-value="'ar-SA'">Modern Standard Arabic</md-option>
+              <md-option ng-value="'ar-AE'">Arabic</md-option>
+              <md-option ng-value="'zh-CN'"
+                >Chinese Mandarin - Mainland</md-option
+              >
+              <md-option ng-value="'ja-JP'">Japanese (Japan)</md-option>
+              <md-option ng-value="'ko-KR'">Korean (Korea)</md-option>
+              <md-option ng-value="'he-IL'"
+                >Hebrew (Israel) - This language is not available for the
+                Sentiment Analysis</md-option
+              >
+              <md-option ng-value="'ms-MY'"
+                >Malay (Malaysia) - This language is not available for the
+                Sentiment Analysis</md-option
+              >
+              <md-option ng-value="'fa-IR'"
+                >Farsi (Iran) - This language is not available for the Sentiment
+                Analysis</md-option
+              >
+              <md-option ng-value="'ru-RU'"
+                >Russian (Russia) - This language is not available for the
+                Sentiment Analysis</md-option
+              >
+              <md-option ng-value="'te-IN'"
+                >Telugu(India) - This language is not available for the
+                Sentiment Analysis</md-option
+              >
+              <md-option ng-value="'ta-IN'"
+                >Tamil - This language is not available for the Sentiment
+                Analysis</md-option
+              >
+              <md-option ng-value="'nl-NL'"
+                >Dutch - This language is not available for the Sentiment
+                Analysis</md-option
+              >
+              <md-option ng-value="'tr-TR'"
+                >Turkish (Turkey) - This language is not available for the
+                Sentiment Analysis</md-option
+              >
+              <md-option ng-value="'id-ID'"
+                >Indonesian(Indonesia) - This language is not available for the
+                Sentiment Analysis</md-option
+              >
+            </md-select>
+            <div
+              ng-messages="aiToolsForm['language'].$error"
+              ng-show="aiToolsForm['language'].$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="SETTINGS.ERRORS.LANGUAGE_REQUIRED"
+                  >Language field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container class="md-block">
+            <label translate="SETTINGS.BUCKET">Bucket</label>
+            <input
+              type="text"
+              name="bucket"
+              ng-model="vm.general.bucket"
+              ng-required="true"
+            />
+
+            <div
+              ng-messages="aiToolsForm['bucket'].$error"
+              ng-show="aiToolsForm['bucket'].$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="SETTINGS.ERRORS.BUCKET_REQUIRED"
+                  >Bucket field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container class="md-block">
+            <md-switch ng-model="vm.general.transcribe" aria-label="Transcribe"
+              ><span translate="SETTINGS.TRANSCRIBE"
+                >Transcribe</span
+              ></md-switch
+            >
+          </md-input-container>
+          <md-input-container
+            ng-if="vm.general.transcribe == true"
+            class="md-block"
+          >
+            <label translate="SETTINGS.TRANSCRIBEREGION"
+              >TranscribeRegion</label
+            >
+            <md-select
+              name="transcribeRegion"
+              ng-model="vm.general.transcribeRegion"
+              required
+            >
+              <md-option ng-value="'us-east-1'"
+                >US East (N. Virginia)</md-option
+              >
+              <md-option ng-value="'us-east-2'">US East (Ohio)</md-option>
+              <md-option ng-value="'us-east-2'"
+                >US West (N. California)</md-option
+              >
+              <md-option ng-value="'us-west-2'">US West (Oregon)</md-option>
+              <md-option ng-value="'ap-south-1'"
+                >Asia Pacific (Mumbai)</md-option
+              >
+              <md-option ng-value="'ap-east-1'"
+                >Asia Pacific (Hong Kong)</md-option
+              >
+              <md-option ng-value="'ap-northeast-2'"
+                >Asia Pacific (Seoul)</md-option
+              >
+              <md-option ng-value="'ap-southeast-1'"
+                >Asia Pacific (Singapore)</md-option
+              >
+              <md-option ng-value="'ap-southeast-2'"
+                >Asia Pacific (Sydney)</md-option
+              >
+              <md-option ng-value="'ap-northeast-1'"
+                >Asia Pacific (Tokyo)</md-option
+              >
+              <md-option ng-value="'ca-central-1'">Canada (Central)</md-option>
+              <md-option ng-value="'eu-central-1'"
+                >Europe (Frankfurt)</md-option
+              >
+              <md-option ng-value="'eu-west-1'">Europe (Ireland)</md-option>
+              <md-option ng-value="'eu-west-2'">Europe (London)</md-option>
+              <md-option ng-value="'eu-west-3'">Europe (Paris)</md-option>
+              <md-option ng-value="'me-south-1'"
+                >Middle East (Bahrain)</md-option
+              >
+              <md-option ng-value="'sa-east-1'"
+                >South America (São Paulo)</md-option
+              >
+            </md-select>
+            <div
+              ng-messages="aiToolsForm['transcribeRegion'].$error"
+              ng-show="aiToolsForm['transcribeRegion'].$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="SETTINGS.ERRORS.TRANSCRIBEREGION_REQUIRED"
+                  >TranscribeRegion field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container
+            ng-if="vm.general.transcribe == true"
+            class="md-block"
+          >
+            <label translate="SETTINGS.TRANSCRIBEACCOUNT"
+              >TranscribeAccount</label
+            >
+            <md-select
+              name="transcribeAccountId"
+              ng-model="vm.general.transcribeAccountId"
+              required
+            >
+              <md-option
+                ng-value="transcribeAccountId.id"
+                ng-repeat="transcribeAccountId in vm.cloudProviders"
+                ng-disabled="transcribeAccountId.canSelect === false"
+                >{{ transcribeAccountId.name }}</md-option
+              >
+            </md-select>
+            <div
+              ng-messages="aiToolsForm['transcribeAccountId'].$error"
+              ng-show="aiToolsForm['transcribeAccountId'].$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="SETTINGS.ERRORS.TRANSCRIBEACCOUNT_REQUIRED"
+                  >TranscribeAccount field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container
+            ng-if="vm.general.transcribe == true && vm.general.language != 'he-IL' && vm.general.language != 'ms-MY' && vm.general.language != 'fa-IR' && vm.general.language != 'ru-RU' && vm.general.language != 'te-IN' && vm.general.language != 'ta-IN' && vm.general.language != 'nl-NL' && vm.general.language != 'tr-TR' && vm.general.language != 'id-ID'"
+            class="md-block"
+          >
+            <md-switch
+              ng-model="vm.general.sentiment"
+              aria-label="SentimentAnalysis"
+              ><span translate="SETTINGS.SENTIMENTANALYSIS"
+                >SentimentAnalysis</span
+              ></md-switch
+            >
+          </md-input-container>
+          <md-input-container
+            ng-if="vm.general.sentiment == true && vm.general.transcribe == true && vm.general.language != 'he-IL' && vm.general.language != 'ms-MY' && vm.general.language != 'fa-IR' && vm.general.language != 'ru-RU' && vm.general.language != 'te-IN' && vm.general.language != 'ta-IN' && vm.general.language != 'nl-NL' && vm.general.language != 'tr-TR' && vm.general.language != 'id-ID'"
+            class="md-block"
+          >
+            <label translate="SETTINGS.SENTIMENTREGION">SentimentRegion</label>
+            <md-select
+              name="sentimentRegion"
+              ng-model="vm.general.sentimentRegion"
+              required
+            >
+              <md-option ng-value="'us-east-1'"
+                >US East (N. Virginia)</md-option
+              >
+              <md-option ng-value="'us-east-2'">US East (Ohio)</md-option>
+              <md-option ng-value="'us-west-2'">US West (Oregon)</md-option>
+              <md-option ng-value="'ap-south-1'"
+                >Asia Pacific (Mumbai)</md-option
+              >
+              <md-option ng-value="'ap-northeast-2'"
+                >Asia Pacific (Seoul)</md-option
+              >
+              <md-option ng-value="'ap-southeast-1'"
+                >Asia Pacific (Singapore)</md-option
+              >
+              <md-option ng-value="'ap-southeast-2'"
+                >Asia Pacific (Sydney)</md-option
+              >
+              <md-option ng-value="'ap-northeast-1'"
+                >Asia Pacific (Tokyo)</md-option
+              >
+              <md-option ng-value="'ca-central-1'">Canada (Central)</md-option>
+              <md-option ng-value="'eu-central-1'"
+                >Europe (Frankfurt)</md-option
+              >
+              <md-option ng-value="'eu-west-1'">Europe (Ireland)</md-option>
+              <md-option ng-value="'eu-west-2'">Europe (London)</md-option>
+            </md-select>
+            <div
+              ng-messages="aiToolsForm['sentimentRegion'].$error"
+              ng-show="aiToolsForm['sentimentRegion'].$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="SETTINGS.ERRORS.SENTIMENTREGION_REQUIRED"
+                  >SentimentRegion field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container
+            ng-if="vm.general.sentiment == true && vm.general.transcribe == true && vm.general.language != 'he-IL' && vm.general.language != 'ms-MY' && vm.general.language != 'fa-IR' && vm.general.language != 'ru-RU' && vm.general.language != 'te-IN' && vm.general.language != 'ta-IN' && vm.general.language != 'nl-NL' && vm.general.language != 'tr-TR' && vm.general.language != 'id-ID'"
+            class="md-block"
+          >
+            <label translate="SETTINGS.SENTIMENTACCOUNT"
+              >SentimentAccount</label
+            >
+            <md-select
+              name="sentimentAccountId"
+              ng-model="vm.general.sentimentAccountId"
+              required
+            >
+              <md-option
+                ng-value="sentimentAccountId.id"
+                ng-repeat="sentimentAccountId in vm.cloudProviders"
+                ng-disabled="sentimentAccountId.canSelect === false"
+                >{{ sentimentAccountId.name }}</md-option
+              >
+            </md-select>
+            <div
+              ng-messages="aiToolsForm['sentimentAccountId'].$error"
+              ng-show="aiToolsForm['sentimentAccountId'].$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="SETTINGS.ERRORS.SENTIMENTACCOUNT_REQUIRED"
+                  >SentimentAccount field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+        </form>
+      </div>
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/settings/views/license/license.html/license-[chunkhash].html b/public/src/js/modules/main/apps/settings/views/license/license.html/license-[chunkhash].html
deleted file mode 100644
index d814326..0000000
--- a/public/src/js/modules/main/apps/settings/views/license/license.html/license-[chunkhash].html
+++ /dev/null
@@ -1,490 +0,0 @@
-<div id="license" class="page-layout simple fullwidth doc-page">
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-cog" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="SETTINGS.LICENSE">LICENSE</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-    <!-- <div>
-                <md-button type="submit" ng-click="vm.requestLicense()" class="send-button md-raised" translate="SETTINGS.REQUEST_LICENSE" translate-attr-aria-label="SETTINGS.REQUEST_LICENSE">
-                    REQUEST LICENSE
-                </md-button>
-            </div> -->
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- LICENSE CARD -->
-      <div layout="row" flex>
-        <md-card class="md-whiteframe-1dp padding-20" flex>
-          <div layout="row" layout-align="center">
-            <div flex layout="row" layout-align="start center">
-              <div ng-if="!vm.license.custom">
-                <a
-                  href="https://www.xcally.com/plans.html"
-                  target="_blank"
-                  class="md-button md-fab green-A700-bg"
-                  aria-label="Eat cake"
-                >
-                  <md-tooltip
-                    ><span translate="SETTINGS.PRICES">Prices</span></md-tooltip
-                  >
-                  <md-icon md-font-icon="icon-coin"></md-icon>
-                </a>
-              </div>
-            </div>
-            <div flex>
-              <div ng-switch="vm.license.months" class="text-center">
-                <span ng-switch-when="1" class="md-title md-accent-fg text-bold"
-                  >{{ 'SETTINGS.PLAN' | translate }}:
-                  <span translate="SETTINGS.MONTH_TO_MONTH"
-                    >MONTH TO MONTH</span
-                  ></span
-                >
-                <span
-                  ng-switch-when="12"
-                  class="md-title md-accent-fg text-bold"
-                  >{{ 'SETTINGS.PLAN' | translate }}:
-                  <span translate="SETTINGS.ANNUALLY">ANNUALLY</span></span
-                >
-                <span
-                  ng-switch-when="36"
-                  class="md-title md-accent-fg text-bold"
-                  >{{ 'SETTINGS.PLAN' | translate }}:
-                  <span translate="SETTINGS.PERPETUAL">PERPETUAL</span></span
-                >
-              </div>
-            </div>
-            <div flex layout="row" layout-align="end center">
-              <div>
-                <md-button
-                  type="submit"
-                  ng-click="vm.updateLicense()"
-                  class="md-button md-fab md-accent"
-                >
-                  <md-tooltip
-                    ><span translate="SETTINGS.UPDATE_LICENSE"
-                      >License</span
-                    ></md-tooltip
-                  >
-                  <md-icon md-font-icon="icon-pencil"></md-icon>
-                </md-button>
-              </div>
-            </div>
-          </div>
-
-          <span
-            ng-if="!vm.license.demo && !vm.license.gray && vm.license.months != 36"
-            class="md-subhead md-warn-fg text-center"
-            >{{ 'SETTINGS.EXPIRATION_DATE' | translate }}:
-            {{vm.license.expiration | date: 'longDate'}}</span
-          >
-          <span class="text-center padding-bottom-10">
-            {{ vm.license.machineUuid !== vm.license.uuid ? 'SETTINGS.OLD_TOKEN'
-            : 'SETTINGS.TOKEN' | translate }}:
-            <span class="text-italic text-bold">{{vm.license.uuid}}</span></span
-          >
-
-          <div layout="column">
-            <span
-              ng-if="vm.license.grayReason == 'changed'"
-              class="blink md-subhead md-warn-fg text-center"
-              >{{ 'SETTINGS.NEW_TOKEN_DETECTED' | translate }}</span
-            >
-            <span
-              ng-if="vm.license.grayReason == 'changed'"
-              class="text-center padding-bottom-10"
-            >
-              {{'SETTINGS.NEW_TOKEN' | translate }}:
-              <span class="text-italic text-bold"
-                >{{vm.license.machineUuid}}</span
-              ></span
-            >
-            <span
-              ng-if="vm.license.gray"
-              class="blink md-subhead md-warn-fg text-center"
-              >{{ 'SETTINGS.EXPIRATION_GRAY_PERIOD' | translate }}:
-              {{vm.license.deadline | date: 'longDate'}}</span
-            >
-            <span
-              ng-if="vm.license.gray"
-              class="text-center padding-bottom-10 text-italic text-bold"
-            >
-              {{'SETTINGS.EXPIRATION_REASON' | translate }}
-            </span>
-            <span
-              ng-if="vm.license.grayReason == 'disabled'"
-              class="text-center padding-bottom-10"
-            >
-              {{'SETTINGS.EXPIRATION_REASON_MESSAGE_DISABLED' | translate
-              }}</span
-            >
-            <span
-              ng-if="vm.license.grayReason == 'changed'"
-              class="text-center padding-bottom-10"
-            >
-              {{'SETTINGS.EXPIRATION_REASON_MESSAGE_CHANGED' | translate
-              }}</span
-            >
-            <span
-              ng-if="vm.license.grayReason == 'changed'"
-              class="text-center padding-bottom-10"
-            >
-              {{'SETTINGS.EXPIRATION_CHANGED_ADVISE' | translate }}</span
-            >
-            <span
-              ng-if="vm.license.grayReason == 'changed'"
-              class="text-center padding-bottom-10"
-              >{{ 'SETTINGS.SEND_EMAIL_TO' | translate }}:
-              <a
-                href="mailto:[email-masked]?subject=New%20token%20detected&body=Hi xCALLY, New Token: {{vm.license.machineUuid}}, Old token: {{vm.license.uuid}}"
-                >[email-masked]</a
-              >.</span
-            >
-            <span
-              ng-if="vm.license.grayReason == 'disabled'"
-              class="text-center padding-bottom-10"
-              >{{ 'SETTINGS.SEND_EMAIL_TO' | translate }}:
-              <a
-                href="mailto:[email-masked]?subject=License%20disabled&body=Hi xCALLY, My Token: {{vm.license.machineUuid}}"
-                >[email-masked]</a
-              >.</span
-            >
-          </div>
-
-          <div ng-if="vm.license.demo" layout="column">
-            <span class="md-subhead md-warn-fg text-center"
-              >{{ 'SETTINGS.TRIAL_VERSION' | translate }}</span
-            >
-            <span class="md-subhead md-warn-fg text-center"
-              ><a
-                href="https://www.xcally.com/en/index.html#pricing-table2-h"
-                target="_blank"
-                >{{ 'SETTINGS.PRICES' | translate}}</a
-              ></span
-            >
-          </div>
-
-          <md-subheader class="md-no-sticky"
-            >{{ 'SETTINGS.STAFF' | translate }}</md-subheader
-          >
-          <md-divider></md-divider>
-          <md-list layout="row">
-            <md-list-item class="md-2-line" flex="33">
-              <md-icon
-                md-font-icon="icon-account"
-                class="md-avatar-icon"
-              ></md-icon>
-              <div class="md-list-item-text">
-                <h3>
-                  {{ vm.license.users || 0 }}
-                  <span
-                    ng-class="{'red-fg': vm.license.users <= vm.users && vm.license.users > 0}"
-                    >({{vm.license.users >= vm.users ? vm.users :
-                    vm.license.users}})</span
-                  >
-                </h3>
-                <p translate="SETTINGS.USERS">Users</p>
-              </div>
-            </md-list-item>
-            <md-list-item class="md-2-line" flex="33">
-              <md-icon
-                md-font-icon="icon-headphones"
-                class="md-avatar-icon"
-              ></md-icon>
-              <div class="md-list-item-text">
-                <h3>
-                  {{ vm.license.agents || 0 }}
-                  <span
-                    ng-class="{'red-fg': (vm.license.agents <= vm.agents && vm.license.agents > 0) }"
-                    >({{vm.license.agents >= vm.agents ? vm.agents :
-                    vm.license.agents}})</span
-                  >
-                </h3>
-                <p translate="SETTINGS.AGENTS">Agents</p>
-              </div>
-            </md-list-item>
-            <md-list-item class="md-2-line" flex="33">
-              <md-icon
-                md-font-icon="icon-phone"
-                class="md-avatar-icon"
-              ></md-icon>
-              <div class="md-list-item-text">
-                <h3>
-                  {{ vm.license.telephones || 0 }}
-                  <span
-                    ng-class="{'red-fg': vm.license.telephones <= vm.telephones && vm.license.telephones > 0}"
-                    >({{vm.license.telephones >= vm.telephones ? vm.telephones :
-                    vm.license.telephones}})</span
-                  >
-                </h3>
-                <p translate="SETTINGS.TELEPHONES">Telephones</p>
-              </div>
-            </md-list-item>
-          </md-list>
-
-          <md-subheader class="md-no-sticky"
-            >{{ 'SETTINGS.CHANNELS' | translate }}</md-subheader
-          >
-          <md-divider></md-divider>
-          <md-list layout="row">
-            <md-list-item
-              flex="33"
-              class="md-2-line"
-              ng-repeat="channel in vm.channels | limitTo:3"
-            >
-              <md-icon
-                md-font-icon="{{channel.icon}}"
-                class="md-avatar-icon"
-                ng-class="vm.license[channel.name] ? 'green-A700-bg' : 'red-A700-bg'"
-              ></md-icon>
-              <div class="md-list-item-text">
-                <h3 translate="SETTINGS.{{channel.name | uppercase}}"></h3>
-                <p
-                  ng-class="vm.license[channel.name] ? 'green-A700-fg' : 'red-A700-fg'"
-                >
-                  {{ 'SETTINGS.' + (vm.license[channel.name] ? 'ENABLED' :
-                  'DISABLED') | translate }}
-                </p>
-              </div>
-            </md-list-item>
-          </md-list>
-          <md-list layout="row">
-            <md-list-item
-              flex="33"
-              class="md-2-line"
-              ng-repeat="channel in vm.channels | limitTo:3:3"
-            >
-              <md-icon
-                md-font-icon="{{channel.icon}}"
-                class="md-avatar-icon"
-                ng-class="vm.license[channel.name] ? 'green-A700-bg' : 'red-A700-bg'"
-              ></md-icon>
-              <div class="md-list-item-text">
-                <h3 translate="SETTINGS.{{channel.name | uppercase}}"></h3>
-                <p
-                  ng-class="vm.license[channel.name] ? 'green-A700-fg' : 'red-A700-fg'"
-                >
-                  {{ 'SETTINGS.' + (vm.license[channel.name] ? 'ENABLED' :
-                  'DISABLED') | translate }}
-                </p>
-              </div>
-            </md-list-item>
-          </md-list>
-          <md-list layout="row">
-            <md-list-item
-              flex="33"
-              class="md-2-line"
-              ng-repeat="channel in vm.channels | limitTo:3:6"
-            >
-              <md-icon
-                md-font-icon="{{channel.icon}}"
-                class="md-avatar-icon"
-                ng-class="vm.license[channel.name] ? 'green-A700-bg' : 'red-A700-bg'"
-              ></md-icon>
-              <div class="md-list-item-text">
-                <h3 translate="SETTINGS.{{channel.name | uppercase}}"></h3>
-                <p
-                  ng-class="vm.license[channel.name] ? 'green-A700-fg' : 'red-A700-fg'"
-                >
-                  {{ 'SETTINGS.' + (vm.license[channel.name] ? 'ENABLED' :
-                  'DISABLED') | translate }}
-                </p>
-              </div>
-            </md-list-item>
-          </md-list>
-
-          <md-subheader class="md-no-sticky"
-            >{{ 'SETTINGS.MODULES' | translate }}</md-subheader
-          >
-          <md-divider></md-divider>
-          <md-list layout="row">
-            <md-list-item
-              class="md-2-line"
-              ng-repeat="module in vm.modules"
-              flex="33"
-            >
-              <md-icon
-                md-font-icon="{{module.icon}}"
-                class="md-avatar-icon"
-                ng-class="vm.license[module.name] ? 'green-A700-bg' : 'red-A700-bg'"
-              ></md-icon>
-              <div class="md-list-item-text">
-                <h3 translate="SETTINGS.{{module.name | uppercase}}"></h3>
-                <p
-                  ng-class="vm.license[module.name] ? 'green-A700-fg' : 'red-A700-fg'"
-                >
-                  {{ 'SETTINGS.' + (vm.license[module.name] ? 'ENABLED' :
-                  'DISABLED') | translate }}
-                </p>
-              </div>
-            </md-list-item>
-          </md-list>
-
-          <md-subheader class="md-no-sticky"
-            >{{ 'SETTINGS.SESSIONS' | translate }}</md-subheader
-          >
-          <md-divider></md-divider>
-          <md-list layout="row">
-            <div ng-repeat="session in vm.sessions" flex="33">
-              <md-list-item class="md-2-line">
-                <md-icon
-                  md-font-icon="{{session.icon}}"
-                  class="md-avatar-icon"
-                  ng-class="vm.license[session.enabled] ? 'green-A700-bg' : 'red-A700-bg'"
-                ></md-icon>
-                <div class="md-list-item-text">
-                  <div layout="row" layout="start center">
-                    <h3 translate="SETTINGS.{{session.name | uppercase}}"></h3>
-                    <button
-                      ng-if="session.restart"
-                      ng-click="vm.gotoProcess($event)"
-                      class="md-mini"
-                      aria-label="restart"
-                    >
-                      <md-tooltip>Restart</md-tooltip>
-                      <md-icon md-font-icon="icon-reload"></md-icon>
-                    </button>
-                  </div>
-                  <p
-                    ng-if="vm.license[session.name] && vm.license[session.enabled]"
-                    class="green-A700-fg"
-                  >
-                    {{vm.license[session.name]}} {{ 'SETTINGS.' + session.label
-                    | uppercase | translate }}
-                  </p>
-                  <p
-                    ng-if="!vm.license[session.name] && vm.license[session.enabled]"
-                    class="green-A700-fg"
-                  >
-                    UNLIMITED {{ 'SETTINGS.' + session.label | uppercase |
-                    translate }}
-                  </p>
-                  <p ng-if="!vm.license[session.enabled]" class="red-A700-fg">
-                    {{ 'SETTINGS.DISABLED' | translate }}
-                  </p>
-                </div>
-              </md-list-item>
-            </div>
-          </md-list>
-
-          <md-subheader class="md-no-sticky"
-            >{{ 'SETTINGS.ADDONS' | translate }}</md-subheader
-          >
-          <md-divider></md-divider>
-          <md-list layout="row">
-            <md-list-item
-              class="md-2-line"
-              ng-repeat="addon in vm.addons | limitTo:3"
-              flex="33"
-            >
-              <md-icon
-                md-font-icon="{{addon.icon}}"
-                class="md-avatar-icon"
-                ng-class="vm.license[addon.name] ? 'green-A700-bg' : 'red-A700-bg'"
-              ></md-icon>
-              <div class="md-list-item-text">
-                <h3 translate="SETTINGS.{{addon.name | uppercase}}"></h3>
-                <p
-                  ng-class="vm.license[addon.name] ? 'green-A700-fg' : 'red-A700-fg'"
-                >
-                  {{ 'SETTINGS.' + (vm.license[addon.name] ? 'ENABLED' :
-                  'DISABLED') | translate }}
-                </p>
-              </div>
-            </md-list-item>
-          </md-list>
-          <md-list layout="row">
-            <md-list-item
-              class="md-2-line"
-              ng-repeat="addon in vm.addons | limitTo:3:3"
-              flex="33"
-            >
-              <md-icon
-                md-font-icon="{{addon.icon}}"
-                class="md-avatar-icon"
-                ng-class="vm.license[addon.name] ? 'green-A700-bg' : 'red-A700-bg'"
-              ></md-icon>
-              <div class="md-list-item-text">
-                <h3 translate="SETTINGS.{{addon.name | uppercase}}"></h3>
-                <p
-                  ng-class="vm.license[addon.name] ? 'green-A700-fg' : 'red-A700-fg'"
-                >
-                  {{ 'SETTINGS.' + (vm.license[addon.name] ? 'ENABLED' :
-                  'DISABLED') | translate }}
-                </p>
-              </div>
-            </md-list-item>
-          </md-list>
-
-          <md-subheader class="md-no-sticky"
-            >{{ 'SETTINGS.OTHERS' | translate }}</md-subheader
-          >
-          <md-divider></md-divider>
-          <md-list layout="row">
-            <md-list-item
-              class="md-2-line"
-              ng-repeat="other in vm.others | limitTo:3"
-              flex="33"
-            >
-              <md-icon
-                md-font-icon="{{other.icon}}"
-                class="md-avatar-icon"
-                ng-class="vm.license[other.name] ? 'green-A700-bg' : 'red-A700-bg'"
-              ></md-icon>
-              <div class="md-list-item-text">
-                <h3 translate="SETTINGS.{{other.name | uppercase}}"></h3>
-                <p
-                  ng-class="vm.license[other.name] ? 'green-A700-fg' : 'red-A700-fg'"
-                >
-                  {{ 'SETTINGS.' + (vm.license[other.name] ? 'ENABLED' :
-                  'DISABLED') | translate }}
-                </p>
-              </div>
-            </md-list-item>
-          </md-list>
-          <md-list layout="row">
-            <md-list-item
-              class="md-2-line"
-              ng-repeat="other in vm.others | limitTo:3:3"
-              flex="33"
-            >
-              <md-icon
-                md-font-icon="{{other.icon}}"
-                class="md-avatar-icon"
-                ng-class="vm.license[other.name] ? 'green-A700-bg' : 'red-A700-bg'"
-              ></md-icon>
-              <div class="md-list-item-text">
-                <h3 translate="SETTINGS.{{other.name | uppercase}}"></h3>
-                <p
-                  ng-class="vm.license[other.name] ? 'green-A700-fg' : 'red-A700-fg'"
-                >
-                  {{ 'SETTINGS.' + (vm.license[other.name] ? 'ENABLED' :
-                  'DISABLED') | translate }}
-                </p>
-              </div>
-            </md-list-item>
-          </md-list>
-        </md-card>
-      </div>
-      <!-- / LICENSE CARD -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- NO ADD BUTTON BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/settings/views/license/license.html/license.html b/public/src/js/modules/main/apps/settings/views/license/license.html/license.html
new file mode 100644
index 0000000..d814326
--- /dev/null
+++ b/public/src/js/modules/main/apps/settings/views/license/license.html/license.html
@@ -0,0 +1,490 @@
+<div id="license" class="page-layout simple fullwidth doc-page">
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-cog" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="SETTINGS.LICENSE">LICENSE</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+    <!-- <div>
+                <md-button type="submit" ng-click="vm.requestLicense()" class="send-button md-raised" translate="SETTINGS.REQUEST_LICENSE" translate-attr-aria-label="SETTINGS.REQUEST_LICENSE">
+                    REQUEST LICENSE
+                </md-button>
+            </div> -->
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- LICENSE CARD -->
+      <div layout="row" flex>
+        <md-card class="md-whiteframe-1dp padding-20" flex>
+          <div layout="row" layout-align="center">
+            <div flex layout="row" layout-align="start center">
+              <div ng-if="!vm.license.custom">
+                <a
+                  href="https://www.xcally.com/plans.html"
+                  target="_blank"
+                  class="md-button md-fab green-A700-bg"
+                  aria-label="Eat cake"
+                >
+                  <md-tooltip
+                    ><span translate="SETTINGS.PRICES">Prices</span></md-tooltip
+                  >
+                  <md-icon md-font-icon="icon-coin"></md-icon>
+                </a>
+              </div>
+            </div>
+            <div flex>
+              <div ng-switch="vm.license.months" class="text-center">
+                <span ng-switch-when="1" class="md-title md-accent-fg text-bold"
+                  >{{ 'SETTINGS.PLAN' | translate }}:
+                  <span translate="SETTINGS.MONTH_TO_MONTH"
+                    >MONTH TO MONTH</span
+                  ></span
+                >
+                <span
+                  ng-switch-when="12"
+                  class="md-title md-accent-fg text-bold"
+                  >{{ 'SETTINGS.PLAN' | translate }}:
+                  <span translate="SETTINGS.ANNUALLY">ANNUALLY</span></span
+                >
+                <span
+                  ng-switch-when="36"
+                  class="md-title md-accent-fg text-bold"
+                  >{{ 'SETTINGS.PLAN' | translate }}:
+                  <span translate="SETTINGS.PERPETUAL">PERPETUAL</span></span
+                >
+              </div>
+            </div>
+            <div flex layout="row" layout-align="end center">
+              <div>
+                <md-button
+                  type="submit"
+                  ng-click="vm.updateLicense()"
+                  class="md-button md-fab md-accent"
+                >
+                  <md-tooltip
+                    ><span translate="SETTINGS.UPDATE_LICENSE"
+                      >License</span
+                    ></md-tooltip
+                  >
+                  <md-icon md-font-icon="icon-pencil"></md-icon>
+                </md-button>
+              </div>
+            </div>
+          </div>
+
+          <span
+            ng-if="!vm.license.demo && !vm.license.gray && vm.license.months != 36"
+            class="md-subhead md-warn-fg text-center"
+            >{{ 'SETTINGS.EXPIRATION_DATE' | translate }}:
+            {{vm.license.expiration | date: 'longDate'}}</span
+          >
+          <span class="text-center padding-bottom-10">
+            {{ vm.license.machineUuid !== vm.license.uuid ? 'SETTINGS.OLD_TOKEN'
+            : 'SETTINGS.TOKEN' | translate }}:
+            <span class="text-italic text-bold">{{vm.license.uuid}}</span></span
+          >
+
+          <div layout="column">
+            <span
+              ng-if="vm.license.grayReason == 'changed'"
+              class="blink md-subhead md-warn-fg text-center"
+              >{{ 'SETTINGS.NEW_TOKEN_DETECTED' | translate }}</span
+            >
+            <span
+              ng-if="vm.license.grayReason == 'changed'"
+              class="text-center padding-bottom-10"
+            >
+              {{'SETTINGS.NEW_TOKEN' | translate }}:
+              <span class="text-italic text-bold"
+                >{{vm.license.machineUuid}}</span
+              ></span
+            >
+            <span
+              ng-if="vm.license.gray"
+              class="blink md-subhead md-warn-fg text-center"
+              >{{ 'SETTINGS.EXPIRATION_GRAY_PERIOD' | translate }}:
+              {{vm.license.deadline | date: 'longDate'}}</span
+            >
+            <span
+              ng-if="vm.license.gray"
+              class="text-center padding-bottom-10 text-italic text-bold"
+            >
+              {{'SETTINGS.EXPIRATION_REASON' | translate }}
+            </span>
+            <span
+              ng-if="vm.license.grayReason == 'disabled'"
+              class="text-center padding-bottom-10"
+            >
+              {{'SETTINGS.EXPIRATION_REASON_MESSAGE_DISABLED' | translate
+              }}</span
+            >
+            <span
+              ng-if="vm.license.grayReason == 'changed'"
+              class="text-center padding-bottom-10"
+            >
+              {{'SETTINGS.EXPIRATION_REASON_MESSAGE_CHANGED' | translate
+              }}</span
+            >
+            <span
+              ng-if="vm.license.grayReason == 'changed'"
+              class="text-center padding-bottom-10"
+            >
+              {{'SETTINGS.EXPIRATION_CHANGED_ADVISE' | translate }}</span
+            >
+            <span
+              ng-if="vm.license.grayReason == 'changed'"
+              class="text-center padding-bottom-10"
+              >{{ 'SETTINGS.SEND_EMAIL_TO' | translate }}:
+              <a
+                href="mailto:[email-masked]?subject=New%20token%20detected&body=Hi xCALLY, New Token: {{vm.license.machineUuid}}, Old token: {{vm.license.uuid}}"
+                >[email-masked]</a
+              >.</span
+            >
+            <span
+              ng-if="vm.license.grayReason == 'disabled'"
+              class="text-center padding-bottom-10"
+              >{{ 'SETTINGS.SEND_EMAIL_TO' | translate }}:
+              <a
+                href="mailto:[email-masked]?subject=License%20disabled&body=Hi xCALLY, My Token: {{vm.license.machineUuid}}"
+                >[email-masked]</a
+              >.</span
+            >
+          </div>
+
+          <div ng-if="vm.license.demo" layout="column">
+            <span class="md-subhead md-warn-fg text-center"
+              >{{ 'SETTINGS.TRIAL_VERSION' | translate }}</span
+            >
+            <span class="md-subhead md-warn-fg text-center"
+              ><a
+                href="https://www.xcally.com/en/index.html#pricing-table2-h"
+                target="_blank"
+                >{{ 'SETTINGS.PRICES' | translate}}</a
+              ></span
+            >
+          </div>
+
+          <md-subheader class="md-no-sticky"
+            >{{ 'SETTINGS.STAFF' | translate }}</md-subheader
+          >
+          <md-divider></md-divider>
+          <md-list layout="row">
+            <md-list-item class="md-2-line" flex="33">
+              <md-icon
+                md-font-icon="icon-account"
+                class="md-avatar-icon"
+              ></md-icon>
+              <div class="md-list-item-text">
+                <h3>
+                  {{ vm.license.users || 0 }}
+                  <span
+                    ng-class="{'red-fg': vm.license.users <= vm.users && vm.license.users > 0}"
+                    >({{vm.license.users >= vm.users ? vm.users :
+                    vm.license.users}})</span
+                  >
+                </h3>
+                <p translate="SETTINGS.USERS">Users</p>
+              </div>
+            </md-list-item>
+            <md-list-item class="md-2-line" flex="33">
+              <md-icon
+                md-font-icon="icon-headphones"
+                class="md-avatar-icon"
+              ></md-icon>
+              <div class="md-list-item-text">
+                <h3>
+                  {{ vm.license.agents || 0 }}
+                  <span
+                    ng-class="{'red-fg': (vm.license.agents <= vm.agents && vm.license.agents > 0) }"
+                    >({{vm.license.agents >= vm.agents ? vm.agents :
+                    vm.license.agents}})</span
+                  >
+                </h3>
+                <p translate="SETTINGS.AGENTS">Agents</p>
+              </div>
+            </md-list-item>
+            <md-list-item class="md-2-line" flex="33">
+              <md-icon
+                md-font-icon="icon-phone"
+                class="md-avatar-icon"
+              ></md-icon>
+              <div class="md-list-item-text">
+                <h3>
+                  {{ vm.license.telephones || 0 }}
+                  <span
+                    ng-class="{'red-fg': vm.license.telephones <= vm.telephones && vm.license.telephones > 0}"
+                    >({{vm.license.telephones >= vm.telephones ? vm.telephones :
+                    vm.license.telephones}})</span
+                  >
+                </h3>
+                <p translate="SETTINGS.TELEPHONES">Telephones</p>
+              </div>
+            </md-list-item>
+          </md-list>
+
+          <md-subheader class="md-no-sticky"
+            >{{ 'SETTINGS.CHANNELS' | translate }}</md-subheader
+          >
+          <md-divider></md-divider>
+          <md-list layout="row">
+            <md-list-item
+              flex="33"
+              class="md-2-line"
+              ng-repeat="channel in vm.channels | limitTo:3"
+            >
+              <md-icon
+                md-font-icon="{{channel.icon}}"
+                class="md-avatar-icon"
+                ng-class="vm.license[channel.name] ? 'green-A700-bg' : 'red-A700-bg'"
+              ></md-icon>
+              <div class="md-list-item-text">
+                <h3 translate="SETTINGS.{{channel.name | uppercase}}"></h3>
+                <p
+                  ng-class="vm.license[channel.name] ? 'green-A700-fg' : 'red-A700-fg'"
+                >
+                  {{ 'SETTINGS.' + (vm.license[channel.name] ? 'ENABLED' :
+                  'DISABLED') | translate }}
+                </p>
+              </div>
+            </md-list-item>
+          </md-list>
+          <md-list layout="row">
+            <md-list-item
+              flex="33"
+              class="md-2-line"
+              ng-repeat="channel in vm.channels | limitTo:3:3"
+            >
+              <md-icon
+                md-font-icon="{{channel.icon}}"
+                class="md-avatar-icon"
+                ng-class="vm.license[channel.name] ? 'green-A700-bg' : 'red-A700-bg'"
+              ></md-icon>
+              <div class="md-list-item-text">
+                <h3 translate="SETTINGS.{{channel.name | uppercase}}"></h3>
+                <p
+                  ng-class="vm.license[channel.name] ? 'green-A700-fg' : 'red-A700-fg'"
+                >
+                  {{ 'SETTINGS.' + (vm.license[channel.name] ? 'ENABLED' :
+                  'DISABLED') | translate }}
+                </p>
+              </div>
+            </md-list-item>
+          </md-list>
+          <md-list layout="row">
+            <md-list-item
+              flex="33"
+              class="md-2-line"
+              ng-repeat="channel in vm.channels | limitTo:3:6"
+            >
+              <md-icon
+                md-font-icon="{{channel.icon}}"
+                class="md-avatar-icon"
+                ng-class="vm.license[channel.name] ? 'green-A700-bg' : 'red-A700-bg'"
+              ></md-icon>
+              <div class="md-list-item-text">
+                <h3 translate="SETTINGS.{{channel.name | uppercase}}"></h3>
+                <p
+                  ng-class="vm.license[channel.name] ? 'green-A700-fg' : 'red-A700-fg'"
+                >
+                  {{ 'SETTINGS.' + (vm.license[channel.name] ? 'ENABLED' :
+                  'DISABLED') | translate }}
+                </p>
+              </div>
+            </md-list-item>
+          </md-list>
+
+          <md-subheader class="md-no-sticky"
+            >{{ 'SETTINGS.MODULES' | translate }}</md-subheader
+          >
+          <md-divider></md-divider>
+          <md-list layout="row">
+            <md-list-item
+              class="md-2-line"
+              ng-repeat="module in vm.modules"
+              flex="33"
+            >
+              <md-icon
+                md-font-icon="{{module.icon}}"
+                class="md-avatar-icon"
+                ng-class="vm.license[module.name] ? 'green-A700-bg' : 'red-A700-bg'"
+              ></md-icon>
+              <div class="md-list-item-text">
+                <h3 translate="SETTINGS.{{module.name | uppercase}}"></h3>
+                <p
+                  ng-class="vm.license[module.name] ? 'green-A700-fg' : 'red-A700-fg'"
+                >
+                  {{ 'SETTINGS.' + (vm.license[module.name] ? 'ENABLED' :
+                  'DISABLED') | translate }}
+                </p>
+              </div>
+            </md-list-item>
+          </md-list>
+
+          <md-subheader class="md-no-sticky"
+            >{{ 'SETTINGS.SESSIONS' | translate }}</md-subheader
+          >
+          <md-divider></md-divider>
+          <md-list layout="row">
+            <div ng-repeat="session in vm.sessions" flex="33">
+              <md-list-item class="md-2-line">
+                <md-icon
+                  md-font-icon="{{session.icon}}"
+                  class="md-avatar-icon"
+                  ng-class="vm.license[session.enabled] ? 'green-A700-bg' : 'red-A700-bg'"
+                ></md-icon>
+                <div class="md-list-item-text">
+                  <div layout="row" layout="start center">
+                    <h3 translate="SETTINGS.{{session.name | uppercase}}"></h3>
+                    <button
+                      ng-if="session.restart"
+                      ng-click="vm.gotoProcess($event)"
+                      class="md-mini"
+                      aria-label="restart"
+                    >
+                      <md-tooltip>Restart</md-tooltip>
+                      <md-icon md-font-icon="icon-reload"></md-icon>
+                    </button>
+                  </div>
+                  <p
+                    ng-if="vm.license[session.name] && vm.license[session.enabled]"
+                    class="green-A700-fg"
+                  >
+                    {{vm.license[session.name]}} {{ 'SETTINGS.' + session.label
+                    | uppercase | translate }}
+                  </p>
+                  <p
+                    ng-if="!vm.license[session.name] && vm.license[session.enabled]"
+                    class="green-A700-fg"
+                  >
+                    UNLIMITED {{ 'SETTINGS.' + session.label | uppercase |
+                    translate }}
+                  </p>
+                  <p ng-if="!vm.license[session.enabled]" class="red-A700-fg">
+                    {{ 'SETTINGS.DISABLED' | translate }}
+                  </p>
+                </div>
+              </md-list-item>
+            </div>
+          </md-list>
+
+          <md-subheader class="md-no-sticky"
+            >{{ 'SETTINGS.ADDONS' | translate }}</md-subheader
+          >
+          <md-divider></md-divider>
+          <md-list layout="row">
+            <md-list-item
+              class="md-2-line"
+              ng-repeat="addon in vm.addons | limitTo:3"
+              flex="33"
+            >
+              <md-icon
+                md-font-icon="{{addon.icon}}"
+                class="md-avatar-icon"
+                ng-class="vm.license[addon.name] ? 'green-A700-bg' : 'red-A700-bg'"
+              ></md-icon>
+              <div class="md-list-item-text">
+                <h3 translate="SETTINGS.{{addon.name | uppercase}}"></h3>
+                <p
+                  ng-class="vm.license[addon.name] ? 'green-A700-fg' : 'red-A700-fg'"
+                >
+                  {{ 'SETTINGS.' + (vm.license[addon.name] ? 'ENABLED' :
+                  'DISABLED') | translate }}
+                </p>
+              </div>
+            </md-list-item>
+          </md-list>
+          <md-list layout="row">
+            <md-list-item
+              class="md-2-line"
+              ng-repeat="addon in vm.addons | limitTo:3:3"
+              flex="33"
+            >
+              <md-icon
+                md-font-icon="{{addon.icon}}"
+                class="md-avatar-icon"
+                ng-class="vm.license[addon.name] ? 'green-A700-bg' : 'red-A700-bg'"
+              ></md-icon>
+              <div class="md-list-item-text">
+                <h3 translate="SETTINGS.{{addon.name | uppercase}}"></h3>
+                <p
+                  ng-class="vm.license[addon.name] ? 'green-A700-fg' : 'red-A700-fg'"
+                >
+                  {{ 'SETTINGS.' + (vm.license[addon.name] ? 'ENABLED' :
+                  'DISABLED') | translate }}
+                </p>
+              </div>
+            </md-list-item>
+          </md-list>
+
+          <md-subheader class="md-no-sticky"
+            >{{ 'SETTINGS.OTHERS' | translate }}</md-subheader
+          >
+          <md-divider></md-divider>
+          <md-list layout="row">
+            <md-list-item
+              class="md-2-line"
+              ng-repeat="other in vm.others | limitTo:3"
+              flex="33"
+            >
+              <md-icon
+                md-font-icon="{{other.icon}}"
+                class="md-avatar-icon"
+                ng-class="vm.license[other.name] ? 'green-A700-bg' : 'red-A700-bg'"
+              ></md-icon>
+              <div class="md-list-item-text">
+                <h3 translate="SETTINGS.{{other.name | uppercase}}"></h3>
+                <p
+                  ng-class="vm.license[other.name] ? 'green-A700-fg' : 'red-A700-fg'"
+                >
+                  {{ 'SETTINGS.' + (vm.license[other.name] ? 'ENABLED' :
+                  'DISABLED') | translate }}
+                </p>
+              </div>
+            </md-list-item>
+          </md-list>
+          <md-list layout="row">
+            <md-list-item
+              class="md-2-line"
+              ng-repeat="other in vm.others | limitTo:3:3"
+              flex="33"
+            >
+              <md-icon
+                md-font-icon="{{other.icon}}"
+                class="md-avatar-icon"
+                ng-class="vm.license[other.name] ? 'green-A700-bg' : 'red-A700-bg'"
+              ></md-icon>
+              <div class="md-list-item-text">
+                <h3 translate="SETTINGS.{{other.name | uppercase}}"></h3>
+                <p
+                  ng-class="vm.license[other.name] ? 'green-A700-fg' : 'red-A700-fg'"
+                >
+                  {{ 'SETTINGS.' + (vm.license[other.name] ? 'ENABLED' :
+                  'DISABLED') | translate }}
+                </p>
+              </div>
+            </md-list-item>
+          </md-list>
+        </md-card>
+      </div>
+      <!-- / LICENSE CARD -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- NO ADD BUTTON BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/settings/views/license/request/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/settings/views/license/request/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index f834d24..0000000
--- a/public/src/js/modules/main/apps/settings/views/license/request/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,306 +0,0 @@
-<md-dialog class="request-dialog" aria-label="Send Request">
-  <form name="requestForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title" translate="SETTINGS.REQUEST_LICENSE"
-          >Request License</span
-        >
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="SETTINGS.NAME">Name</label>
-        <input type="text" name="name" ng-model="vm.license.name" required />
-        <div
-          ng-messages="requestForm.name.$error"
-          ng-show="requestForm.name.$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SETTINGS.ERRORS.NAME_REQUIRED"
-              >Address field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="SETTINGS.EMAIL">Email</label>
-        <input type="email" name="email" ng-model="vm.license.email" required />
-        <div
-          ng-messages="requestForm.email.$error"
-          ng-show="requestForm.email.$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SETTINGS.ERRORS.EMAIL_REQUIRED"
-              >Email field is required</span
-            >
-          </div>
-          <div ng-message="email">
-            <span translate="SETTINGS.ERRORS.EMAIL_MUST_VALID"
-              >Email must be a valid e-mail address</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="SETTINGS.PLAN">Plan</label>
-        <md-select name="plan" ng-model="vm.license.months" required>
-          <md-option ng-value="1"
-            ><span translate="SETTINGS.MONTH_TO_MONTH"
-              >MONTH TO MONTH</span
-            ></md-option
-          >
-          <md-option ng-value="12"
-            ><span translate="SETTINGS.ANNUALLY">ANNUALLY</span></md-option
-          >
-          <md-option ng-value="36"
-            ><span translate="SETTINGS.PERPETUAL">PERPETUAL</span></md-option
-          >
-        </md-select>
-        <div
-          ng-messages="requestForm.plan.$error"
-          ng-show="requestForm.plan.$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SETTINGS.ERRORS.PLAN_REQUIRED"
-              >Plan field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-subheader class="md-no-sticky"
-        >{{ 'SETTINGS.STAFF' | translate }}</md-subheader
-      >
-      <div layout="row" layout-align="space-between center">
-        <md-input-container class="md-block" flex>
-          <label translate="SETTINGS.USERS">Users</label>
-          <input
-            type="number"
-            name="users"
-            ng-model="vm.license.users"
-            required
-          />
-          <div
-            ng-messages="requestForm.users.$error"
-            ng-show="requestForm.users.$touched"
-            role="alert"
-          >
-            <div ng-message="required">
-              <span translate="SETTINGS.ERRORS.USERS_REQUIRED"
-                >Users field is required</span
-              >
-            </div>
-          </div>
-        </md-input-container>
-        <md-input-container class="md-block" flex>
-          <label translate="SETTINGS.AGENTS">Agents</label>
-          <input
-            type="number"
-            name="agents"
-            ng-model="vm.license.agents"
-            required
-          />
-          <div
-            ng-messages="requestForm.agents.$error"
-            ng-show="requestForm.agents.$touched"
-            role="alert"
-          >
-            <div ng-message="required">
-              <span translate="SETTINGS.ERRORS.AGENTS_REQUIRED"
-                >Agents field is required</span
-              >
-            </div>
-          </div>
-        </md-input-container>
-        <md-input-container class="md-block" flex>
-          <label translate="SETTINGS.TELEPHONES">Telephones</label>
-          <input
-            type="number"
-            name="telephones"
-            ng-model="vm.license.telephones"
-            required
-          />
-          <div
-            ng-messages="requestForm.telephones.$error"
-            ng-show="requestForm.telephones.$touched"
-            role="alert"
-          >
-            <div ng-message="required">
-              <span translate="SETTINGS.ERRORS.TELEPHONES_REQUIRED"
-                >Telephones field is required</span
-              >
-            </div>
-          </div>
-        </md-input-container>
-      </div>
-
-      <md-subheader class="md-no-sticky"
-        >{{ 'SETTINGS.CHANNELS' | translate }}</md-subheader
-      >
-      <div layout="row" layout-align="space-between center">
-        <md-switch
-          ng-model="vm.license[channel.name]"
-          aria-label="{{channel.name}}"
-          ng-repeat="channel in vm.channels | limitTo:3"
-          ><span translate="SETTINGS.{{channel.name | uppercase}}"></span
-        ></md-switch>
-        <md-switch
-          ng-model="vm.license[channel.name]"
-          aria-label="{{channel.name}}"
-          ng-repeat="channel in vm.channels | limitTo:3:3"
-          ><span translate="SETTINGS.{{channel.name | uppercase}}"></span
-        ></md-switch>
-      </div>
-
-      <md-subheader class="md-no-sticky"
-        >{{ 'SETTINGS.MODULES' | translate }}</md-subheader
-      >
-      <div layout="row" layout-align="space-between center">
-        <md-switch
-          ng-model="vm.license[module.name]"
-          aria-label="{{module.name}}"
-          ng-repeat="module in vm.modules"
-          ><span translate="SETTINGS.{{module.name | uppercase}}"></span
-        ></md-switch>
-      </div>
-
-      <md-subheader class="md-no-sticky"
-        >{{ 'SETTINGS.SESSIONS' | translate }}</md-subheader
-      >
-      <div layout="row">
-        <md-input-container
-          ng-repeat="session in vm.sessions"
-          class="md-block"
-          flex="50"
-        >
-          <label
-            >{{ 'SETTINGS.' + session.name | uppercase | translate }} ({{
-            'SETTINGS.' + session.label | uppercase | translate }})</label
-          >
-          <input
-            type="number"
-            name="{{session.name}}"
-            ng-model="vm.license[session.name]"
-            required
-          />
-          <div class="hint">
-            <span>0={{ 'SETTINGS.UNLIMITED_CHANNELS' | translate }}</span>
-          </div>
-          <div
-            ng-messages="requestForm[session.name].$error"
-            ng-show="requestForm[session.name].$touched"
-            role="alert"
-          >
-            <div ng-message="required">
-              <span translate="SETTINGS.ERRORS.CHANNEL_REQUIRED"
-                >Mandatory field</span
-              >
-            </div>
-          </div>
-        </md-input-container>
-      </div>
-
-      <md-subheader class="md-no-sticky"
-        >{{ 'SETTINGS.ADDONS' | translate }}</md-subheader
-      >
-      <div layout="row" layout-align="space-between center">
-        <md-switch
-          ng-model="vm.license[addon.name]"
-          aria-label="{{module.name}}"
-          ng-repeat="addon in vm.addons"
-          ><span translate="SETTINGS.{{addon.name | uppercase}}"></span
-        ></md-switch>
-      </div>
-
-      <md-subheader class="md-no-sticky"
-        >{{ 'SETTINGS.OTHERS' | translate }}</md-subheader
-      >
-      <div layout="row" layout-align="space-between center">
-        <md-switch
-          ng-model="vm.license[other.name]"
-          aria-label="{{other.name}}"
-          ng-repeat="other in vm.others"
-          ><span translate="SETTINGS.{{other.name | uppercase}}"></span
-        ></md-switch>
-      </div>
-
-      <md-input-container class="md-block">
-        <label translate="SETTINGS.DESCRIPTION">Description</label>
-        <textarea
-          name="description"
-          ng-model="vm.license.description"
-        ></textarea>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-click="vm.sendRequest()"
-          class="send-button md-accent md-raised"
-          ng-disabled="requestForm.$invalid || requestForm.$pristine"
-          aria-label="SEND"
-          translate="SETTINGS.SEND"
-          translate-attr-aria-label="SETTINGS.SEND"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/settings/views/license/request/dialog.html/dialog.html b/public/src/js/modules/main/apps/settings/views/license/request/dialog.html/dialog.html
new file mode 100644
index 0000000..f834d24
--- /dev/null
+++ b/public/src/js/modules/main/apps/settings/views/license/request/dialog.html/dialog.html
@@ -0,0 +1,306 @@
+<md-dialog class="request-dialog" aria-label="Send Request">
+  <form name="requestForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title" translate="SETTINGS.REQUEST_LICENSE"
+          >Request License</span
+        >
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="SETTINGS.NAME">Name</label>
+        <input type="text" name="name" ng-model="vm.license.name" required />
+        <div
+          ng-messages="requestForm.name.$error"
+          ng-show="requestForm.name.$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SETTINGS.ERRORS.NAME_REQUIRED"
+              >Address field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="SETTINGS.EMAIL">Email</label>
+        <input type="email" name="email" ng-model="vm.license.email" required />
+        <div
+          ng-messages="requestForm.email.$error"
+          ng-show="requestForm.email.$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SETTINGS.ERRORS.EMAIL_REQUIRED"
+              >Email field is required</span
+            >
+          </div>
+          <div ng-message="email">
+            <span translate="SETTINGS.ERRORS.EMAIL_MUST_VALID"
+              >Email must be a valid e-mail address</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="SETTINGS.PLAN">Plan</label>
+        <md-select name="plan" ng-model="vm.license.months" required>
+          <md-option ng-value="1"
+            ><span translate="SETTINGS.MONTH_TO_MONTH"
+              >MONTH TO MONTH</span
+            ></md-option
+          >
+          <md-option ng-value="12"
+            ><span translate="SETTINGS.ANNUALLY">ANNUALLY</span></md-option
+          >
+          <md-option ng-value="36"
+            ><span translate="SETTINGS.PERPETUAL">PERPETUAL</span></md-option
+          >
+        </md-select>
+        <div
+          ng-messages="requestForm.plan.$error"
+          ng-show="requestForm.plan.$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SETTINGS.ERRORS.PLAN_REQUIRED"
+              >Plan field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-subheader class="md-no-sticky"
+        >{{ 'SETTINGS.STAFF' | translate }}</md-subheader
+      >
+      <div layout="row" layout-align="space-between center">
+        <md-input-container class="md-block" flex>
+          <label translate="SETTINGS.USERS">Users</label>
+          <input
+            type="number"
+            name="users"
+            ng-model="vm.license.users"
+            required
+          />
+          <div
+            ng-messages="requestForm.users.$error"
+            ng-show="requestForm.users.$touched"
+            role="alert"
+          >
+            <div ng-message="required">
+              <span translate="SETTINGS.ERRORS.USERS_REQUIRED"
+                >Users field is required</span
+              >
+            </div>
+          </div>
+        </md-input-container>
+        <md-input-container class="md-block" flex>
+          <label translate="SETTINGS.AGENTS">Agents</label>
+          <input
+            type="number"
+            name="agents"
+            ng-model="vm.license.agents"
+            required
+          />
+          <div
+            ng-messages="requestForm.agents.$error"
+            ng-show="requestForm.agents.$touched"
+            role="alert"
+          >
+            <div ng-message="required">
+              <span translate="SETTINGS.ERRORS.AGENTS_REQUIRED"
+                >Agents field is required</span
+              >
+            </div>
+          </div>
+        </md-input-container>
+        <md-input-container class="md-block" flex>
+          <label translate="SETTINGS.TELEPHONES">Telephones</label>
+          <input
+            type="number"
+            name="telephones"
+            ng-model="vm.license.telephones"
+            required
+          />
+          <div
+            ng-messages="requestForm.telephones.$error"
+            ng-show="requestForm.telephones.$touched"
+            role="alert"
+          >
+            <div ng-message="required">
+              <span translate="SETTINGS.ERRORS.TELEPHONES_REQUIRED"
+                >Telephones field is required</span
+              >
+            </div>
+          </div>
+        </md-input-container>
+      </div>
+
+      <md-subheader class="md-no-sticky"
+        >{{ 'SETTINGS.CHANNELS' | translate }}</md-subheader
+      >
+      <div layout="row" layout-align="space-between center">
+        <md-switch
+          ng-model="vm.license[channel.name]"
+          aria-label="{{channel.name}}"
+          ng-repeat="channel in vm.channels | limitTo:3"
+          ><span translate="SETTINGS.{{channel.name | uppercase}}"></span
+        ></md-switch>
+        <md-switch
+          ng-model="vm.license[channel.name]"
+          aria-label="{{channel.name}}"
+          ng-repeat="channel in vm.channels | limitTo:3:3"
+          ><span translate="SETTINGS.{{channel.name | uppercase}}"></span
+        ></md-switch>
+      </div>
+
+      <md-subheader class="md-no-sticky"
+        >{{ 'SETTINGS.MODULES' | translate }}</md-subheader
+      >
+      <div layout="row" layout-align="space-between center">
+        <md-switch
+          ng-model="vm.license[module.name]"
+          aria-label="{{module.name}}"
+          ng-repeat="module in vm.modules"
+          ><span translate="SETTINGS.{{module.name | uppercase}}"></span
+        ></md-switch>
+      </div>
+
+      <md-subheader class="md-no-sticky"
+        >{{ 'SETTINGS.SESSIONS' | translate }}</md-subheader
+      >
+      <div layout="row">
+        <md-input-container
+          ng-repeat="session in vm.sessions"
+          class="md-block"
+          flex="50"
+        >
+          <label
+            >{{ 'SETTINGS.' + session.name | uppercase | translate }} ({{
+            'SETTINGS.' + session.label | uppercase | translate }})</label
+          >
+          <input
+            type="number"
+            name="{{session.name}}"
+            ng-model="vm.license[session.name]"
+            required
+          />
+          <div class="hint">
+            <span>0={{ 'SETTINGS.UNLIMITED_CHANNELS' | translate }}</span>
+          </div>
+          <div
+            ng-messages="requestForm[session.name].$error"
+            ng-show="requestForm[session.name].$touched"
+            role="alert"
+          >
+            <div ng-message="required">
+              <span translate="SETTINGS.ERRORS.CHANNEL_REQUIRED"
+                >Mandatory field</span
+              >
+            </div>
+          </div>
+        </md-input-container>
+      </div>
+
+      <md-subheader class="md-no-sticky"
+        >{{ 'SETTINGS.ADDONS' | translate }}</md-subheader
+      >
+      <div layout="row" layout-align="space-between center">
+        <md-switch
+          ng-model="vm.license[addon.name]"
+          aria-label="{{module.name}}"
+          ng-repeat="addon in vm.addons"
+          ><span translate="SETTINGS.{{addon.name | uppercase}}"></span
+        ></md-switch>
+      </div>
+
+      <md-subheader class="md-no-sticky"
+        >{{ 'SETTINGS.OTHERS' | translate }}</md-subheader
+      >
+      <div layout="row" layout-align="space-between center">
+        <md-switch
+          ng-model="vm.license[other.name]"
+          aria-label="{{other.name}}"
+          ng-repeat="other in vm.others"
+          ><span translate="SETTINGS.{{other.name | uppercase}}"></span
+        ></md-switch>
+      </div>
+
+      <md-input-container class="md-block">
+        <label translate="SETTINGS.DESCRIPTION">Description</label>
+        <textarea
+          name="description"
+          ng-model="vm.license.description"
+        ></textarea>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-click="vm.sendRequest()"
+          class="send-button md-accent md-raised"
+          ng-disabled="requestForm.$invalid || requestForm.$pristine"
+          aria-label="SEND"
+          translate="SETTINGS.SEND"
+          translate-attr-aria-label="SETTINGS.SEND"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/settings/views/license/update/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/settings/views/license/update/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 1bcbaa0..0000000
--- a/public/src/js/modules/main/apps/settings/views/license/update/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,102 +0,0 @@
-<md-dialog class="update-dialog" aria-label="Update License">
-  <form name="updateForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title" translate="SETTINGS.UPDATE_LICENSE"
-          >Update License</span
-        >
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <md-content layout="row">
-        <span class="md-title" translate="SETTINGS.UPDATE_LICENSE_MANUALLY"
-          >Do you want to update your license manually?</span
-        >
-      </md-content>
-      <md-input-container class="md-block">
-        <label translate="SETTINGS.ENTER_LICENSE">Enter your license</label>
-        <textarea name="key" ng-model="vm.licenseKey" required></textarea>
-        <div
-          ng-messages="updateForm.name.$error"
-          ng-show="updateForm.key.$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SETTINGS.ERRORS.LICENSE_REQUIRED"
-              >License key field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-click="vm.updateLicense()"
-          class="send-button md-accent md-raised"
-          ng-disabled="updateForm.$invalid || updateForm.$pristine"
-          aria-label="UPDATE"
-          translate="SETTINGS.UPDATE"
-          translate-attr-aria-label="SETTINGS.UPDATE"
-        >
-          UPDATE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/settings/views/license/update/dialog.html/dialog.html b/public/src/js/modules/main/apps/settings/views/license/update/dialog.html/dialog.html
new file mode 100644
index 0000000..1bcbaa0
--- /dev/null
+++ b/public/src/js/modules/main/apps/settings/views/license/update/dialog.html/dialog.html
@@ -0,0 +1,102 @@
+<md-dialog class="update-dialog" aria-label="Update License">
+  <form name="updateForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title" translate="SETTINGS.UPDATE_LICENSE"
+          >Update License</span
+        >
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <md-content layout="row">
+        <span class="md-title" translate="SETTINGS.UPDATE_LICENSE_MANUALLY"
+          >Do you want to update your license manually?</span
+        >
+      </md-content>
+      <md-input-container class="md-block">
+        <label translate="SETTINGS.ENTER_LICENSE">Enter your license</label>
+        <textarea name="key" ng-model="vm.licenseKey" required></textarea>
+        <div
+          ng-messages="updateForm.name.$error"
+          ng-show="updateForm.key.$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SETTINGS.ERRORS.LICENSE_REQUIRED"
+              >License key field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-click="vm.updateLicense()"
+          class="send-button md-accent md-raised"
+          ng-disabled="updateForm.$invalid || updateForm.$pristine"
+          aria-label="UPDATE"
+          translate="SETTINGS.UPDATE"
+          translate-attr-aria-label="SETTINGS.UPDATE"
+        >
+          UPDATE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/settings/views/networks/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/settings/views/networks/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index ce90da1..0000000
--- a/public/src/js/modules/main/apps/settings/views/networks/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,263 +0,0 @@
-<md-dialog class="network-dialog" aria-label="New Network">
-  <form name="networkForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="SETTINGS.TYPE">Type</label>
-        <md-select name="type" ng-model="vm.network.type" autofocus required>
-          <md-option ng-value="'localnet'">LocalNET</md-option>
-          <md-option ng-value="'externip'">ExternIP</md-option>
-          <md-option ng-value="'turn'">Turn</md-option>
-          <md-option ng-value="'stun'">Stun</md-option>
-        </md-select>
-        <div
-          ng-messages="networkForm['type'].$error"
-          ng-show="networkForm['type'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SETTINGS.ERRORS.TYPE_REQUIRED"
-              >Type field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.network.type == 'localnet'"
-        class="md-block"
-      >
-        <label translate="SETTINGS.LOCALNETADDRESS">localNetAddress</label>
-        <input
-          type="text"
-          name="value"
-          ng-model="vm.network.value"
-          ng-pattern="/^(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])/(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])$/"
-          ng-required="true"
-        />
-
-        <div class="hint">
-          <span translate="SETTINGS.HELP.LOCALNETADDRESS"></span>
-        </div>
-        <div
-          ng-messages="networkForm['value'].$error"
-          ng-show="networkForm['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SETTINGS.ERRORS.LOCALNETADDRESS_REQUIRED"
-              >localNetAddress field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span
-              translate="SETTINGS.ERRORS.LOCALNETADDRESS_MUST_VALID_PATTERN"
-              translate-values="{ regex: '/^(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])/(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])$/' }"
-              >localNetAddress must be valid pattern
-            </span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.network.type == 'externip'"
-        class="md-block"
-      >
-        <label translate="SETTINGS.ADDRESS">Address</label>
-        <input
-          type="text"
-          name="value"
-          ng-model="vm.network.value"
-          ng-pattern="/^(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])$/"
-          ng-required="true"
-        />
-
-        <div class="hint"><span translate="SETTINGS.HELP.ADDRESS"></span></div>
-        <div
-          ng-messages="networkForm['value'].$error"
-          ng-show="networkForm['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SETTINGS.ERRORS.ADDRESS_REQUIRED"
-              >Address field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span
-              translate="SETTINGS.ERRORS.ADDRESS_MUST_VALID_PATTERN"
-              translate-values="{ regex: '/^(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])$/' }"
-              >Address must be valid pattern
-            </span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.network.type == 'turn' || vm.network.type == 'stun'"
-        class="md-block"
-      >
-        <label translate="SETTINGS.ADDRESS">Address</label>
-        <input
-          type="text"
-          name="value"
-          ng-model="vm.network.value"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="networkForm['value'].$error"
-          ng-show="networkForm['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SETTINGS.ERRORS.ADDRESS_REQUIRED"
-              >Address field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container ng-if="vm.network.type == 'turn'" class="md-block">
-        <label translate="SETTINGS.USERNAME">Username</label>
-        <input
-          type="text"
-          name="username"
-          ng-model="vm.network.username"
-          ng-required="vm.network.type == 'turn'"
-        />
-
-        <div class="hint"><span translate="SETTINGS.HELP.USERNAME"></span></div>
-        <div
-          ng-messages="networkForm['username'].$error"
-          ng-show="networkForm['username'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SETTINGS.ERRORS.USERNAME_REQUIRED"
-              >Username field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container ng-if="vm.network.type == 'turn'" class="md-block">
-        <label translate="SETTINGS.PASSWORD">Password</label>
-        <input
-          type="text"
-          name="password"
-          ng-model="vm.network.password"
-          ng-required="vm.network.type == 'turn'"
-        />
-
-        <div class="hint"><span translate="SETTINGS.HELP.PASSWORD"></span></div>
-        <div
-          ng-messages="networkForm['password'].$error"
-          ng-show="networkForm['password'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SETTINGS.ERRORS.PASSWORD_REQUIRED"
-              >Password field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="!vm.newNetwork"
-          ng-click="vm.saveNetwork()"
-          class="send-button md-accent md-raised"
-          ng-disabled="networkForm.$invalid || networkForm.$pristine"
-          aria-label="SAVE"
-          translate="SETTINGS.SAVE"
-          translate-attr-aria-label="SETTINGS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.newNetwork"
-          ng-click="vm.addNewNetwork()"
-          class="send-button md-accent md-raised"
-          ng-disabled="networkForm.$invalid"
-          aria-label="ADD"
-          translate="SETTINGS.ADD_NETWORK"
-          translate-attr-aria-label="SETTINGS.ADD_NETWORK"
-        >
-          ADD NETWORK
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-click="vm.deleteNetwork($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="SETTINGS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="SETTINGS.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/settings/views/networks/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/settings/views/networks/create/dialog.html/dialog.html
new file mode 100644
index 0000000..ce90da1
--- /dev/null
+++ b/public/src/js/modules/main/apps/settings/views/networks/create/dialog.html/dialog.html
@@ -0,0 +1,263 @@
+<md-dialog class="network-dialog" aria-label="New Network">
+  <form name="networkForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="SETTINGS.TYPE">Type</label>
+        <md-select name="type" ng-model="vm.network.type" autofocus required>
+          <md-option ng-value="'localnet'">LocalNET</md-option>
+          <md-option ng-value="'externip'">ExternIP</md-option>
+          <md-option ng-value="'turn'">Turn</md-option>
+          <md-option ng-value="'stun'">Stun</md-option>
+        </md-select>
+        <div
+          ng-messages="networkForm['type'].$error"
+          ng-show="networkForm['type'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SETTINGS.ERRORS.TYPE_REQUIRED"
+              >Type field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.network.type == 'localnet'"
+        class="md-block"
+      >
+        <label translate="SETTINGS.LOCALNETADDRESS">localNetAddress</label>
+        <input
+          type="text"
+          name="value"
+          ng-model="vm.network.value"
+          ng-pattern="/^(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])/(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])$/"
+          ng-required="true"
+        />
+
+        <div class="hint">
+          <span translate="SETTINGS.HELP.LOCALNETADDRESS"></span>
+        </div>
+        <div
+          ng-messages="networkForm['value'].$error"
+          ng-show="networkForm['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SETTINGS.ERRORS.LOCALNETADDRESS_REQUIRED"
+              >localNetAddress field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span
+              translate="SETTINGS.ERRORS.LOCALNETADDRESS_MUST_VALID_PATTERN"
+              translate-values="{ regex: '/^(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])/(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])$/' }"
+              >localNetAddress must be valid pattern
+            </span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.network.type == 'externip'"
+        class="md-block"
+      >
+        <label translate="SETTINGS.ADDRESS">Address</label>
+        <input
+          type="text"
+          name="value"
+          ng-model="vm.network.value"
+          ng-pattern="/^(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])$/"
+          ng-required="true"
+        />
+
+        <div class="hint"><span translate="SETTINGS.HELP.ADDRESS"></span></div>
+        <div
+          ng-messages="networkForm['value'].$error"
+          ng-show="networkForm['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SETTINGS.ERRORS.ADDRESS_REQUIRED"
+              >Address field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span
+              translate="SETTINGS.ERRORS.ADDRESS_MUST_VALID_PATTERN"
+              translate-values="{ regex: '/^(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])$/' }"
+              >Address must be valid pattern
+            </span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.network.type == 'turn' || vm.network.type == 'stun'"
+        class="md-block"
+      >
+        <label translate="SETTINGS.ADDRESS">Address</label>
+        <input
+          type="text"
+          name="value"
+          ng-model="vm.network.value"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="networkForm['value'].$error"
+          ng-show="networkForm['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SETTINGS.ERRORS.ADDRESS_REQUIRED"
+              >Address field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container ng-if="vm.network.type == 'turn'" class="md-block">
+        <label translate="SETTINGS.USERNAME">Username</label>
+        <input
+          type="text"
+          name="username"
+          ng-model="vm.network.username"
+          ng-required="vm.network.type == 'turn'"
+        />
+
+        <div class="hint"><span translate="SETTINGS.HELP.USERNAME"></span></div>
+        <div
+          ng-messages="networkForm['username'].$error"
+          ng-show="networkForm['username'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SETTINGS.ERRORS.USERNAME_REQUIRED"
+              >Username field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container ng-if="vm.network.type == 'turn'" class="md-block">
+        <label translate="SETTINGS.PASSWORD">Password</label>
+        <input
+          type="text"
+          name="password"
+          ng-model="vm.network.password"
+          ng-required="vm.network.type == 'turn'"
+        />
+
+        <div class="hint"><span translate="SETTINGS.HELP.PASSWORD"></span></div>
+        <div
+          ng-messages="networkForm['password'].$error"
+          ng-show="networkForm['password'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SETTINGS.ERRORS.PASSWORD_REQUIRED"
+              >Password field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="!vm.newNetwork"
+          ng-click="vm.saveNetwork()"
+          class="send-button md-accent md-raised"
+          ng-disabled="networkForm.$invalid || networkForm.$pristine"
+          aria-label="SAVE"
+          translate="SETTINGS.SAVE"
+          translate-attr-aria-label="SETTINGS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.newNetwork"
+          ng-click="vm.addNewNetwork()"
+          class="send-button md-accent md-raised"
+          ng-disabled="networkForm.$invalid"
+          aria-label="ADD"
+          translate="SETTINGS.ADD_NETWORK"
+          translate-attr-aria-label="SETTINGS.ADD_NETWORK"
+        >
+          ADD NETWORK
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-click="vm.deleteNetwork($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="SETTINGS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="SETTINGS.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/settings/views/networks/networks.html/networks-[chunkhash].html b/public/src/js/modules/main/apps/settings/views/networks/networks.html/networks-[chunkhash].html
deleted file mode 100644
index e06dafa..0000000
--- a/public/src/js/modules/main/apps/settings/views/networks/networks.html/networks-[chunkhash].html
+++ /dev/null
@@ -1,303 +0,0 @@
-<div
-  id="networks"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-cog" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="SETTINGS.NETWORKS">Networks</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="SETTINGS.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedNetworks.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedNetworks =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="SETTINGS.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-networks-count">
-          <span>{{vm.selectedNetworks.length}}</span>
-          <span translate="SETTINGS.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="SETTINGS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllNetworks()"
-                translate="SETTINGS.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectNetworks()"
-                translate="SETTINGS.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedNetworks"
-          csv-label="true"
-          filename="networks.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-click="vm.deleteSelectedNetworks($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="SETTINGS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- NETWORK TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedNetworks"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getNetworks"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">
-                  {{ 'SETTINGS.ID' | translate }}
-                </th>
-                <th md-column md-order-by="type">
-                  {{ 'SETTINGS.TYPE' | translate }}
-                </th>
-                <th md-column md-order-by="value">
-                  {{ 'SETTINGS.ADDRESS' | translate }}
-                </th>
-                <th md-column md-order-by="createdAt">
-                  {{ 'SETTINGS.CREATED_AT' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.networks.rows.length">
-                <td md-cell colspan="5">
-                  <div layout="row" layout-align="center center">
-                    <span translate="SETTINGS.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="network"
-                md-select-id="id"
-                ng-repeat="network in vm.networks.rows"
-              >
-                <td md-cell ng-if="network.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{network.name}}"
-                    ng-src="api/users/{{network.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!network.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{network.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.createOrEditNetwork($event, network)"
-                  md-cell
-                  class="id"
-                >
-                  {{network.id}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditNetwork($event, network)"
-                  md-cell
-                  class="type"
-                >
-                  {{ vm.arraytype[network.type].option }}
-                </td>
-                <td
-                  ng-click="vm.createOrEditNetwork($event, network)"
-                  md-cell
-                  class="value"
-                >
-                  {{network.value}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditNetwork($event, network)"
-                  md-cell
-                  class="createdAt"
-                >
-                  {{network.createdAt | date:'medium' }}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="SETTINGS.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.editdialog(network, $event    )"
-                          translate="SETTINGS.EDIT_NETWORK"
-                        >
-                          Edit Network
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.deleteconfirm(network, $event    )"
-                          translate="SETTINGS.DELETE_NETWORK"
-                        >
-                          Delete Network
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'SETTINGS.PAGE' | translate}}:', rowsPerPage: '{{'SETTINGS.ROWSPERPAGE' | translate}}:', of: '{{'SETTINGS.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.networks.count}}"
-          md-on-paginate="vm.getNetworks"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / NETWORK TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD NETWORK BUTTON -->
-  <md-button
-    class="md-fab md-accent add-item-button"
-    id="add-network-button"
-    ng-click="vm.createOrEditNetwork($event)"
-    aria-label="add network"
-    translate
-    translate-attr-aria-label="SETTINGS.ADD_NETWORK"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD NETWORK BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/settings/views/networks/networks.html/networks.html b/public/src/js/modules/main/apps/settings/views/networks/networks.html/networks.html
new file mode 100644
index 0000000..e06dafa
--- /dev/null
+++ b/public/src/js/modules/main/apps/settings/views/networks/networks.html/networks.html
@@ -0,0 +1,303 @@
+<div
+  id="networks"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-cog" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="SETTINGS.NETWORKS">Networks</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="SETTINGS.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedNetworks.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedNetworks =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="SETTINGS.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-networks-count">
+          <span>{{vm.selectedNetworks.length}}</span>
+          <span translate="SETTINGS.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="SETTINGS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllNetworks()"
+                translate="SETTINGS.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectNetworks()"
+                translate="SETTINGS.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedNetworks"
+          csv-label="true"
+          filename="networks.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-click="vm.deleteSelectedNetworks($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="SETTINGS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- NETWORK TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedNetworks"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getNetworks"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">
+                  {{ 'SETTINGS.ID' | translate }}
+                </th>
+                <th md-column md-order-by="type">
+                  {{ 'SETTINGS.TYPE' | translate }}
+                </th>
+                <th md-column md-order-by="value">
+                  {{ 'SETTINGS.ADDRESS' | translate }}
+                </th>
+                <th md-column md-order-by="createdAt">
+                  {{ 'SETTINGS.CREATED_AT' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.networks.rows.length">
+                <td md-cell colspan="5">
+                  <div layout="row" layout-align="center center">
+                    <span translate="SETTINGS.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="network"
+                md-select-id="id"
+                ng-repeat="network in vm.networks.rows"
+              >
+                <td md-cell ng-if="network.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{network.name}}"
+                    ng-src="api/users/{{network.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!network.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{network.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.createOrEditNetwork($event, network)"
+                  md-cell
+                  class="id"
+                >
+                  {{network.id}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditNetwork($event, network)"
+                  md-cell
+                  class="type"
+                >
+                  {{ vm.arraytype[network.type].option }}
+                </td>
+                <td
+                  ng-click="vm.createOrEditNetwork($event, network)"
+                  md-cell
+                  class="value"
+                >
+                  {{network.value}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditNetwork($event, network)"
+                  md-cell
+                  class="createdAt"
+                >
+                  {{network.createdAt | date:'medium' }}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="SETTINGS.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.editdialog(network, $event    )"
+                          translate="SETTINGS.EDIT_NETWORK"
+                        >
+                          Edit Network
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.deleteconfirm(network, $event    )"
+                          translate="SETTINGS.DELETE_NETWORK"
+                        >
+                          Delete Network
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'SETTINGS.PAGE' | translate}}:', rowsPerPage: '{{'SETTINGS.ROWSPERPAGE' | translate}}:', of: '{{'SETTINGS.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.networks.count}}"
+          md-on-paginate="vm.getNetworks"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / NETWORK TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD NETWORK BUTTON -->
+  <md-button
+    class="md-fab md-accent add-item-button"
+    id="add-network-button"
+    ng-click="vm.createOrEditNetwork($event)"
+    aria-label="add network"
+    translate
+    translate-attr-aria-label="SETTINGS.ADD_NETWORK"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD NETWORK BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/settings/views/smtps/smtps.html/smtps-[chunkhash].html b/public/src/js/modules/main/apps/settings/views/smtps/smtps.html/smtps-[chunkhash].html
deleted file mode 100644
index a9017e4..0000000
--- a/public/src/js/modules/main/apps/settings/views/smtps/smtps.html/smtps-[chunkhash].html
+++ /dev/null
@@ -1,291 +0,0 @@
-<div
-  id="smtps"
-  class="page-layout simple left-sidenav inner-sidenav motion-form"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-cog" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="SETTINGS.SMTP">Smtp</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.verifySmtp()"
-        ng-disabled="!vm.smtp.id"
-        class="send-button md-accent md-raised"
-        translate="SETTINGS.VERIFY"
-        translate-attr-aria-label="SETTINGS.VERIFY"
-      >
-        VERIFY
-      </md-button>
-      <md-button
-        type="submit"
-        ng-click="vm.saveSmtp()"
-        ng-disabled="(generalForm.$pristine) || (generalForm.$invalid)"
-        class="send-button md-accent md-raised"
-        translate="SETTINGS.SAVE"
-        translate-attr-aria-label="SETTINGS.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <div
-        class="smtp-detail-form-container general motion-form__detail-form-container md-background-bg md-whiteframe-1dp"
-      >
-        <div class="pb-16" layout="row" layout-align="start center">
-          <div class="h2 secondary-text" translate="SETTINGS.GENERAL">
-            GENERAL
-          </div>
-        </div>
-        <form name="generalForm" novalidate>
-          <md-input-container class="md-block">
-            <label translate="SETTINGS.ACCOUNTNAME">AccountName</label>
-            <input
-              type="text"
-              name="name"
-              ng-model="vm.smtp.name"
-              ng-required="true"
-              autofocus
-            />
-
-            <div
-              ng-messages="generalForm['name'].$error"
-              ng-show="generalForm['name'].$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="SETTINGS.ERRORS.ACCOUNTNAME_REQUIRED"
-                  >AccountName field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container class="md-block">
-            <label translate="SETTINGS.EMAILADDRESS">EmailAddress</label>
-            <input
-              type="email"
-              name="email"
-              ng-model="vm.smtp.email"
-              ng-required="true"
-            />
-
-            <div class="hint">
-              <span translate="SETTINGS.HELP.EMAILADDRESS"></span>
-            </div>
-            <div
-              ng-messages="generalForm['email'].$error"
-              ng-show="generalForm['email'].$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="SETTINGS.ERRORS.EMAILADDRESS_REQUIRED"
-                  >EmailAddress field is required</span
-                >
-              </div>
-              <div ng-message="email">
-                <span translate="SETTINGS.ERRORS.EMAILADDRESS_MUST_VALID"
-                  >EmailAddress must be a valid e-mail address</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container class="md-block">
-            <label translate="SETTINGS.SMTP_SERVICE">SMTP_Service</label>
-            <md-select
-              name="Smtp.service"
-              ng-model="vm.smtp.Smtp.service"
-              required
-            >
-              <md-option ng-value="null">Custom</md-option>
-              <md-option ng-value="'gmail'">Gmail</md-option>
-              <md-option ng-value="'hotmail'">Hotmail</md-option>
-              <md-option ng-value="'yahoo'">Yahoo</md-option>
-              <md-option ng-value="'outlook365'">Outlook365</md-option>
-            </md-select>
-            <div
-              ng-messages="generalForm['Smtp.service'].$error"
-              ng-show="generalForm['Smtp.service'].$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="SETTINGS.ERRORS.SMTP_SERVICE_REQUIRED"
-                  >SMTP_Service field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container
-            ng-if="vm.smtp.Smtp.service == null"
-            class="md-block"
-          >
-            <label translate="SETTINGS.SMTP_HOST">SMTP_Host</label>
-            <input
-              type="text"
-              name="Smtp.host"
-              ng-model="vm.smtp.Smtp.host"
-              ng-required="true"
-            />
-
-            <div
-              ng-messages="generalForm['Smtp.host'].$error"
-              ng-show="generalForm['Smtp.host'].$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="SETTINGS.ERRORS.SMTP_HOST_REQUIRED"
-                  >SMTP_Host field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container
-            ng-if="vm.smtp.Smtp.service == null"
-            class="md-block"
-          >
-            <label translate="SETTINGS.SMTP_PORT">SMTP_Port</label>
-            <input
-              type="number"
-              name="Smtp.port"
-              ng-model="vm.smtp.Smtp.port"
-              ng-required="true"
-            />
-
-            <div
-              ng-messages="generalForm['Smtp.port'].$error"
-              ng-show="generalForm['Smtp.port'].$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="SETTINGS.ERRORS.SMTP_PORT_REQUIRED"
-                  >SMTP_Port field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container
-            ng-if="vm.smtp.Smtp.service == null"
-            class="md-block"
-          >
-            <md-switch ng-model="vm.smtp.Smtp.secure" aria-label="SMTP_Secure"
-              ><span translate="SETTINGS.SMTP_SECURE"
-                >SMTP_Secure</span
-              ></md-switch
-            >
-
-            <div class="hint">
-              <span translate="SETTINGS.HELP.SMTP_SECURE"></span>
-            </div>
-          </md-input-container>
-          <md-input-container
-            ng-if="vm.smtp.Smtp.service == null"
-            class="md-block"
-          >
-            <md-switch
-              ng-model="vm.smtp.Smtp.authentication"
-              aria-label="SMTP_Authentication"
-              ><span translate="SETTINGS.SMTP_AUTHENTICATION"
-                >SMTP_Authentication</span
-              ></md-switch
-            >
-          </md-input-container>
-          <md-input-container
-            ng-if="vm.smtp.Smtp.authentication == true || vm.smtp.Smtp.service != null"
-            class="md-block"
-          >
-            <label translate="SETTINGS.SMTP_USERNAME">SMTP_Username</label>
-            <input
-              type="text"
-              name="Smtp.user"
-              ng-model="vm.smtp.Smtp.user"
-              ng-required="true"
-            />
-
-            <div class="hint">
-              <span translate="SETTINGS.HELP.SMTP_USERNAME"></span>
-            </div>
-            <div
-              ng-messages="generalForm['Smtp.user'].$error"
-              ng-show="generalForm['Smtp.user'].$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="SETTINGS.ERRORS.SMTP_USERNAME_REQUIRED"
-                  >SMTP_Username field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-          <md-input-container
-            class="md-block"
-            ng-if="vm.smtp.Smtp.authentication == true || vm.smtp.Smtp.service != null"
-          >
-            <label translate="SETTINGS.SMTP_PASSWORD">SMTP_Password</label>
-            <input
-              type="password"
-              name="Smtp.pass"
-              ng-model="vm.smtp.Smtp.pass"
-              placeholder="Password"
-              translate
-              translate-attr-placeholder="SETTINGS.PASSWORD"
-              required
-            />
-            <div class="hint">
-              <span translate="SETTINGS.HELP.SMTP_PASSWORD"></span>
-            </div>
-            <div ng-messages="generalForm['Smtp.pass'].$error" role="alert">
-              <div ng-message="required">
-                <span translate="SETTINGS.ERRORS.PASSWORD_REQUIRED"
-                  >Password field is required</span
-                >
-              </div>
-              <div ng-message="pattern">
-                <span translate="SETTINGS.ERRORS.SECURE_PASSWORD_PATTERN"
-                  >Must contain at least 8 characters, with a minimum of 1
-                  lowercase letter, 1 uppercase letter, 1 numeric character and
-                  1 special character ~!?*@#$%^&-_=+[{]}.</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-
-          <md-input-container class="md-block">
-            <label translate="SETTINGS.DESCRIPTION">Description</label>
-            <input type="" name="description" ng-model="vm.smtp.description" />
-
-            <div
-              ng-messages="generalForm['description'].$error"
-              ng-show="generalForm['description'].$touched"
-              role="alert"
-            >
-              <div ng-message="required">
-                <span translate="SETTINGS.ERRORS.DESCRIPTION_REQUIRED"
-                  >Description field is required</span
-                >
-              </div>
-            </div>
-          </md-input-container>
-        </form>
-      </div>
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/settings/views/smtps/smtps.html/smtps.html b/public/src/js/modules/main/apps/settings/views/smtps/smtps.html/smtps.html
new file mode 100644
index 0000000..a9017e4
--- /dev/null
+++ b/public/src/js/modules/main/apps/settings/views/smtps/smtps.html/smtps.html
@@ -0,0 +1,291 @@
+<div
+  id="smtps"
+  class="page-layout simple left-sidenav inner-sidenav motion-form"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-cog" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="SETTINGS.SMTP">Smtp</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.verifySmtp()"
+        ng-disabled="!vm.smtp.id"
+        class="send-button md-accent md-raised"
+        translate="SETTINGS.VERIFY"
+        translate-attr-aria-label="SETTINGS.VERIFY"
+      >
+        VERIFY
+      </md-button>
+      <md-button
+        type="submit"
+        ng-click="vm.saveSmtp()"
+        ng-disabled="(generalForm.$pristine) || (generalForm.$invalid)"
+        class="send-button md-accent md-raised"
+        translate="SETTINGS.SAVE"
+        translate-attr-aria-label="SETTINGS.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <div
+        class="smtp-detail-form-container general motion-form__detail-form-container md-background-bg md-whiteframe-1dp"
+      >
+        <div class="pb-16" layout="row" layout-align="start center">
+          <div class="h2 secondary-text" translate="SETTINGS.GENERAL">
+            GENERAL
+          </div>
+        </div>
+        <form name="generalForm" novalidate>
+          <md-input-container class="md-block">
+            <label translate="SETTINGS.ACCOUNTNAME">AccountName</label>
+            <input
+              type="text"
+              name="name"
+              ng-model="vm.smtp.name"
+              ng-required="true"
+              autofocus
+            />
+
+            <div
+              ng-messages="generalForm['name'].$error"
+              ng-show="generalForm['name'].$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="SETTINGS.ERRORS.ACCOUNTNAME_REQUIRED"
+                  >AccountName field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container class="md-block">
+            <label translate="SETTINGS.EMAILADDRESS">EmailAddress</label>
+            <input
+              type="email"
+              name="email"
+              ng-model="vm.smtp.email"
+              ng-required="true"
+            />
+
+            <div class="hint">
+              <span translate="SETTINGS.HELP.EMAILADDRESS"></span>
+            </div>
+            <div
+              ng-messages="generalForm['email'].$error"
+              ng-show="generalForm['email'].$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="SETTINGS.ERRORS.EMAILADDRESS_REQUIRED"
+                  >EmailAddress field is required</span
+                >
+              </div>
+              <div ng-message="email">
+                <span translate="SETTINGS.ERRORS.EMAILADDRESS_MUST_VALID"
+                  >EmailAddress must be a valid e-mail address</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container class="md-block">
+            <label translate="SETTINGS.SMTP_SERVICE">SMTP_Service</label>
+            <md-select
+              name="Smtp.service"
+              ng-model="vm.smtp.Smtp.service"
+              required
+            >
+              <md-option ng-value="null">Custom</md-option>
+              <md-option ng-value="'gmail'">Gmail</md-option>
+              <md-option ng-value="'hotmail'">Hotmail</md-option>
+              <md-option ng-value="'yahoo'">Yahoo</md-option>
+              <md-option ng-value="'outlook365'">Outlook365</md-option>
+            </md-select>
+            <div
+              ng-messages="generalForm['Smtp.service'].$error"
+              ng-show="generalForm['Smtp.service'].$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="SETTINGS.ERRORS.SMTP_SERVICE_REQUIRED"
+                  >SMTP_Service field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container
+            ng-if="vm.smtp.Smtp.service == null"
+            class="md-block"
+          >
+            <label translate="SETTINGS.SMTP_HOST">SMTP_Host</label>
+            <input
+              type="text"
+              name="Smtp.host"
+              ng-model="vm.smtp.Smtp.host"
+              ng-required="true"
+            />
+
+            <div
+              ng-messages="generalForm['Smtp.host'].$error"
+              ng-show="generalForm['Smtp.host'].$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="SETTINGS.ERRORS.SMTP_HOST_REQUIRED"
+                  >SMTP_Host field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container
+            ng-if="vm.smtp.Smtp.service == null"
+            class="md-block"
+          >
+            <label translate="SETTINGS.SMTP_PORT">SMTP_Port</label>
+            <input
+              type="number"
+              name="Smtp.port"
+              ng-model="vm.smtp.Smtp.port"
+              ng-required="true"
+            />
+
+            <div
+              ng-messages="generalForm['Smtp.port'].$error"
+              ng-show="generalForm['Smtp.port'].$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="SETTINGS.ERRORS.SMTP_PORT_REQUIRED"
+                  >SMTP_Port field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container
+            ng-if="vm.smtp.Smtp.service == null"
+            class="md-block"
+          >
+            <md-switch ng-model="vm.smtp.Smtp.secure" aria-label="SMTP_Secure"
+              ><span translate="SETTINGS.SMTP_SECURE"
+                >SMTP_Secure</span
+              ></md-switch
+            >
+
+            <div class="hint">
+              <span translate="SETTINGS.HELP.SMTP_SECURE"></span>
+            </div>
+          </md-input-container>
+          <md-input-container
+            ng-if="vm.smtp.Smtp.service == null"
+            class="md-block"
+          >
+            <md-switch
+              ng-model="vm.smtp.Smtp.authentication"
+              aria-label="SMTP_Authentication"
+              ><span translate="SETTINGS.SMTP_AUTHENTICATION"
+                >SMTP_Authentication</span
+              ></md-switch
+            >
+          </md-input-container>
+          <md-input-container
+            ng-if="vm.smtp.Smtp.authentication == true || vm.smtp.Smtp.service != null"
+            class="md-block"
+          >
+            <label translate="SETTINGS.SMTP_USERNAME">SMTP_Username</label>
+            <input
+              type="text"
+              name="Smtp.user"
+              ng-model="vm.smtp.Smtp.user"
+              ng-required="true"
+            />
+
+            <div class="hint">
+              <span translate="SETTINGS.HELP.SMTP_USERNAME"></span>
+            </div>
+            <div
+              ng-messages="generalForm['Smtp.user'].$error"
+              ng-show="generalForm['Smtp.user'].$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="SETTINGS.ERRORS.SMTP_USERNAME_REQUIRED"
+                  >SMTP_Username field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+          <md-input-container
+            class="md-block"
+            ng-if="vm.smtp.Smtp.authentication == true || vm.smtp.Smtp.service != null"
+          >
+            <label translate="SETTINGS.SMTP_PASSWORD">SMTP_Password</label>
+            <input
+              type="password"
+              name="Smtp.pass"
+              ng-model="vm.smtp.Smtp.pass"
+              placeholder="Password"
+              translate
+              translate-attr-placeholder="SETTINGS.PASSWORD"
+              required
+            />
+            <div class="hint">
+              <span translate="SETTINGS.HELP.SMTP_PASSWORD"></span>
+            </div>
+            <div ng-messages="generalForm['Smtp.pass'].$error" role="alert">
+              <div ng-message="required">
+                <span translate="SETTINGS.ERRORS.PASSWORD_REQUIRED"
+                  >Password field is required</span
+                >
+              </div>
+              <div ng-message="pattern">
+                <span translate="SETTINGS.ERRORS.SECURE_PASSWORD_PATTERN"
+                  >Must contain at least 8 characters, with a minimum of 1
+                  lowercase letter, 1 uppercase letter, 1 numeric character and
+                  1 special character ~!?*@#$%^&-_=+[{]}.</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+
+          <md-input-container class="md-block">
+            <label translate="SETTINGS.DESCRIPTION">Description</label>
+            <input type="" name="description" ng-model="vm.smtp.description" />
+
+            <div
+              ng-messages="generalForm['description'].$error"
+              ng-show="generalForm['description'].$touched"
+              role="alert"
+            >
+              <div ng-message="required">
+                <span translate="SETTINGS.ERRORS.DESCRIPTION_REQUIRED"
+                  >Description field is required</span
+                >
+              </div>
+            </div>
+          </md-input-container>
+        </form>
+      </div>
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/settings/views/system/system.html/system-[chunkhash].html b/public/src/js/modules/main/apps/settings/views/system/system.html/system-[chunkhash].html
deleted file mode 100644
index 2c1b40c..0000000
--- a/public/src/js/modules/main/apps/settings/views/system/system.html/system-[chunkhash].html
+++ /dev/null
@@ -1,491 +0,0 @@
-<div id="system" class="page-layout simple tabbed" layout="column">
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-cog" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="SETTINGS.SYSTEM">SYSTEM</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      md-border-bottom
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="SETTINGS.GENERAL">GENERAL</span>
-        </md-tab-label>
-
-        <md-tab-body>
-          <div
-            class="system-detail-form-container personal_info md-background-bg md-whiteframe-1dp"
-          >
-            <md-card
-              class="md-whiteframe-1dp padding-20"
-              layout="row"
-              layout-xs="column"
-              layout-wrap
-            >
-              <ms-widget flex="50" flex-xs="100">
-                <!-- Front -->
-                <ms-widget-front class="white-bg">
-                  <div class="ph-16 pt-16 pb-8 md-accent-bg">
-                    <div class="h3">OS</div>
-                  </div>
-
-                  <div layout="row" layout-align="start center" layout-wrap>
-                    <div flex="100" flex-gt-md="100">
-                      <div class="p-16 pb-32">
-                        <div class="h4">
-                          {{vm.system.system.manufacturer}}
-                          {{vm.system.system.model}}
-                        </div>
-                        <div class="h4">
-                          {{vm.system.cpu.manufacturer}} {{vm.system.cpu.brand}}
-                          - {{vm.system.cpu.speed}} GHz -
-                          {{vm.system.cpu.cores}} Cores
-                        </div>
-                        <div class="h4">
-                          {{vm.system.os.distro}} - {{vm.system.os.release}} -
-                          Kernel: {{vm.system.os.kernel}}
-                        </div>
-                        <div class="h4">Node.js: {{vm.system.node}}</div>
-                        <div class="h4">
-                          Host: {{vm.system.os.hostname}} - Uptime:
-                          {{vm.system.time.uptime / 60 | number:0}} m
-                        </div>
-                        <div class="h4">
-                          TimeZone: {{vm.system.time.timezone}}
-                          ({{vm.system.time.timezoneName}})
-                        </div>
-                      </div>
-                    </div>
-                  </div>
-                </ms-widget-front>
-                <!-- / Front -->
-              </ms-widget>
-              <ms-widget flex="25" flex-xs="100">
-                <!-- Front -->
-                <ms-widget-front class="white-bg">
-                  <div class="ph-16 pt-16 pb-8 md-accent-bg md-hue-1">
-                    <div class="h3">CPU</div>
-                  </div>
-
-                  <div layout="row" layout-align="start center" layout-wrap>
-                    <div flex="100" flex-gt-md="100">
-                      <div class="p-16 pb-32">
-                        <div
-                          class="pb-8"
-                          layout="row"
-                          layout-align="space-between start"
-                        >
-                          <span class="h3" translate="SETTINGS.AVG_LOAD"
-                            >AVG Load</span
-                          >
-                          <span class="h3 secondary-text font-weight-500"
-                            >{{vm.system.currentLoad.avgload * 100 |
-                            number:0}}%</span
-                          >
-                        </div>
-                        <md-progress-linear
-                          class="red"
-                          md-mode="determinate"
-                          value="{{vm.system.currentLoad.avgload * 100 | number:0}}"
-                        ></md-progress-linear>
-                      </div>
-                    </div>
-                  </div>
-                </ms-widget-front>
-                <!-- / Front -->
-              </ms-widget>
-              <ms-widget flex="25" flex-xs="100">
-                <!-- Front -->
-                <ms-widget-front class="white-bg">
-                  <div class="ph-16 pt-16 pb-8 md-accent-bg md-hue-3">
-                    <div class="h3">MEM</div>
-                  </div>
-
-                  <div layout="row" layout-align="start center" layout-wrap>
-                    <div flex="100" flex-gt-md="100">
-                      <div class="p-16 pb-32">
-                        <div class="h4">
-                          {{'SETTINGS.TOTAL' | translate}}:
-                          {{vm.system.mem.total / 1024 / 1024 / 1024 |
-                          number:0}} GB
-                        </div>
-                        <div class="h4">
-                          {{'SETTINGS.FREE' | translate}}:
-                          {{vm.system.mem.available / 1024 / 1024 / 1024 |
-                          number:0}} GB
-                        </div>
-                        <div class="h4">
-                          {{'SETTINGS.USED' | translate}}:
-                          {{vm.system.mem.active / 1024 / 1024 / 1024 |
-                          number:0}} GB
-                        </div>
-                      </div>
-                      <div class="p-16 pb-32">
-                        <div
-                          class="pb-8"
-                          layout="row"
-                          layout-align="space-between start"
-                        >
-                          <span class="h3" translate="SETTINGS.USED">Used</span>
-                          <span class="h3 secondary-text font-weight-500"
-                            >{{(vm.system.mem.active / vm.system.mem.total) *
-                            100 | number : 0}}%</span
-                          >
-                        </div>
-                        <md-progress-linear
-                          class="md-warn"
-                          md-mode="determinate"
-                          value="{{(vm.system.mem.active / vm.system.mem.total) * 100 | number : 0 }}"
-                        ></md-progress-linear>
-                      </div>
-                    </div>
-                  </div>
-                </ms-widget-front>
-                <!-- / Front -->
-              </ms-widget>
-            </md-card>
-
-            <md-card
-              class="md-whiteframe-1dp padding-20"
-              layout="row"
-              layout-xs="column"
-              layout-wrap
-            >
-              <ms-widget
-                ng-repeat="disk in vm.system.fsSize"
-                flex="25"
-                flex-xs="100"
-              >
-                <!-- Front -->
-                <ms-widget-front class="white-bg">
-                  <div class="ph-16 pt-16 pb-8 md-accent-bg md-hue-3">
-                    <div class="h3">DISK {{$index + 1}}</div>
-                  </div>
-
-                  <div layout="row" layout-align="start center" layout-wrap>
-                    <div flex="100" flex-gt-md="100">
-                      <div class="p-16 pb-32">
-                        <div class="h4">
-                          {{'SETTINGS.FILE_SYSTEM' | translate}}: {{disk.fs}}
-                        </div>
-                        <div class="h4">
-                          {{'SETTINGS.MOUNT_POINT' | translate}}:
-                          "{{disk.mount}}"
-                        </div>
-                        <div class="h4">
-                          {{'SETTINGS.TOTAL' | translate}}: {{disk.size / 1024 /
-                          1024 / 1024 | number:0}} GB
-                        </div>
-                        <div class="h4">
-                          {{'SETTINGS.USED' | translate}}: {{disk.used / 1024 /
-                          1024 / 1024 | number:0}} GB
-                        </div>
-                      </div>
-                      <div class="p-16 pb-32">
-                        <div
-                          class="pb-8"
-                          layout="row"
-                          layout-align="space-between start"
-                        >
-                          <span class="h3" translate="SETTINGS.USED">Used</span>
-                          <span class="h4 secondary-text font-weight-500"
-                            >{{disk.use | number:0}}%</span
-                          >
-                        </div>
-                        <md-progress-linear
-                          class="red"
-                          md-mode="determinate"
-                          value="{{disk.use | number:0}}"
-                        ></md-progress-linear>
-                      </div>
-                    </div>
-                  </div>
-                </ms-widget-front>
-                <!-- / Front -->
-              </ms-widget>
-            </md-card>
-
-            <md-card
-              class="md-whiteframe-1dp padding-20"
-              layout="row"
-              layout-xs="column"
-              layout-wrap
-            >
-              <ms-widget
-                ng-repeat="net in vm.system.net"
-                flex="25"
-                flex-xs="100"
-              >
-                <!-- Front -->
-                <ms-widget-front class="white-bg">
-                  <div class="ph-16 pt-16 pb-8 md-accent-bg md-hue-3">
-                    <div class="h3">NET {{$index + 1}}</div>
-                  </div>
-
-                  <div layout="row" layout-align="start center" layout-wrap>
-                    <div flex="100" flex-gt-md="100">
-                      <div class="p-16 pb-32">
-                        <div class="h4">
-                          {{'SETTINGS.INTERFACE' | translate}}: {{net.iface}}
-                        </div>
-                        <div class="h4">IPv4: {{net.ip4}}</div>
-                        <div class="h4">IPv6: {{net.ip6}}</div>
-                        <div class="h4">MAC: {{net.mac}}</div>
-                      </div>
-                    </div>
-                  </div>
-                </ms-widget-front>
-                <!-- / Front -->
-              </ms-widget>
-            </md-card>
-
-            <md-card class="md-whiteframe-1dp padding-20" layout="row">
-              <div flex>
-                <md-toolbar class="md-table-toolbar md-default">
-                  <div class="md-toolbar-tools">
-                    <span
-                      class="md-subhead"
-                      translate="SETTINGS.TOP_N_PROCESSES"
-                      translate-values="{value: vm.processLimit}"
-                    ></span>
-                    <div flex></div>
-                    <ms-search-bar
-                      on-search="vm.searchTerm1 = query"
-                      on-collapse="vm.searchTerm1 = undefined"
-                      debounce="300"
-                    ></ms-search-bar>
-                  </div>
-                </md-toolbar>
-                <md-table-container>
-                  <table md-table>
-                    <thead md-head>
-                      <tr md-row>
-                        <th md-column>pid</th>
-                        <th md-column>{{'SETTINGS.NAME' | translate}}</th>
-                        <th md-column>{{'SETTINGS.STATE' | translate}}</th>
-                        <th md-column>pmem</th>
-                        <th md-column>pcpu</th>
-                      </tr>
-                    </thead>
-                    <tbody md-body>
-                      <tr
-                        md-row
-                        ng-repeat="process in vm.system.processes.list | limitTo: vm.processLimit | filter: vm.searchTerm1 | orderBy:'-pcpu'"
-                      >
-                        <td md-cell>{{process.pid}}</td>
-                        <td md-cell>{{process.command}}</td>
-                        <td md-cell>
-                          <span
-                            class="text-boxed white-fg"
-                            ng-class="{
-                          'green-600-bg': process.state == 'running',
-                          'yellow-600-bg': process.state == 'sleeping',
-                          'red-600-bg': process.state == 'blocked'}"
-                            >{{process.state | uppercase}}</span
-                          >
-                        </td>
-                        <td md-cell>{{process.pmem}}%</td>
-                        <td md-cell>{{process.pcpu}}%</td>
-                      </tr>
-                    </tbody>
-                  </table>
-                </md-table-container>
-              </div>
-            </md-card>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="SETTINGS.PROCESSES">PROCESSES</span>
-        </md-tab-label>
-
-        <md-tab-body>
-          <div
-            class="system-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <md-card class="md-whiteframe-1dp padding-20" flex>
-              <md-toolbar class="md-table-toolbar md-default">
-                <div class="md-toolbar-tools">
-                  <span
-                    class="md-subhead"
-                    translate="SETTINGS.MOTION_PROCESS_MANAGEMENT"
-                  ></span>
-                  <div flex></div>
-                  <ms-search-bar
-                    on-search="vm.searchTerm2 = query"
-                    on-collapse="vm.searchTerm2 = undefined"
-                    debounce="300"
-                  ></ms-search-bar>
-                  <md-button
-                    ng-click="vm.getProcesses()"
-                    class="md-icon-button"
-                    aria-label="Reload"
-                  >
-                    <md-icon md-font-icon="icon-reload" class="s24"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-table-container>
-                <table md-table>
-                  <thead md-head>
-                    <tr md-row>
-                      <th md-column>id</th>
-                      <th md-column>pid</th>
-                      <th md-column>{{'SETTINGS.NAME' | translate}}</th>
-                      <th md-column>{{'SETTINGS.STATE' | translate}}</th>
-                      <th md-column>MEM</th>
-                      <th md-column>CPU</th>
-                      <th md-column width="20px">Actions</th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr
-                      md-row
-                      ng-repeat="process in vm.processes | filter: vm.searchTerm2 | orderBy:'-monit.cpu'"
-                    >
-                      <td md-cell>{{process.pm_id}}</td>
-                      <td md-cell>{{process.pid}}</td>
-                      <td md-cell>
-                        {{process.name == 'agi' ? 'agi (Cally Square IVR)' :
-                        process.name}}
-                      </td>
-                      <td md-cell>
-                        <span
-                          class="text-boxed white-fg"
-                          ng-class="{'green-600-bg': process.pm2_env.status == 'online', 'red-600-bg': process.pm2_env.status == 'stopped'}"
-                          >{{process.pm2_env.status | uppercase}}</span
-                        >
-                      </td>
-                      <td md-cell>
-                        {{process.monit.memory / 1024 / 1024 | number:0}} MB
-                      </td>
-                      <td md-cell>{{process.monit.cpu}}%</td>
-                      <td md-cell>
-                        <md-button
-                          ng-if="process.pm2_env.status !== 'online'"
-                          ng-click="vm.updateProcess($event, process.pm_id, 'online')"
-                          class="md-icon-button"
-                          aria-label="Play"
-                        >
-                          <md-icon
-                            md-font-icon="icon-play"
-                            class="s24"
-                          ></md-icon>
-                        </md-button>
-                        <md-button
-                          ng-if="process.pm2_env.status === 'online'"
-                          ng-click="vm.updateProcess($event, process.pm_id, 'stopped')"
-                          class="md-icon-button"
-                          aria-label="Stop"
-                        >
-                          <md-icon
-                            md-font-icon="icon-stop"
-                            class="s24"
-                          ></md-icon>
-                        </md-button>
-                      </td>
-                    </tr>
-                  </tbody>
-                  <tfoot md-foot>
-                    <tr md-row>
-                      <td md-cell></td>
-                      <td md-cell></td>
-                      <td md-cell></td>
-                      <td md-cell></td>
-                      <td md-cell>
-                        {{ (vm.processes | map: 'monit.memory' | sum) / 1024 /
-                        1024 | number:0 }} MB
-                      </td>
-                      <td md-cell></td>
-                      <td md-cell></td>
-                    </tr>
-                  </tfoot>
-                </table>
-              </md-table-container>
-            </md-card>
-            <md-card class="md-whiteframe-1dp padding-20" flex>
-              <md-toolbar class="md-table-toolbar md-default">
-                <div class="md-toolbar-tools">
-                  <span
-                    class="md-subhead"
-                    translate="SETTINGS.USEFUL_COMMANDS"
-                  ></span>
-                  <div flex></div>
-                </div>
-              </md-toolbar>
-              <md-table-container>
-                <table md-table>
-                  <thead md-head>
-                    <tr md-row>
-                      <th md-column width="30%">
-                        {{'SETTINGS.COMMAND' | translate}}
-                      </th>
-                      <th md-column>{{'SETTINGS.DESCRIPTION' | translate}}</th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr>
-                      <td md-cell class="no-border">pm2 list</td>
-                      <td md-cell class="no-border">
-                        {{ 'SETTINGS.PM2_LIST' | translate}}
-                      </td>
-                    </tr>
-                    <tr>
-                      <td md-cell class="no-border">
-                        pm2 start &lt;id | name&gt;
-                      </td>
-                      <td md-cell class="no-border">
-                        {{ 'SETTINGS.PM2_START' | translate}}
-                      </td>
-                    </tr>
-                    <tr>
-                      <td md-cell class="no-border">
-                        pm2 stop &lt;id | name | all&gt;
-                      </td>
-                      <td md-cell class="no-border">
-                        {{ 'SETTINGS.PM2_STOP' | translate}}
-                      </td>
-                    </tr>
-                    <tr>
-                      <td md-cell class="no-border">
-                        pm2 restart &lt;id | name&gt;
-                      </td>
-                      <td md-cell class="no-border">
-                        {{ 'SETTINGS.PM2_RESTART' | translate}}
-                      </td>
-                    </tr>
-                    <tr>
-                      <td md-cell class="no-border">pm2 logs [id | name]</td>
-                      <td md-cell class="no-border">
-                        {{ 'SETTINGS.PM2_LOGS' | translate}}
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-            </md-card>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/settings/views/system/system.html/system.html b/public/src/js/modules/main/apps/settings/views/system/system.html/system.html
new file mode 100644
index 0000000..2c1b40c
--- /dev/null
+++ b/public/src/js/modules/main/apps/settings/views/system/system.html/system.html
@@ -0,0 +1,491 @@
+<div id="system" class="page-layout simple tabbed" layout="column">
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-cog" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="SETTINGS.SYSTEM">SYSTEM</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      md-border-bottom
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="SETTINGS.GENERAL">GENERAL</span>
+        </md-tab-label>
+
+        <md-tab-body>
+          <div
+            class="system-detail-form-container personal_info md-background-bg md-whiteframe-1dp"
+          >
+            <md-card
+              class="md-whiteframe-1dp padding-20"
+              layout="row"
+              layout-xs="column"
+              layout-wrap
+            >
+              <ms-widget flex="50" flex-xs="100">
+                <!-- Front -->
+                <ms-widget-front class="white-bg">
+                  <div class="ph-16 pt-16 pb-8 md-accent-bg">
+                    <div class="h3">OS</div>
+                  </div>
+
+                  <div layout="row" layout-align="start center" layout-wrap>
+                    <div flex="100" flex-gt-md="100">
+                      <div class="p-16 pb-32">
+                        <div class="h4">
+                          {{vm.system.system.manufacturer}}
+                          {{vm.system.system.model}}
+                        </div>
+                        <div class="h4">
+                          {{vm.system.cpu.manufacturer}} {{vm.system.cpu.brand}}
+                          - {{vm.system.cpu.speed}} GHz -
+                          {{vm.system.cpu.cores}} Cores
+                        </div>
+                        <div class="h4">
+                          {{vm.system.os.distro}} - {{vm.system.os.release}} -
+                          Kernel: {{vm.system.os.kernel}}
+                        </div>
+                        <div class="h4">Node.js: {{vm.system.node}}</div>
+                        <div class="h4">
+                          Host: {{vm.system.os.hostname}} - Uptime:
+                          {{vm.system.time.uptime / 60 | number:0}} m
+                        </div>
+                        <div class="h4">
+                          TimeZone: {{vm.system.time.timezone}}
+                          ({{vm.system.time.timezoneName}})
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </ms-widget-front>
+                <!-- / Front -->
+              </ms-widget>
+              <ms-widget flex="25" flex-xs="100">
+                <!-- Front -->
+                <ms-widget-front class="white-bg">
+                  <div class="ph-16 pt-16 pb-8 md-accent-bg md-hue-1">
+                    <div class="h3">CPU</div>
+                  </div>
+
+                  <div layout="row" layout-align="start center" layout-wrap>
+                    <div flex="100" flex-gt-md="100">
+                      <div class="p-16 pb-32">
+                        <div
+                          class="pb-8"
+                          layout="row"
+                          layout-align="space-between start"
+                        >
+                          <span class="h3" translate="SETTINGS.AVG_LOAD"
+                            >AVG Load</span
+                          >
+                          <span class="h3 secondary-text font-weight-500"
+                            >{{vm.system.currentLoad.avgload * 100 |
+                            number:0}}%</span
+                          >
+                        </div>
+                        <md-progress-linear
+                          class="red"
+                          md-mode="determinate"
+                          value="{{vm.system.currentLoad.avgload * 100 | number:0}}"
+                        ></md-progress-linear>
+                      </div>
+                    </div>
+                  </div>
+                </ms-widget-front>
+                <!-- / Front -->
+              </ms-widget>
+              <ms-widget flex="25" flex-xs="100">
+                <!-- Front -->
+                <ms-widget-front class="white-bg">
+                  <div class="ph-16 pt-16 pb-8 md-accent-bg md-hue-3">
+                    <div class="h3">MEM</div>
+                  </div>
+
+                  <div layout="row" layout-align="start center" layout-wrap>
+                    <div flex="100" flex-gt-md="100">
+                      <div class="p-16 pb-32">
+                        <div class="h4">
+                          {{'SETTINGS.TOTAL' | translate}}:
+                          {{vm.system.mem.total / 1024 / 1024 / 1024 |
+                          number:0}} GB
+                        </div>
+                        <div class="h4">
+                          {{'SETTINGS.FREE' | translate}}:
+                          {{vm.system.mem.available / 1024 / 1024 / 1024 |
+                          number:0}} GB
+                        </div>
+                        <div class="h4">
+                          {{'SETTINGS.USED' | translate}}:
+                          {{vm.system.mem.active / 1024 / 1024 / 1024 |
+                          number:0}} GB
+                        </div>
+                      </div>
+                      <div class="p-16 pb-32">
+                        <div
+                          class="pb-8"
+                          layout="row"
+                          layout-align="space-between start"
+                        >
+                          <span class="h3" translate="SETTINGS.USED">Used</span>
+                          <span class="h3 secondary-text font-weight-500"
+                            >{{(vm.system.mem.active / vm.system.mem.total) *
+                            100 | number : 0}}%</span
+                          >
+                        </div>
+                        <md-progress-linear
+                          class="md-warn"
+                          md-mode="determinate"
+                          value="{{(vm.system.mem.active / vm.system.mem.total) * 100 | number : 0 }}"
+                        ></md-progress-linear>
+                      </div>
+                    </div>
+                  </div>
+                </ms-widget-front>
+                <!-- / Front -->
+              </ms-widget>
+            </md-card>
+
+            <md-card
+              class="md-whiteframe-1dp padding-20"
+              layout="row"
+              layout-xs="column"
+              layout-wrap
+            >
+              <ms-widget
+                ng-repeat="disk in vm.system.fsSize"
+                flex="25"
+                flex-xs="100"
+              >
+                <!-- Front -->
+                <ms-widget-front class="white-bg">
+                  <div class="ph-16 pt-16 pb-8 md-accent-bg md-hue-3">
+                    <div class="h3">DISK {{$index + 1}}</div>
+                  </div>
+
+                  <div layout="row" layout-align="start center" layout-wrap>
+                    <div flex="100" flex-gt-md="100">
+                      <div class="p-16 pb-32">
+                        <div class="h4">
+                          {{'SETTINGS.FILE_SYSTEM' | translate}}: {{disk.fs}}
+                        </div>
+                        <div class="h4">
+                          {{'SETTINGS.MOUNT_POINT' | translate}}:
+                          "{{disk.mount}}"
+                        </div>
+                        <div class="h4">
+                          {{'SETTINGS.TOTAL' | translate}}: {{disk.size / 1024 /
+                          1024 / 1024 | number:0}} GB
+                        </div>
+                        <div class="h4">
+                          {{'SETTINGS.USED' | translate}}: {{disk.used / 1024 /
+                          1024 / 1024 | number:0}} GB
+                        </div>
+                      </div>
+                      <div class="p-16 pb-32">
+                        <div
+                          class="pb-8"
+                          layout="row"
+                          layout-align="space-between start"
+                        >
+                          <span class="h3" translate="SETTINGS.USED">Used</span>
+                          <span class="h4 secondary-text font-weight-500"
+                            >{{disk.use | number:0}}%</span
+                          >
+                        </div>
+                        <md-progress-linear
+                          class="red"
+                          md-mode="determinate"
+                          value="{{disk.use | number:0}}"
+                        ></md-progress-linear>
+                      </div>
+                    </div>
+                  </div>
+                </ms-widget-front>
+                <!-- / Front -->
+              </ms-widget>
+            </md-card>
+
+            <md-card
+              class="md-whiteframe-1dp padding-20"
+              layout="row"
+              layout-xs="column"
+              layout-wrap
+            >
+              <ms-widget
+                ng-repeat="net in vm.system.net"
+                flex="25"
+                flex-xs="100"
+              >
+                <!-- Front -->
+                <ms-widget-front class="white-bg">
+                  <div class="ph-16 pt-16 pb-8 md-accent-bg md-hue-3">
+                    <div class="h3">NET {{$index + 1}}</div>
+                  </div>
+
+                  <div layout="row" layout-align="start center" layout-wrap>
+                    <div flex="100" flex-gt-md="100">
+                      <div class="p-16 pb-32">
+                        <div class="h4">
+                          {{'SETTINGS.INTERFACE' | translate}}: {{net.iface}}
+                        </div>
+                        <div class="h4">IPv4: {{net.ip4}}</div>
+                        <div class="h4">IPv6: {{net.ip6}}</div>
+                        <div class="h4">MAC: {{net.mac}}</div>
+                      </div>
+                    </div>
+                  </div>
+                </ms-widget-front>
+                <!-- / Front -->
+              </ms-widget>
+            </md-card>
+
+            <md-card class="md-whiteframe-1dp padding-20" layout="row">
+              <div flex>
+                <md-toolbar class="md-table-toolbar md-default">
+                  <div class="md-toolbar-tools">
+                    <span
+                      class="md-subhead"
+                      translate="SETTINGS.TOP_N_PROCESSES"
+                      translate-values="{value: vm.processLimit}"
+                    ></span>
+                    <div flex></div>
+                    <ms-search-bar
+                      on-search="vm.searchTerm1 = query"
+                      on-collapse="vm.searchTerm1 = undefined"
+                      debounce="300"
+                    ></ms-search-bar>
+                  </div>
+                </md-toolbar>
+                <md-table-container>
+                  <table md-table>
+                    <thead md-head>
+                      <tr md-row>
+                        <th md-column>pid</th>
+                        <th md-column>{{'SETTINGS.NAME' | translate}}</th>
+                        <th md-column>{{'SETTINGS.STATE' | translate}}</th>
+                        <th md-column>pmem</th>
+                        <th md-column>pcpu</th>
+                      </tr>
+                    </thead>
+                    <tbody md-body>
+                      <tr
+                        md-row
+                        ng-repeat="process in vm.system.processes.list | limitTo: vm.processLimit | filter: vm.searchTerm1 | orderBy:'-pcpu'"
+                      >
+                        <td md-cell>{{process.pid}}</td>
+                        <td md-cell>{{process.command}}</td>
+                        <td md-cell>
+                          <span
+                            class="text-boxed white-fg"
+                            ng-class="{
+                          'green-600-bg': process.state == 'running',
+                          'yellow-600-bg': process.state == 'sleeping',
+                          'red-600-bg': process.state == 'blocked'}"
+                            >{{process.state | uppercase}}</span
+                          >
+                        </td>
+                        <td md-cell>{{process.pmem}}%</td>
+                        <td md-cell>{{process.pcpu}}%</td>
+                      </tr>
+                    </tbody>
+                  </table>
+                </md-table-container>
+              </div>
+            </md-card>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="SETTINGS.PROCESSES">PROCESSES</span>
+        </md-tab-label>
+
+        <md-tab-body>
+          <div
+            class="system-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <md-card class="md-whiteframe-1dp padding-20" flex>
+              <md-toolbar class="md-table-toolbar md-default">
+                <div class="md-toolbar-tools">
+                  <span
+                    class="md-subhead"
+                    translate="SETTINGS.MOTION_PROCESS_MANAGEMENT"
+                  ></span>
+                  <div flex></div>
+                  <ms-search-bar
+                    on-search="vm.searchTerm2 = query"
+                    on-collapse="vm.searchTerm2 = undefined"
+                    debounce="300"
+                  ></ms-search-bar>
+                  <md-button
+                    ng-click="vm.getProcesses()"
+                    class="md-icon-button"
+                    aria-label="Reload"
+                  >
+                    <md-icon md-font-icon="icon-reload" class="s24"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-table-container>
+                <table md-table>
+                  <thead md-head>
+                    <tr md-row>
+                      <th md-column>id</th>
+                      <th md-column>pid</th>
+                      <th md-column>{{'SETTINGS.NAME' | translate}}</th>
+                      <th md-column>{{'SETTINGS.STATE' | translate}}</th>
+                      <th md-column>MEM</th>
+                      <th md-column>CPU</th>
+                      <th md-column width="20px">Actions</th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr
+                      md-row
+                      ng-repeat="process in vm.processes | filter: vm.searchTerm2 | orderBy:'-monit.cpu'"
+                    >
+                      <td md-cell>{{process.pm_id}}</td>
+                      <td md-cell>{{process.pid}}</td>
+                      <td md-cell>
+                        {{process.name == 'agi' ? 'agi (Cally Square IVR)' :
+                        process.name}}
+                      </td>
+                      <td md-cell>
+                        <span
+                          class="text-boxed white-fg"
+                          ng-class="{'green-600-bg': process.pm2_env.status == 'online', 'red-600-bg': process.pm2_env.status == 'stopped'}"
+                          >{{process.pm2_env.status | uppercase}}</span
+                        >
+                      </td>
+                      <td md-cell>
+                        {{process.monit.memory / 1024 / 1024 | number:0}} MB
+                      </td>
+                      <td md-cell>{{process.monit.cpu}}%</td>
+                      <td md-cell>
+                        <md-button
+                          ng-if="process.pm2_env.status !== 'online'"
+                          ng-click="vm.updateProcess($event, process.pm_id, 'online')"
+                          class="md-icon-button"
+                          aria-label="Play"
+                        >
+                          <md-icon
+                            md-font-icon="icon-play"
+                            class="s24"
+                          ></md-icon>
+                        </md-button>
+                        <md-button
+                          ng-if="process.pm2_env.status === 'online'"
+                          ng-click="vm.updateProcess($event, process.pm_id, 'stopped')"
+                          class="md-icon-button"
+                          aria-label="Stop"
+                        >
+                          <md-icon
+                            md-font-icon="icon-stop"
+                            class="s24"
+                          ></md-icon>
+                        </md-button>
+                      </td>
+                    </tr>
+                  </tbody>
+                  <tfoot md-foot>
+                    <tr md-row>
+                      <td md-cell></td>
+                      <td md-cell></td>
+                      <td md-cell></td>
+                      <td md-cell></td>
+                      <td md-cell>
+                        {{ (vm.processes | map: 'monit.memory' | sum) / 1024 /
+                        1024 | number:0 }} MB
+                      </td>
+                      <td md-cell></td>
+                      <td md-cell></td>
+                    </tr>
+                  </tfoot>
+                </table>
+              </md-table-container>
+            </md-card>
+            <md-card class="md-whiteframe-1dp padding-20" flex>
+              <md-toolbar class="md-table-toolbar md-default">
+                <div class="md-toolbar-tools">
+                  <span
+                    class="md-subhead"
+                    translate="SETTINGS.USEFUL_COMMANDS"
+                  ></span>
+                  <div flex></div>
+                </div>
+              </md-toolbar>
+              <md-table-container>
+                <table md-table>
+                  <thead md-head>
+                    <tr md-row>
+                      <th md-column width="30%">
+                        {{'SETTINGS.COMMAND' | translate}}
+                      </th>
+                      <th md-column>{{'SETTINGS.DESCRIPTION' | translate}}</th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr>
+                      <td md-cell class="no-border">pm2 list</td>
+                      <td md-cell class="no-border">
+                        {{ 'SETTINGS.PM2_LIST' | translate}}
+                      </td>
+                    </tr>
+                    <tr>
+                      <td md-cell class="no-border">
+                        pm2 start &lt;id | name&gt;
+                      </td>
+                      <td md-cell class="no-border">
+                        {{ 'SETTINGS.PM2_START' | translate}}
+                      </td>
+                    </tr>
+                    <tr>
+                      <td md-cell class="no-border">
+                        pm2 stop &lt;id | name | all&gt;
+                      </td>
+                      <td md-cell class="no-border">
+                        {{ 'SETTINGS.PM2_STOP' | translate}}
+                      </td>
+                    </tr>
+                    <tr>
+                      <td md-cell class="no-border">
+                        pm2 restart &lt;id | name&gt;
+                      </td>
+                      <td md-cell class="no-border">
+                        {{ 'SETTINGS.PM2_RESTART' | translate}}
+                      </td>
+                    </tr>
+                    <tr>
+                      <td md-cell class="no-border">pm2 logs [id | name]</td>
+                      <td md-cell class="no-border">
+                        {{ 'SETTINGS.PM2_LOGS' | translate}}
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+            </md-card>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/settings/views/updates/update/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/settings/views/updates/update/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 4500f92..0000000
--- a/public/src/js/modules/main/apps/settings/views/updates/update/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,78 +0,0 @@
-<md-dialog aria-label="Update">
-  <form name="updateForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-      </div>
-    </md-toolbar>
-
-    <div md-background-bg layout="row" layout-align="start start">
-      <md-progress-linear
-        md-mode="determinate"
-        value="{{vm.progress}}"
-        class="md-warn"
-      ></md-progress-linear>
-    </div>
-
-    <md-dialog-content ms-scroll>
-      <div layout="row" layout-align="center center">
-        <div ng-if="vm.updating" layout="column" layout-align="center center">
-          <span class="text-center md-title">Grab a quick coffee and</span>
-          <span class="text-center md-title"
-            >get back here as soon as completed!</span
-          >
-          <span class="text-center md-title">{{vm.output}}</span>
-        </div>
-        <div ng-if="!vm.updating">
-          <div ng-if="vm.success" layout="column" layout-align="center center">
-            <span class="text-center md-title"
-              >Update Completed! Thank you for your time.</span
-            >
-            <span class="text-center md-title"
-              >In order to complete the update,</span
-            >
-            <span class="text-center md-title"
-              >please click on reload button</span
-            >
-          </div>
-          <div ng-if="!vm.success" layout="column" layout-align="center center">
-            <span class="text-center md-title">Update Error!</span>
-            <span class="text-center md-title"
-              >Please contact your administrator!</span
-            >
-            <span class="text-center md-title">{{vm.output}}</span>
-          </div>
-        </div>
-        <img
-          src="assets/images/business/users.jpg"
-          alt=""
-          width="128"
-          height="128"
-        />
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      ng-if="!vm.updating"
-      layout="row"
-      layout-align="space-between center"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-click="vm.reload()"
-          class="send-button md-warm md-raised"
-          aria-label="RELOAD"
-          translate="SETTINGS.RELOAD"
-          translate-attr-aria-label="SETTINGS.RELOAD"
-        >
-          RELOAD
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/settings/views/updates/update/dialog.html/dialog.html b/public/src/js/modules/main/apps/settings/views/updates/update/dialog.html/dialog.html
new file mode 100644
index 0000000..4500f92
--- /dev/null
+++ b/public/src/js/modules/main/apps/settings/views/updates/update/dialog.html/dialog.html
@@ -0,0 +1,78 @@
+<md-dialog aria-label="Update">
+  <form name="updateForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+      </div>
+    </md-toolbar>
+
+    <div md-background-bg layout="row" layout-align="start start">
+      <md-progress-linear
+        md-mode="determinate"
+        value="{{vm.progress}}"
+        class="md-warn"
+      ></md-progress-linear>
+    </div>
+
+    <md-dialog-content ms-scroll>
+      <div layout="row" layout-align="center center">
+        <div ng-if="vm.updating" layout="column" layout-align="center center">
+          <span class="text-center md-title">Grab a quick coffee and</span>
+          <span class="text-center md-title"
+            >get back here as soon as completed!</span
+          >
+          <span class="text-center md-title">{{vm.output}}</span>
+        </div>
+        <div ng-if="!vm.updating">
+          <div ng-if="vm.success" layout="column" layout-align="center center">
+            <span class="text-center md-title"
+              >Update Completed! Thank you for your time.</span
+            >
+            <span class="text-center md-title"
+              >In order to complete the update,</span
+            >
+            <span class="text-center md-title"
+              >please click on reload button</span
+            >
+          </div>
+          <div ng-if="!vm.success" layout="column" layout-align="center center">
+            <span class="text-center md-title">Update Error!</span>
+            <span class="text-center md-title"
+              >Please contact your administrator!</span
+            >
+            <span class="text-center md-title">{{vm.output}}</span>
+          </div>
+        </div>
+        <img
+          src="assets/images/business/users.jpg"
+          alt=""
+          width="128"
+          height="128"
+        />
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      ng-if="!vm.updating"
+      layout="row"
+      layout-align="space-between center"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-click="vm.reload()"
+          class="send-button md-warm md-raised"
+          aria-label="RELOAD"
+          translate="SETTINGS.RELOAD"
+          translate-attr-aria-label="SETTINGS.RELOAD"
+        >
+          RELOAD
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/settings/views/updates/updates.html/updates-[chunkhash].html b/public/src/js/modules/main/apps/settings/views/updates/updates.html/updates-[chunkhash].html
deleted file mode 100644
index 3c40745..0000000
--- a/public/src/js/modules/main/apps/settings/views/updates/updates.html/updates-[chunkhash].html
+++ /dev/null
@@ -1,141 +0,0 @@
-<div id="updates" class="page-layout simple fullwidth doc-page">
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-cog" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="SETTINGS.UPDATES">UPDATES</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- UPDATE CARD -->
-      <div layout="row" ng-if="!vm.updating">
-        <md-card class="md-whiteframe-1dp padding-20" flex>
-          <div layout="column" layout-align="center center">
-            <span
-              class="md-title md-accent-fg padding-20 text-bold"
-              translate="SETTINGS.CURRENT_VERSION"
-              >CURRENT VERSION</span
-            >
-
-            <span class="md-display-3 padding-20">{{vm.version.current}}</span>
-
-            <md-button
-              href="https://wiki.xcallymotion.com/display/XMV/Motion+GUI#MotionGUI-Version{{vm.version.current}}"
-              target="_blank"
-              class="md-accent"
-              title="CHANGELOG"
-              aria-label="CHANGELOG"
-              translate="SETTINGS.CHANGELOG"
-              translate-attr-aria-label="SETTINGS.CHANGELOG"
-            >
-              CHANGELOG
-            </md-button>
-          </div>
-        </md-card>
-        <md-card
-          class="md-whiteframe-20dp padding-20"
-          flex
-          ng-if="vm.version.current != vm.version.latest"
-        >
-          <div layout="column" layout-align="center center">
-            <span
-              class="md-title md-warn-fg padding-20 text-bold"
-              translate="SETTINGS.NEW_VERSION"
-              >NEW VERSION</span
-            >
-
-            <span class="md-display-3 padding-20">{{vm.version.latest}}</span>
-
-            <md-button
-              href="https://wiki.xcallymotion.com/display/XMV/Motion+GUI#MotionGUI-Version{{vm.version.latest}}"
-              target="_blank"
-              class="md-accent"
-              title="CHANGELOG"
-              aria-label="CHANGELOG"
-              translate="SETTINGS.CHANGELOG"
-              translate-attr-aria-label="SETTINGS.CHANGELOG"
-            >
-              CHANGELOG
-            </md-button>
-            <md-button
-              ng-click="vm.updateConfirm($event)"
-              class="md-raised md-warn"
-              aria-label="CHANGELOG"
-              translate="SETTINGS.UPDATE"
-              translate-attr-aria-label="SETTINGS.UPDATE"
-              >UPDATE</md-button
-            >
-          </div>
-        </md-card>
-        <md-card
-          class="md-whiteframe-1dp padding-20"
-          flex
-          ng-if="vm.version.current == vm.version.latest"
-        >
-          <div layout="column" layout-align="center center">
-            <span
-              class="md-title md-warn-fg padding-20 text-bold"
-              translate="SETTINGS.REMOTE_VERSION"
-              >REMOTE VERSION</span
-            >
-
-            <span
-              class="md-subhead padding-20"
-              translate="SETTINGS.NO_NEW_VERSION_AVAILABLE"
-              >NO NEW VERSION AVAILABLE</span
-            >
-          </div>
-        </md-card>
-      </div>
-      <!-- / UPDATE CARD -->
-
-      <div ng-if="vm.updating">
-        <md-card class="md-whiteframe-1dp padding-20" flex>
-          <div layout="column" layout-align="center center">
-            <span
-              class="md-title md-accent-fg padding-20 text-bold"
-              translate="SETTINGS.UPDATING"
-              >...</span
-            >
-            <md-progress-linear
-              md-mode="determinate"
-              class="md-accent padding-20"
-              value="{{vm.progress}}"
-            ></md-progress-linear>
-            <span class="md-display-1 padding-5 text-center"
-              >Grab a quick coffee and</span
-            >
-            <span class="md-display-1 padding-5 text-center"
-              >get back here as soon as completed</span
-            >
-            <img
-              src="assets/images/business/users.jpg"
-              alt=""
-              width="40%"
-              height="40%"
-            />
-          </div>
-        </md-card>
-      </div>
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- NO ADD BUTTON BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/settings/views/updates/updates.html/updates.html b/public/src/js/modules/main/apps/settings/views/updates/updates.html/updates.html
new file mode 100644
index 0000000..3c40745
--- /dev/null
+++ b/public/src/js/modules/main/apps/settings/views/updates/updates.html/updates.html
@@ -0,0 +1,141 @@
+<div id="updates" class="page-layout simple fullwidth doc-page">
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-cog" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="SETTINGS.UPDATES">UPDATES</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- UPDATE CARD -->
+      <div layout="row" ng-if="!vm.updating">
+        <md-card class="md-whiteframe-1dp padding-20" flex>
+          <div layout="column" layout-align="center center">
+            <span
+              class="md-title md-accent-fg padding-20 text-bold"
+              translate="SETTINGS.CURRENT_VERSION"
+              >CURRENT VERSION</span
+            >
+
+            <span class="md-display-3 padding-20">{{vm.version.current}}</span>
+
+            <md-button
+              href="https://wiki.xcallymotion.com/display/XMV/Motion+GUI#MotionGUI-Version{{vm.version.current}}"
+              target="_blank"
+              class="md-accent"
+              title="CHANGELOG"
+              aria-label="CHANGELOG"
+              translate="SETTINGS.CHANGELOG"
+              translate-attr-aria-label="SETTINGS.CHANGELOG"
+            >
+              CHANGELOG
+            </md-button>
+          </div>
+        </md-card>
+        <md-card
+          class="md-whiteframe-20dp padding-20"
+          flex
+          ng-if="vm.version.current != vm.version.latest"
+        >
+          <div layout="column" layout-align="center center">
+            <span
+              class="md-title md-warn-fg padding-20 text-bold"
+              translate="SETTINGS.NEW_VERSION"
+              >NEW VERSION</span
+            >
+
+            <span class="md-display-3 padding-20">{{vm.version.latest}}</span>
+
+            <md-button
+              href="https://wiki.xcallymotion.com/display/XMV/Motion+GUI#MotionGUI-Version{{vm.version.latest}}"
+              target="_blank"
+              class="md-accent"
+              title="CHANGELOG"
+              aria-label="CHANGELOG"
+              translate="SETTINGS.CHANGELOG"
+              translate-attr-aria-label="SETTINGS.CHANGELOG"
+            >
+              CHANGELOG
+            </md-button>
+            <md-button
+              ng-click="vm.updateConfirm($event)"
+              class="md-raised md-warn"
+              aria-label="CHANGELOG"
+              translate="SETTINGS.UPDATE"
+              translate-attr-aria-label="SETTINGS.UPDATE"
+              >UPDATE</md-button
+            >
+          </div>
+        </md-card>
+        <md-card
+          class="md-whiteframe-1dp padding-20"
+          flex
+          ng-if="vm.version.current == vm.version.latest"
+        >
+          <div layout="column" layout-align="center center">
+            <span
+              class="md-title md-warn-fg padding-20 text-bold"
+              translate="SETTINGS.REMOTE_VERSION"
+              >REMOTE VERSION</span
+            >
+
+            <span
+              class="md-subhead padding-20"
+              translate="SETTINGS.NO_NEW_VERSION_AVAILABLE"
+              >NO NEW VERSION AVAILABLE</span
+            >
+          </div>
+        </md-card>
+      </div>
+      <!-- / UPDATE CARD -->
+
+      <div ng-if="vm.updating">
+        <md-card class="md-whiteframe-1dp padding-20" flex>
+          <div layout="column" layout-align="center center">
+            <span
+              class="md-title md-accent-fg padding-20 text-bold"
+              translate="SETTINGS.UPDATING"
+              >...</span
+            >
+            <md-progress-linear
+              md-mode="determinate"
+              class="md-accent padding-20"
+              value="{{vm.progress}}"
+            ></md-progress-linear>
+            <span class="md-display-1 padding-5 text-center"
+              >Grab a quick coffee and</span
+            >
+            <span class="md-display-1 padding-5 text-center"
+              >get back here as soon as completed</span
+            >
+            <img
+              src="assets/images/business/users.jpg"
+              alt=""
+              width="40%"
+              height="40%"
+            />
+          </div>
+        </md-card>
+      </div>
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- NO ADD BUTTON BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/sms/views/realtime/agents/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/sms/views/realtime/agents/view.html/view-[chunkhash].html
deleted file mode 100644
index 1148d96..0000000
--- a/public/src/js/modules/main/apps/sms/views/realtime/agents/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,515 +0,0 @@
-<!-- MAIN -->
-<md-toolbar class="md-table-toolbar md-default">
-  <div class="md-toolbar-tools">
-    <span class="md-subhead" translate="SMS.AGENTS">Agents</span>
-    <div flex></div>
-    <ms-search-bar
-      on-search="vm.query.filter = query; vm.onInit()"
-      on-collapse="vm.query.filter = undefined; vm.onInit()"
-      debounce="300"
-    ></ms-search-bar>
-    <md-select
-      ng-model="vm.query.globalStatusFilter"
-      class="md-caption"
-      ng-change="vm.query.pauseTypeFilter = ''; vm.onInit()"
-    >
-      <md-option ng-value="''">{{ 'SMS.ALL' | translate }}</md-option>
-      <md-option value="pause">{{ 'SMS.PAUSE' | translate }}</md-option>
-      <md-option value="*pause">{{ 'SMS.PARTIALPAUSE' | translate }}</md-option>
-      <md-option value="busy">{{ 'SMS.BUSY' | translate }}</md-option>
-      <md-option value="idle">{{ 'SMS.IDLE' | translate }}</md-option>
-    </md-select>
-
-    <md-select
-      ng-if="vm.isPause(vm.query.globalStatusFilter)"
-      ng-model="vm.query.pauseTypeFilter"
-      class="md-caption"
-      ng-change="vm.onInit()"
-    >
-      <md-option ng-value="''">All</md-option>
-      <md-option value="DEFAULT PAUSE">DEFAULT PAUSE</md-option>
-      <md-option value="ACW">ACW</md-option>
-      <md-option value="LOGININPAUSE">LOGININPAUSE</md-option>
-      <md-option value="Auto-Pause">AUTOPAUSE</md-option>
-      <md-option ng-value="pause.name" ng-repeat="pause in vm.pauses.rows"
-        >{{pause.name}}</md-option
-      >
-    </md-select>
-  </div>
-</md-toolbar>
-
-<!-- AGENT TABLE -->
-<md-table-container>
-  <table md-table multiple md-progress="vm.promise">
-    <thead md-head md-order="vm.query.order" md-on-reorder="vm.onInit">
-      <tr md-row border="1">
-        <th class="bv text-center" colspan="5">
-          {{ 'SMS.AGENT' | translate }}
-        </th>
-        <th class="bv bl text-center" colspan="2">
-          {{ 'VOICE.VOICE' | translate }}
-        </th>
-        <th ng-if="vm.license.chat" class="bv bl text-center" colspan="2">
-          {{ 'CHAT.CHAT' | translate }}
-        </th>
-        <th ng-if="vm.license.mail" class="bv bl text-center" colspan="2">
-          {{ 'MAIL.MAIL' | translate }}
-        </th>
-        <th ng-if="vm.license.messaging" class="bv bl text-center" colspan="2">
-          {{ 'SMS.SMS' | translate }}
-        </th>
-        <th
-          ng-if="vm.license.openchannel"
-          class="bv bl text-center"
-          colspan="2"
-        >
-          {{ 'OPENCHANNEL.OPENCHANNEL' | translate }}
-        </th>
-        <th ng-if="vm.license.fax" class="bv bl text-center" colspan="2">
-          {{ 'FAX.FAX' | translate }}
-        </th>
-        <th ng-if="vm.license.whatsapp" class="bv bl text-center" colspan="2">
-          {{ 'WHATSAPP.WHATSAPP' | translate }}
-        </th>
-        <th width="10px" class="bt bl" rowspan="2"></th>
-      </tr>
-      <tr md-row>
-        <th class="bl" colspan="2" md-column md-order-by="fullname">
-          {{ 'SMS.NAME' | translate }}
-        </th>
-        <th class="bl custom-column" md-column md-order-by="globalStatus">
-          {{ 'SMS.STATUS' | translate }}
-        </th>
-        <th class="bl custom-column" md-column md-order-by="lastLoginAt">
-          {{ 'SMS.LOGIN_TIME' | translate }}
-        </th>
-        <th class="bl custom-column" md-column md-order-by="lastPauseAt">
-          {{ 'SMS.PAUSE_TIME' | translate }}
-        </th>
-
-        <th class="bl custom-column">{{ 'VOICE.STATUS' | translate }}</th>
-        <th class="bl custom-column">Info</th>
-
-        <th ng-if="vm.license.chat" class="bl text-center">
-          {{ 'CHAT.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.chat" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'CHAT.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.mail" class="bl text-center">
-          {{ 'MAIL.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.mail" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'MAIL.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.messaging" class="bl text-center">
-          {{ 'SMS.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.messaging" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'SMS.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.openchannel" class="bl text-center">
-          {{ 'OPENCHANNEL.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.openchannel" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'OPENCHANNEL.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.fax" class="bl text-center">
-          {{ 'FAX.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.fax" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'FAX.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.whatsapp" class="bl text-center">
-          {{ 'WHATSAPP.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.whatsapp" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'WHATSAPP.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-      </tr>
-    </thead>
-    <tbody md-body>
-      <tr md-row ng-hide="vm.order.length">
-        <td md-cell colspan="19">
-          <div layout="row" layout-align="center center">
-            <span>{{ 'SMS.NO_AGENT_ONLINE' | translate }}</span>
-          </div>
-        </td>
-      </tr>
-      <tr
-        md-select="vm.agents[value]"
-        md-select-id="id"
-        ng-repeat="(id, value) in vm.order"
-      >
-        <td class="bt padding-5">
-          <div layout="row" layout-align="start center">
-            <img
-              class="avatar"
-              ng-src="{{vm.agents[value].userpic && 'api/users/'+vm.agents[value].id+'/avatar' || 'assets/images/avatars/profile.png'}}"
-            />
-            <div layout="column">
-              <span>{{vm.agents[value].fullname}}</span>
-              <span>{{vm.agents[value].internal}}</span>
-            </div>
-          </div>
-        </td>
-        <td class="bt padding-5">
-          <div
-            layout="row"
-            layout-align="start center"
-            ng-if="vm.license.screenrecording && (vm.agents[value].phoneBarEnableScreenRecordingByAgent || vm.agents[value].phoneBarEnableAutomaticScreenRecording)"
-          >
-            <div class="column" ng-if="vm.agents[value].screenrecording">
-              <span>
-                <md-icon
-                  md-font-icon="icon-camcorder-box"
-                  style="color: green; font-size: 36px"
-                  aria-label="icon-camcorder-box26"
-                >
-                  <md-tooltip>
-                    {{ 'SMS.TOOLTIP_SCREENRECORDING_ON' | translate }}
-                  </md-tooltip>
-                </md-icon>
-              </span>
-            </div>
-            <div class="column" ng-if="!vm.agents[value].screenrecording">
-              <span>
-                <md-icon
-                  md-font-icon="icon-camcorder-box"
-                  style="color: gray"
-                  aria-label="icon-camcorder-box26"
-                >
-                  <md-tooltip>
-                    {{ 'SMS.TOOLTIP_SCREENRECORDING_OFF' | translate }}
-                  </md-tooltip>
-                </md-icon>
-              </span>
-            </div>
-          </div>
-        </td>
-
-        <td class="bt">
-          <span
-            class="text-boxed md-background-bg bl bt padding-5"
-            ng-class="{'idle':'lime-300-bg','busy':'indigo-100-bg','*pause':'amber-50-bg','pause':'amber-200-bg'}[vm.agents[value].globalStatus]"
-            >{{ vm.isPause(vm.agents[value].globalStatus) ? '' :
-            vm.agents[value].globalStatus | uppercase }} {{
-            vm.isPause(vm.agents[value].globalStatus) ?
-            (vm.isPartialPause(vm.agents[value].globalStatus) ?
-            '*'+vm.agents[value].pauseType || 'DEFAULT PAUSE' :
-            vm.agents[value].pauseType || 'DEFAULT PAUSE') : ''}}</span
-          >
-        </td>
-        <td class="bt custom-column">
-          <timer start-time="vm.agents[value].lastLoginAt" interval="1000"
-            >{{ days > 0 ? days + 'd' : '' }}
-            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
-          >
-        </td>
-        <td class="bt custom-column">
-          <timer
-            ng-if="vm.isPause(vm.agents[value].globalStatus) || vm.isPartialPause(vm.agents[value].globalStatus)"
-            start-time="vm.agents[value].lastPauseAt"
-            interval="1000"
-            >{{ days > 0 ? days + 'd' : '' }}
-            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
-          >
-        </td>
-        <td class="bt bl">
-          <div layout="row">
-            <span
-              ng-if="!vm.agents[value].onhold"
-              class="text-boxed md-background-bg bl bt padding-5"
-              ng-class="{'idle':'lime-300-bg','talking':'indigo-100-bg','ringing':'orange-400-bg','pause':'amber-200-bg'}[vm.agents[value].voiceStatus]"
-              >{{ vm.agents[value].voiceStatus | uppercase }}</span
-            >
-            <span
-              ng-if="vm.agents[value].onhold"
-              class="text-boxed md-background-bg bl bt padding-5 orange-400-bg"
-              >ONHOLD</span
-            >
-          </div>
-        </td>
-        <td class="bt bl">
-          <div layout="column">
-            <span
-              ng-if="vm.agents[value].queue"
-              class="padding-5"
-              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
-              >{{ vm.agents[value].queue }}</span
-            >
-            <span
-              ng-if="vm.agents[value].destconnectedlinenum"
-              class="padding-5"
-              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
-              >{{ vm.agents[value].destconnectedlinenum }}</span
-            >
-            <span
-              class="padding-5"
-              ng-if="vm.agents[value].queue || vm.agents[value].destconnectedlinenum"
-            >
-              <timer
-                start-time="vm.agents[value].voiceStatusTime"
-                interval="1000"
-                ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
-              >
-                {{hhours}}:{{mminutes}}:{{sseconds}}</timer
-              >
-            </span>
-          </div>
-        </td>
-
-        <td class="bt bl" ng-if="vm.license.chat">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].chatStatus]"
-                >{{ vm.agents[value].chatStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          md-number
-          class="bt text-center font-size-20"
-          ng-if="vm.license.chat"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].chatStatus]"
-        >
-          {{ vm.agents[value].chatCurrentCapacity }}
-        </td>
-
-        <td class="bl bt" ng-if="vm.license.mail">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].mailStatus]"
-                >{{ vm.agents[value].mailStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.mail"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].mailStatus]"
-        >
-          {{ vm.agents[value].mailCurrentCapacity }}
-        </td>
-
-        <td class="bl bt" ng-if="vm.license.messaging">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].smsStatus]"
-                >{{ vm.agents[value].smsStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.messaging"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].smsStatus]"
-        >
-          {{ vm.agents[value].smsCurrentCapacity }}
-        </td>
-
-        <td class="bt bl" ng-if="vm.license.openchannel">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].openchannelStatus]"
-                >{{ vm.agents[value].openchannelStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.openchannel"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].openchannelStatus]"
-        >
-          {{ vm.agents[value].openchannelCurrentCapacity }}
-        </td>
-
-        <td class="bt bl" ng-if="vm.license.fax">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].faxStatus]"
-                >{{ vm.agents[value].faxStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.fax"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].faxStatus]"
-        >
-          {{ vm.agents[value].faxCurrentCapacity }}
-        </td>
-
-        <td class="bl bt" ng-if="vm.license.whatsapp">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].whatsappStatus]"
-                >{{ vm.agents[value].whatsappStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.whatsapp"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].whatsappStatus]"
-        >
-          {{ vm.agents[value].whatsappCurrentCapacity }}
-        </td>
-
-        <td
-          class="bl bt padding-5 text-center"
-          ng-if="vm.crudPermissions.canEdit"
-        >
-          <md-menu>
-            <md-button
-              class="md-icon-button"
-              aria-label="More"
-              translate
-              translate-attr-aria-label="STAFF.MORE"
-              ng-click="$mdMenu.open($event)"
-            >
-              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-            </md-button>
-
-            <md-menu-content width="4">
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.logout(vm.agents[value], $event)"
-                  translate="SMS.LOGOUT"
-                >
-                  Logout
-                </md-button>
-              </md-menu-item>
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.queueAdd(vm.agents[value], $event)"
-                  translate="SMS.AGENTADD_QUEUE"
-                >
-                  Add Agent In Queue
-                </md-button>
-              </md-menu-item>
-
-              <md-menu-item
-                ng-if="vm.license.screenrecording && vm.agents[value].phoneBarEnableScreenRecordingByAgent"
-              >
-                <md-menu>
-                  <md-button
-                    ng-click="$mdMenu.open()"
-                    class="text-capitalize"
-                    translate="SMS.SCREENRECORDING"
-                    >Screen Recording
-                  </md-button>
-                  <md-menu-content>
-                    <md-menu-item ng-if="!vm.agents[value].screenrecording">
-                      <md-button
-                        ng-click="vm.screenRecording(vm.agents[value], true)"
-                        ><em translate="SMS.START_SCREENRECORDING"
-                          >Start Screen Recording</em
-                        ></md-button
-                      >
-                    </md-menu-item>
-                    <md-menu-item ng-if="vm.agents[value].screenrecording">
-                      <md-button
-                        ng-click="vm.screenRecording(vm.agents[value], false)"
-                        ><em translate="SMS.STOP_SCREENRECORDING"
-                          >Stop Screen Recording</em
-                        ></md-button
-                      >
-                    </md-menu-item>
-                  </md-menu-content>
-                </md-menu>
-              </md-menu-item>
-
-              <md-menu-item>
-                <md-menu>
-                  <md-button
-                    ng-click="$mdMenu.open()"
-                    class="text-capitalize"
-                    translate="SMS.PAUSE"
-                    >Pause</md-button
-                  >
-                  <md-menu-content>
-                    <md-menu-item>
-                      <md-button
-                        ng-disabled=" vm.agents[value].voicePause && 'DEFAULT PAUSE' === vm.agents[value].pauseType"
-                        ng-click="vm.pause(vm.agents[value])"
-                        ><em translate="SMS.DEFAULT_PAUSE"
-                          >Default Pause</em
-                        ></md-button
-                      >
-                    </md-menu-item>
-                    <md-menu-item
-                      ng-if="vm.pauses.rows.length"
-                      ng-repeat="pause in vm.pauses.rows"
-                    >
-                      <md-button
-                        ng-disabled="vm.agents[value].voicePause && pause.name === vm.agents[value].pauseType"
-                        ng-click="vm.pause(vm.agents[value], pause.name)"
-                        >{{pause.name}}
-                      </md-button>
-                    </md-menu-item>
-                  </md-menu-content>
-                </md-menu>
-              </md-menu-item>
-              <md-menu-item ng-if="vm.isPause(vm.agents[value].globalStatus)">
-                <md-button
-                  ng-click="vm.unPause(vm.agents[value])"
-                  translate="SMS.UNPAUSE"
-                >
-                  Unpause
-                </md-button>
-              </md-menu-item>
-            </md-menu-content>
-          </md-menu>
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</md-table-container>
-
-<md-table-pagination
-  md-label="{page: '{{'SMS.PAGE' | translate}}:', rowsPerPage: '{{'SMS.ROWSPERPAGE' | translate}}:', of: '{{'SMS.OF' | translate}}'}"
-  md-limit="vm.query.limit"
-  md-limit-options="[10, 15, 20, 50, 100, 250]"
-  md-page="vm.query.page"
-  md-total="{{vm.filteredAgents.length}}"
-  md-on-paginate="vm.onInit"
-  md-page-select
-></md-table-pagination>
-<!-- / AGENT TABLE -->
-<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/sms/views/realtime/agents/view.html/view.html b/public/src/js/modules/main/apps/sms/views/realtime/agents/view.html/view.html
new file mode 100644
index 0000000..1148d96
--- /dev/null
+++ b/public/src/js/modules/main/apps/sms/views/realtime/agents/view.html/view.html
@@ -0,0 +1,515 @@
+<!-- MAIN -->
+<md-toolbar class="md-table-toolbar md-default">
+  <div class="md-toolbar-tools">
+    <span class="md-subhead" translate="SMS.AGENTS">Agents</span>
+    <div flex></div>
+    <ms-search-bar
+      on-search="vm.query.filter = query; vm.onInit()"
+      on-collapse="vm.query.filter = undefined; vm.onInit()"
+      debounce="300"
+    ></ms-search-bar>
+    <md-select
+      ng-model="vm.query.globalStatusFilter"
+      class="md-caption"
+      ng-change="vm.query.pauseTypeFilter = ''; vm.onInit()"
+    >
+      <md-option ng-value="''">{{ 'SMS.ALL' | translate }}</md-option>
+      <md-option value="pause">{{ 'SMS.PAUSE' | translate }}</md-option>
+      <md-option value="*pause">{{ 'SMS.PARTIALPAUSE' | translate }}</md-option>
+      <md-option value="busy">{{ 'SMS.BUSY' | translate }}</md-option>
+      <md-option value="idle">{{ 'SMS.IDLE' | translate }}</md-option>
+    </md-select>
+
+    <md-select
+      ng-if="vm.isPause(vm.query.globalStatusFilter)"
+      ng-model="vm.query.pauseTypeFilter"
+      class="md-caption"
+      ng-change="vm.onInit()"
+    >
+      <md-option ng-value="''">All</md-option>
+      <md-option value="DEFAULT PAUSE">DEFAULT PAUSE</md-option>
+      <md-option value="ACW">ACW</md-option>
+      <md-option value="LOGININPAUSE">LOGININPAUSE</md-option>
+      <md-option value="Auto-Pause">AUTOPAUSE</md-option>
+      <md-option ng-value="pause.name" ng-repeat="pause in vm.pauses.rows"
+        >{{pause.name}}</md-option
+      >
+    </md-select>
+  </div>
+</md-toolbar>
+
+<!-- AGENT TABLE -->
+<md-table-container>
+  <table md-table multiple md-progress="vm.promise">
+    <thead md-head md-order="vm.query.order" md-on-reorder="vm.onInit">
+      <tr md-row border="1">
+        <th class="bv text-center" colspan="5">
+          {{ 'SMS.AGENT' | translate }}
+        </th>
+        <th class="bv bl text-center" colspan="2">
+          {{ 'VOICE.VOICE' | translate }}
+        </th>
+        <th ng-if="vm.license.chat" class="bv bl text-center" colspan="2">
+          {{ 'CHAT.CHAT' | translate }}
+        </th>
+        <th ng-if="vm.license.mail" class="bv bl text-center" colspan="2">
+          {{ 'MAIL.MAIL' | translate }}
+        </th>
+        <th ng-if="vm.license.messaging" class="bv bl text-center" colspan="2">
+          {{ 'SMS.SMS' | translate }}
+        </th>
+        <th
+          ng-if="vm.license.openchannel"
+          class="bv bl text-center"
+          colspan="2"
+        >
+          {{ 'OPENCHANNEL.OPENCHANNEL' | translate }}
+        </th>
+        <th ng-if="vm.license.fax" class="bv bl text-center" colspan="2">
+          {{ 'FAX.FAX' | translate }}
+        </th>
+        <th ng-if="vm.license.whatsapp" class="bv bl text-center" colspan="2">
+          {{ 'WHATSAPP.WHATSAPP' | translate }}
+        </th>
+        <th width="10px" class="bt bl" rowspan="2"></th>
+      </tr>
+      <tr md-row>
+        <th class="bl" colspan="2" md-column md-order-by="fullname">
+          {{ 'SMS.NAME' | translate }}
+        </th>
+        <th class="bl custom-column" md-column md-order-by="globalStatus">
+          {{ 'SMS.STATUS' | translate }}
+        </th>
+        <th class="bl custom-column" md-column md-order-by="lastLoginAt">
+          {{ 'SMS.LOGIN_TIME' | translate }}
+        </th>
+        <th class="bl custom-column" md-column md-order-by="lastPauseAt">
+          {{ 'SMS.PAUSE_TIME' | translate }}
+        </th>
+
+        <th class="bl custom-column">{{ 'VOICE.STATUS' | translate }}</th>
+        <th class="bl custom-column">Info</th>
+
+        <th ng-if="vm.license.chat" class="bl text-center">
+          {{ 'CHAT.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.chat" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'CHAT.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.mail" class="bl text-center">
+          {{ 'MAIL.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.mail" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'MAIL.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.messaging" class="bl text-center">
+          {{ 'SMS.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.messaging" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'SMS.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.openchannel" class="bl text-center">
+          {{ 'OPENCHANNEL.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.openchannel" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'OPENCHANNEL.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.fax" class="bl text-center">
+          {{ 'FAX.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.fax" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'FAX.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.whatsapp" class="bl text-center">
+          {{ 'WHATSAPP.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.whatsapp" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'WHATSAPP.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+      </tr>
+    </thead>
+    <tbody md-body>
+      <tr md-row ng-hide="vm.order.length">
+        <td md-cell colspan="19">
+          <div layout="row" layout-align="center center">
+            <span>{{ 'SMS.NO_AGENT_ONLINE' | translate }}</span>
+          </div>
+        </td>
+      </tr>
+      <tr
+        md-select="vm.agents[value]"
+        md-select-id="id"
+        ng-repeat="(id, value) in vm.order"
+      >
+        <td class="bt padding-5">
+          <div layout="row" layout-align="start center">
+            <img
+              class="avatar"
+              ng-src="{{vm.agents[value].userpic && 'api/users/'+vm.agents[value].id+'/avatar' || 'assets/images/avatars/profile.png'}}"
+            />
+            <div layout="column">
+              <span>{{vm.agents[value].fullname}}</span>
+              <span>{{vm.agents[value].internal}}</span>
+            </div>
+          </div>
+        </td>
+        <td class="bt padding-5">
+          <div
+            layout="row"
+            layout-align="start center"
+            ng-if="vm.license.screenrecording && (vm.agents[value].phoneBarEnableScreenRecordingByAgent || vm.agents[value].phoneBarEnableAutomaticScreenRecording)"
+          >
+            <div class="column" ng-if="vm.agents[value].screenrecording">
+              <span>
+                <md-icon
+                  md-font-icon="icon-camcorder-box"
+                  style="color: green; font-size: 36px"
+                  aria-label="icon-camcorder-box26"
+                >
+                  <md-tooltip>
+                    {{ 'SMS.TOOLTIP_SCREENRECORDING_ON' | translate }}
+                  </md-tooltip>
+                </md-icon>
+              </span>
+            </div>
+            <div class="column" ng-if="!vm.agents[value].screenrecording">
+              <span>
+                <md-icon
+                  md-font-icon="icon-camcorder-box"
+                  style="color: gray"
+                  aria-label="icon-camcorder-box26"
+                >
+                  <md-tooltip>
+                    {{ 'SMS.TOOLTIP_SCREENRECORDING_OFF' | translate }}
+                  </md-tooltip>
+                </md-icon>
+              </span>
+            </div>
+          </div>
+        </td>
+
+        <td class="bt">
+          <span
+            class="text-boxed md-background-bg bl bt padding-5"
+            ng-class="{'idle':'lime-300-bg','busy':'indigo-100-bg','*pause':'amber-50-bg','pause':'amber-200-bg'}[vm.agents[value].globalStatus]"
+            >{{ vm.isPause(vm.agents[value].globalStatus) ? '' :
+            vm.agents[value].globalStatus | uppercase }} {{
+            vm.isPause(vm.agents[value].globalStatus) ?
+            (vm.isPartialPause(vm.agents[value].globalStatus) ?
+            '*'+vm.agents[value].pauseType || 'DEFAULT PAUSE' :
+            vm.agents[value].pauseType || 'DEFAULT PAUSE') : ''}}</span
+          >
+        </td>
+        <td class="bt custom-column">
+          <timer start-time="vm.agents[value].lastLoginAt" interval="1000"
+            >{{ days > 0 ? days + 'd' : '' }}
+            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
+          >
+        </td>
+        <td class="bt custom-column">
+          <timer
+            ng-if="vm.isPause(vm.agents[value].globalStatus) || vm.isPartialPause(vm.agents[value].globalStatus)"
+            start-time="vm.agents[value].lastPauseAt"
+            interval="1000"
+            >{{ days > 0 ? days + 'd' : '' }}
+            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
+          >
+        </td>
+        <td class="bt bl">
+          <div layout="row">
+            <span
+              ng-if="!vm.agents[value].onhold"
+              class="text-boxed md-background-bg bl bt padding-5"
+              ng-class="{'idle':'lime-300-bg','talking':'indigo-100-bg','ringing':'orange-400-bg','pause':'amber-200-bg'}[vm.agents[value].voiceStatus]"
+              >{{ vm.agents[value].voiceStatus | uppercase }}</span
+            >
+            <span
+              ng-if="vm.agents[value].onhold"
+              class="text-boxed md-background-bg bl bt padding-5 orange-400-bg"
+              >ONHOLD</span
+            >
+          </div>
+        </td>
+        <td class="bt bl">
+          <div layout="column">
+            <span
+              ng-if="vm.agents[value].queue"
+              class="padding-5"
+              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
+              >{{ vm.agents[value].queue }}</span
+            >
+            <span
+              ng-if="vm.agents[value].destconnectedlinenum"
+              class="padding-5"
+              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
+              >{{ vm.agents[value].destconnectedlinenum }}</span
+            >
+            <span
+              class="padding-5"
+              ng-if="vm.agents[value].queue || vm.agents[value].destconnectedlinenum"
+            >
+              <timer
+                start-time="vm.agents[value].voiceStatusTime"
+                interval="1000"
+                ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
+              >
+                {{hhours}}:{{mminutes}}:{{sseconds}}</timer
+              >
+            </span>
+          </div>
+        </td>
+
+        <td class="bt bl" ng-if="vm.license.chat">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].chatStatus]"
+                >{{ vm.agents[value].chatStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          md-number
+          class="bt text-center font-size-20"
+          ng-if="vm.license.chat"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].chatStatus]"
+        >
+          {{ vm.agents[value].chatCurrentCapacity }}
+        </td>
+
+        <td class="bl bt" ng-if="vm.license.mail">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].mailStatus]"
+                >{{ vm.agents[value].mailStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.mail"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].mailStatus]"
+        >
+          {{ vm.agents[value].mailCurrentCapacity }}
+        </td>
+
+        <td class="bl bt" ng-if="vm.license.messaging">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].smsStatus]"
+                >{{ vm.agents[value].smsStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.messaging"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].smsStatus]"
+        >
+          {{ vm.agents[value].smsCurrentCapacity }}
+        </td>
+
+        <td class="bt bl" ng-if="vm.license.openchannel">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].openchannelStatus]"
+                >{{ vm.agents[value].openchannelStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.openchannel"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].openchannelStatus]"
+        >
+          {{ vm.agents[value].openchannelCurrentCapacity }}
+        </td>
+
+        <td class="bt bl" ng-if="vm.license.fax">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].faxStatus]"
+                >{{ vm.agents[value].faxStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.fax"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].faxStatus]"
+        >
+          {{ vm.agents[value].faxCurrentCapacity }}
+        </td>
+
+        <td class="bl bt" ng-if="vm.license.whatsapp">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].whatsappStatus]"
+                >{{ vm.agents[value].whatsappStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.whatsapp"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].whatsappStatus]"
+        >
+          {{ vm.agents[value].whatsappCurrentCapacity }}
+        </td>
+
+        <td
+          class="bl bt padding-5 text-center"
+          ng-if="vm.crudPermissions.canEdit"
+        >
+          <md-menu>
+            <md-button
+              class="md-icon-button"
+              aria-label="More"
+              translate
+              translate-attr-aria-label="STAFF.MORE"
+              ng-click="$mdMenu.open($event)"
+            >
+              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+            </md-button>
+
+            <md-menu-content width="4">
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.logout(vm.agents[value], $event)"
+                  translate="SMS.LOGOUT"
+                >
+                  Logout
+                </md-button>
+              </md-menu-item>
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.queueAdd(vm.agents[value], $event)"
+                  translate="SMS.AGENTADD_QUEUE"
+                >
+                  Add Agent In Queue
+                </md-button>
+              </md-menu-item>
+
+              <md-menu-item
+                ng-if="vm.license.screenrecording && vm.agents[value].phoneBarEnableScreenRecordingByAgent"
+              >
+                <md-menu>
+                  <md-button
+                    ng-click="$mdMenu.open()"
+                    class="text-capitalize"
+                    translate="SMS.SCREENRECORDING"
+                    >Screen Recording
+                  </md-button>
+                  <md-menu-content>
+                    <md-menu-item ng-if="!vm.agents[value].screenrecording">
+                      <md-button
+                        ng-click="vm.screenRecording(vm.agents[value], true)"
+                        ><em translate="SMS.START_SCREENRECORDING"
+                          >Start Screen Recording</em
+                        ></md-button
+                      >
+                    </md-menu-item>
+                    <md-menu-item ng-if="vm.agents[value].screenrecording">
+                      <md-button
+                        ng-click="vm.screenRecording(vm.agents[value], false)"
+                        ><em translate="SMS.STOP_SCREENRECORDING"
+                          >Stop Screen Recording</em
+                        ></md-button
+                      >
+                    </md-menu-item>
+                  </md-menu-content>
+                </md-menu>
+              </md-menu-item>
+
+              <md-menu-item>
+                <md-menu>
+                  <md-button
+                    ng-click="$mdMenu.open()"
+                    class="text-capitalize"
+                    translate="SMS.PAUSE"
+                    >Pause</md-button
+                  >
+                  <md-menu-content>
+                    <md-menu-item>
+                      <md-button
+                        ng-disabled=" vm.agents[value].voicePause && 'DEFAULT PAUSE' === vm.agents[value].pauseType"
+                        ng-click="vm.pause(vm.agents[value])"
+                        ><em translate="SMS.DEFAULT_PAUSE"
+                          >Default Pause</em
+                        ></md-button
+                      >
+                    </md-menu-item>
+                    <md-menu-item
+                      ng-if="vm.pauses.rows.length"
+                      ng-repeat="pause in vm.pauses.rows"
+                    >
+                      <md-button
+                        ng-disabled="vm.agents[value].voicePause && pause.name === vm.agents[value].pauseType"
+                        ng-click="vm.pause(vm.agents[value], pause.name)"
+                        >{{pause.name}}
+                      </md-button>
+                    </md-menu-item>
+                  </md-menu-content>
+                </md-menu>
+              </md-menu-item>
+              <md-menu-item ng-if="vm.isPause(vm.agents[value].globalStatus)">
+                <md-button
+                  ng-click="vm.unPause(vm.agents[value])"
+                  translate="SMS.UNPAUSE"
+                >
+                  Unpause
+                </md-button>
+              </md-menu-item>
+            </md-menu-content>
+          </md-menu>
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</md-table-container>
+
+<md-table-pagination
+  md-label="{page: '{{'SMS.PAGE' | translate}}:', rowsPerPage: '{{'SMS.ROWSPERPAGE' | translate}}:', of: '{{'SMS.OF' | translate}}'}"
+  md-limit="vm.query.limit"
+  md-limit-options="[10, 15, 20, 50, 100, 250]"
+  md-page="vm.query.page"
+  md-total="{{vm.filteredAgents.length}}"
+  md-on-paginate="vm.onInit"
+  md-page-select
+></md-table-pagination>
+<!-- / AGENT TABLE -->
+<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/sms/views/realtime/queues/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/sms/views/realtime/queues/view.html/view-[chunkhash].html
deleted file mode 100644
index d2d20eb..0000000
--- a/public/src/js/modules/main/apps/sms/views/realtime/queues/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,110 +0,0 @@
-<!-- MAIN -->
-<md-toolbar class="md-table-toolbar md-default">
-  <div class="md-toolbar-tools">
-    <span class="md-subhead" translate="SMS.QUEUES">Queues</span>
-    <div flex></div>
-    <ms-search-bar
-      on-search="vm.query.filter = query;"
-      on-collapse="vm.query.filter = undefined;"
-      debounce="300"
-    ></ms-search-bar>
-  </div>
-</md-toolbar>
-
-<!-- QUEUE TABLE -->
-<md-table-container>
-  <table md-table multiple md-progress="vm.promise">
-    <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getQueues">
-      <tr md-row>
-        <th md-column md-order-by="name">{{ 'SMS.NAME' | translate }}</th>
-        <th md-column>{{ 'SMS.LOGGED_IN' | translate }}</th>
-        <th md-column>{{ 'SMS.PAUSED' | translate }}</th>
-        <th md-column>{{ 'SMS.READY' | translate }}</th>
-        <th md-column>{{ 'SMS.WAITING' | translate }}</th>
-        <th md-column width="10px"></th>
-      </tr>
-    </thead>
-    <tbody md-body>
-      <tr md-row ng-hide="vm.queues">
-        <td md-cell colspan="7">
-          <div layout="row" layout-align="center center">
-            <span translate="SMS.NO_AVAILABLE_INFO">No Available Info</span>
-          </div>
-        </td>
-      </tr>
-      <tr
-        md-row
-        md-select="vm.queues[value]"
-        md-select-id="id"
-        ng-repeat="(id, value) in vm.order"
-      >
-        <td md-cell>{{vm.queues[value].name}}</td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{vm.queues[value].loggedInDb || 0}} ({{vm.queues[value].loggedIn
-            || 0}})</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{vm.queues[value].paused || 0}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-16 grey-fg"
-            >{{vm.queues[value].available || 0}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{vm.queues[value].waiting || 0}}</span
-          >
-        </td>
-        <td md-cell class="actions" ng-if="vm.crudPermissions.canEdit">
-          <md-menu>
-            <md-button
-              class="md-icon-button"
-              aria-label="More"
-              translate
-              translate-attr-aria-label="SMS.MORE"
-              ng-click="$mdMenu.open($event)"
-            >
-              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-            </md-button>
-
-            <md-menu-content width="3">
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.createOrEditSmsQueue($event, vm.queues[value])"
-                  translate="SMS.EDIT_QUEUE"
-                >
-                  Edit Queue
-                </md-button>
-              </md-menu-item>
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.agentAdd($event, vm.queues[value])"
-                  translate="SMS.AGENTSADD_QUEUE"
-                >
-                  Add Agents to queue
-                </md-button>
-              </md-menu-item>
-            </md-menu-content>
-          </md-menu>
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</md-table-container>
-
-<md-table-pagination
-  md-label="{page: '{{'SMS.PAGE' | translate}}:', rowsPerPage: '{{'SMS.ROWSPERPAGE' | translate}}:', of: '{{'SMS.OF' | translate}}'}"
-  md-limit="vm.query.limit"
-  md-limit-options="[10, 15, 20, 50, 100, 250]"
-  md-page="vm.query.page"
-  md-total="{{vm.count}}"
-  md-on-paginate="vm.getQueues"
-  md-page-select
-></md-table-pagination>
-<!-- / QUEUE TABLE -->
-<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/sms/views/realtime/queues/view.html/view.html b/public/src/js/modules/main/apps/sms/views/realtime/queues/view.html/view.html
new file mode 100644
index 0000000..d2d20eb
--- /dev/null
+++ b/public/src/js/modules/main/apps/sms/views/realtime/queues/view.html/view.html
@@ -0,0 +1,110 @@
+<!-- MAIN -->
+<md-toolbar class="md-table-toolbar md-default">
+  <div class="md-toolbar-tools">
+    <span class="md-subhead" translate="SMS.QUEUES">Queues</span>
+    <div flex></div>
+    <ms-search-bar
+      on-search="vm.query.filter = query;"
+      on-collapse="vm.query.filter = undefined;"
+      debounce="300"
+    ></ms-search-bar>
+  </div>
+</md-toolbar>
+
+<!-- QUEUE TABLE -->
+<md-table-container>
+  <table md-table multiple md-progress="vm.promise">
+    <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getQueues">
+      <tr md-row>
+        <th md-column md-order-by="name">{{ 'SMS.NAME' | translate }}</th>
+        <th md-column>{{ 'SMS.LOGGED_IN' | translate }}</th>
+        <th md-column>{{ 'SMS.PAUSED' | translate }}</th>
+        <th md-column>{{ 'SMS.READY' | translate }}</th>
+        <th md-column>{{ 'SMS.WAITING' | translate }}</th>
+        <th md-column width="10px"></th>
+      </tr>
+    </thead>
+    <tbody md-body>
+      <tr md-row ng-hide="vm.queues">
+        <td md-cell colspan="7">
+          <div layout="row" layout-align="center center">
+            <span translate="SMS.NO_AVAILABLE_INFO">No Available Info</span>
+          </div>
+        </td>
+      </tr>
+      <tr
+        md-row
+        md-select="vm.queues[value]"
+        md-select-id="id"
+        ng-repeat="(id, value) in vm.order"
+      >
+        <td md-cell>{{vm.queues[value].name}}</td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{vm.queues[value].loggedInDb || 0}} ({{vm.queues[value].loggedIn
+            || 0}})</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{vm.queues[value].paused || 0}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-16 grey-fg"
+            >{{vm.queues[value].available || 0}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{vm.queues[value].waiting || 0}}</span
+          >
+        </td>
+        <td md-cell class="actions" ng-if="vm.crudPermissions.canEdit">
+          <md-menu>
+            <md-button
+              class="md-icon-button"
+              aria-label="More"
+              translate
+              translate-attr-aria-label="SMS.MORE"
+              ng-click="$mdMenu.open($event)"
+            >
+              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+            </md-button>
+
+            <md-menu-content width="3">
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.createOrEditSmsQueue($event, vm.queues[value])"
+                  translate="SMS.EDIT_QUEUE"
+                >
+                  Edit Queue
+                </md-button>
+              </md-menu-item>
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.agentAdd($event, vm.queues[value])"
+                  translate="SMS.AGENTSADD_QUEUE"
+                >
+                  Add Agents to queue
+                </md-button>
+              </md-menu-item>
+            </md-menu-content>
+          </md-menu>
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</md-table-container>
+
+<md-table-pagination
+  md-label="{page: '{{'SMS.PAGE' | translate}}:', rowsPerPage: '{{'SMS.ROWSPERPAGE' | translate}}:', of: '{{'SMS.OF' | translate}}'}"
+  md-limit="vm.query.limit"
+  md-limit-options="[10, 15, 20, 50, 100, 250]"
+  md-page="vm.query.page"
+  md-total="{{vm.count}}"
+  md-on-paginate="vm.getQueues"
+  md-page-select
+></md-table-pagination>
+<!-- / QUEUE TABLE -->
+<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/sms/views/realtime/realtime.html/realtime-[chunkhash].html b/public/src/js/modules/main/apps/sms/views/realtime/realtime.html/realtime-[chunkhash].html
deleted file mode 100644
index f118b7f..0000000
--- a/public/src/js/modules/main/apps/sms/views/realtime/realtime.html/realtime-[chunkhash].html
+++ /dev/null
@@ -1,26 +0,0 @@
-<div id="realtime" class="page-layout simple tabbed" layout="column" ng-cloak>
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="SMS.AGENTS">Agents</span>
-        </md-tab-label>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="SMS.QUEUES">Queues</span>
-        </md-tab-label>
-      </md-tab>
-    </md-tabs>
-
-    <md-card ui-view></md-card>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/sms/views/realtime/realtime.html/realtime.html b/public/src/js/modules/main/apps/sms/views/realtime/realtime.html/realtime.html
new file mode 100644
index 0000000..f118b7f
--- /dev/null
+++ b/public/src/js/modules/main/apps/sms/views/realtime/realtime.html/realtime.html
@@ -0,0 +1,26 @@
+<div id="realtime" class="page-layout simple tabbed" layout="column" ng-cloak>
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="SMS.AGENTS">Agents</span>
+        </md-tab-label>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="SMS.QUEUES">Queues</span>
+        </md-tab-label>
+      </md-tab>
+    </md-tabs>
+
+    <md-card ui-view></md-card>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/sms/views/smsAccounts/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 1ce0554..0000000
--- a/public/src/js/modules/main/apps/sms/views/smsAccounts/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,482 +0,0 @@
-<md-dialog class="smsAccount-dialog" aria-label="New SmsAccount">
-  <form name="smsAccountForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="SMS.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.smsAccount.name"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.newSmsAccount"
-        />
-
-        <div
-          ng-messages="smsAccountForm['name'].$error"
-          ng-show="smsAccountForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="SMS.KEY">key</label>
-        <input
-          type="text"
-          name="key"
-          ng-model="vm.smsAccount.key"
-          md-maxlength="5"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="smsAccountForm['key'].$error"
-          ng-show="smsAccountForm['key'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.KEY_REQUIRED"
-              >key field is required</span
-            >
-          </div>
-          <div ng-message="md-maxlength">
-            <span
-              translate="SMS.ERRORS.KEY_MAX_LENGTH"
-              translate-values="{max: 5}"
-              >key must have a maximum length equal to 5</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="SMS.MOTIONPROXY">MotionProxy</label>
-        <input
-          type="url"
-          name="remote"
-          ng-model="vm.smsAccount.remote"
-          md-maxlength="255"
-          ng-required="true"
-        />
-
-        <div class="hint"><span translate="SMS.HELP.MOTIONPROXY"></span></div>
-        <div
-          ng-messages="smsAccountForm['remote'].$error"
-          ng-show="smsAccountForm['remote'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.MOTIONPROXY_REQUIRED"
-              >MotionProxy field is required</span
-            >
-          </div>
-          <div ng-message="url">
-            <span translate="SMS.ERRORS.MOTIONPROXY_MUST_VALID_URL"
-              >MotionProxy must be a valid url http://www.xcally.com</span
-            >
-          </div>
-          <div ng-message="md-maxlength">
-            <span
-              translate="SMS.ERRORS.MOTIONPROXY_MAX_LENGTH"
-              translate-values="{max: 255}"
-              >MotionProxy must have a maximum length equal to 255</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="SMS.LIST">List</label>
-        <md-select name="ListId" ng-model="vm.smsAccount.ListId" required>
-          <md-option
-            ng-value="ListId.id"
-            ng-repeat="ListId in vm.lists"
-            ng-disabled="ListId.canSelect === false"
-            >{{ ListId.name }}</md-option
-          >
-        </md-select>
-        <div class="hint"><span translate="SMS.HELP.LIST"></span></div>
-        <div
-          ng-messages="smsAccountForm['ListId'].$error"
-          ng-show="smsAccountForm['ListId'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.LIST_REQUIRED"
-              >List field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="SMS.TYPE">Type</label>
-        <md-select name="type" ng-model="vm.smsAccount.type" required>
-          <md-option ng-value="'twilio'">Twilio</md-option>
-          <md-option ng-value="'skebby'">Skebby</md-option>
-          <md-option ng-value="'connectel'">Connectel</md-option>
-          <md-option ng-value="'clicksend'">ClickSend</md-option>
-          <md-option ng-value="'plivo'">Plivo</md-option>
-          <md-option ng-value="'infobip'">Infobip</md-option>
-          <md-option ng-value="'clickatell'">Clickatell</md-option>
-          <md-option ng-value="'csc'">CSCTelecom</md-option>
-          <md-option ng-value="'intelepeer'">Intelepeer</md-option>
-        </md-select>
-        <div
-          ng-messages="smsAccountForm['type'].$error"
-          ng-show="smsAccountForm['type'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.TYPE_REQUIRED"
-              >Type field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="SMS.PHONE">Phone</label>
-        <input
-          type="text"
-          name="phone"
-          ng-model="vm.smsAccount.phone"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="smsAccountForm['phone'].$error"
-          ng-show="smsAccountForm['phone'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.PHONE_REQUIRED"
-              >Phone field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.smsAccount.type == 'twilio'"
-        class="md-block"
-      >
-        <label translate="SMS.ACCOUNTSID">AccountSID</label>
-        <input
-          type="text"
-          name="accountSid"
-          ng-model="vm.smsAccount.accountSid"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="smsAccountForm['accountSid'].$error"
-          ng-show="smsAccountForm['accountSid'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.ACCOUNTSID_REQUIRED"
-              >AccountSID field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.smsAccount.type == 'plivo'"
-        class="md-block"
-      >
-        <label translate="SMS.AUTHID">AuthID</label>
-        <input
-          type="text"
-          name="authId"
-          ng-model="vm.smsAccount.authId"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="smsAccountForm['authId'].$error"
-          ng-show="smsAccountForm['authId'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.AUTHID_REQUIRED"
-              >AuthID field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.smsAccount.type == 'twilio' || vm.smsAccount.type == 'connectel' || vm.smsAccount.type == 'plivo'"
-        class="md-block"
-      >
-        <label translate="SMS.AUTHTOKEN">AuthToken</label>
-        <input
-          type="text"
-          name="authToken"
-          ng-model="vm.smsAccount.authToken"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="smsAccountForm['authToken'].$error"
-          ng-show="smsAccountForm['authToken'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.AUTHTOKEN_REQUIRED"
-              >AuthToken field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.smsAccount.type == 'skebby'"
-        class="md-block"
-      >
-        <label translate="SMS.METHOD">Method</label>
-        <md-select name="smsMethod" ng-model="vm.smsAccount.smsMethod" required>
-          <md-option ng-value="'SI'">Basic</md-option>
-          <md-option ng-value="'TI'">Classic</md-option>
-          <md-option ng-value="'GP'">Classic+</md-option>
-        </md-select>
-        <div
-          ng-messages="smsAccountForm['smsMethod'].$error"
-          ng-show="smsAccountForm['smsMethod'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.METHOD_REQUIRED"
-              >Method field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.smsAccount.type == 'skebby' || vm.smsAccount.type == 'clicksend' || vm.smsAccount.type == 'csc' || vm.smsAccount.type == 'infobip'"
-        class="md-block"
-      >
-        <label translate="SMS.USERNAME">Username</label>
-        <input
-          type="text"
-          name="username"
-          ng-model="vm.smsAccount.username"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="smsAccountForm['username'].$error"
-          ng-show="smsAccountForm['username'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.USERNAME_REQUIRED"
-              >Username field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        class="md-block"
-        ng-if="vm.smsAccount.type == 'skebby' || vm.smsAccount.type == 'clicksend' || vm.smsAccount.type == 'infobip'"
-      >
-        <label translate="SMS.PASSWORD">Password</label>
-        <input
-          type="password"
-          name="password"
-          ng-model="vm.smsAccount.password"
-          placeholder="Password"
-          translate
-          translate-attr-placeholder="SMS.PASSWORD"
-          required
-        />
-        <div ng-messages="smsAccountForm['password'].$error" role="alert">
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.PASSWORD_REQUIRED"
-              >Password field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span translate="SMS.ERRORS.SECURE_PASSWORD_PATTERN"
-              >Must contain at least 8 characters, with a minimum of 1 lowercase
-              letter, 1 uppercase letter, 1 numeric character and 1 special
-              character ~!?*@#$%^&-_=+[{]}.</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <md-input-container
-        ng-if="vm.smsAccount.type == 'infobip' || vm.smsAccount.type == 'csc'"
-        class="md-block"
-      >
-        <label translate="SMS.BASEURL">BaseURL</label>
-        <input
-          type="text"
-          name="baseUrl"
-          ng-model="vm.smsAccount.baseUrl"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="smsAccountForm['baseUrl'].$error"
-          ng-show="smsAccountForm['baseUrl'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.BASEURL_REQUIRED"
-              >BaseURL field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.smsAccount.type == 'csc' || vm.smsAccount.type == 'clickatell' || vm.smsAccount.type == 'intelepeer'"
-        class="md-block"
-      >
-        <label translate="SMS.APIKEY">ApiKey</label>
-        <input
-          type="text"
-          name="apiKey"
-          ng-model="vm.smsAccount.apiKey"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="smsAccountForm['apiKey'].$error"
-          ng-show="smsAccountForm['apiKey'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.APIKEY_REQUIRED"
-              >ApiKey field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="SMS.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.smsAccount.description"
-        />
-
-        <div
-          ng-messages="smsAccountForm['description'].$error"
-          ng-show="smsAccountForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newSmsAccount"
-          ng-click="vm.saveSmsAccount()"
-          class="send-button md-accent md-raised"
-          ng-disabled="smsAccountForm.$invalid || smsAccountForm.$pristine"
-          aria-label="SAVE"
-          translate="SMS.SAVE"
-          translate-attr-aria-label="SMS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newSmsAccount"
-          ng-click="vm.addNewSmsAccount()"
-          class="send-button md-accent md-raised"
-          ng-disabled="smsAccountForm.$invalid"
-          aria-label="ADD"
-          translate="SMS.ADD_SMSACCOUNT"
-          translate-attr-aria-label="SMS.ADD_SMSACCOUNT"
-        >
-          ADD SMSACCOUNT
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newSmsAccount"
-          ng-click="vm.deleteSmsAccount($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="SMS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="SMS.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/sms/views/smsAccounts/create/dialog.html/dialog.html
new file mode 100644
index 0000000..1ce0554
--- /dev/null
+++ b/public/src/js/modules/main/apps/sms/views/smsAccounts/create/dialog.html/dialog.html
@@ -0,0 +1,482 @@
+<md-dialog class="smsAccount-dialog" aria-label="New SmsAccount">
+  <form name="smsAccountForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="SMS.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.smsAccount.name"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.newSmsAccount"
+        />
+
+        <div
+          ng-messages="smsAccountForm['name'].$error"
+          ng-show="smsAccountForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="SMS.KEY">key</label>
+        <input
+          type="text"
+          name="key"
+          ng-model="vm.smsAccount.key"
+          md-maxlength="5"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="smsAccountForm['key'].$error"
+          ng-show="smsAccountForm['key'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.KEY_REQUIRED"
+              >key field is required</span
+            >
+          </div>
+          <div ng-message="md-maxlength">
+            <span
+              translate="SMS.ERRORS.KEY_MAX_LENGTH"
+              translate-values="{max: 5}"
+              >key must have a maximum length equal to 5</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="SMS.MOTIONPROXY">MotionProxy</label>
+        <input
+          type="url"
+          name="remote"
+          ng-model="vm.smsAccount.remote"
+          md-maxlength="255"
+          ng-required="true"
+        />
+
+        <div class="hint"><span translate="SMS.HELP.MOTIONPROXY"></span></div>
+        <div
+          ng-messages="smsAccountForm['remote'].$error"
+          ng-show="smsAccountForm['remote'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.MOTIONPROXY_REQUIRED"
+              >MotionProxy field is required</span
+            >
+          </div>
+          <div ng-message="url">
+            <span translate="SMS.ERRORS.MOTIONPROXY_MUST_VALID_URL"
+              >MotionProxy must be a valid url http://www.xcally.com</span
+            >
+          </div>
+          <div ng-message="md-maxlength">
+            <span
+              translate="SMS.ERRORS.MOTIONPROXY_MAX_LENGTH"
+              translate-values="{max: 255}"
+              >MotionProxy must have a maximum length equal to 255</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="SMS.LIST">List</label>
+        <md-select name="ListId" ng-model="vm.smsAccount.ListId" required>
+          <md-option
+            ng-value="ListId.id"
+            ng-repeat="ListId in vm.lists"
+            ng-disabled="ListId.canSelect === false"
+            >{{ ListId.name }}</md-option
+          >
+        </md-select>
+        <div class="hint"><span translate="SMS.HELP.LIST"></span></div>
+        <div
+          ng-messages="smsAccountForm['ListId'].$error"
+          ng-show="smsAccountForm['ListId'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.LIST_REQUIRED"
+              >List field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="SMS.TYPE">Type</label>
+        <md-select name="type" ng-model="vm.smsAccount.type" required>
+          <md-option ng-value="'twilio'">Twilio</md-option>
+          <md-option ng-value="'skebby'">Skebby</md-option>
+          <md-option ng-value="'connectel'">Connectel</md-option>
+          <md-option ng-value="'clicksend'">ClickSend</md-option>
+          <md-option ng-value="'plivo'">Plivo</md-option>
+          <md-option ng-value="'infobip'">Infobip</md-option>
+          <md-option ng-value="'clickatell'">Clickatell</md-option>
+          <md-option ng-value="'csc'">CSCTelecom</md-option>
+          <md-option ng-value="'intelepeer'">Intelepeer</md-option>
+        </md-select>
+        <div
+          ng-messages="smsAccountForm['type'].$error"
+          ng-show="smsAccountForm['type'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.TYPE_REQUIRED"
+              >Type field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="SMS.PHONE">Phone</label>
+        <input
+          type="text"
+          name="phone"
+          ng-model="vm.smsAccount.phone"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="smsAccountForm['phone'].$error"
+          ng-show="smsAccountForm['phone'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.PHONE_REQUIRED"
+              >Phone field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.smsAccount.type == 'twilio'"
+        class="md-block"
+      >
+        <label translate="SMS.ACCOUNTSID">AccountSID</label>
+        <input
+          type="text"
+          name="accountSid"
+          ng-model="vm.smsAccount.accountSid"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="smsAccountForm['accountSid'].$error"
+          ng-show="smsAccountForm['accountSid'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.ACCOUNTSID_REQUIRED"
+              >AccountSID field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.smsAccount.type == 'plivo'"
+        class="md-block"
+      >
+        <label translate="SMS.AUTHID">AuthID</label>
+        <input
+          type="text"
+          name="authId"
+          ng-model="vm.smsAccount.authId"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="smsAccountForm['authId'].$error"
+          ng-show="smsAccountForm['authId'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.AUTHID_REQUIRED"
+              >AuthID field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.smsAccount.type == 'twilio' || vm.smsAccount.type == 'connectel' || vm.smsAccount.type == 'plivo'"
+        class="md-block"
+      >
+        <label translate="SMS.AUTHTOKEN">AuthToken</label>
+        <input
+          type="text"
+          name="authToken"
+          ng-model="vm.smsAccount.authToken"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="smsAccountForm['authToken'].$error"
+          ng-show="smsAccountForm['authToken'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.AUTHTOKEN_REQUIRED"
+              >AuthToken field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.smsAccount.type == 'skebby'"
+        class="md-block"
+      >
+        <label translate="SMS.METHOD">Method</label>
+        <md-select name="smsMethod" ng-model="vm.smsAccount.smsMethod" required>
+          <md-option ng-value="'SI'">Basic</md-option>
+          <md-option ng-value="'TI'">Classic</md-option>
+          <md-option ng-value="'GP'">Classic+</md-option>
+        </md-select>
+        <div
+          ng-messages="smsAccountForm['smsMethod'].$error"
+          ng-show="smsAccountForm['smsMethod'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.METHOD_REQUIRED"
+              >Method field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.smsAccount.type == 'skebby' || vm.smsAccount.type == 'clicksend' || vm.smsAccount.type == 'csc' || vm.smsAccount.type == 'infobip'"
+        class="md-block"
+      >
+        <label translate="SMS.USERNAME">Username</label>
+        <input
+          type="text"
+          name="username"
+          ng-model="vm.smsAccount.username"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="smsAccountForm['username'].$error"
+          ng-show="smsAccountForm['username'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.USERNAME_REQUIRED"
+              >Username field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        class="md-block"
+        ng-if="vm.smsAccount.type == 'skebby' || vm.smsAccount.type == 'clicksend' || vm.smsAccount.type == 'infobip'"
+      >
+        <label translate="SMS.PASSWORD">Password</label>
+        <input
+          type="password"
+          name="password"
+          ng-model="vm.smsAccount.password"
+          placeholder="Password"
+          translate
+          translate-attr-placeholder="SMS.PASSWORD"
+          required
+        />
+        <div ng-messages="smsAccountForm['password'].$error" role="alert">
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.PASSWORD_REQUIRED"
+              >Password field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span translate="SMS.ERRORS.SECURE_PASSWORD_PATTERN"
+              >Must contain at least 8 characters, with a minimum of 1 lowercase
+              letter, 1 uppercase letter, 1 numeric character and 1 special
+              character ~!?*@#$%^&-_=+[{]}.</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <md-input-container
+        ng-if="vm.smsAccount.type == 'infobip' || vm.smsAccount.type == 'csc'"
+        class="md-block"
+      >
+        <label translate="SMS.BASEURL">BaseURL</label>
+        <input
+          type="text"
+          name="baseUrl"
+          ng-model="vm.smsAccount.baseUrl"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="smsAccountForm['baseUrl'].$error"
+          ng-show="smsAccountForm['baseUrl'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.BASEURL_REQUIRED"
+              >BaseURL field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.smsAccount.type == 'csc' || vm.smsAccount.type == 'clickatell' || vm.smsAccount.type == 'intelepeer'"
+        class="md-block"
+      >
+        <label translate="SMS.APIKEY">ApiKey</label>
+        <input
+          type="text"
+          name="apiKey"
+          ng-model="vm.smsAccount.apiKey"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="smsAccountForm['apiKey'].$error"
+          ng-show="smsAccountForm['apiKey'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.APIKEY_REQUIRED"
+              >ApiKey field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="SMS.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.smsAccount.description"
+        />
+
+        <div
+          ng-messages="smsAccountForm['description'].$error"
+          ng-show="smsAccountForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newSmsAccount"
+          ng-click="vm.saveSmsAccount()"
+          class="send-button md-accent md-raised"
+          ng-disabled="smsAccountForm.$invalid || smsAccountForm.$pristine"
+          aria-label="SAVE"
+          translate="SMS.SAVE"
+          translate-attr-aria-label="SMS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newSmsAccount"
+          ng-click="vm.addNewSmsAccount()"
+          class="send-button md-accent md-raised"
+          ng-disabled="smsAccountForm.$invalid"
+          aria-label="ADD"
+          translate="SMS.ADD_SMSACCOUNT"
+          translate-attr-aria-label="SMS.ADD_SMSACCOUNT"
+        >
+          ADD SMSACCOUNT
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newSmsAccount"
+          ng-click="vm.deleteSmsAccount($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="SMS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="SMS.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/agentadd/agentadd.html/agentadd-[chunkhash].html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
deleted file mode 100644
index 86f3a56..0000000
--- a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
+++ /dev/null
@@ -1,44 +0,0 @@
-<md-dialog
-  class="smsAccount-dialog"
-  aria-label="smsAccount"
-  ng-init="vm.onInit()"
->
-  <form name="smsAccountForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="SMS.AGENTADD_SMSACCOUNT">Add Agent to smsAccount</h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <ms-dual-multiselect
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveAgents()"
-        class="send-button md-accent md-raised"
-        ng-disabled="!vm.pendingChanges"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/agentadd/agentadd.html/agentadd.html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/agentadd/agentadd.html/agentadd.html
new file mode 100644
index 0000000..86f3a56
--- /dev/null
+++ b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/agentadd/agentadd.html/agentadd.html
@@ -0,0 +1,44 @@
+<md-dialog
+  class="smsAccount-dialog"
+  aria-label="smsAccount"
+  ng-init="vm.onInit()"
+>
+  <form name="smsAccountForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="SMS.AGENTADD_SMSACCOUNT">Add Agent to smsAccount</h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <ms-dual-multiselect
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveAgents()"
+        class="send-button md-accent md-raised"
+        ng-disabled="!vm.pendingChanges"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/agent/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/agent/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index cd91f55..0000000
--- a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/agent/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,148 +0,0 @@
-<md-dialog class="smsAccount-dialog" aria-label="New SmsAccount">
-  <form name="smsAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="SMS.AGENT">Agent</label>
-        <md-select
-          name="agent"
-          ng-model="vm.agent.agent"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="agent.name"
-            ng-repeat="agent in vm.agents"
-            ng-disabled="agent.canSelect === false"
-            >{{ agent.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="smsAccountFormApp['agent'].$error"
-          ng-show="smsAccountFormApp['agent'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.AGENT_REQUIRED"
-              >Agent field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="SMS.TIMEOUT">Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.agent.timeout"
-          min="0"
-          max="2147483"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="smsAccountFormApp['timeout'].$error"
-          ng-show="smsAccountFormApp['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.TIMEOUT_REQUIRED"
-              >Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="SMS.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-          <div ng-message="max">
-            <span translate="SMS.ERRORS.TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>2147483</span>
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveSmsAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="smsAccountFormApp.$invalid || smsAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="SMS.SAVE"
-          translate-attr-aria-label="SMS.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/agent/dialog.html/dialog.html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/agent/dialog.html/dialog.html
new file mode 100644
index 0000000..cd91f55
--- /dev/null
+++ b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/agent/dialog.html/dialog.html
@@ -0,0 +1,148 @@
+<md-dialog class="smsAccount-dialog" aria-label="New SmsAccount">
+  <form name="smsAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="SMS.AGENT">Agent</label>
+        <md-select
+          name="agent"
+          ng-model="vm.agent.agent"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="agent.name"
+            ng-repeat="agent in vm.agents"
+            ng-disabled="agent.canSelect === false"
+            >{{ agent.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="smsAccountFormApp['agent'].$error"
+          ng-show="smsAccountFormApp['agent'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.AGENT_REQUIRED"
+              >Agent field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="SMS.TIMEOUT">Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.agent.timeout"
+          min="0"
+          max="2147483"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="smsAccountFormApp['timeout'].$error"
+          ng-show="smsAccountFormApp['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.TIMEOUT_REQUIRED"
+              >Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="SMS.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+          <div ng-message="max">
+            <span translate="SMS.ERRORS.TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>2147483</span>
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveSmsAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="smsAccountFormApp.$invalid || smsAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="SMS.SAVE"
+          translate-attr-aria-label="SMS.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/amazonlex/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/amazonlex/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 77343e5..0000000
--- a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/amazonlex/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,208 +0,0 @@
-<md-dialog class="smsAccount-dialog" aria-label="New SmsAccount">
-  <form name="smsAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="SMS.ACCESSKEYID">accesskeyid</label>
-        <input
-          type="text"
-          name="accesskeyid"
-          ng-model="vm.amazonlex.accesskeyid"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="smsAccountFormApp['accesskeyid'].$error"
-          ng-show="smsAccountFormApp['accesskeyid'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.ACCESSKEYID_REQUIRED"
-              >accesskeyid field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="SMS.SECRETACCESSKEY">secretaccesskey</label>
-        <input
-          type="text"
-          name="secretaccesskey"
-          ng-model="vm.amazonlex.secretaccesskey"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="smsAccountFormApp['secretaccesskey'].$error"
-          ng-show="smsAccountFormApp['secretaccesskey'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.SECRETACCESSKEY_REQUIRED"
-              >secretaccesskey field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="SMS.LEXREGION">lexregion</label>
-        <md-select
-          name="lexregion"
-          ng-model="vm.amazonlex.lexregion"
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="'us-east-1'">US East (N. Virginia)</md-option>
-          <md-option ng-value="'us-west-2'">US West (Oregon)</md-option>
-          <md-option ng-value="'eu-west-1'">EU (Ireland)</md-option>
-          <md-option ng-value="'ap-southeast-2'"
-            >Asia Pacific (Sydney)</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="smsAccountFormApp['lexregion'].$error"
-          ng-show="smsAccountFormApp['lexregion'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.LEXREGION_REQUIRED"
-              >lexregion field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="SMS.BOTNAME">botname</label>
-        <input
-          type="text"
-          name="botname"
-          ng-model="vm.amazonlex.botname"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="smsAccountFormApp['botname'].$error"
-          ng-show="smsAccountFormApp['botname'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.BOTNAME_REQUIRED"
-              >botname field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="SMS.WELCOMEMESSAGE">welcomemessage</label>
-        <textarea
-          name="welcomemessage"
-          ng-model="vm.amazonlex.welcomemessage"
-          md-maxlength="255"
-        ></textarea>
-        <div class="hint">
-          <span translate="SMS.HELP.WELCOMEMESSAGE"></span>
-        </div>
-
-        <div
-          ng-messages="smsAccountFormApp['welcomemessage'].$error"
-          ng-show="smsAccountFormApp['welcomemessage'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.WELCOMEMESSAGE_REQUIRED"
-              >welcomemessage field is required</span
-            >
-          </div>
-
-          <div ng-message="md-maxlength">
-            <span
-              translate="SMS.ERRORS.WELCOMEMESSAGE_MAX_LENGTH"
-              translate-values="{max: 255}"
-              >welcomemessage must have a maximum length equal to 255</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveSmsAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="smsAccountFormApp.$invalid || smsAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="SMS.SAVE"
-          translate-attr-aria-label="SMS.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/amazonlex/dialog.html/dialog.html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/amazonlex/dialog.html/dialog.html
new file mode 100644
index 0000000..77343e5
--- /dev/null
+++ b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/amazonlex/dialog.html/dialog.html
@@ -0,0 +1,208 @@
+<md-dialog class="smsAccount-dialog" aria-label="New SmsAccount">
+  <form name="smsAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="SMS.ACCESSKEYID">accesskeyid</label>
+        <input
+          type="text"
+          name="accesskeyid"
+          ng-model="vm.amazonlex.accesskeyid"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="smsAccountFormApp['accesskeyid'].$error"
+          ng-show="smsAccountFormApp['accesskeyid'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.ACCESSKEYID_REQUIRED"
+              >accesskeyid field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="SMS.SECRETACCESSKEY">secretaccesskey</label>
+        <input
+          type="text"
+          name="secretaccesskey"
+          ng-model="vm.amazonlex.secretaccesskey"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="smsAccountFormApp['secretaccesskey'].$error"
+          ng-show="smsAccountFormApp['secretaccesskey'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.SECRETACCESSKEY_REQUIRED"
+              >secretaccesskey field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="SMS.LEXREGION">lexregion</label>
+        <md-select
+          name="lexregion"
+          ng-model="vm.amazonlex.lexregion"
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="'us-east-1'">US East (N. Virginia)</md-option>
+          <md-option ng-value="'us-west-2'">US West (Oregon)</md-option>
+          <md-option ng-value="'eu-west-1'">EU (Ireland)</md-option>
+          <md-option ng-value="'ap-southeast-2'"
+            >Asia Pacific (Sydney)</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="smsAccountFormApp['lexregion'].$error"
+          ng-show="smsAccountFormApp['lexregion'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.LEXREGION_REQUIRED"
+              >lexregion field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="SMS.BOTNAME">botname</label>
+        <input
+          type="text"
+          name="botname"
+          ng-model="vm.amazonlex.botname"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="smsAccountFormApp['botname'].$error"
+          ng-show="smsAccountFormApp['botname'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.BOTNAME_REQUIRED"
+              >botname field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="SMS.WELCOMEMESSAGE">welcomemessage</label>
+        <textarea
+          name="welcomemessage"
+          ng-model="vm.amazonlex.welcomemessage"
+          md-maxlength="255"
+        ></textarea>
+        <div class="hint">
+          <span translate="SMS.HELP.WELCOMEMESSAGE"></span>
+        </div>
+
+        <div
+          ng-messages="smsAccountFormApp['welcomemessage'].$error"
+          ng-show="smsAccountFormApp['welcomemessage'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.WELCOMEMESSAGE_REQUIRED"
+              >welcomemessage field is required</span
+            >
+          </div>
+
+          <div ng-message="md-maxlength">
+            <span
+              translate="SMS.ERRORS.WELCOMEMESSAGE_MAX_LENGTH"
+              translate-values="{max: 255}"
+              >welcomemessage must have a maximum length equal to 255</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveSmsAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="smsAccountFormApp.$invalid || smsAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="SMS.SAVE"
+          translate-attr-aria-label="SMS.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/autoreply/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/autoreply/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 265c570..0000000
--- a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/autoreply/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,123 +0,0 @@
-<md-dialog class="smsAccount-dialog" aria-label="New SmsAccount">
-  <form name="smsAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="SMS.TIMES">times</label>
-        <md-select
-          name="times"
-          ng-model="vm.autoreply.times"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="1">One Time</md-option>
-          <md-option ng-value="0">Always</md-option>
-        </md-select>
-        <div
-          ng-messages="smsAccountFormApp['times'].$error"
-          ng-show="smsAccountFormApp['times'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.TIMES_REQUIRED"
-              >times field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="SMS.TEXT">Text</label>
-        <textarea name="text" ng-model="vm.autoreply.text" required></textarea>
-
-        <div
-          ng-messages="smsAccountFormApp['text'].$error"
-          ng-show="smsAccountFormApp['text'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.TEXT_REQUIRED"
-              >Text field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveSmsAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="smsAccountFormApp.$invalid || smsAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="SMS.SAVE"
-          translate-attr-aria-label="SMS.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/autoreply/dialog.html/dialog.html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/autoreply/dialog.html/dialog.html
new file mode 100644
index 0000000..265c570
--- /dev/null
+++ b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/autoreply/dialog.html/dialog.html
@@ -0,0 +1,123 @@
+<md-dialog class="smsAccount-dialog" aria-label="New SmsAccount">
+  <form name="smsAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="SMS.TIMES">times</label>
+        <md-select
+          name="times"
+          ng-model="vm.autoreply.times"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="1">One Time</md-option>
+          <md-option ng-value="0">Always</md-option>
+        </md-select>
+        <div
+          ng-messages="smsAccountFormApp['times'].$error"
+          ng-show="smsAccountFormApp['times'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.TIMES_REQUIRED"
+              >times field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="SMS.TEXT">Text</label>
+        <textarea name="text" ng-model="vm.autoreply.text" required></textarea>
+
+        <div
+          ng-messages="smsAccountFormApp['text'].$error"
+          ng-show="smsAccountFormApp['text'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.TEXT_REQUIRED"
+              >Text field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveSmsAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="smsAccountFormApp.$invalid || smsAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="SMS.SAVE"
+          translate-attr-aria-label="SMS.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/close/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/close/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 1d5ac2b..0000000
--- a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/close/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,106 +0,0 @@
-<md-dialog class="smsAccount-dialog" aria-label="New SmsAccount">
-  <form name="smsAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="SMS.DISPOSITION">Disposition</label>
-        <input
-          type="text"
-          name="disposition"
-          ng-model="vm.close.disposition"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="smsAccountFormApp['disposition'].$error"
-          ng-show="smsAccountFormApp['disposition'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.DISPOSITION_REQUIRED"
-              >Disposition field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveSmsAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="smsAccountFormApp.$invalid || smsAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="SMS.SAVE"
-          translate-attr-aria-label="SMS.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/close/dialog.html/dialog.html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/close/dialog.html/dialog.html
new file mode 100644
index 0000000..1d5ac2b
--- /dev/null
+++ b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/close/dialog.html/dialog.html
@@ -0,0 +1,106 @@
+<md-dialog class="smsAccount-dialog" aria-label="New SmsAccount">
+  <form name="smsAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="SMS.DISPOSITION">Disposition</label>
+        <input
+          type="text"
+          name="disposition"
+          ng-model="vm.close.disposition"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="smsAccountFormApp['disposition'].$error"
+          ng-show="smsAccountFormApp['disposition'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.DISPOSITION_REQUIRED"
+              >Disposition field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveSmsAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="smsAccountFormApp.$invalid || smsAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="SMS.SAVE"
+          translate-attr-aria-label="SMS.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/dialogflow/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/dialogflow/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 1606d0a..0000000
--- a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/dialogflow/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,178 +0,0 @@
-<md-dialog class="smsAccount-dialog" aria-label="New SmsAccount">
-  <form name="smsAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="SMS.KEY">Key</label>
-        <input
-          type="text"
-          name="key"
-          ng-model="vm.dialogflow.key"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="smsAccountFormApp['key'].$error"
-          ng-show="smsAccountFormApp['key'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.KEY_REQUIRED"
-              >Key field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="SMS.LANGUAGE">language</label>
-        <md-select
-          name="language"
-          ng-model="vm.dialogflow.language"
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="'da'">Danish</md-option>
-          <md-option ng-value="'en'">English</md-option>
-          <md-option ng-value="'de'">German</md-option>
-          <md-option ng-value="'it'">Italian</md-option>
-          <md-option ng-value="'es'">Spanish</md-option>
-          <md-option ng-value="'fr'">French</md-option>
-          <md-option ng-value="'id'">Indonesian</md-option>
-          <md-option ng-value="'ja'">Japanese</md-option>
-          <md-option ng-value="'ko'">Korean (South Korea)</md-option>
-          <md-option ng-value="'nl'">Dutch</md-option>
-          <md-option ng-value="'no'">Norwegian</md-option>
-          <md-option ng-value="'pt'">Portuguese (European)</md-option>
-          <md-option ng-value="'pt-br'">Portuguese (Nrazilian)</md-option>
-          <md-option ng-value="'ru'">Russian</md-option>
-          <md-option ng-value="'sv'">Swedish</md-option>
-          <md-option ng-value="'th'">Thai</md-option>
-          <md-option ng-value="'uk'">Ukrainian</md-option>
-          <md-option ng-value="'zh-CN'">Chinese (Simplified)</md-option>
-          <md-option ng-value="'zh-HK'">Chinese (Hong Kong)</md-option>
-          <md-option ng-value="'zh-TW'">Chinese (Traditional)</md-option>
-        </md-select>
-        <div
-          ng-messages="smsAccountFormApp['language'].$error"
-          ng-show="smsAccountFormApp['language'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.LANGUAGE_REQUIRED"
-              >language field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="SMS.WELCOMEMESSAGE">welcomemessage</label>
-        <textarea
-          name="welcomemessage"
-          ng-model="vm.dialogflow.welcomemessage"
-          md-maxlength="255"
-        ></textarea>
-        <div class="hint">
-          <span translate="SMS.HELP.WELCOMEMESSAGE"></span>
-        </div>
-
-        <div
-          ng-messages="smsAccountFormApp['welcomemessage'].$error"
-          ng-show="smsAccountFormApp['welcomemessage'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.WELCOMEMESSAGE_REQUIRED"
-              >welcomemessage field is required</span
-            >
-          </div>
-
-          <div ng-message="md-maxlength">
-            <span
-              translate="SMS.ERRORS.WELCOMEMESSAGE_MAX_LENGTH"
-              translate-values="{max: 255}"
-              >welcomemessage must have a maximum length equal to 255</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveSmsAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="smsAccountFormApp.$invalid || smsAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="SMS.SAVE"
-          translate-attr-aria-label="SMS.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/dialogflow/dialog.html/dialog.html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/dialogflow/dialog.html/dialog.html
new file mode 100644
index 0000000..1606d0a
--- /dev/null
+++ b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/dialogflow/dialog.html/dialog.html
@@ -0,0 +1,178 @@
+<md-dialog class="smsAccount-dialog" aria-label="New SmsAccount">
+  <form name="smsAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="SMS.KEY">Key</label>
+        <input
+          type="text"
+          name="key"
+          ng-model="vm.dialogflow.key"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="smsAccountFormApp['key'].$error"
+          ng-show="smsAccountFormApp['key'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.KEY_REQUIRED"
+              >Key field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="SMS.LANGUAGE">language</label>
+        <md-select
+          name="language"
+          ng-model="vm.dialogflow.language"
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="'da'">Danish</md-option>
+          <md-option ng-value="'en'">English</md-option>
+          <md-option ng-value="'de'">German</md-option>
+          <md-option ng-value="'it'">Italian</md-option>
+          <md-option ng-value="'es'">Spanish</md-option>
+          <md-option ng-value="'fr'">French</md-option>
+          <md-option ng-value="'id'">Indonesian</md-option>
+          <md-option ng-value="'ja'">Japanese</md-option>
+          <md-option ng-value="'ko'">Korean (South Korea)</md-option>
+          <md-option ng-value="'nl'">Dutch</md-option>
+          <md-option ng-value="'no'">Norwegian</md-option>
+          <md-option ng-value="'pt'">Portuguese (European)</md-option>
+          <md-option ng-value="'pt-br'">Portuguese (Nrazilian)</md-option>
+          <md-option ng-value="'ru'">Russian</md-option>
+          <md-option ng-value="'sv'">Swedish</md-option>
+          <md-option ng-value="'th'">Thai</md-option>
+          <md-option ng-value="'uk'">Ukrainian</md-option>
+          <md-option ng-value="'zh-CN'">Chinese (Simplified)</md-option>
+          <md-option ng-value="'zh-HK'">Chinese (Hong Kong)</md-option>
+          <md-option ng-value="'zh-TW'">Chinese (Traditional)</md-option>
+        </md-select>
+        <div
+          ng-messages="smsAccountFormApp['language'].$error"
+          ng-show="smsAccountFormApp['language'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.LANGUAGE_REQUIRED"
+              >language field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="SMS.WELCOMEMESSAGE">welcomemessage</label>
+        <textarea
+          name="welcomemessage"
+          ng-model="vm.dialogflow.welcomemessage"
+          md-maxlength="255"
+        ></textarea>
+        <div class="hint">
+          <span translate="SMS.HELP.WELCOMEMESSAGE"></span>
+        </div>
+
+        <div
+          ng-messages="smsAccountFormApp['welcomemessage'].$error"
+          ng-show="smsAccountFormApp['welcomemessage'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.WELCOMEMESSAGE_REQUIRED"
+              >welcomemessage field is required</span
+            >
+          </div>
+
+          <div ng-message="md-maxlength">
+            <span
+              translate="SMS.ERRORS.WELCOMEMESSAGE_MAX_LENGTH"
+              translate-values="{max: 255}"
+              >welcomemessage must have a maximum length equal to 255</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveSmsAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="smsAccountFormApp.$invalid || smsAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="SMS.SAVE"
+          translate-attr-aria-label="SMS.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/gotoif/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/gotoif/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 452c4bc..0000000
--- a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/gotoif/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,166 +0,0 @@
-<md-dialog class="smsAccount-dialog" aria-label="New SmsAccount">
-  <form name="smsAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="SMS.CONDITION">Condition</label>
-        <input
-          type="text"
-          name="condition"
-          ng-model="vm.gotoif.condition"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="smsAccountFormApp['condition'].$error"
-          ng-show="smsAccountFormApp['condition'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.CONDITION_REQUIRED"
-              >Condition field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="SMS.TRUEPRIORITY">truepriority</label>
-        <input
-          type="number"
-          name="truepriority"
-          ng-model="vm.gotoif.truepriority"
-          min="1"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="smsAccountFormApp['truepriority'].$error"
-          ng-show="smsAccountFormApp['truepriority'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.TRUEPRIORITY_REQUIRED"
-              >truepriority field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="SMS.ERRORS.TRUEPRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >truepriority must be a valid greater or equal than</span
-            >
-            <span>1</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="SMS.FALSEPRIORITY">falsepriority</label>
-        <input
-          type="number"
-          name="falsepriority"
-          ng-model="vm.gotoif.falsepriority"
-          min="1"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="smsAccountFormApp['falsepriority'].$error"
-          ng-show="smsAccountFormApp['falsepriority'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.FALSEPRIORITY_REQUIRED"
-              >falsepriority field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="SMS.ERRORS.FALSEPRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >falsepriority must be a valid greater or equal than</span
-            >
-            <span>1</span>
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveSmsAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="smsAccountFormApp.$invalid || smsAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="SMS.SAVE"
-          translate-attr-aria-label="SMS.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/gotoif/dialog.html/dialog.html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/gotoif/dialog.html/dialog.html
new file mode 100644
index 0000000..452c4bc
--- /dev/null
+++ b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/gotoif/dialog.html/dialog.html
@@ -0,0 +1,166 @@
+<md-dialog class="smsAccount-dialog" aria-label="New SmsAccount">
+  <form name="smsAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="SMS.CONDITION">Condition</label>
+        <input
+          type="text"
+          name="condition"
+          ng-model="vm.gotoif.condition"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="smsAccountFormApp['condition'].$error"
+          ng-show="smsAccountFormApp['condition'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.CONDITION_REQUIRED"
+              >Condition field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="SMS.TRUEPRIORITY">truepriority</label>
+        <input
+          type="number"
+          name="truepriority"
+          ng-model="vm.gotoif.truepriority"
+          min="1"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="smsAccountFormApp['truepriority'].$error"
+          ng-show="smsAccountFormApp['truepriority'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.TRUEPRIORITY_REQUIRED"
+              >truepriority field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="SMS.ERRORS.TRUEPRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >truepriority must be a valid greater or equal than</span
+            >
+            <span>1</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="SMS.FALSEPRIORITY">falsepriority</label>
+        <input
+          type="number"
+          name="falsepriority"
+          ng-model="vm.gotoif.falsepriority"
+          min="1"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="smsAccountFormApp['falsepriority'].$error"
+          ng-show="smsAccountFormApp['falsepriority'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.FALSEPRIORITY_REQUIRED"
+              >falsepriority field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="SMS.ERRORS.FALSEPRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >falsepriority must be a valid greater or equal than</span
+            >
+            <span>1</span>
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveSmsAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="smsAccountFormApp.$invalid || smsAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="SMS.SAVE"
+          translate-attr-aria-label="SMS.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/gotop/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/gotop/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index eea6c89..0000000
--- a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/gotop/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,114 +0,0 @@
-<md-dialog class="smsAccount-dialog" aria-label="New SmsAccount">
-  <form name="smsAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="SMS.PRIORITY">Priority</label>
-        <input
-          type="number"
-          name="priority"
-          ng-model="vm.gotop.priority"
-          min="0"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="smsAccountFormApp['priority'].$error"
-          ng-show="smsAccountFormApp['priority'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.PRIORITY_REQUIRED"
-              >Priority field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="SMS.ERRORS.PRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Priority must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveSmsAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="smsAccountFormApp.$invalid || smsAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="SMS.SAVE"
-          translate-attr-aria-label="SMS.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/gotop/dialog.html/dialog.html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/gotop/dialog.html/dialog.html
new file mode 100644
index 0000000..eea6c89
--- /dev/null
+++ b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/gotop/dialog.html/dialog.html
@@ -0,0 +1,114 @@
+<md-dialog class="smsAccount-dialog" aria-label="New SmsAccount">
+  <form name="smsAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="SMS.PRIORITY">Priority</label>
+        <input
+          type="number"
+          name="priority"
+          ng-model="vm.gotop.priority"
+          min="0"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="smsAccountFormApp['priority'].$error"
+          ng-show="smsAccountFormApp['priority'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.PRIORITY_REQUIRED"
+              >Priority field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="SMS.ERRORS.PRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Priority must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveSmsAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="smsAccountFormApp.$invalid || smsAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="SMS.SAVE"
+          translate-attr-aria-label="SMS.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/interval/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/interval/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index ca0ed91..0000000
--- a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/interval/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,313 +0,0 @@
-<md-dialog class="inboundroute-dialog" aria-label="New Interval">
-  <form name="intervalForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <md-input-container class="md-block">
-        <label translate="TOOLS.TYPE">Type</label>
-        <md-select
-          ng-model="vm.type"
-          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="type" ng-repeat="type in vm.types"
-            >{{ type | ucfirst }}</md-option
-          >
-        </md-select>
-      </md-input-container>
-
-      <md-input-container class="md-block" ng-if="vm.type === 'list'">
-        <label translate="TOOLS.INTERVALS">Intervals</label>
-        <md-select
-          ng-model="vm.interval.IntervalId"
-          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="interval.id" ng-repeat="interval in vm.intervals"
-            >{{ interval.name }}</md-option
-          >
-        </md-select>
-      </md-input-container>
-
-      <!-- TIMERANGE START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.TIME_RANGE"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <div class="md-block" flex>
-          <mdp-time-picker
-            name="timeRangeFrom"
-            mdp-placeholder="FROM"
-            ng-model="vm.timeRangeFrom"
-            mdp-format="HH:mm"
-            mdp-auto-switch="true"
-            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <div
-              ng-messages="intervalForm.timeRangeFrom.$error"
-              ng-show="intervalForm.timeRangeFrom.$touched"
-              role="alert"
-            >
-              <div ng-message="format">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_FROM_INVALID"
-                  >Time Range From field is invalid</span
-                >
-              </div>
-            </div>
-          </mdp-time-picker>
-        </div>
-        <div class="md-block" flex ng-if="vm.timeRangeFrom">
-          <mdp-time-picker
-            name="timeRangeTo"
-            mdp-placeholder="TO*"
-            ng-model="vm.timeRangeTo"
-            mdp-format="HH:mm"
-            mdp-auto-switch="true"
-            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-            required
-          >
-            <div
-              ng-messages="intervalForm.timeRangeTo.$error"
-              ng-show="intervalForm.timeRangeTo.$invalid"
-              role="alert"
-            >
-              <div ng-message="format">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_INVALID"
-                  >Time Range To field is invalid</span
-                >
-              </div>
-              <div ng-message="required">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_REQUIRED"
-                  >Time Range To field is required</span
-                >
-              </div>
-            </div>
-          </mdp-time-picker>
-        </div>
-      </div>
-      <!-- TIMERANGE END -->
-
-      <!-- DAYSOFWEEK START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.WEEK_DAYS"
-        >Week Days</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.dayOfWeekFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
-              ><span translate="TOOLS.{{day.value | uppercase}}"
-                >{{ day.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container flex class="md-block" ng-if="vm.dayOfWeekFrom">
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="dayOfWeekTo"
-            ng-model="vm.dayOfWeekTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
-              ><span translate="TOOLS.{{day.value | uppercase}}"
-                >{{ day.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.dayOfWeekTo.$error"
-            ng-show="intervalForm.dayOfWeekTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- DAYSOFWEEK END -->
-
-      <!-- MONTHDAY START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTH_DAYS"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex layout="column" class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.monthDayFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
-              >{{ month }}</md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container
-          flex
-          layout="column"
-          class="md-block"
-          ng-if="vm.monthDayFrom"
-        >
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="monthDayTo"
-            ng-model="vm.monthDayTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
-              >{{ month }}</md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.monthDayTo.$error"
-            ng-show="intervalForm.monthDayTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- MONTHDAY END -->
-
-      <!-- MONTH START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTHS"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex layout="column" class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.monthFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
-              ><span translate="TOOLS.{{month.value | uppercase}}"
-                >{{ month.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container
-          flex
-          layout="column"
-          class="md-block"
-          ng-if="vm.monthFrom"
-        >
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="monthTo"
-            ng-model="vm.monthTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
-              ><span translate="TOOLS.{{month.value | uppercase}}"
-                >{{ month.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.monthTo.$error"
-            ng-show="intervalForm.monthTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- MONTH END -->
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="!vm.newInterval && vm.crudPermissions.canEdit"
-          ng-click="vm.saveInterval()"
-          class="send-button md-accent md-raised"
-          ng-disabled="intervalForm.$invalid || intervalForm.$pristine"
-          aria-label="SAVE"
-          translate="TOOLS.SAVE"
-          translate-attr-aria-label="TOOLS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.newInterval && vm.crudPermissions.canEdit"
-          ng-click="vm.addNewInterval()"
-          class="send-button md-accent md-raised"
-          ng-disabled="intervalForm.$invalid"
-          aria-label="ADD"
-          translate="TOOLS.ADD_INTERVAL"
-          translate-attr-aria-label="TOOLS.ADD_INTERVAL"
-        >
-          ADD INTERVAL
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/interval/dialog.html/dialog.html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/interval/dialog.html/dialog.html
new file mode 100644
index 0000000..ca0ed91
--- /dev/null
+++ b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/interval/dialog.html/dialog.html
@@ -0,0 +1,313 @@
+<md-dialog class="inboundroute-dialog" aria-label="New Interval">
+  <form name="intervalForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <md-input-container class="md-block">
+        <label translate="TOOLS.TYPE">Type</label>
+        <md-select
+          ng-model="vm.type"
+          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="type" ng-repeat="type in vm.types"
+            >{{ type | ucfirst }}</md-option
+          >
+        </md-select>
+      </md-input-container>
+
+      <md-input-container class="md-block" ng-if="vm.type === 'list'">
+        <label translate="TOOLS.INTERVALS">Intervals</label>
+        <md-select
+          ng-model="vm.interval.IntervalId"
+          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="interval.id" ng-repeat="interval in vm.intervals"
+            >{{ interval.name }}</md-option
+          >
+        </md-select>
+      </md-input-container>
+
+      <!-- TIMERANGE START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.TIME_RANGE"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <div class="md-block" flex>
+          <mdp-time-picker
+            name="timeRangeFrom"
+            mdp-placeholder="FROM"
+            ng-model="vm.timeRangeFrom"
+            mdp-format="HH:mm"
+            mdp-auto-switch="true"
+            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <div
+              ng-messages="intervalForm.timeRangeFrom.$error"
+              ng-show="intervalForm.timeRangeFrom.$touched"
+              role="alert"
+            >
+              <div ng-message="format">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_FROM_INVALID"
+                  >Time Range From field is invalid</span
+                >
+              </div>
+            </div>
+          </mdp-time-picker>
+        </div>
+        <div class="md-block" flex ng-if="vm.timeRangeFrom">
+          <mdp-time-picker
+            name="timeRangeTo"
+            mdp-placeholder="TO*"
+            ng-model="vm.timeRangeTo"
+            mdp-format="HH:mm"
+            mdp-auto-switch="true"
+            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+            required
+          >
+            <div
+              ng-messages="intervalForm.timeRangeTo.$error"
+              ng-show="intervalForm.timeRangeTo.$invalid"
+              role="alert"
+            >
+              <div ng-message="format">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_INVALID"
+                  >Time Range To field is invalid</span
+                >
+              </div>
+              <div ng-message="required">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_REQUIRED"
+                  >Time Range To field is required</span
+                >
+              </div>
+            </div>
+          </mdp-time-picker>
+        </div>
+      </div>
+      <!-- TIMERANGE END -->
+
+      <!-- DAYSOFWEEK START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.WEEK_DAYS"
+        >Week Days</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.dayOfWeekFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
+              ><span translate="TOOLS.{{day.value | uppercase}}"
+                >{{ day.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container flex class="md-block" ng-if="vm.dayOfWeekFrom">
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="dayOfWeekTo"
+            ng-model="vm.dayOfWeekTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
+              ><span translate="TOOLS.{{day.value | uppercase}}"
+                >{{ day.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.dayOfWeekTo.$error"
+            ng-show="intervalForm.dayOfWeekTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- DAYSOFWEEK END -->
+
+      <!-- MONTHDAY START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTH_DAYS"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex layout="column" class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.monthDayFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
+              >{{ month }}</md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container
+          flex
+          layout="column"
+          class="md-block"
+          ng-if="vm.monthDayFrom"
+        >
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="monthDayTo"
+            ng-model="vm.monthDayTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
+              >{{ month }}</md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.monthDayTo.$error"
+            ng-show="intervalForm.monthDayTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- MONTHDAY END -->
+
+      <!-- MONTH START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTHS"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex layout="column" class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.monthFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
+              ><span translate="TOOLS.{{month.value | uppercase}}"
+                >{{ month.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container
+          flex
+          layout="column"
+          class="md-block"
+          ng-if="vm.monthFrom"
+        >
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="monthTo"
+            ng-model="vm.monthTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
+              ><span translate="TOOLS.{{month.value | uppercase}}"
+                >{{ month.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.monthTo.$error"
+            ng-show="intervalForm.monthTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- MONTH END -->
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="!vm.newInterval && vm.crudPermissions.canEdit"
+          ng-click="vm.saveInterval()"
+          class="send-button md-accent md-raised"
+          ng-disabled="intervalForm.$invalid || intervalForm.$pristine"
+          aria-label="SAVE"
+          translate="TOOLS.SAVE"
+          translate-attr-aria-label="TOOLS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.newInterval && vm.crudPermissions.canEdit"
+          ng-click="vm.addNewInterval()"
+          class="send-button md-accent md-raised"
+          ng-disabled="intervalForm.$invalid"
+          aria-label="ADD"
+          translate="TOOLS.ADD_INTERVAL"
+          translate-attr-aria-label="TOOLS.ADD_INTERVAL"
+        >
+          ADD INTERVAL
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/noop/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/noop/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 70eaae0..0000000
--- a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/noop/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,105 +0,0 @@
-<md-dialog class="smsAccount-dialog" aria-label="New SmsAccount">
-  <form name="smsAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="SMS.VALUE">Value</label>
-        <input
-          type="text"
-          name="value"
-          ng-model="vm.noop.value"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="smsAccountFormApp['value'].$error"
-          ng-show="smsAccountFormApp['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.VALUE_REQUIRED"
-              >Value field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveSmsAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="smsAccountFormApp.$invalid || smsAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="SMS.SAVE"
-          translate-attr-aria-label="SMS.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/noop/dialog.html/dialog.html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/noop/dialog.html/dialog.html
new file mode 100644
index 0000000..70eaae0
--- /dev/null
+++ b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/noop/dialog.html/dialog.html
@@ -0,0 +1,105 @@
+<md-dialog class="smsAccount-dialog" aria-label="New SmsAccount">
+  <form name="smsAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="SMS.VALUE">Value</label>
+        <input
+          type="text"
+          name="value"
+          ng-model="vm.noop.value"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="smsAccountFormApp['value'].$error"
+          ng-show="smsAccountFormApp['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.VALUE_REQUIRED"
+              >Value field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveSmsAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="smsAccountFormApp.$invalid || smsAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="SMS.SAVE"
+          translate-attr-aria-label="SMS.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/queue/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/queue/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 5bcf333..0000000
--- a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/queue/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,148 +0,0 @@
-<md-dialog class="smsAccount-dialog" aria-label="New SmsAccount">
-  <form name="smsAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="SMS.QUEUE">Queue</label>
-        <md-select
-          name="queue"
-          ng-model="vm.queue.queue"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="queue.name"
-            ng-repeat="queue in vm.queues"
-            ng-disabled="queue.canSelect === false"
-            >{{ queue.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="smsAccountFormApp['queue'].$error"
-          ng-show="smsAccountFormApp['queue'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.QUEUE_REQUIRED"
-              >Queue field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="SMS.TIMEOUT">Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.queue.timeout"
-          min="0"
-          max="2147483"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="smsAccountFormApp['timeout'].$error"
-          ng-show="smsAccountFormApp['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.TIMEOUT_REQUIRED"
-              >Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="SMS.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-          <div ng-message="max">
-            <span translate="SMS.ERRORS.TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>2147483</span>
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveSmsAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="smsAccountFormApp.$invalid || smsAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="SMS.SAVE"
-          translate-attr-aria-label="SMS.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/queue/dialog.html/dialog.html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/queue/dialog.html/dialog.html
new file mode 100644
index 0000000..5bcf333
--- /dev/null
+++ b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/queue/dialog.html/dialog.html
@@ -0,0 +1,148 @@
+<md-dialog class="smsAccount-dialog" aria-label="New SmsAccount">
+  <form name="smsAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="SMS.QUEUE">Queue</label>
+        <md-select
+          name="queue"
+          ng-model="vm.queue.queue"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="queue.name"
+            ng-repeat="queue in vm.queues"
+            ng-disabled="queue.canSelect === false"
+            >{{ queue.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="smsAccountFormApp['queue'].$error"
+          ng-show="smsAccountFormApp['queue'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.QUEUE_REQUIRED"
+              >Queue field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="SMS.TIMEOUT">Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.queue.timeout"
+          min="0"
+          max="2147483"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="smsAccountFormApp['timeout'].$error"
+          ng-show="smsAccountFormApp['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.TIMEOUT_REQUIRED"
+              >Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="SMS.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+          <div ng-message="max">
+            <span translate="SMS.ERRORS.TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>2147483</span>
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveSmsAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="smsAccountFormApp.$invalid || smsAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="SMS.SAVE"
+          translate-attr-aria-label="SMS.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/system/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/system/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 2d19f42..0000000
--- a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/system/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,133 +0,0 @@
-<md-dialog class="smsAccount-dialog" aria-label="New SmsAccount">
-  <form name="smsAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="SMS.COMMAND">Command</label>
-        <input
-          type="text"
-          name="command"
-          ng-model="vm.system.command"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="smsAccountFormApp['command'].$error"
-          ng-show="smsAccountFormApp['command'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.COMMAND_REQUIRED"
-              >Command field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="SMS.VARIABLE">Variable</label>
-        <md-select
-          name="variable"
-          ng-model="vm.system.variable"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="''">None</md-option>
-          <md-option
-            ng-value="variable.name"
-            ng-repeat="variable in vm.variables"
-            ng-disabled="variable.canSelect === false"
-            >{{ variable.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="smsAccountFormApp['variable'].$error"
-          ng-show="smsAccountFormApp['variable'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.VARIABLE_REQUIRED"
-              >Variable field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveSmsAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="smsAccountFormApp.$invalid || smsAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="SMS.SAVE"
-          translate-attr-aria-label="SMS.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/system/dialog.html/dialog.html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/system/dialog.html/dialog.html
new file mode 100644
index 0000000..2d19f42
--- /dev/null
+++ b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/system/dialog.html/dialog.html
@@ -0,0 +1,133 @@
+<md-dialog class="smsAccount-dialog" aria-label="New SmsAccount">
+  <form name="smsAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="SMS.COMMAND">Command</label>
+        <input
+          type="text"
+          name="command"
+          ng-model="vm.system.command"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="smsAccountFormApp['command'].$error"
+          ng-show="smsAccountFormApp['command'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.COMMAND_REQUIRED"
+              >Command field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="SMS.VARIABLE">Variable</label>
+        <md-select
+          name="variable"
+          ng-model="vm.system.variable"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="''">None</md-option>
+          <md-option
+            ng-value="variable.name"
+            ng-repeat="variable in vm.variables"
+            ng-disabled="variable.canSelect === false"
+            >{{ variable.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="smsAccountFormApp['variable'].$error"
+          ng-show="smsAccountFormApp['variable'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.VARIABLE_REQUIRED"
+              >Variable field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveSmsAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="smsAccountFormApp.$invalid || smsAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="SMS.SAVE"
+          translate-attr-aria-label="SMS.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/tag/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/tag/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 159f755..0000000
--- a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/tag/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,111 +0,0 @@
-<md-dialog class="smsAccount-dialog" aria-label="New SmsAccount">
-  <form name="smsAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="SMS.TAG">Tag</label>
-        <md-select
-          name="tag"
-          ng-model="vm.tag.tag"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="tag.name"
-            ng-repeat="tag in vm.tags"
-            ng-disabled="tag.canSelect === false"
-            >{{ tag.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="smsAccountFormApp['tag'].$error"
-          ng-show="smsAccountFormApp['tag'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.TAG_REQUIRED"
-              >Tag field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveSmsAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="smsAccountFormApp.$invalid || smsAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="SMS.SAVE"
-          translate-attr-aria-label="SMS.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/tag/dialog.html/dialog.html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/tag/dialog.html/dialog.html
new file mode 100644
index 0000000..159f755
--- /dev/null
+++ b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/apps/tag/dialog.html/dialog.html
@@ -0,0 +1,111 @@
+<md-dialog class="smsAccount-dialog" aria-label="New SmsAccount">
+  <form name="smsAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="SMS.TAG">Tag</label>
+        <md-select
+          name="tag"
+          ng-model="vm.tag.tag"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="tag.name"
+            ng-repeat="tag in vm.tags"
+            ng-disabled="tag.canSelect === false"
+            >{{ tag.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="smsAccountFormApp['tag'].$error"
+          ng-show="smsAccountFormApp['tag'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.TAG_REQUIRED"
+              >Tag field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveSmsAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="smsAccountFormApp.$invalid || smsAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="SMS.SAVE"
+          translate-attr-aria-label="SMS.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/smsCannedAnswers/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/smsCannedAnswers/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 219c31b..0000000
--- a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/smsCannedAnswers/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,173 +0,0 @@
-<md-dialog class="smsCannedAnswer-dialog" aria-label="New SmsCannedAnswer">
-  <form name="smsCannedAnswerForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="SMS.KEY">Key</label>
-        <input
-          type=""
-          name="key"
-          ng-model="vm.smsCannedAnswer.key"
-          md-maxlength="255"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="smsCannedAnswerForm['key'].$error"
-          ng-show="smsCannedAnswerForm['key'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.KEY_REQUIRED"
-              >Key field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="SMS.VALUE">Value</label>
-        <textarea
-          name="value"
-          ng-model="vm.smsCannedAnswer.value"
-          required
-        ></textarea>
-
-        <div
-          ng-messages="smsCannedAnswerForm['value'].$error"
-          ng-show="smsCannedAnswerForm['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.VALUE_REQUIRED"
-              >Value field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="SMS.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.smsCannedAnswer.description"
-        />
-
-        <div
-          ng-messages="smsCannedAnswerForm['description'].$error"
-          ng-show="smsCannedAnswerForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newSmsCannedAnswer"
-          ng-click="vm.saveSmsCannedAnswer()"
-          class="send-button md-accent md-raised"
-          ng-disabled="smsCannedAnswerForm.$invalid || smsCannedAnswerForm.$pristine"
-          aria-label="SAVE"
-          translate="SMS.SAVE"
-          translate-attr-aria-label="SMS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newSmsCannedAnswer"
-          ng-click="vm.addNewSmsCannedAnswer()"
-          class="send-button md-accent md-raised"
-          ng-disabled="smsCannedAnswerForm.$invalid"
-          aria-label="ADD"
-          translate="SMS.ADD_SMSCANNEDANSWER"
-          translate-attr-aria-label="SMS.ADD_SMSCANNEDANSWER"
-        >
-          ADD SMSCANNEDANSWER
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newSmsCannedAnswer"
-          ng-click="vm.deleteSmsCannedAnswer($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="SMS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="SMS.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/smsCannedAnswers/dialog.html/dialog.html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/smsCannedAnswers/dialog.html/dialog.html
new file mode 100644
index 0000000..219c31b
--- /dev/null
+++ b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/smsCannedAnswers/dialog.html/dialog.html
@@ -0,0 +1,173 @@
+<md-dialog class="smsCannedAnswer-dialog" aria-label="New SmsCannedAnswer">
+  <form name="smsCannedAnswerForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="SMS.KEY">Key</label>
+        <input
+          type=""
+          name="key"
+          ng-model="vm.smsCannedAnswer.key"
+          md-maxlength="255"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="smsCannedAnswerForm['key'].$error"
+          ng-show="smsCannedAnswerForm['key'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.KEY_REQUIRED"
+              >Key field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="SMS.VALUE">Value</label>
+        <textarea
+          name="value"
+          ng-model="vm.smsCannedAnswer.value"
+          required
+        ></textarea>
+
+        <div
+          ng-messages="smsCannedAnswerForm['value'].$error"
+          ng-show="smsCannedAnswerForm['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.VALUE_REQUIRED"
+              >Value field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="SMS.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.smsCannedAnswer.description"
+        />
+
+        <div
+          ng-messages="smsCannedAnswerForm['description'].$error"
+          ng-show="smsCannedAnswerForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newSmsCannedAnswer"
+          ng-click="vm.saveSmsCannedAnswer()"
+          class="send-button md-accent md-raised"
+          ng-disabled="smsCannedAnswerForm.$invalid || smsCannedAnswerForm.$pristine"
+          aria-label="SAVE"
+          translate="SMS.SAVE"
+          translate-attr-aria-label="SMS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newSmsCannedAnswer"
+          ng-click="vm.addNewSmsCannedAnswer()"
+          class="send-button md-accent md-raised"
+          ng-disabled="smsCannedAnswerForm.$invalid"
+          aria-label="ADD"
+          translate="SMS.ADD_SMSCANNEDANSWER"
+          translate-attr-aria-label="SMS.ADD_SMSCANNEDANSWER"
+        >
+          ADD SMSCANNEDANSWER
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newSmsCannedAnswer"
+          ng-click="vm.deleteSmsCannedAnswer($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="SMS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="SMS.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index d4fa3b2..0000000
--- a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,1975 +0,0 @@
-<div id="sms-smsAccount" class="page-layout simple tabbed" layout="column">
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-smsAccounts-button md-icon-button"
-        aria-label="Go to smsAccounts"
-        ng-click="vm.gotoSmsAccounts()"
-        translate
-        translate-attr-aria-label="SMS.GO_TO_SMSACCOUNTS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="smsAccount-image" hide-xs>
-          <img ng-src="assets/images/business/smsAccounts.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.smsAccount.id}}
-            <span ng-if="vm.smsAccount.name">{{vm.smsAccount.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="SMS.CREATED_AT"></span>
-            <span>{{vm.smsAccount.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.agentadddialog(vm.smsAccount, $event)"
-        class="md-fab md-warn md-icon-button"
-        aria-label="agentadd"
-      >
-        <md-tooltip
-          ><span translate="SMS.AGENTADD_SMSACCOUNT"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
-      </md-button>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveSmsAccount()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (notificationForm.$invalid) || (transferForm.$invalid) || (proxyForm.$invalid) || (dispositionForm.$invalid) || (smsDispositionsForm.$invalid) || (smsCannedAnswersForm.$invalid) || (actionsForm.$invalid) || (interactionsForm.$invalid)"
-        translate="SMS.SAVE"
-        translate-attr-aria-label="SMS.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="SMS.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="smsAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="SMS.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="SMS.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.smsAccount.name"
-                  ng-required="true"
-                  autofocus
-                  disabled
-                />
-
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="SMS.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="SMS.KEY">key</label>
-                <input
-                  type="text"
-                  name="key"
-                  ng-model="vm.smsAccount.key"
-                  md-maxlength="5"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['key'].$error"
-                  ng-show="generalForm['key'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="SMS.ERRORS.KEY_REQUIRED"
-                      >key field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="SMS.ERRORS.KEY_MAX_LENGTH"
-                      translate-values="{max: 5}"
-                      >key must have a maximum length equal to 5</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="SMS.LIST">List</label>
-                <md-select
-                  name="ListId"
-                  ng-model="vm.smsAccount.ListId"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="ListId.id"
-                    ng-repeat="ListId in vm.lists"
-                    ng-disabled="ListId.canSelect === false"
-                    >{{ ListId.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint"><span translate="SMS.HELP.LIST"></span></div>
-                <div
-                  ng-messages="generalForm['ListId'].$error"
-                  ng-show="generalForm['ListId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="SMS.ERRORS.LIST_REQUIRED"
-                      >List field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="SMS.TYPE">Type</label>
-                <md-select
-                  name="type"
-                  ng-model="vm.smsAccount.type"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'twilio'">Twilio</md-option>
-                  <md-option ng-value="'skebby'">Skebby</md-option>
-                  <md-option ng-value="'connectel'">Connectel</md-option>
-                  <md-option ng-value="'clicksend'">ClickSend</md-option>
-                  <md-option ng-value="'plivo'">Plivo</md-option>
-                  <md-option ng-value="'infobip'">Infobip</md-option>
-                  <md-option ng-value="'clickatell'">Clickatell</md-option>
-                  <md-option ng-value="'csc'">CSCTelecom</md-option>
-                  <md-option ng-value="'intelepeer'">Intelepeer</md-option>
-                </md-select>
-                <div
-                  ng-messages="generalForm['type'].$error"
-                  ng-show="generalForm['type'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="SMS.ERRORS.TYPE_REQUIRED"
-                      >Type field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="SMS.PHONE">Phone</label>
-                <input
-                  type="text"
-                  name="phone"
-                  ng-model="vm.smsAccount.phone"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['phone'].$error"
-                  ng-show="generalForm['phone'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="SMS.ERRORS.PHONE_REQUIRED"
-                      >Phone field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.smsAccount.type == 'twilio'"
-                class="md-block"
-              >
-                <label translate="SMS.ACCOUNTSID">AccountSID</label>
-                <input
-                  type="text"
-                  name="accountSid"
-                  ng-model="vm.smsAccount.accountSid"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['accountSid'].$error"
-                  ng-show="generalForm['accountSid'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="SMS.ERRORS.ACCOUNTSID_REQUIRED"
-                      >AccountSID field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.smsAccount.type == 'plivo'"
-                class="md-block"
-              >
-                <label translate="SMS.AUTHID">AuthID</label>
-                <input
-                  type="text"
-                  name="authId"
-                  ng-model="vm.smsAccount.authId"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['authId'].$error"
-                  ng-show="generalForm['authId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="SMS.ERRORS.AUTHID_REQUIRED"
-                      >AuthID field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.smsAccount.type == 'twilio' || vm.smsAccount.type == 'connectel' || vm.smsAccount.type == 'plivo'"
-                class="md-block"
-              >
-                <label translate="SMS.AUTHTOKEN">AuthToken</label>
-                <input
-                  type="text"
-                  name="authToken"
-                  ng-model="vm.smsAccount.authToken"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['authToken'].$error"
-                  ng-show="generalForm['authToken'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="SMS.ERRORS.AUTHTOKEN_REQUIRED"
-                      >AuthToken field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.smsAccount.type == 'skebby'"
-                class="md-block"
-              >
-                <label translate="SMS.METHOD">Method</label>
-                <md-select
-                  name="smsMethod"
-                  ng-model="vm.smsAccount.smsMethod"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'SI'">Basic</md-option>
-                  <md-option ng-value="'TI'">Classic</md-option>
-                  <md-option ng-value="'GP'">Classic+</md-option>
-                </md-select>
-                <div
-                  ng-messages="generalForm['smsMethod'].$error"
-                  ng-show="generalForm['smsMethod'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="SMS.ERRORS.METHOD_REQUIRED"
-                      >Method field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.smsAccount.type == 'skebby' || vm.smsAccount.type == 'clicksend' || vm.smsAccount.type == 'csc' || vm.smsAccount.type == 'infobip'"
-                class="md-block"
-              >
-                <label translate="SMS.USERNAME">Username</label>
-                <input
-                  type="text"
-                  name="username"
-                  ng-model="vm.smsAccount.username"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['username'].$error"
-                  ng-show="generalForm['username'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="SMS.ERRORS.USERNAME_REQUIRED"
-                      >Username field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                class="md-block"
-                ng-if="vm.smsAccount.type == 'skebby' || vm.smsAccount.type == 'clicksend' || vm.smsAccount.type == 'infobip'"
-              >
-                <label translate="SMS.PASSWORD">Password</label>
-                <input
-                  type="password"
-                  name="password"
-                  ng-model="vm.smsAccount.password"
-                  placeholder="Password"
-                  translate
-                  translate-attr-placeholder="SMS.PASSWORD"
-                  required
-                />
-                <div ng-messages="generalForm['password'].$error" role="alert">
-                  <div ng-message="required">
-                    <span translate="SMS.ERRORS.PASSWORD_REQUIRED"
-                      >Password field is required</span
-                    >
-                  </div>
-                  <div ng-message="pattern">
-                    <span translate="SMS.ERRORS.SECURE_PASSWORD_PATTERN"
-                      >Must contain at least 8 characters, with a minimum of 1
-                      lowercase letter, 1 uppercase letter, 1 numeric character
-                      and 1 special character ~!?*@#$%^&-_=+[{]}.</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-
-              <md-input-container
-                ng-if="vm.smsAccount.type == 'infobip' || vm.smsAccount.type == 'csc'"
-                class="md-block"
-              >
-                <label translate="SMS.BASEURL">BaseURL</label>
-                <input
-                  type="text"
-                  name="baseUrl"
-                  ng-model="vm.smsAccount.baseUrl"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['baseUrl'].$error"
-                  ng-show="generalForm['baseUrl'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="SMS.ERRORS.BASEURL_REQUIRED"
-                      >BaseURL field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.smsAccount.type == 'csc' || vm.smsAccount.type == 'clickatell' || vm.smsAccount.type == 'intelepeer'"
-                class="md-block"
-              >
-                <label translate="SMS.APIKEY">ApiKey</label>
-                <input
-                  type="text"
-                  name="apiKey"
-                  ng-model="vm.smsAccount.apiKey"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['apiKey'].$error"
-                  ng-show="generalForm['apiKey'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="SMS.ERRORS.APIKEY_REQUIRED"
-                      >ApiKey field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.smsAccount.type == 'connectel' || vm.smsAccount.type == 'clicksend' || vm.smsAccount.type == 'plivo'|| vm.smsAccount.type == 'csc'|| vm.smsAccount.type == 'infobip' || vm.smsAccount.type == 'intelepeer'"
-                class="md-block"
-              >
-                <label translate="SMS.SENDERSTRING">SenderString</label>
-                <input
-                  type="text"
-                  name="senderString"
-                  ng-model="vm.smsAccount.senderString"
-                  md-maxlength="11"
-                  ng-pattern="/^[A-Za-z0-9\.\s]*$/i"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['senderString'].$error"
-                  ng-show="generalForm['senderString'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="SMS.ERRORS.SENDERSTRING_REQUIRED"
-                      >SenderString field is required</span
-                    >
-                  </div>
-                  <div ng-message="pattern">
-                    <span
-                      translate="SMS.ERRORS.SENDERSTRING_MUST_VALID_PATTERN"
-                      translate-values="{ regex: '/^[A-Za-z0-9\.\s]*$/i' }"
-                      >SenderString must be valid pattern
-                    </span>
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="SMS.ERRORS.SENDERSTRING_MAX_LENGTH"
-                      translate-values="{max: 11}"
-                      >SenderString must have a maximum length equal to 11</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="(vm.smsAccount.type == 'skebby' && vm.smsAccount.smsMethod == 'GP') || vm.smsAccount.type == 'connectel' || vm.smsAccount.type == 'clicksend' || vm.smsAccount.type == 'csc' || vm.smsAccount.type == 'clickatell'"
-                class="md-block"
-              >
-                <md-switch
-                  ng-model="vm.smsAccount.deliveryReport"
-                  aria-label="deliveryReport"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="SMS.DELIVERYREPORT"
-                    >deliveryReport</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="SMS.WAITFORTHEASSIGNEDAGENT"
-                  >WaitForTheAssignedAgent</label
-                >
-                <input
-                  type="number"
-                  name="waitForTheAssignedAgent"
-                  ng-model="vm.smsAccount.waitForTheAssignedAgent"
-                  min="1"
-                  max="2147483"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['waitForTheAssignedAgent'].$error"
-                  ng-show="generalForm['waitForTheAssignedAgent'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="SMS.ERRORS.WAITFORTHEASSIGNEDAGENT_REQUIRED"
-                      >WaitForTheAssignedAgent field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="SMS.ERRORS.WAITFORTHEASSIGNEDAGENT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >WaitForTheAssignedAgent must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="SMS.ERRORS.WAITFORTHEASSIGNEDAGENT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >WaitForTheAssignedAgent must be a valid greater or equal
-                      than</span
-                    >
-                    <span>2147483</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="SMS.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.smsAccount.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="SMS.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="SMS.RECEIVEURL">receiveUrl</label>
-                <div layout="row" layout-align="center center">
-                  <button
-                    class="md-button md-fab md-mini md-primary"
-                    ngclipboard
-                    data-clipboard-target="#copytoclipboard-receiveUrl"
-                    ngclipboard-success="vm.alert({title: 'copied to clipboard', msg: e.text});"
-                    ngclipboard-error="vm.alert({title: 'error', msg: 'copy to clipboard failed'});"
-                  >
-                    <md-icon md-font-icon="icon-clipboard-text"></md-icon>
-                  </button>
-                  <input
-                    class="md-input"
-                    type="text"
-                    id="copytoclipboard-receiveUrl"
-                    name="receiveUrl"
-                    ng-value="vm.smsAccount.remote + '/api/sms/accounts/' + vm.smsAccount.id + '/notify?token=' + vm.smsAccount.token"
-                    ng-readonly="true"
-                  />
-                </div>
-                <div class="hint">
-                  <span translate="SMS.HELP.RECEIVEURL"></span>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="( (vm.smsAccount.type == 'skebby' && vm.smsAccount.smsMethod == 'GP') || vm.smsAccount.type == 'connectel' || vm.smsAccount.type == 'clicksend' || vm.smsAccount.type == 'csc' || vm.smsAccount.type == 'clickatell') && vm.smsAccount.deliveryReport"
-                class="md-block"
-              >
-                <label translate="SMS.DELIVERYREPORTURL"
-                  >deliveryReportUrl</label
-                >
-                <div layout="row" layout-align="center center">
-                  <button
-                    class="md-button md-fab md-mini md-primary"
-                    ngclipboard
-                    data-clipboard-target="#copytoclipboard-deliveryReportUrl"
-                    ngclipboard-success="vm.alert({title: 'copied to clipboard', msg: e.text});"
-                    ngclipboard-error="vm.alert({title: 'error', msg: 'copy to clipboard failed'});"
-                  >
-                    <md-icon md-font-icon="icon-clipboard-text"></md-icon>
-                  </button>
-                  <input
-                    class="md-input"
-                    type="text"
-                    id="copytoclipboard-deliveryReportUrl"
-                    name="deliveryReportUrl"
-                    ng-value="vm.smsAccount.remote + '/api/sms/accounts/' + vm.smsAccount.id + '/status?token=' + vm.smsAccount.token + (vm.smsAccount.type == 'csc' ? '&message-id={message-id}&state={state}' : '')"
-                    ng-readonly="true"
-                  />
-                </div>
-                <div class="hint">
-                  <span translate="SMS.HELP.DELIVERYREPORTURL"></span>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="smsAccount-detail-form-container notification md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="SMS.NOTIFICATION">
-                NOTIFICATION
-              </div>
-            </div>
-            <form name="notificationForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.smsAccount.notificationSound"
-                  aria-label="notificationSound"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="SMS.NOTIFICATIONSOUND"
-                    >notificationSound</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.smsAccount.notificationShake"
-                  aria-label="notificationShake"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="SMS.NOTIFICATIONSHAKE"
-                    >notificationShake</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <div class="md-block">
-                <label
-                  class="md-caption grey-fg"
-                  translate="SMS.NOTIFICATIONTEMPLATE"
-                  >notificationTemplate</label
-                >
-                <textarea
-                  aria-label="notificationTemplate notificationTemplate"
-                  ckeditor="{ skin: 'office2013', language: 'en', allowedContent: true, extraPlugins: 'font,colorbutton,autoembed,autocorrect,googlethisterm,pastebase64', toolbarGroups: [{ name: 'styles', groups: ['styles'] }, { name: 'clipboard', groups: ['undo'] }, { name: 'colors', groups: ['colors'] }, { name: 'basicstyles', groups: ['basicstyles'] }, { name: 'paragraph', groups: ['list', 'indent', 'align'] }, { name: 'mode' }], autocorrect_enabled: true, disableNativeSpellChecker: false, fontSize_sizes: '8/8pt;9/9pt;10/10pt;11/11pt;12/12pt;14/14pt;16/16pt;18/18pt;20/20pt;22/22pt;24/24pt;26/26pt;28/28pt;36/36pt;48/48pt;72/72pt',  removePlugins: 'magicline' }"
-                  ng-model="vm.smsAccount.notificationTemplate"
-                ></textarea>
-              </div>
-            </form>
-          </div>
-          <div
-            class="smsAccount-detail-form-container transfer md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="SMS.TRANSFER">
-                TRANSFER
-              </div>
-            </div>
-            <form name="transferForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.smsAccount.queueTransfer"
-                  aria-label="queueTransfer"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="SMS.QUEUETRANSFER"
-                    >queueTransfer</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.smsAccount.queueTransfer == true"
-                class="md-block"
-              >
-                <label translate="SMS.QUEUETRANSFERTIMEOUT"
-                  >queueTransferTimeout</label
-                >
-                <input
-                  type="number"
-                  name="queueTransferTimeout"
-                  ng-model="vm.smsAccount.queueTransferTimeout"
-                  min="1"
-                  max="2147483"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="transferForm['queueTransferTimeout'].$error"
-                  ng-show="transferForm['queueTransferTimeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="SMS.ERRORS.QUEUETRANSFERTIMEOUT_REQUIRED"
-                      >queueTransferTimeout field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="SMS.ERRORS.QUEUETRANSFERTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >queueTransferTimeout must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="SMS.ERRORS.QUEUETRANSFERTIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >queueTransferTimeout must be a valid greater or equal
-                      than</span
-                    >
-                    <span>2147483</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.smsAccount.agentTransfer"
-                  aria-label="agentTransfer"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="SMS.AGENTTRANSFER"
-                    >agentTransfer</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.smsAccount.agentTransfer == true"
-                class="md-block"
-              >
-                <label translate="SMS.AGENTTRANSFERTIMEOUT"
-                  >agentTransferTimeout</label
-                >
-                <input
-                  type="number"
-                  name="agentTransferTimeout"
-                  ng-model="vm.smsAccount.agentTransferTimeout"
-                  min="1"
-                  max="2147483"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="transferForm['agentTransferTimeout'].$error"
-                  ng-show="transferForm['agentTransferTimeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="SMS.ERRORS.AGENTTRANSFERTIMEOUT_REQUIRED"
-                      >agentTransferTimeout field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="SMS.ERRORS.AGENTTRANSFERTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >agentTransferTimeout must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="SMS.ERRORS.AGENTTRANSFERTIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >agentTransferTimeout must be a valid greater or equal
-                      than</span
-                    >
-                    <span>2147483</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="SMS.ADVANCED">ADVANCED</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="smsAccount-detail-form-container proxy md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="SMS.PROXY">PROXY</div>
-            </div>
-            <form name="proxyForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="SMS.TOKEN">token</label>
-                <input
-                  type="text"
-                  name="token"
-                  ng-model="vm.smsAccount.token"
-                  autofocus
-                  disabled
-                />
-
-                <div
-                  ng-messages="proxyForm['token'].$error"
-                  ng-show="proxyForm['token'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="SMS.ERRORS.TOKEN_REQUIRED"
-                      >token field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="SMS.MOTIONPROXY">MotionProxy</label>
-                <input
-                  type="url"
-                  name="remote"
-                  ng-model="vm.smsAccount.remote"
-                  md-maxlength="255"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="SMS.HELP.MOTIONPROXY"></span>
-                </div>
-                <div
-                  ng-messages="proxyForm['remote'].$error"
-                  ng-show="proxyForm['remote'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="SMS.ERRORS.MOTIONPROXY_REQUIRED"
-                      >MotionProxy field is required</span
-                    >
-                  </div>
-                  <div ng-message="url">
-                    <span translate="SMS.ERRORS.MOTIONPROXY_MUST_VALID_URL"
-                      >MotionProxy must be a valid url
-                      http://www.xcally.com</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="SMS.ERRORS.MOTIONPROXY_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >MotionProxy must have a maximum length equal to 255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="smsAccount-detail-form-container disposition md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="SMS.DISPOSITION">
-                DISPOSITION
-              </div>
-            </div>
-            <form name="dispositionForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.smsAccount.mandatoryDisposition"
-                  aria-label="MandatoryDisposition"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="SMS.MANDATORYDISPOSITION"
-                    >MandatoryDisposition</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.smsAccount.mandatoryDisposition"
-                class="md-block"
-              >
-                <label translate="SMS.MANDATORYDISPOSITIONPAUSEID"
-                  >MandatoryDispositionPauseId</label
-                >
-                <md-select
-                  name="mandatoryDispositionPauseId"
-                  ng-model="vm.smsAccount.mandatoryDispositionPauseId"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="mandatoryDispositionPauseId.id"
-                    ng-repeat="mandatoryDispositionPauseId in vm.pauses"
-                    ng-disabled="mandatoryDispositionPauseId.canSelect === false"
-                    >{{ mandatoryDispositionPauseId.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span translate="SMS.HELP.MANDATORYDISPOSITIONPAUSEID"></span>
-                </div>
-                <div
-                  ng-messages="dispositionForm['mandatoryDispositionPauseId'].$error"
-                  ng-show="dispositionForm['mandatoryDispositionPauseId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="SMS.ERRORS.MANDATORYDISPOSITIONPAUSEID_REQUIRED"
-                      >MandatoryDispositionPauseId field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="SMS.DISPOSITIONS">DISPOSITIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            ng-controller="SmsAccountDispositionsController as vm_dc"
-            ng-init="vm_dc.init(vm.smsAccount, vm.crudPermissions)"
-          >
-            <div layout="row">
-              <div class="column" flex="20">
-                <md-card class="mt-0">
-                  <md-card-content>
-                    <button
-                      layout-align="center center"
-                      md-mini-fab
-                      ng-click="vm_dc.query.level = null; vm_dc.getDispositions()"
-                    >
-                      <div layout="row" layout-align="start center">
-                        <md-icon md-font-icon="icon-refresh"></md-icon>
-                        <span class="ph-5"
-                          >{{ 'TOOLS.ALL_DISPOSITIONS' | translate }}</span
-                        >
-                      </div>
-                    </button>
-                  </md-card-content>
-                </md-card>
-                <md-card>
-                  <md-card-content>
-                    <md-input-container class="md-block" flex-gt-sm="">
-                      <label translate="TOOLS.SELECT_LEVEL"
-                        >Select a level</label
-                      >
-                      <md-select
-                        placeholder="{{ 'TOOLS.SELECT_LEVEL' | translate }}"
-                        ng-model="vm_dc.query.level"
-                        ng-change="vm_dc.getDispositions()"
-                      >
-                        <md-option ng-value="null"
-                          ><em translate="TOOLS.ALL">All</em></md-option
-                        >
-                        <md-option
-                          ng-value="key"
-                          ng-repeat="(key, value) in vm_dc.levels"
-                          >{{ value }}</md-option
-                        >
-                      </md-select>
-                    </md-input-container>
-                  </md-card-content>
-                </md-card>
-              </div>
-              <div
-                class="smsAccount-detail-form-container smsdispositions md-background-bg md-whiteframe-1dp"
-                flex="80"
-              >
-                <md-toolbar
-                  class="md-table-toolbar md-default"
-                  ng-hide="vm_dc.selectedSmsAccountDispositions.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead" translate="SMS.DISPOSITIONS"
-                      >Dispositions</span
-                    >
-                    <ms-search-bar
-                      on-search="vm_dc.query.filter = query"
-                      on-collapse="vm_dc.query.filter = undefined"
-                      debounce="300"
-                      direction="down"
-                    ></ms-search-bar>
-                    <div flex></div>
-                    <md-button
-                      ng-if="vm_dc.crudPermissions.canEdit"
-                      class="md-icon-button"
-                      ng-click="vm_dc.createOrEditDisposition($event)"
-                      aria-label="Add sms dispositions"
-                      translate
-                      translate-attr-label="SMS.ADD_DISPOSITION"
-                    >
-                      <md-icon md-font-icon="icon-plus"></md-icon>
-                    </md-button>
-                  </div>
-                </md-toolbar>
-                <md-toolbar
-                  class="md-table-toolbar md-accent"
-                  ng-show="vm_dc.selectedDispositions.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead"
-                      >{{vm_dc.selectedDispositions.length}}
-                      {{vm_dc.selectedDispositions.length > 1 ? 'items' :
-                      'item'}} selected</span
-                    >
-                    <div flex></div>
-                    <button
-                      class="md-icon-button"
-                      ng-csv="vm_dc.exportSelectedDispositions"
-                      csv-label="true"
-                      filename="smsAccounts.csv"
-                    >
-                      <md-icon md-font-icon="icon-file-excel"></md-icon>
-                    </button>
-                    <md-button
-                      ng-if="vm_dc.crudPermissions.canDelete"
-                      class="md-icon-button"
-                      ng-click="vm_dc.deleteSelectedDispositions($event)"
-                      aria-label="delete selected"
-                      translate
-                      translate-attr-label="SMS.DELETE_SELECTED"
-                    >
-                      <md-icon md-font-icon="icon-delete"></md-icon>
-                    </md-button>
-                  </div>
-                </md-toolbar>
-                <md-table-container>
-                  <table
-                    md-table
-                    md-row-select
-                    multiple
-                    ng-model="vm_dc.selectedDispositions"
-                    md-progress="vm_dc.promise"
-                  >
-                    <thead
-                      md-head
-                      md-order="vm_dc.query.sort"
-                      md-on-reorder="vm_dc.getDispositions"
-                    >
-                      <tr md-row>
-                        <th md-column md-order-by="id">
-                          {{ 'SMS.ID' | translate }}
-                        </th>
-                        <th md-column md-order-by="level">
-                          {{ 'TOOLS.LEVEL' | translate }}
-                        </th>
-                        <th md-column md-order-by="name">
-                          {{ 'SMS.NAME' | translate }}
-                        </th>
-                        <th md-column md-order-by="description">
-                          {{ 'SMS.DESCRIPTION' | translate }}
-                        </th>
-                        <th md-column width="10px"></th>
-                      </tr>
-                    </thead>
-                    <tbody md-body>
-                      <tr md-row ng-hide="vm_dc.dispositions.rows.length">
-                        <td md-cell colspan="5">
-                          <div layout="row" layout-align="center center">
-                            <span translate="SMS.NO_AVAILABLE_INFO"
-                              >No Available Info</span
-                            >
-                          </div>
-                        </td>
-                      </tr>
-                      <tr
-                        md-row
-                        md-select="disposition"
-                        md-select-id="id"
-                        ng-repeat="disposition in vm_dc.dispositions.rows"
-                      >
-                        <td
-                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                          md-cell
-                          class="id"
-                        >
-                          {{disposition.id}}
-                        </td>
-                        <td
-                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                          md-cell
-                          class="level"
-                        >
-                          {{ vm_dc.levels[disposition.level] }}
-                        </td>
-                        <td
-                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                          md-cell
-                          class="name"
-                        >
-                          {{disposition.name}}
-                        </td>
-                        <td
-                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                          md-cell
-                          class="description"
-                        >
-                          {{disposition.description}}
-                        </td>
-                        <td
-                          md-cell
-                          class="actions"
-                          ng-if="!vm_dc.crudPermissions.readOnly"
-                        >
-                          <md-menu>
-                            <md-button
-                              class="md-icon-button"
-                              aria-label="More"
-                              translate
-                              translate-attr-aria-label="SMS.MORE"
-                              ng-click="$mdOpenMenu($event)"
-                            >
-                              <md-icon
-                                md-font-icon="icon-dots-vertical"
-                              ></md-icon>
-                            </md-button>
-                            <md-menu-content width="3">
-                              <!-- SUBACTIONS -->
-                              <!-- ACTIONS -->
-                              <md-menu-item
-                                ng-if="vm_dc.crudPermissions.canEdit"
-                              >
-                                <md-button
-                                  ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                                  translate="TOOLS.EDIT_DISPOSITION"
-                                >
-                                  Edit Disposition
-                                </md-button>
-                              </md-menu-item>
-                              <!-- SUBACTIONS -->
-                              <!-- ACTIONS -->
-                              <md-menu-item
-                                ng-if="vm_dc.crudPermissions.canDelete"
-                              >
-                                <md-button
-                                  ng-click="vm_dc.deleteConfirm(disposition, $event)"
-                                  translate="TOOLS.DELETE_DISPOSITION"
-                                >
-                                  Delete Disposition
-                                </md-button>
-                              </md-menu-item>
-                            </md-menu-content>
-                          </md-menu>
-                        </td>
-                      </tr>
-                    </tbody>
-                  </table>
-                </md-table-container>
-                <md-table-pagination
-                  md-label="{page: '{{'SMS.PAGE' | translate}}:', rowsPerPage: '{{'SMS.ROWSPERPAGE' | translate}}:', of: '{{'SMS.OF' | translate}}'}"
-                  md-limit="vm_dc.query.limit"
-                  md-limit-options="[10, 15, 20, 50, 100, 250]"
-                  md-page="vm_dc.query.page"
-                  md-total="{{vm_dc.dispositions.count}}"
-                  md-on-paginate="vm_dc.getDispositions"
-                  md-page-select
-                >
-                </md-table-pagination>
-              </div>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="SMS.CANNEDANSWERS">CANNEDANSWERS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="smsAccount-detail-form-container smscannedanswers md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="SmsAccountSmsCannedAnswersController as vm_dc"
-              ng-init="vm_dc.init(vm.smsAccount, vm.crudPermissions)"
-            >
-              <md-toolbar
-                class="md-table-toolbar md-default"
-                ng-hide="vm_dc.selectedSmsAccountSmsCannedAnswers.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead" translate="SMS.SMSCANNEDANSWERS"
-                    >SmsCannedAnswers</span
-                  >
-                  <ms-search-bar
-                    on-search="vm_dc.query.filter = query"
-                    on-collapse="vm_dc.query.filter = undefined"
-                    debounce="300"
-                    direction="down"
-                  ></ms-search-bar>
-                  <div flex></div>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canEdit"
-                    class="md-icon-button"
-                    ng-click="vm_dc.createOrEditSmsAccountSmsCannedAnswer($event)"
-                    aria-label="add smsCannedAnswer"
-                    translate
-                    translate-attr-label="SMS.ADD_SMSCANNEDANSWER"
-                  >
-                    <md-icon md-font-icon="icon-plus"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-toolbar
-                class="md-table-toolbar md-accent"
-                ng-show="vm_dc.selectedSmsAccountSmsCannedAnswers.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead"
-                    >{{vm_dc.selectedSmsAccountSmsCannedAnswers.length}}
-                    {{vm_dc.selectedSmsAccountSmsCannedAnswers.length > 1 ?
-                    'items' : 'item'}} selected</span
-                  >
-                  <div flex></div>
-                  <button
-                    class="md-icon-button"
-                    ng-csv="vm_dc.exportSelectedSmsAccountSmsCannedAnswers"
-                    csv-label="true"
-                    filename="smsAccounts.csv"
-                  >
-                    <md-icon md-font-icon="icon-file-excel"></md-icon>
-                  </button>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canDelete"
-                    class="md-icon-button"
-                    ng-click="vm_dc.deleteSelectedSmsAccountSmsCannedAnswers($event)"
-                    aria-label="delete selected"
-                    translate
-                    translate-attr-label="SMS.DELETE_SELECTED"
-                  >
-                    <md-icon md-font-icon="icon-delete"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-table-container class="font-size-12">
-                <table
-                  md-table
-                  md-row-select
-                  multiple
-                  ng-model="vm_dc.selectedSmsAccountSmsCannedAnswers"
-                  md-progress="vm_dc.promise"
-                >
-                  <thead
-                    md-head
-                    md-order="vm_dc.query.sort"
-                    md-on-reorder="vm_dc.getSmsAccountSmsCannedAnswers"
-                  >
-                    <tr md-row>
-                      <th md-column md-order-by="id">
-                        {{ 'SMS.ID' | translate }}
-                      </th>
-                      <th md-column md-order-by="key">
-                        {{ 'SMS.KEY' | translate }}
-                      </th>
-                      <th md-column md-order-by="value">
-                        {{ 'SMS.VALUE' | translate }}
-                      </th>
-                      <th md-column md-order-by="description">
-                        {{ 'SMS.DESCRIPTION' | translate }}
-                      </th>
-                      <th md-column md-order-by="createdAt">
-                        {{ 'SMS.CREATED_AT' | translate }}
-                      </th>
-                      <th md-column width="10px"></th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr
-                      md-row
-                      md-select="smsCannedAnswer"
-                      md-select-id="id"
-                      ng-repeat="smsCannedAnswer in vm_dc.smsAccountSmsCannedAnswers.rows"
-                    >
-                      <td
-                        ng-click="vm_dc.createOrEditSmsAccountSmsCannedAnswer($event, smsCannedAnswer)"
-                        md-cell
-                      >
-                        {{smsCannedAnswer.id}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditSmsAccountSmsCannedAnswer($event, smsCannedAnswer)"
-                        md-cell
-                      >
-                        {{smsCannedAnswer.key}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditSmsAccountSmsCannedAnswer($event, smsCannedAnswer)"
-                        md-cell
-                      >
-                        {{smsCannedAnswer.value}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditSmsAccountSmsCannedAnswer($event, smsCannedAnswer)"
-                        md-cell
-                      >
-                        {{smsCannedAnswer.description}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditSmsAccountSmsCannedAnswer($event, smsCannedAnswer)"
-                        md-cell
-                      >
-                        {{ smsCannedAnswer.createdAt | formatdate }}
-                      </td>
-                      <td
-                        md-cell
-                        class="actions"
-                        ng-if="!vm_dc.crudPermissions.readOnly"
-                      >
-                        <md-menu>
-                          <md-button
-                            class="md-icon-button"
-                            aria-label="More"
-                            translate
-                            translate-attr-aria-label="SMS.MORE"
-                            ng-click="$mdOpenMenu($event)"
-                          >
-                            <md-icon
-                              md-font-icon="icon-dots-vertical"
-                            ></md-icon>
-                          </md-button>
-
-                          <md-menu-content width="3">
-                            <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
-                              <md-button
-                                ng-click="vm_dc.createOrEditSmsAccountSmsCannedAnswer($event, smsCannedAnswer)"
-                                translate="SMS.EDIT_SMSCANNEDANSWER"
-                              >
-                                Edit SmsCannedAnswer
-                              </md-button>
-                            </md-menu-item>
-                            <md-menu-item
-                              ng-if="vm_dc.crudPermissions.canDelete"
-                            >
-                              <md-button
-                                ng-click="vm_dc.deleteConfirm(smsCannedAnswer, $event)"
-                                translate="SMS.DELETE_SMSCANNEDANSWER"
-                              >
-                                Delete SmsCannedAnswer
-                              </md-button>
-                            </md-menu-item>
-                          </md-menu-content>
-                        </md-menu>
-                      </td>
-                    </tr>
-                    <tr
-                      md-row
-                      ng-if="!vm_dc.smsAccountSmsCannedAnswers.rows.length"
-                    >
-                      <td md-cell colspan="7">
-                        <div layout="row" layout-align="center center">
-                          <span
-                            class="text-boxed-light"
-                            translate="SMS.NO_SMSCANNEDANSWER_AVAILABLE"
-                            >No smscannedanswer available</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-              <md-table-pagination
-                md-label="{page: '{{'SMS.PAGE' | translate}}:', rowsPerPage: '{{'SMS.ROWSPERPAGE' | translate}}:', of: '{{'SMS.OF' | translate}}'}"
-                md-limit="vm_dc.query.limit"
-                md-limit-options="[10, 15, 20, 50, 100, 250]"
-                md-page="vm_dc.query.page"
-                md-total="{{vm_dc.smsAccountSmsCannedAnswers.count}}"
-                md-on-paginate="vm_dc.getSmsAccountSmsCannedAnswers"
-                md-page-select
-              ></md-table-pagination>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="SMS.ACTIONS">ACTIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="smsAccount-detail-form-container actions md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="SmsAccountActionsController as vm_ac"
-              ng-init="vm_ac.init(vm.smsAccount, vm.crudPermissions)"
-              class="content"
-              md-background-bg
-              layout="row"
-              layout-align="start start"
-            >
-              <!-- SIDENAV -->
-              <div
-                class="navigation-simple sidenav main-sidenav md-background-bg md-whiteframe-1dp"
-                ms-scroll
-                layout="column"
-                flex="20"
-                ng-if="vm_ac.crudPermissions.canEdit"
-              >
-                <!-- SIDENAV CONTENT -->
-                <md-list class="no-padding">
-                  <md-subheader class="md-no-sticky">
-                    <span translate="VOICE.APPLICATIONS_LIST">
-                      Applications List
-                    </span>
-                  </md-subheader>
-                </md-list>
-                <md-divider></md-divider>
-                <md-list ng-sortable="vm_ac.list">
-                  <md-list-item class="handle" ng-repeat="a in vm_ac.apps">
-                    <md-icon md-font-icon="{{a.icon}}" class="s16"></md-icon>
-                    <p
-                      class="text-truncate"
-                      translate="SMS.{{(a.alias || a.appType) | uppercase}}"
-                    >
-                      {{a.alias || a.appType}}
-                    </p>
-                  </md-list-item>
-                </md-list>
-                <!-- / SIDENAV CONTENT -->
-              </div>
-              <!-- / SIDENAV -->
-              <div flex></div>
-              <!-- MAIN -->
-              <div
-                class="main scrollable md-background-bg md-whiteframe-1dp"
-                ms-scroll
-                layout="column"
-                flex="{{vm_ac.crudPermissions.canEdit ? 75 : 100}}"
-              >
-                <md-toolbar
-                  class="md-table-toolbar md-default"
-                  ng-hide="vm_ac.selectedSmsAccountApps.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead">Drag & Drop Routing</span>
-                    <div flex></div>
-                    <ms-search-bar
-                      on-search="vm_ac.query.filter = query"
-                      on-collapse="vm_ac.query.filter = undefined"
-                      debounce="300"
-                    ></ms-search-bar>
-                  </div>
-                </md-toolbar>
-                <md-toolbar
-                  class="md-table-toolbar md-accent"
-                  ng-show="vm_ac.selectedSmsAccountApps.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead"
-                      >{{vm_ac.selectedSmsAccountApps.length}}
-                      {{vm_ac.selectedSmsAccountApps.length > 1 ? 'items' :
-                      'item'}} selected</span
-                    >
-                    <div flex></div>
-                    <md-button
-                      ng-if="vm_ac.crudPermissions.canDelete"
-                      class="md-icon-button"
-                      ng-click="vm_ac.deleteSelectedSmsAccountApps($event)"
-                      aria-label="delete selected"
-                      translate
-                      translate-attr-label="SMS.DELETE_SELECTED"
-                    >
-                      <md-icon md-font-icon="icon-delete"></md-icon>
-                    </md-button>
-                  </div>
-                </md-toolbar>
-
-                <!-- QUEUES TABLE -->
-                <md-table-container>
-                  <table
-                    md-table
-                    md-row-select
-                    multiple
-                    ng-model="vm_ac.selectedSmsAccountApps"
-                  >
-                    <thead md-head>
-                      <tr md-row>
-                        <th md-column width="10px"></th>
-                        <th md-column width="10px">
-                          <span translate="VOICE.PRIORITY">Priority</span>
-                        </th>
-                        <th md-column>
-                          <span>Type</span>
-                        </th>
-                        <th md-column>
-                          <span>Appdata</span>
-                        </th>
-                        <th md-column>
-                          <span>Interval</span>
-                        </th>
-                        <th md-column width="10px"></th>
-                        <th md-column width="10px"></th>
-                      </tr>
-                    </thead>
-                    <tbody md-body ng-sortable="vm_ac.applications">
-                      <tr
-                        md-row
-                        md-select="app"
-                        md-select-id="id"
-                        ng-repeat="app in vm_ac.smsAccountApps.rows | filter: vm_ac.query.filter"
-                      >
-                        <td md-cell>
-                          <md-icon
-                            md-font-icon="icon-drag-vertical"
-                            class="s16 handle"
-                          ></md-icon>
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editSmsAccountApp($event, $index)"
-                        >
-                          <span>{{app.priority}}</span>
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editSmsAccountApp($event, $index)"
-                        >
-                          {{app.app.toLowerCase() === 'agi' ? 'Cally-Square' :
-                          app.app | ucfirst}}<span
-                            ng-if="app.appType.toLowerCase() === 'custom'"
-                            >*</span
-                          >
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editSmsAccountApp($event, $index)"
-                        >
-                          <span class="text-truncate" style="width: 200px"
-                            >{{app.appdata}}</span
-                          >
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editInterval($event, $index)"
-                        >
-                          {{app.IntervalId ? 'From List' : app.interval}}
-                        </td>
-                        <td md-cell>
-                          <md-button
-                            ng-click="vm_ac.editInterval($event, $index)"
-                            class="md-icon-button"
-                            aria-label="Interval"
-                          >
-                            <md-icon md-font-icon="icon-timer"></md-icon>
-                            <md-tooltip>
-                              {{app.IntervalId ? 'From List' : (app.interval ===
-                              '*,*,*,*' ? 'Always' : 'Custom')}}
-                            </md-tooltip>
-                          </md-button>
-                        </td>
-                        <td
-                          md-cell
-                          class="actions"
-                          ng-if="!vm_ac.crudPermissions.readOnly"
-                        >
-                          <md-menu>
-                            <md-button
-                              class="md-icon-button"
-                              aria-label="More"
-                              translate
-                              translate-attr-aria-label="VOICE.MORE"
-                              ng-click="$mdOpenMenu($event)"
-                            >
-                              <md-icon
-                                md-font-icon="icon-dots-vertical"
-                              ></md-icon>
-                            </md-button>
-
-                            <md-menu-content width="3">
-                              <md-menu-item
-                                ng-if="vm_ac.crudPermissions.canEdit"
-                              >
-                                <md-button
-                                  ng-click="vm_ac.editSmsAccountApp($event, $index)"
-                                  translate="VOICE.EDIT_APP"
-                                >
-                                  Edit App
-                                </md-button>
-                              </md-menu-item>
-                              <md-menu-item
-                                ng-if="vm_ac.crudPermissions.canEdit"
-                              >
-                                <md-button
-                                  ng-click="vm_ac.editInterval($event, $index)"
-                                  translate="VOICE.EDIT_INTERVAL"
-                                >
-                                  Edit Interval
-                                </md-button>
-                              </md-menu-item>
-                              <md-menu-item
-                                ng-if="vm_ac.crudPermissions.canDelete"
-                              >
-                                <md-button
-                                  ng-click="vm_ac.deleteConfirm(app, $index, $event)"
-                                  translate="VOICE.DELETE_APP"
-                                >
-                                  Delete App
-                                </md-button>
-                              </md-menu-item>
-                            </md-menu-content>
-                          </md-menu>
-                        </td>
-                      </tr>
-                      <tr md-row ng-hide="vm_ac.smsAccountApps.rows.length">
-                        <td md-cell colspan="7">
-                          <span
-                            class="text-boxed-light"
-                            translate="VOICE.NO_APPS_AVAILABLE"
-                            >No apps available</span
-                          >
-                        </td>
-                      </tr>
-                    </tbody>
-                  </table>
-                </md-table-container>
-                <!-- / QUEUES TABLE -->
-
-                <!-- NO RESULTS -->
-
-                <!-- / NO RESULTS -->
-              </div>
-              <!-- / MAIN -->
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="SMS.INTERACTIONS">INTERACTIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="smsAccount-detail-form-container interactions md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="SmsAccountInteractionsController as vm_dc"
-              ng-init="vm_dc.init(vm.smsAccount, vm.crudPermissions)"
-            >
-              <md-toolbar
-                class="md-table-toolbar md-default"
-                ng-hide="vm_dc.selectedSmsAccountInteractions.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead" translate="SMS.INTERACTIONS"
-                    >Interactions</span
-                  >
-                  <ms-search-bar
-                    on-search="vm_dc.query.filter = query"
-                    on-collapse="vm_dc.query.filter = undefined"
-                    debounce="300"
-                    direction="down"
-                  ></ms-search-bar>
-                  <div flex></div>
-                  <ms-quick-filter
-                    filters="vm_dc.quickFilters"
-                    query="vm_dc.query"
-                    search="vm_dc.getSmsAccountInteractions()"
-                  ></ms-quick-filter>
-                  <div layout="column">
-                    <md-button
-                      class="md-icon-button advanced-search"
-                      ng-class="{ 'md-fab md-mini md-accent-bg': vm_dc.query.search }"
-                      aria-label="Filter"
-                      translate
-                      translate-attr-aria-label="DASHBOARDS.FILTER"
-                      ng-click="vm_dc.openAdvancedSearch()"
-                    >
-                      <md-icon
-                        md-font-icon="{{ vm_dc.query.search ? 'icon-filter' : 'icon-filter-outline' }}"
-                        ng-class="{ 'blink': vm_dc.query.search }"
-                      ></md-icon>
-                    </md-button>
-                  </div>
-                  <md-button
-                    class="md-icon-button"
-                    ng-click="vm_dc.getSmsAccountInteractions()"
-                    aria-label="refresh Interactions"
-                    translate
-                    translate-attr-label="SMS.REFRESH_INTERACTIONS"
-                  >
-                    <md-icon md-font-icon="icon-refresh"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-toolbar
-                class="md-table-toolbar md-accent"
-                ng-show="vm_dc.selectedSmsAccountInteractions.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead"
-                    >{{vm_dc.selectedSmsAccountInteractions.length}}
-                    {{vm_dc.selectedSmsAccountInteractions.length > 1 ? 'items'
-                    : 'item'}} selected</span
-                  >
-                  <div flex></div>
-                  <button
-                    class="md-icon-button"
-                    ng-csv="vm_dc.exportSelectedSmsAccountInteractions"
-                    csv-label="true"
-                    filename="smsAccounts.csv"
-                  >
-                    <md-icon md-font-icon="icon-file-excel"></md-icon>
-                  </button>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canDelete"
-                    class="md-icon-button"
-                    ng-click="vm_dc.deleteSelectedSmsAccountInteractions($event)"
-                    aria-label="delete selected"
-                    translate
-                    translate-attr-label="SMS.DELETE_SELECTED"
-                  >
-                    <md-icon md-font-icon="icon-delete"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-table-container class="font-size-12">
-                <table
-                  md-table
-                  md-row-select
-                  multiple
-                  ng-model="vm_dc.selectedSmsAccountInteractions"
-                  md-progress="vm_dc.promise"
-                >
-                  <thead
-                    md-head
-                    md-order="vm_dc.query.sort"
-                    md-on-reorder="vm_dc.getSmsAccountInteractions"
-                  >
-                    <tr md-row>
-                      <th md-column md-order-by="id">
-                        {{ 'SMS.ID' | translate }}
-                      </th>
-                      <th md-column class="no-padding">
-                        <md-icon md-font-icon="icon-eye" class="s16"></md-icon>
-                      </th>
-                      <th md-column class="no-padding"></th>
-                      <th md-column class="no-padding"></th>
-                      <th md-column>{{ 'SMS.CONTACT' | translate }}</th>
-                      <th md-column md-order-by="createdAt">
-                        {{ 'SMS.STARTEDAT' | translate }}
-                      </th>
-                      <th md-column md-order-by="lastMsgAt">
-                        {{ 'SMS.LASTMESSAGE' | translate }}
-                      </th>
-                      <th md-column md-order-by="closed">
-                        {{ 'SMS.STATUS' | translate }}
-                      </th>
-                      <th md-column>{{ 'SMS.AGENT' | translate }}</th>
-                      <th md-column md-order-by="tag">
-                        {{ 'SMS.TAGS' | translate }}
-                      </th>
-                      <th md-column width="10px"></th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr
-                      md-row
-                      md-select="interaction"
-                      md-select-id="id"
-                      ng-repeat="interaction in vm_dc.smsAccountInteractions.rows"
-                      ng-class="{'text-bold text-italic': interaction.unreadMessages > 0}"
-                    >
-                      <td md-cell>{{interaction.id}}</td>
-                      <td md-cell class="no-padding">
-                        <div
-                          ng-if="!interaction.closed && interaction.Users.length"
-                        >
-                          <md-icon
-                            md-font-icon="icon-eye"
-                            class="s16"
-                          ></md-icon>
-                          <md-tooltip>
-                            <span ng-repeat="user in interaction.Users"
-                              >{{ user.fullname | translate }}
-                              <span ng-if="!$last">, </span>
-                            </span>
-                          </md-tooltip>
-                        </div>
-                      </td>
-                      <td md-cell class="no-padding">
-                        <div
-                          ng-if="interaction.unreadMessages > 0"
-                          layout="row"
-                          layout-align="start center"
-                        >
-                          <span
-                            class="badge white-fg md-primary-bg"
-                            layout-margin
-                            >{{ interaction.unreadMessages}}</span
-                          >
-                        </div>
-                      </td>
-                      <td md-cell class="no-padding">
-                        <div ng-if="interaction.attach">
-                          <md-icon
-                            md-font-icon="icon-paperclip"
-                            class="s16"
-                          ></md-icon>
-                        </div>
-                      </td>
-                      <td md-cell>
-                        <div layout="column" layout-align="start start">
-                          <span
-                            class="font-size-12 text-truncate contact-text"
-                            ng-class="{'margin-bottom-0' : interaction.contactInfo}"
-                            layout-margin
-                            >{{ interaction.contactName }}</span
-                          >
-                          <span
-                            ng-if="interaction.contactInfo"
-                            class="font-size-12 text-truncate contact-text margin-top-0"
-                            layout-margin
-                            >{{ interaction.contactInfo }}</span
-                          >
-                        </div>
-                      </td>
-                      <td md-cell>{{ interaction.createdAt | formatdate }}</td>
-                      <td md-cell>
-                        <div layout="row">
-                          <span>
-                            <md-icon
-                              md-font-icon="{{interaction.lastMsgDirection == 'in' ? 'icon-arrow-down-bold blue-grey-800-fg' : 'icon-arrow-up-bold blue-grey-300-fg'}}"
-                            ></md-icon>
-                          </span>
-                          <div layout="column" layout-align="center center">
-                            <span class="text-truncate"
-                              >{{ interaction.lastMsgAt | formatdate }}</span
-                            >
-                          </div>
-                        </div>
-                      </td>
-                      <td md-cell>
-                        <span ng-if="interaction.closed === 0" class="green-fg">
-                          {{ 'SMS.OPENED' | translate }}
-                          <span ng-if="interaction.substatus">
-                            - {{ interaction.substatus }}
-                          </span>
-                        </span>
-                        <span ng-if="interaction.closed === 1" class="red-fg">
-                          {{ 'SMS.CLOSED' | translate }}
-                          <span ng-if="interaction.disposition">
-                            - {{ interaction.thirdDisposition ||
-                            interaction.secondDisposition ||
-                            interaction.disposition }}
-                          </span>
-                          <md-tooltip class="multiline">
-                            <div layout="column">
-                              <div layout="column">
-                                <span
-                                  >{{ 'DASHBOARDS.CLOSED_AT' |
-                                  translate}}:</span
-                                >
-                                <span class="text-bold"
-                                  >{{ interaction.closedAt | formatdate }}</span
-                                >
-                              </div>
-                              <div
-                                ng-if="interaction.disposition"
-                                layout="column"
-                              >
-                                <span
-                                  >{{ 'DASHBOARDS.DISPOSITION' |
-                                  translate}}:</span
-                                >
-                                <span class="text-bold"
-                                  >{{ interaction.disposition }}</span
-                                >
-                              </div>
-                              <div
-                                ng-if="interaction.secondDisposition"
-                                layout="column"
-                              >
-                                <span
-                                  >{{ 'DASHBOARDS.SECOND_LEVEL_DISPOSITION' |
-                                  translate}}:</span
-                                >
-                                <span class="text-bold"
-                                  >{{ interaction.secondDisposition }}</span
-                                >
-                              </div>
-                              <div
-                                ng-if="interaction.thirdDisposition"
-                                layout="column"
-                              >
-                                <span
-                                  >{{ 'DASHBOARDS.THIRD_LEVEL_DISPOSITION' |
-                                  translate}}:</span
-                                >
-                                <span class="text-bold"
-                                  >{{ interaction.thirdDisposition }}</span
-                                >
-                              </div>
-                            </div>
-                          </md-tooltip>
-                        </span>
-                      </td>
-
-                      <td md-cell>{{interaction.Owner.name}}</td>
-                      <td md-cell>
-                        <div ng-if="interaction.Tags.length">
-                          <md-tooltip md-direction="left" layout="row">
-                            <span ng-repeat="tag in interaction.Tags"
-                              >{{tag.name}}<span ng-if="!$last">, </span></span
-                            >
-                          </md-tooltip>
-                          <md-icon
-                            md-font-icon="icon-tag"
-                            ng-style="{'color': interaction.Tags.length == 1 && interaction.Tags[0].color }"
-                          >
-                          </md-icon>
-                        </div>
-                      </td>
-                      <td md-cell class="actions">
-                        <md-menu>
-                          <md-button
-                            class="md-icon-button"
-                            aria-label="More"
-                            translate
-                            translate-attr-aria-label="SMS.MORE"
-                            ng-click="$mdOpenMenu($event)"
-                          >
-                            <md-icon
-                              md-font-icon="icon-dots-vertical"
-                            ></md-icon>
-                          </md-button>
-
-                          <md-menu-content width="3">
-                            <md-menu-item>
-                              <md-button
-                                ng-click="vm_dc.spysmsInteraction($event, interaction)"
-                                translate="SMS.SPYINTERACTION"
-                              >
-                                Spy Interaction
-                              </md-button>
-                            </md-menu-item>
-                            <md-menu-item>
-                              <md-button
-                                class="md-primary"
-                                ng-click="vm_dc.smsInteractionDownload(interaction, $event)"
-                                translate="SMS.DOWNLOAD_INTERACTION"
-                              >
-                                Download
-                              </md-button>
-                            </md-menu-item>
-                            <md-menu-item
-                              ng-if="vm_dc.crudPermissions.canDelete"
-                            >
-                              <md-button
-                                ng-click="vm_dc.deleteConfirm(interaction, $event)"
-                                translate="SMS.DELETE_INTERACTION"
-                              >
-                                Delete Interaction
-                              </md-button>
-                            </md-menu-item>
-                          </md-menu-content>
-                        </md-menu>
-                      </td>
-                    </tr>
-                    <tr
-                      md-row
-                      ng-if="!vm_dc.smsAccountInteractions.rows.length"
-                    >
-                      <td md-cell colspan="12">
-                        <div layout="row" layout-align="center center">
-                          <span
-                            class="text-boxed-light"
-                            translate="SMS.NO_INTERACTION_AVAILABLE"
-                            >No interaction available</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-              <md-table-pagination
-                md-label="{page: '{{'SMS.PAGE' | translate}}:', rowsPerPage: '{{'SMS.ROWSPERPAGE' | translate}}:', of: '{{'SMS.OF' | translate}}'}"
-                md-limit="vm_dc.query.limit"
-                md-limit-options="[10, 15, 20, 50, 100, 250]"
-                md-page="vm_dc.query.page"
-                md-total="{{vm_dc.smsAccountInteractions.count}}"
-                md-on-paginate="vm_dc.getSmsAccountInteractions"
-                md-page-select
-              ></md-table-pagination>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/view.html/view.html b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/view.html/view.html
new file mode 100644
index 0000000..d4fa3b2
--- /dev/null
+++ b/public/src/js/modules/main/apps/sms/views/smsAccounts/edit/view.html/view.html
@@ -0,0 +1,1975 @@
+<div id="sms-smsAccount" class="page-layout simple tabbed" layout="column">
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-smsAccounts-button md-icon-button"
+        aria-label="Go to smsAccounts"
+        ng-click="vm.gotoSmsAccounts()"
+        translate
+        translate-attr-aria-label="SMS.GO_TO_SMSACCOUNTS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="smsAccount-image" hide-xs>
+          <img ng-src="assets/images/business/smsAccounts.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.smsAccount.id}}
+            <span ng-if="vm.smsAccount.name">{{vm.smsAccount.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="SMS.CREATED_AT"></span>
+            <span>{{vm.smsAccount.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.agentadddialog(vm.smsAccount, $event)"
+        class="md-fab md-warn md-icon-button"
+        aria-label="agentadd"
+      >
+        <md-tooltip
+          ><span translate="SMS.AGENTADD_SMSACCOUNT"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
+      </md-button>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveSmsAccount()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (notificationForm.$invalid) || (transferForm.$invalid) || (proxyForm.$invalid) || (dispositionForm.$invalid) || (smsDispositionsForm.$invalid) || (smsCannedAnswersForm.$invalid) || (actionsForm.$invalid) || (interactionsForm.$invalid)"
+        translate="SMS.SAVE"
+        translate-attr-aria-label="SMS.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="SMS.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="smsAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="SMS.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="SMS.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.smsAccount.name"
+                  ng-required="true"
+                  autofocus
+                  disabled
+                />
+
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="SMS.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="SMS.KEY">key</label>
+                <input
+                  type="text"
+                  name="key"
+                  ng-model="vm.smsAccount.key"
+                  md-maxlength="5"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['key'].$error"
+                  ng-show="generalForm['key'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="SMS.ERRORS.KEY_REQUIRED"
+                      >key field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="SMS.ERRORS.KEY_MAX_LENGTH"
+                      translate-values="{max: 5}"
+                      >key must have a maximum length equal to 5</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="SMS.LIST">List</label>
+                <md-select
+                  name="ListId"
+                  ng-model="vm.smsAccount.ListId"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="ListId.id"
+                    ng-repeat="ListId in vm.lists"
+                    ng-disabled="ListId.canSelect === false"
+                    >{{ ListId.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint"><span translate="SMS.HELP.LIST"></span></div>
+                <div
+                  ng-messages="generalForm['ListId'].$error"
+                  ng-show="generalForm['ListId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="SMS.ERRORS.LIST_REQUIRED"
+                      >List field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="SMS.TYPE">Type</label>
+                <md-select
+                  name="type"
+                  ng-model="vm.smsAccount.type"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'twilio'">Twilio</md-option>
+                  <md-option ng-value="'skebby'">Skebby</md-option>
+                  <md-option ng-value="'connectel'">Connectel</md-option>
+                  <md-option ng-value="'clicksend'">ClickSend</md-option>
+                  <md-option ng-value="'plivo'">Plivo</md-option>
+                  <md-option ng-value="'infobip'">Infobip</md-option>
+                  <md-option ng-value="'clickatell'">Clickatell</md-option>
+                  <md-option ng-value="'csc'">CSCTelecom</md-option>
+                  <md-option ng-value="'intelepeer'">Intelepeer</md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['type'].$error"
+                  ng-show="generalForm['type'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="SMS.ERRORS.TYPE_REQUIRED"
+                      >Type field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="SMS.PHONE">Phone</label>
+                <input
+                  type="text"
+                  name="phone"
+                  ng-model="vm.smsAccount.phone"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['phone'].$error"
+                  ng-show="generalForm['phone'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="SMS.ERRORS.PHONE_REQUIRED"
+                      >Phone field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.smsAccount.type == 'twilio'"
+                class="md-block"
+              >
+                <label translate="SMS.ACCOUNTSID">AccountSID</label>
+                <input
+                  type="text"
+                  name="accountSid"
+                  ng-model="vm.smsAccount.accountSid"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['accountSid'].$error"
+                  ng-show="generalForm['accountSid'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="SMS.ERRORS.ACCOUNTSID_REQUIRED"
+                      >AccountSID field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.smsAccount.type == 'plivo'"
+                class="md-block"
+              >
+                <label translate="SMS.AUTHID">AuthID</label>
+                <input
+                  type="text"
+                  name="authId"
+                  ng-model="vm.smsAccount.authId"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['authId'].$error"
+                  ng-show="generalForm['authId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="SMS.ERRORS.AUTHID_REQUIRED"
+                      >AuthID field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.smsAccount.type == 'twilio' || vm.smsAccount.type == 'connectel' || vm.smsAccount.type == 'plivo'"
+                class="md-block"
+              >
+                <label translate="SMS.AUTHTOKEN">AuthToken</label>
+                <input
+                  type="text"
+                  name="authToken"
+                  ng-model="vm.smsAccount.authToken"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['authToken'].$error"
+                  ng-show="generalForm['authToken'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="SMS.ERRORS.AUTHTOKEN_REQUIRED"
+                      >AuthToken field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.smsAccount.type == 'skebby'"
+                class="md-block"
+              >
+                <label translate="SMS.METHOD">Method</label>
+                <md-select
+                  name="smsMethod"
+                  ng-model="vm.smsAccount.smsMethod"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'SI'">Basic</md-option>
+                  <md-option ng-value="'TI'">Classic</md-option>
+                  <md-option ng-value="'GP'">Classic+</md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['smsMethod'].$error"
+                  ng-show="generalForm['smsMethod'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="SMS.ERRORS.METHOD_REQUIRED"
+                      >Method field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.smsAccount.type == 'skebby' || vm.smsAccount.type == 'clicksend' || vm.smsAccount.type == 'csc' || vm.smsAccount.type == 'infobip'"
+                class="md-block"
+              >
+                <label translate="SMS.USERNAME">Username</label>
+                <input
+                  type="text"
+                  name="username"
+                  ng-model="vm.smsAccount.username"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['username'].$error"
+                  ng-show="generalForm['username'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="SMS.ERRORS.USERNAME_REQUIRED"
+                      >Username field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                class="md-block"
+                ng-if="vm.smsAccount.type == 'skebby' || vm.smsAccount.type == 'clicksend' || vm.smsAccount.type == 'infobip'"
+              >
+                <label translate="SMS.PASSWORD">Password</label>
+                <input
+                  type="password"
+                  name="password"
+                  ng-model="vm.smsAccount.password"
+                  placeholder="Password"
+                  translate
+                  translate-attr-placeholder="SMS.PASSWORD"
+                  required
+                />
+                <div ng-messages="generalForm['password'].$error" role="alert">
+                  <div ng-message="required">
+                    <span translate="SMS.ERRORS.PASSWORD_REQUIRED"
+                      >Password field is required</span
+                    >
+                  </div>
+                  <div ng-message="pattern">
+                    <span translate="SMS.ERRORS.SECURE_PASSWORD_PATTERN"
+                      >Must contain at least 8 characters, with a minimum of 1
+                      lowercase letter, 1 uppercase letter, 1 numeric character
+                      and 1 special character ~!?*@#$%^&-_=+[{]}.</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+
+              <md-input-container
+                ng-if="vm.smsAccount.type == 'infobip' || vm.smsAccount.type == 'csc'"
+                class="md-block"
+              >
+                <label translate="SMS.BASEURL">BaseURL</label>
+                <input
+                  type="text"
+                  name="baseUrl"
+                  ng-model="vm.smsAccount.baseUrl"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['baseUrl'].$error"
+                  ng-show="generalForm['baseUrl'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="SMS.ERRORS.BASEURL_REQUIRED"
+                      >BaseURL field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.smsAccount.type == 'csc' || vm.smsAccount.type == 'clickatell' || vm.smsAccount.type == 'intelepeer'"
+                class="md-block"
+              >
+                <label translate="SMS.APIKEY">ApiKey</label>
+                <input
+                  type="text"
+                  name="apiKey"
+                  ng-model="vm.smsAccount.apiKey"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['apiKey'].$error"
+                  ng-show="generalForm['apiKey'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="SMS.ERRORS.APIKEY_REQUIRED"
+                      >ApiKey field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.smsAccount.type == 'connectel' || vm.smsAccount.type == 'clicksend' || vm.smsAccount.type == 'plivo'|| vm.smsAccount.type == 'csc'|| vm.smsAccount.type == 'infobip' || vm.smsAccount.type == 'intelepeer'"
+                class="md-block"
+              >
+                <label translate="SMS.SENDERSTRING">SenderString</label>
+                <input
+                  type="text"
+                  name="senderString"
+                  ng-model="vm.smsAccount.senderString"
+                  md-maxlength="11"
+                  ng-pattern="/^[A-Za-z0-9\.\s]*$/i"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['senderString'].$error"
+                  ng-show="generalForm['senderString'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="SMS.ERRORS.SENDERSTRING_REQUIRED"
+                      >SenderString field is required</span
+                    >
+                  </div>
+                  <div ng-message="pattern">
+                    <span
+                      translate="SMS.ERRORS.SENDERSTRING_MUST_VALID_PATTERN"
+                      translate-values="{ regex: '/^[A-Za-z0-9\.\s]*$/i' }"
+                      >SenderString must be valid pattern
+                    </span>
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="SMS.ERRORS.SENDERSTRING_MAX_LENGTH"
+                      translate-values="{max: 11}"
+                      >SenderString must have a maximum length equal to 11</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="(vm.smsAccount.type == 'skebby' && vm.smsAccount.smsMethod == 'GP') || vm.smsAccount.type == 'connectel' || vm.smsAccount.type == 'clicksend' || vm.smsAccount.type == 'csc' || vm.smsAccount.type == 'clickatell'"
+                class="md-block"
+              >
+                <md-switch
+                  ng-model="vm.smsAccount.deliveryReport"
+                  aria-label="deliveryReport"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="SMS.DELIVERYREPORT"
+                    >deliveryReport</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="SMS.WAITFORTHEASSIGNEDAGENT"
+                  >WaitForTheAssignedAgent</label
+                >
+                <input
+                  type="number"
+                  name="waitForTheAssignedAgent"
+                  ng-model="vm.smsAccount.waitForTheAssignedAgent"
+                  min="1"
+                  max="2147483"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['waitForTheAssignedAgent'].$error"
+                  ng-show="generalForm['waitForTheAssignedAgent'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="SMS.ERRORS.WAITFORTHEASSIGNEDAGENT_REQUIRED"
+                      >WaitForTheAssignedAgent field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="SMS.ERRORS.WAITFORTHEASSIGNEDAGENT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >WaitForTheAssignedAgent must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="SMS.ERRORS.WAITFORTHEASSIGNEDAGENT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >WaitForTheAssignedAgent must be a valid greater or equal
+                      than</span
+                    >
+                    <span>2147483</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="SMS.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.smsAccount.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="SMS.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="SMS.RECEIVEURL">receiveUrl</label>
+                <div layout="row" layout-align="center center">
+                  <button
+                    class="md-button md-fab md-mini md-primary"
+                    ngclipboard
+                    data-clipboard-target="#copytoclipboard-receiveUrl"
+                    ngclipboard-success="vm.alert({title: 'copied to clipboard', msg: e.text});"
+                    ngclipboard-error="vm.alert({title: 'error', msg: 'copy to clipboard failed'});"
+                  >
+                    <md-icon md-font-icon="icon-clipboard-text"></md-icon>
+                  </button>
+                  <input
+                    class="md-input"
+                    type="text"
+                    id="copytoclipboard-receiveUrl"
+                    name="receiveUrl"
+                    ng-value="vm.smsAccount.remote + '/api/sms/accounts/' + vm.smsAccount.id + '/notify?token=' + vm.smsAccount.token"
+                    ng-readonly="true"
+                  />
+                </div>
+                <div class="hint">
+                  <span translate="SMS.HELP.RECEIVEURL"></span>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="( (vm.smsAccount.type == 'skebby' && vm.smsAccount.smsMethod == 'GP') || vm.smsAccount.type == 'connectel' || vm.smsAccount.type == 'clicksend' || vm.smsAccount.type == 'csc' || vm.smsAccount.type == 'clickatell') && vm.smsAccount.deliveryReport"
+                class="md-block"
+              >
+                <label translate="SMS.DELIVERYREPORTURL"
+                  >deliveryReportUrl</label
+                >
+                <div layout="row" layout-align="center center">
+                  <button
+                    class="md-button md-fab md-mini md-primary"
+                    ngclipboard
+                    data-clipboard-target="#copytoclipboard-deliveryReportUrl"
+                    ngclipboard-success="vm.alert({title: 'copied to clipboard', msg: e.text});"
+                    ngclipboard-error="vm.alert({title: 'error', msg: 'copy to clipboard failed'});"
+                  >
+                    <md-icon md-font-icon="icon-clipboard-text"></md-icon>
+                  </button>
+                  <input
+                    class="md-input"
+                    type="text"
+                    id="copytoclipboard-deliveryReportUrl"
+                    name="deliveryReportUrl"
+                    ng-value="vm.smsAccount.remote + '/api/sms/accounts/' + vm.smsAccount.id + '/status?token=' + vm.smsAccount.token + (vm.smsAccount.type == 'csc' ? '&message-id={message-id}&state={state}' : '')"
+                    ng-readonly="true"
+                  />
+                </div>
+                <div class="hint">
+                  <span translate="SMS.HELP.DELIVERYREPORTURL"></span>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="smsAccount-detail-form-container notification md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="SMS.NOTIFICATION">
+                NOTIFICATION
+              </div>
+            </div>
+            <form name="notificationForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.smsAccount.notificationSound"
+                  aria-label="notificationSound"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="SMS.NOTIFICATIONSOUND"
+                    >notificationSound</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.smsAccount.notificationShake"
+                  aria-label="notificationShake"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="SMS.NOTIFICATIONSHAKE"
+                    >notificationShake</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <div class="md-block">
+                <label
+                  class="md-caption grey-fg"
+                  translate="SMS.NOTIFICATIONTEMPLATE"
+                  >notificationTemplate</label
+                >
+                <textarea
+                  aria-label="notificationTemplate notificationTemplate"
+                  ckeditor="{ skin: 'office2013', language: 'en', allowedContent: true, extraPlugins: 'font,colorbutton,autoembed,autocorrect,googlethisterm,pastebase64', toolbarGroups: [{ name: 'styles', groups: ['styles'] }, { name: 'clipboard', groups: ['undo'] }, { name: 'colors', groups: ['colors'] }, { name: 'basicstyles', groups: ['basicstyles'] }, { name: 'paragraph', groups: ['list', 'indent', 'align'] }, { name: 'mode' }], autocorrect_enabled: true, disableNativeSpellChecker: false, fontSize_sizes: '8/8pt;9/9pt;10/10pt;11/11pt;12/12pt;14/14pt;16/16pt;18/18pt;20/20pt;22/22pt;24/24pt;26/26pt;28/28pt;36/36pt;48/48pt;72/72pt',  removePlugins: 'magicline' }"
+                  ng-model="vm.smsAccount.notificationTemplate"
+                ></textarea>
+              </div>
+            </form>
+          </div>
+          <div
+            class="smsAccount-detail-form-container transfer md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="SMS.TRANSFER">
+                TRANSFER
+              </div>
+            </div>
+            <form name="transferForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.smsAccount.queueTransfer"
+                  aria-label="queueTransfer"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="SMS.QUEUETRANSFER"
+                    >queueTransfer</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.smsAccount.queueTransfer == true"
+                class="md-block"
+              >
+                <label translate="SMS.QUEUETRANSFERTIMEOUT"
+                  >queueTransferTimeout</label
+                >
+                <input
+                  type="number"
+                  name="queueTransferTimeout"
+                  ng-model="vm.smsAccount.queueTransferTimeout"
+                  min="1"
+                  max="2147483"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="transferForm['queueTransferTimeout'].$error"
+                  ng-show="transferForm['queueTransferTimeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="SMS.ERRORS.QUEUETRANSFERTIMEOUT_REQUIRED"
+                      >queueTransferTimeout field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="SMS.ERRORS.QUEUETRANSFERTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >queueTransferTimeout must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="SMS.ERRORS.QUEUETRANSFERTIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >queueTransferTimeout must be a valid greater or equal
+                      than</span
+                    >
+                    <span>2147483</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.smsAccount.agentTransfer"
+                  aria-label="agentTransfer"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="SMS.AGENTTRANSFER"
+                    >agentTransfer</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.smsAccount.agentTransfer == true"
+                class="md-block"
+              >
+                <label translate="SMS.AGENTTRANSFERTIMEOUT"
+                  >agentTransferTimeout</label
+                >
+                <input
+                  type="number"
+                  name="agentTransferTimeout"
+                  ng-model="vm.smsAccount.agentTransferTimeout"
+                  min="1"
+                  max="2147483"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="transferForm['agentTransferTimeout'].$error"
+                  ng-show="transferForm['agentTransferTimeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="SMS.ERRORS.AGENTTRANSFERTIMEOUT_REQUIRED"
+                      >agentTransferTimeout field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="SMS.ERRORS.AGENTTRANSFERTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >agentTransferTimeout must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="SMS.ERRORS.AGENTTRANSFERTIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >agentTransferTimeout must be a valid greater or equal
+                      than</span
+                    >
+                    <span>2147483</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="SMS.ADVANCED">ADVANCED</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="smsAccount-detail-form-container proxy md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="SMS.PROXY">PROXY</div>
+            </div>
+            <form name="proxyForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="SMS.TOKEN">token</label>
+                <input
+                  type="text"
+                  name="token"
+                  ng-model="vm.smsAccount.token"
+                  autofocus
+                  disabled
+                />
+
+                <div
+                  ng-messages="proxyForm['token'].$error"
+                  ng-show="proxyForm['token'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="SMS.ERRORS.TOKEN_REQUIRED"
+                      >token field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="SMS.MOTIONPROXY">MotionProxy</label>
+                <input
+                  type="url"
+                  name="remote"
+                  ng-model="vm.smsAccount.remote"
+                  md-maxlength="255"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="SMS.HELP.MOTIONPROXY"></span>
+                </div>
+                <div
+                  ng-messages="proxyForm['remote'].$error"
+                  ng-show="proxyForm['remote'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="SMS.ERRORS.MOTIONPROXY_REQUIRED"
+                      >MotionProxy field is required</span
+                    >
+                  </div>
+                  <div ng-message="url">
+                    <span translate="SMS.ERRORS.MOTIONPROXY_MUST_VALID_URL"
+                      >MotionProxy must be a valid url
+                      http://www.xcally.com</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="SMS.ERRORS.MOTIONPROXY_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >MotionProxy must have a maximum length equal to 255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="smsAccount-detail-form-container disposition md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="SMS.DISPOSITION">
+                DISPOSITION
+              </div>
+            </div>
+            <form name="dispositionForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.smsAccount.mandatoryDisposition"
+                  aria-label="MandatoryDisposition"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="SMS.MANDATORYDISPOSITION"
+                    >MandatoryDisposition</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.smsAccount.mandatoryDisposition"
+                class="md-block"
+              >
+                <label translate="SMS.MANDATORYDISPOSITIONPAUSEID"
+                  >MandatoryDispositionPauseId</label
+                >
+                <md-select
+                  name="mandatoryDispositionPauseId"
+                  ng-model="vm.smsAccount.mandatoryDispositionPauseId"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="mandatoryDispositionPauseId.id"
+                    ng-repeat="mandatoryDispositionPauseId in vm.pauses"
+                    ng-disabled="mandatoryDispositionPauseId.canSelect === false"
+                    >{{ mandatoryDispositionPauseId.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span translate="SMS.HELP.MANDATORYDISPOSITIONPAUSEID"></span>
+                </div>
+                <div
+                  ng-messages="dispositionForm['mandatoryDispositionPauseId'].$error"
+                  ng-show="dispositionForm['mandatoryDispositionPauseId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="SMS.ERRORS.MANDATORYDISPOSITIONPAUSEID_REQUIRED"
+                      >MandatoryDispositionPauseId field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="SMS.DISPOSITIONS">DISPOSITIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            ng-controller="SmsAccountDispositionsController as vm_dc"
+            ng-init="vm_dc.init(vm.smsAccount, vm.crudPermissions)"
+          >
+            <div layout="row">
+              <div class="column" flex="20">
+                <md-card class="mt-0">
+                  <md-card-content>
+                    <button
+                      layout-align="center center"
+                      md-mini-fab
+                      ng-click="vm_dc.query.level = null; vm_dc.getDispositions()"
+                    >
+                      <div layout="row" layout-align="start center">
+                        <md-icon md-font-icon="icon-refresh"></md-icon>
+                        <span class="ph-5"
+                          >{{ 'TOOLS.ALL_DISPOSITIONS' | translate }}</span
+                        >
+                      </div>
+                    </button>
+                  </md-card-content>
+                </md-card>
+                <md-card>
+                  <md-card-content>
+                    <md-input-container class="md-block" flex-gt-sm="">
+                      <label translate="TOOLS.SELECT_LEVEL"
+                        >Select a level</label
+                      >
+                      <md-select
+                        placeholder="{{ 'TOOLS.SELECT_LEVEL' | translate }}"
+                        ng-model="vm_dc.query.level"
+                        ng-change="vm_dc.getDispositions()"
+                      >
+                        <md-option ng-value="null"
+                          ><em translate="TOOLS.ALL">All</em></md-option
+                        >
+                        <md-option
+                          ng-value="key"
+                          ng-repeat="(key, value) in vm_dc.levels"
+                          >{{ value }}</md-option
+                        >
+                      </md-select>
+                    </md-input-container>
+                  </md-card-content>
+                </md-card>
+              </div>
+              <div
+                class="smsAccount-detail-form-container smsdispositions md-background-bg md-whiteframe-1dp"
+                flex="80"
+              >
+                <md-toolbar
+                  class="md-table-toolbar md-default"
+                  ng-hide="vm_dc.selectedSmsAccountDispositions.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead" translate="SMS.DISPOSITIONS"
+                      >Dispositions</span
+                    >
+                    <ms-search-bar
+                      on-search="vm_dc.query.filter = query"
+                      on-collapse="vm_dc.query.filter = undefined"
+                      debounce="300"
+                      direction="down"
+                    ></ms-search-bar>
+                    <div flex></div>
+                    <md-button
+                      ng-if="vm_dc.crudPermissions.canEdit"
+                      class="md-icon-button"
+                      ng-click="vm_dc.createOrEditDisposition($event)"
+                      aria-label="Add sms dispositions"
+                      translate
+                      translate-attr-label="SMS.ADD_DISPOSITION"
+                    >
+                      <md-icon md-font-icon="icon-plus"></md-icon>
+                    </md-button>
+                  </div>
+                </md-toolbar>
+                <md-toolbar
+                  class="md-table-toolbar md-accent"
+                  ng-show="vm_dc.selectedDispositions.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead"
+                      >{{vm_dc.selectedDispositions.length}}
+                      {{vm_dc.selectedDispositions.length > 1 ? 'items' :
+                      'item'}} selected</span
+                    >
+                    <div flex></div>
+                    <button
+                      class="md-icon-button"
+                      ng-csv="vm_dc.exportSelectedDispositions"
+                      csv-label="true"
+                      filename="smsAccounts.csv"
+                    >
+                      <md-icon md-font-icon="icon-file-excel"></md-icon>
+                    </button>
+                    <md-button
+                      ng-if="vm_dc.crudPermissions.canDelete"
+                      class="md-icon-button"
+                      ng-click="vm_dc.deleteSelectedDispositions($event)"
+                      aria-label="delete selected"
+                      translate
+                      translate-attr-label="SMS.DELETE_SELECTED"
+                    >
+                      <md-icon md-font-icon="icon-delete"></md-icon>
+                    </md-button>
+                  </div>
+                </md-toolbar>
+                <md-table-container>
+                  <table
+                    md-table
+                    md-row-select
+                    multiple
+                    ng-model="vm_dc.selectedDispositions"
+                    md-progress="vm_dc.promise"
+                  >
+                    <thead
+                      md-head
+                      md-order="vm_dc.query.sort"
+                      md-on-reorder="vm_dc.getDispositions"
+                    >
+                      <tr md-row>
+                        <th md-column md-order-by="id">
+                          {{ 'SMS.ID' | translate }}
+                        </th>
+                        <th md-column md-order-by="level">
+                          {{ 'TOOLS.LEVEL' | translate }}
+                        </th>
+                        <th md-column md-order-by="name">
+                          {{ 'SMS.NAME' | translate }}
+                        </th>
+                        <th md-column md-order-by="description">
+                          {{ 'SMS.DESCRIPTION' | translate }}
+                        </th>
+                        <th md-column width="10px"></th>
+                      </tr>
+                    </thead>
+                    <tbody md-body>
+                      <tr md-row ng-hide="vm_dc.dispositions.rows.length">
+                        <td md-cell colspan="5">
+                          <div layout="row" layout-align="center center">
+                            <span translate="SMS.NO_AVAILABLE_INFO"
+                              >No Available Info</span
+                            >
+                          </div>
+                        </td>
+                      </tr>
+                      <tr
+                        md-row
+                        md-select="disposition"
+                        md-select-id="id"
+                        ng-repeat="disposition in vm_dc.dispositions.rows"
+                      >
+                        <td
+                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                          md-cell
+                          class="id"
+                        >
+                          {{disposition.id}}
+                        </td>
+                        <td
+                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                          md-cell
+                          class="level"
+                        >
+                          {{ vm_dc.levels[disposition.level] }}
+                        </td>
+                        <td
+                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                          md-cell
+                          class="name"
+                        >
+                          {{disposition.name}}
+                        </td>
+                        <td
+                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                          md-cell
+                          class="description"
+                        >
+                          {{disposition.description}}
+                        </td>
+                        <td
+                          md-cell
+                          class="actions"
+                          ng-if="!vm_dc.crudPermissions.readOnly"
+                        >
+                          <md-menu>
+                            <md-button
+                              class="md-icon-button"
+                              aria-label="More"
+                              translate
+                              translate-attr-aria-label="SMS.MORE"
+                              ng-click="$mdOpenMenu($event)"
+                            >
+                              <md-icon
+                                md-font-icon="icon-dots-vertical"
+                              ></md-icon>
+                            </md-button>
+                            <md-menu-content width="3">
+                              <!-- SUBACTIONS -->
+                              <!-- ACTIONS -->
+                              <md-menu-item
+                                ng-if="vm_dc.crudPermissions.canEdit"
+                              >
+                                <md-button
+                                  ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                                  translate="TOOLS.EDIT_DISPOSITION"
+                                >
+                                  Edit Disposition
+                                </md-button>
+                              </md-menu-item>
+                              <!-- SUBACTIONS -->
+                              <!-- ACTIONS -->
+                              <md-menu-item
+                                ng-if="vm_dc.crudPermissions.canDelete"
+                              >
+                                <md-button
+                                  ng-click="vm_dc.deleteConfirm(disposition, $event)"
+                                  translate="TOOLS.DELETE_DISPOSITION"
+                                >
+                                  Delete Disposition
+                                </md-button>
+                              </md-menu-item>
+                            </md-menu-content>
+                          </md-menu>
+                        </td>
+                      </tr>
+                    </tbody>
+                  </table>
+                </md-table-container>
+                <md-table-pagination
+                  md-label="{page: '{{'SMS.PAGE' | translate}}:', rowsPerPage: '{{'SMS.ROWSPERPAGE' | translate}}:', of: '{{'SMS.OF' | translate}}'}"
+                  md-limit="vm_dc.query.limit"
+                  md-limit-options="[10, 15, 20, 50, 100, 250]"
+                  md-page="vm_dc.query.page"
+                  md-total="{{vm_dc.dispositions.count}}"
+                  md-on-paginate="vm_dc.getDispositions"
+                  md-page-select
+                >
+                </md-table-pagination>
+              </div>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="SMS.CANNEDANSWERS">CANNEDANSWERS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="smsAccount-detail-form-container smscannedanswers md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="SmsAccountSmsCannedAnswersController as vm_dc"
+              ng-init="vm_dc.init(vm.smsAccount, vm.crudPermissions)"
+            >
+              <md-toolbar
+                class="md-table-toolbar md-default"
+                ng-hide="vm_dc.selectedSmsAccountSmsCannedAnswers.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead" translate="SMS.SMSCANNEDANSWERS"
+                    >SmsCannedAnswers</span
+                  >
+                  <ms-search-bar
+                    on-search="vm_dc.query.filter = query"
+                    on-collapse="vm_dc.query.filter = undefined"
+                    debounce="300"
+                    direction="down"
+                  ></ms-search-bar>
+                  <div flex></div>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canEdit"
+                    class="md-icon-button"
+                    ng-click="vm_dc.createOrEditSmsAccountSmsCannedAnswer($event)"
+                    aria-label="add smsCannedAnswer"
+                    translate
+                    translate-attr-label="SMS.ADD_SMSCANNEDANSWER"
+                  >
+                    <md-icon md-font-icon="icon-plus"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-toolbar
+                class="md-table-toolbar md-accent"
+                ng-show="vm_dc.selectedSmsAccountSmsCannedAnswers.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead"
+                    >{{vm_dc.selectedSmsAccountSmsCannedAnswers.length}}
+                    {{vm_dc.selectedSmsAccountSmsCannedAnswers.length > 1 ?
+                    'items' : 'item'}} selected</span
+                  >
+                  <div flex></div>
+                  <button
+                    class="md-icon-button"
+                    ng-csv="vm_dc.exportSelectedSmsAccountSmsCannedAnswers"
+                    csv-label="true"
+                    filename="smsAccounts.csv"
+                  >
+                    <md-icon md-font-icon="icon-file-excel"></md-icon>
+                  </button>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canDelete"
+                    class="md-icon-button"
+                    ng-click="vm_dc.deleteSelectedSmsAccountSmsCannedAnswers($event)"
+                    aria-label="delete selected"
+                    translate
+                    translate-attr-label="SMS.DELETE_SELECTED"
+                  >
+                    <md-icon md-font-icon="icon-delete"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-table-container class="font-size-12">
+                <table
+                  md-table
+                  md-row-select
+                  multiple
+                  ng-model="vm_dc.selectedSmsAccountSmsCannedAnswers"
+                  md-progress="vm_dc.promise"
+                >
+                  <thead
+                    md-head
+                    md-order="vm_dc.query.sort"
+                    md-on-reorder="vm_dc.getSmsAccountSmsCannedAnswers"
+                  >
+                    <tr md-row>
+                      <th md-column md-order-by="id">
+                        {{ 'SMS.ID' | translate }}
+                      </th>
+                      <th md-column md-order-by="key">
+                        {{ 'SMS.KEY' | translate }}
+                      </th>
+                      <th md-column md-order-by="value">
+                        {{ 'SMS.VALUE' | translate }}
+                      </th>
+                      <th md-column md-order-by="description">
+                        {{ 'SMS.DESCRIPTION' | translate }}
+                      </th>
+                      <th md-column md-order-by="createdAt">
+                        {{ 'SMS.CREATED_AT' | translate }}
+                      </th>
+                      <th md-column width="10px"></th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr
+                      md-row
+                      md-select="smsCannedAnswer"
+                      md-select-id="id"
+                      ng-repeat="smsCannedAnswer in vm_dc.smsAccountSmsCannedAnswers.rows"
+                    >
+                      <td
+                        ng-click="vm_dc.createOrEditSmsAccountSmsCannedAnswer($event, smsCannedAnswer)"
+                        md-cell
+                      >
+                        {{smsCannedAnswer.id}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditSmsAccountSmsCannedAnswer($event, smsCannedAnswer)"
+                        md-cell
+                      >
+                        {{smsCannedAnswer.key}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditSmsAccountSmsCannedAnswer($event, smsCannedAnswer)"
+                        md-cell
+                      >
+                        {{smsCannedAnswer.value}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditSmsAccountSmsCannedAnswer($event, smsCannedAnswer)"
+                        md-cell
+                      >
+                        {{smsCannedAnswer.description}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditSmsAccountSmsCannedAnswer($event, smsCannedAnswer)"
+                        md-cell
+                      >
+                        {{ smsCannedAnswer.createdAt | formatdate }}
+                      </td>
+                      <td
+                        md-cell
+                        class="actions"
+                        ng-if="!vm_dc.crudPermissions.readOnly"
+                      >
+                        <md-menu>
+                          <md-button
+                            class="md-icon-button"
+                            aria-label="More"
+                            translate
+                            translate-attr-aria-label="SMS.MORE"
+                            ng-click="$mdOpenMenu($event)"
+                          >
+                            <md-icon
+                              md-font-icon="icon-dots-vertical"
+                            ></md-icon>
+                          </md-button>
+
+                          <md-menu-content width="3">
+                            <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
+                              <md-button
+                                ng-click="vm_dc.createOrEditSmsAccountSmsCannedAnswer($event, smsCannedAnswer)"
+                                translate="SMS.EDIT_SMSCANNEDANSWER"
+                              >
+                                Edit SmsCannedAnswer
+                              </md-button>
+                            </md-menu-item>
+                            <md-menu-item
+                              ng-if="vm_dc.crudPermissions.canDelete"
+                            >
+                              <md-button
+                                ng-click="vm_dc.deleteConfirm(smsCannedAnswer, $event)"
+                                translate="SMS.DELETE_SMSCANNEDANSWER"
+                              >
+                                Delete SmsCannedAnswer
+                              </md-button>
+                            </md-menu-item>
+                          </md-menu-content>
+                        </md-menu>
+                      </td>
+                    </tr>
+                    <tr
+                      md-row
+                      ng-if="!vm_dc.smsAccountSmsCannedAnswers.rows.length"
+                    >
+                      <td md-cell colspan="7">
+                        <div layout="row" layout-align="center center">
+                          <span
+                            class="text-boxed-light"
+                            translate="SMS.NO_SMSCANNEDANSWER_AVAILABLE"
+                            >No smscannedanswer available</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+              <md-table-pagination
+                md-label="{page: '{{'SMS.PAGE' | translate}}:', rowsPerPage: '{{'SMS.ROWSPERPAGE' | translate}}:', of: '{{'SMS.OF' | translate}}'}"
+                md-limit="vm_dc.query.limit"
+                md-limit-options="[10, 15, 20, 50, 100, 250]"
+                md-page="vm_dc.query.page"
+                md-total="{{vm_dc.smsAccountSmsCannedAnswers.count}}"
+                md-on-paginate="vm_dc.getSmsAccountSmsCannedAnswers"
+                md-page-select
+              ></md-table-pagination>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="SMS.ACTIONS">ACTIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="smsAccount-detail-form-container actions md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="SmsAccountActionsController as vm_ac"
+              ng-init="vm_ac.init(vm.smsAccount, vm.crudPermissions)"
+              class="content"
+              md-background-bg
+              layout="row"
+              layout-align="start start"
+            >
+              <!-- SIDENAV -->
+              <div
+                class="navigation-simple sidenav main-sidenav md-background-bg md-whiteframe-1dp"
+                ms-scroll
+                layout="column"
+                flex="20"
+                ng-if="vm_ac.crudPermissions.canEdit"
+              >
+                <!-- SIDENAV CONTENT -->
+                <md-list class="no-padding">
+                  <md-subheader class="md-no-sticky">
+                    <span translate="VOICE.APPLICATIONS_LIST">
+                      Applications List
+                    </span>
+                  </md-subheader>
+                </md-list>
+                <md-divider></md-divider>
+                <md-list ng-sortable="vm_ac.list">
+                  <md-list-item class="handle" ng-repeat="a in vm_ac.apps">
+                    <md-icon md-font-icon="{{a.icon}}" class="s16"></md-icon>
+                    <p
+                      class="text-truncate"
+                      translate="SMS.{{(a.alias || a.appType) | uppercase}}"
+                    >
+                      {{a.alias || a.appType}}
+                    </p>
+                  </md-list-item>
+                </md-list>
+                <!-- / SIDENAV CONTENT -->
+              </div>
+              <!-- / SIDENAV -->
+              <div flex></div>
+              <!-- MAIN -->
+              <div
+                class="main scrollable md-background-bg md-whiteframe-1dp"
+                ms-scroll
+                layout="column"
+                flex="{{vm_ac.crudPermissions.canEdit ? 75 : 100}}"
+              >
+                <md-toolbar
+                  class="md-table-toolbar md-default"
+                  ng-hide="vm_ac.selectedSmsAccountApps.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead">Drag & Drop Routing</span>
+                    <div flex></div>
+                    <ms-search-bar
+                      on-search="vm_ac.query.filter = query"
+                      on-collapse="vm_ac.query.filter = undefined"
+                      debounce="300"
+                    ></ms-search-bar>
+                  </div>
+                </md-toolbar>
+                <md-toolbar
+                  class="md-table-toolbar md-accent"
+                  ng-show="vm_ac.selectedSmsAccountApps.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead"
+                      >{{vm_ac.selectedSmsAccountApps.length}}
+                      {{vm_ac.selectedSmsAccountApps.length > 1 ? 'items' :
+                      'item'}} selected</span
+                    >
+                    <div flex></div>
+                    <md-button
+                      ng-if="vm_ac.crudPermissions.canDelete"
+                      class="md-icon-button"
+                      ng-click="vm_ac.deleteSelectedSmsAccountApps($event)"
+                      aria-label="delete selected"
+                      translate
+                      translate-attr-label="SMS.DELETE_SELECTED"
+                    >
+                      <md-icon md-font-icon="icon-delete"></md-icon>
+                    </md-button>
+                  </div>
+                </md-toolbar>
+
+                <!-- QUEUES TABLE -->
+                <md-table-container>
+                  <table
+                    md-table
+                    md-row-select
+                    multiple
+                    ng-model="vm_ac.selectedSmsAccountApps"
+                  >
+                    <thead md-head>
+                      <tr md-row>
+                        <th md-column width="10px"></th>
+                        <th md-column width="10px">
+                          <span translate="VOICE.PRIORITY">Priority</span>
+                        </th>
+                        <th md-column>
+                          <span>Type</span>
+                        </th>
+                        <th md-column>
+                          <span>Appdata</span>
+                        </th>
+                        <th md-column>
+                          <span>Interval</span>
+                        </th>
+                        <th md-column width="10px"></th>
+                        <th md-column width="10px"></th>
+                      </tr>
+                    </thead>
+                    <tbody md-body ng-sortable="vm_ac.applications">
+                      <tr
+                        md-row
+                        md-select="app"
+                        md-select-id="id"
+                        ng-repeat="app in vm_ac.smsAccountApps.rows | filter: vm_ac.query.filter"
+                      >
+                        <td md-cell>
+                          <md-icon
+                            md-font-icon="icon-drag-vertical"
+                            class="s16 handle"
+                          ></md-icon>
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editSmsAccountApp($event, $index)"
+                        >
+                          <span>{{app.priority}}</span>
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editSmsAccountApp($event, $index)"
+                        >
+                          {{app.app.toLowerCase() === 'agi' ? 'Cally-Square' :
+                          app.app | ucfirst}}<span
+                            ng-if="app.appType.toLowerCase() === 'custom'"
+                            >*</span
+                          >
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editSmsAccountApp($event, $index)"
+                        >
+                          <span class="text-truncate" style="width: 200px"
+                            >{{app.appdata}}</span
+                          >
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editInterval($event, $index)"
+                        >
+                          {{app.IntervalId ? 'From List' : app.interval}}
+                        </td>
+                        <td md-cell>
+                          <md-button
+                            ng-click="vm_ac.editInterval($event, $index)"
+                            class="md-icon-button"
+                            aria-label="Interval"
+                          >
+                            <md-icon md-font-icon="icon-timer"></md-icon>
+                            <md-tooltip>
+                              {{app.IntervalId ? 'From List' : (app.interval ===
+                              '*,*,*,*' ? 'Always' : 'Custom')}}
+                            </md-tooltip>
+                          </md-button>
+                        </td>
+                        <td
+                          md-cell
+                          class="actions"
+                          ng-if="!vm_ac.crudPermissions.readOnly"
+                        >
+                          <md-menu>
+                            <md-button
+                              class="md-icon-button"
+                              aria-label="More"
+                              translate
+                              translate-attr-aria-label="VOICE.MORE"
+                              ng-click="$mdOpenMenu($event)"
+                            >
+                              <md-icon
+                                md-font-icon="icon-dots-vertical"
+                              ></md-icon>
+                            </md-button>
+
+                            <md-menu-content width="3">
+                              <md-menu-item
+                                ng-if="vm_ac.crudPermissions.canEdit"
+                              >
+                                <md-button
+                                  ng-click="vm_ac.editSmsAccountApp($event, $index)"
+                                  translate="VOICE.EDIT_APP"
+                                >
+                                  Edit App
+                                </md-button>
+                              </md-menu-item>
+                              <md-menu-item
+                                ng-if="vm_ac.crudPermissions.canEdit"
+                              >
+                                <md-button
+                                  ng-click="vm_ac.editInterval($event, $index)"
+                                  translate="VOICE.EDIT_INTERVAL"
+                                >
+                                  Edit Interval
+                                </md-button>
+                              </md-menu-item>
+                              <md-menu-item
+                                ng-if="vm_ac.crudPermissions.canDelete"
+                              >
+                                <md-button
+                                  ng-click="vm_ac.deleteConfirm(app, $index, $event)"
+                                  translate="VOICE.DELETE_APP"
+                                >
+                                  Delete App
+                                </md-button>
+                              </md-menu-item>
+                            </md-menu-content>
+                          </md-menu>
+                        </td>
+                      </tr>
+                      <tr md-row ng-hide="vm_ac.smsAccountApps.rows.length">
+                        <td md-cell colspan="7">
+                          <span
+                            class="text-boxed-light"
+                            translate="VOICE.NO_APPS_AVAILABLE"
+                            >No apps available</span
+                          >
+                        </td>
+                      </tr>
+                    </tbody>
+                  </table>
+                </md-table-container>
+                <!-- / QUEUES TABLE -->
+
+                <!-- NO RESULTS -->
+
+                <!-- / NO RESULTS -->
+              </div>
+              <!-- / MAIN -->
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="SMS.INTERACTIONS">INTERACTIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="smsAccount-detail-form-container interactions md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="SmsAccountInteractionsController as vm_dc"
+              ng-init="vm_dc.init(vm.smsAccount, vm.crudPermissions)"
+            >
+              <md-toolbar
+                class="md-table-toolbar md-default"
+                ng-hide="vm_dc.selectedSmsAccountInteractions.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead" translate="SMS.INTERACTIONS"
+                    >Interactions</span
+                  >
+                  <ms-search-bar
+                    on-search="vm_dc.query.filter = query"
+                    on-collapse="vm_dc.query.filter = undefined"
+                    debounce="300"
+                    direction="down"
+                  ></ms-search-bar>
+                  <div flex></div>
+                  <ms-quick-filter
+                    filters="vm_dc.quickFilters"
+                    query="vm_dc.query"
+                    search="vm_dc.getSmsAccountInteractions()"
+                  ></ms-quick-filter>
+                  <div layout="column">
+                    <md-button
+                      class="md-icon-button advanced-search"
+                      ng-class="{ 'md-fab md-mini md-accent-bg': vm_dc.query.search }"
+                      aria-label="Filter"
+                      translate
+                      translate-attr-aria-label="DASHBOARDS.FILTER"
+                      ng-click="vm_dc.openAdvancedSearch()"
+                    >
+                      <md-icon
+                        md-font-icon="{{ vm_dc.query.search ? 'icon-filter' : 'icon-filter-outline' }}"
+                        ng-class="{ 'blink': vm_dc.query.search }"
+                      ></md-icon>
+                    </md-button>
+                  </div>
+                  <md-button
+                    class="md-icon-button"
+                    ng-click="vm_dc.getSmsAccountInteractions()"
+                    aria-label="refresh Interactions"
+                    translate
+                    translate-attr-label="SMS.REFRESH_INTERACTIONS"
+                  >
+                    <md-icon md-font-icon="icon-refresh"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-toolbar
+                class="md-table-toolbar md-accent"
+                ng-show="vm_dc.selectedSmsAccountInteractions.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead"
+                    >{{vm_dc.selectedSmsAccountInteractions.length}}
+                    {{vm_dc.selectedSmsAccountInteractions.length > 1 ? 'items'
+                    : 'item'}} selected</span
+                  >
+                  <div flex></div>
+                  <button
+                    class="md-icon-button"
+                    ng-csv="vm_dc.exportSelectedSmsAccountInteractions"
+                    csv-label="true"
+                    filename="smsAccounts.csv"
+                  >
+                    <md-icon md-font-icon="icon-file-excel"></md-icon>
+                  </button>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canDelete"
+                    class="md-icon-button"
+                    ng-click="vm_dc.deleteSelectedSmsAccountInteractions($event)"
+                    aria-label="delete selected"
+                    translate
+                    translate-attr-label="SMS.DELETE_SELECTED"
+                  >
+                    <md-icon md-font-icon="icon-delete"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-table-container class="font-size-12">
+                <table
+                  md-table
+                  md-row-select
+                  multiple
+                  ng-model="vm_dc.selectedSmsAccountInteractions"
+                  md-progress="vm_dc.promise"
+                >
+                  <thead
+                    md-head
+                    md-order="vm_dc.query.sort"
+                    md-on-reorder="vm_dc.getSmsAccountInteractions"
+                  >
+                    <tr md-row>
+                      <th md-column md-order-by="id">
+                        {{ 'SMS.ID' | translate }}
+                      </th>
+                      <th md-column class="no-padding">
+                        <md-icon md-font-icon="icon-eye" class="s16"></md-icon>
+                      </th>
+                      <th md-column class="no-padding"></th>
+                      <th md-column class="no-padding"></th>
+                      <th md-column>{{ 'SMS.CONTACT' | translate }}</th>
+                      <th md-column md-order-by="createdAt">
+                        {{ 'SMS.STARTEDAT' | translate }}
+                      </th>
+                      <th md-column md-order-by="lastMsgAt">
+                        {{ 'SMS.LASTMESSAGE' | translate }}
+                      </th>
+                      <th md-column md-order-by="closed">
+                        {{ 'SMS.STATUS' | translate }}
+                      </th>
+                      <th md-column>{{ 'SMS.AGENT' | translate }}</th>
+                      <th md-column md-order-by="tag">
+                        {{ 'SMS.TAGS' | translate }}
+                      </th>
+                      <th md-column width="10px"></th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr
+                      md-row
+                      md-select="interaction"
+                      md-select-id="id"
+                      ng-repeat="interaction in vm_dc.smsAccountInteractions.rows"
+                      ng-class="{'text-bold text-italic': interaction.unreadMessages > 0}"
+                    >
+                      <td md-cell>{{interaction.id}}</td>
+                      <td md-cell class="no-padding">
+                        <div
+                          ng-if="!interaction.closed && interaction.Users.length"
+                        >
+                          <md-icon
+                            md-font-icon="icon-eye"
+                            class="s16"
+                          ></md-icon>
+                          <md-tooltip>
+                            <span ng-repeat="user in interaction.Users"
+                              >{{ user.fullname | translate }}
+                              <span ng-if="!$last">, </span>
+                            </span>
+                          </md-tooltip>
+                        </div>
+                      </td>
+                      <td md-cell class="no-padding">
+                        <div
+                          ng-if="interaction.unreadMessages > 0"
+                          layout="row"
+                          layout-align="start center"
+                        >
+                          <span
+                            class="badge white-fg md-primary-bg"
+                            layout-margin
+                            >{{ interaction.unreadMessages}}</span
+                          >
+                        </div>
+                      </td>
+                      <td md-cell class="no-padding">
+                        <div ng-if="interaction.attach">
+                          <md-icon
+                            md-font-icon="icon-paperclip"
+                            class="s16"
+                          ></md-icon>
+                        </div>
+                      </td>
+                      <td md-cell>
+                        <div layout="column" layout-align="start start">
+                          <span
+                            class="font-size-12 text-truncate contact-text"
+                            ng-class="{'margin-bottom-0' : interaction.contactInfo}"
+                            layout-margin
+                            >{{ interaction.contactName }}</span
+                          >
+                          <span
+                            ng-if="interaction.contactInfo"
+                            class="font-size-12 text-truncate contact-text margin-top-0"
+                            layout-margin
+                            >{{ interaction.contactInfo }}</span
+                          >
+                        </div>
+                      </td>
+                      <td md-cell>{{ interaction.createdAt | formatdate }}</td>
+                      <td md-cell>
+                        <div layout="row">
+                          <span>
+                            <md-icon
+                              md-font-icon="{{interaction.lastMsgDirection == 'in' ? 'icon-arrow-down-bold blue-grey-800-fg' : 'icon-arrow-up-bold blue-grey-300-fg'}}"
+                            ></md-icon>
+                          </span>
+                          <div layout="column" layout-align="center center">
+                            <span class="text-truncate"
+                              >{{ interaction.lastMsgAt | formatdate }}</span
+                            >
+                          </div>
+                        </div>
+                      </td>
+                      <td md-cell>
+                        <span ng-if="interaction.closed === 0" class="green-fg">
+                          {{ 'SMS.OPENED' | translate }}
+                          <span ng-if="interaction.substatus">
+                            - {{ interaction.substatus }}
+                          </span>
+                        </span>
+                        <span ng-if="interaction.closed === 1" class="red-fg">
+                          {{ 'SMS.CLOSED' | translate }}
+                          <span ng-if="interaction.disposition">
+                            - {{ interaction.thirdDisposition ||
+                            interaction.secondDisposition ||
+                            interaction.disposition }}
+                          </span>
+                          <md-tooltip class="multiline">
+                            <div layout="column">
+                              <div layout="column">
+                                <span
+                                  >{{ 'DASHBOARDS.CLOSED_AT' |
+                                  translate}}:</span
+                                >
+                                <span class="text-bold"
+                                  >{{ interaction.closedAt | formatdate }}</span
+                                >
+                              </div>
+                              <div
+                                ng-if="interaction.disposition"
+                                layout="column"
+                              >
+                                <span
+                                  >{{ 'DASHBOARDS.DISPOSITION' |
+                                  translate}}:</span
+                                >
+                                <span class="text-bold"
+                                  >{{ interaction.disposition }}</span
+                                >
+                              </div>
+                              <div
+                                ng-if="interaction.secondDisposition"
+                                layout="column"
+                              >
+                                <span
+                                  >{{ 'DASHBOARDS.SECOND_LEVEL_DISPOSITION' |
+                                  translate}}:</span
+                                >
+                                <span class="text-bold"
+                                  >{{ interaction.secondDisposition }}</span
+                                >
+                              </div>
+                              <div
+                                ng-if="interaction.thirdDisposition"
+                                layout="column"
+                              >
+                                <span
+                                  >{{ 'DASHBOARDS.THIRD_LEVEL_DISPOSITION' |
+                                  translate}}:</span
+                                >
+                                <span class="text-bold"
+                                  >{{ interaction.thirdDisposition }}</span
+                                >
+                              </div>
+                            </div>
+                          </md-tooltip>
+                        </span>
+                      </td>
+
+                      <td md-cell>{{interaction.Owner.name}}</td>
+                      <td md-cell>
+                        <div ng-if="interaction.Tags.length">
+                          <md-tooltip md-direction="left" layout="row">
+                            <span ng-repeat="tag in interaction.Tags"
+                              >{{tag.name}}<span ng-if="!$last">, </span></span
+                            >
+                          </md-tooltip>
+                          <md-icon
+                            md-font-icon="icon-tag"
+                            ng-style="{'color': interaction.Tags.length == 1 && interaction.Tags[0].color }"
+                          >
+                          </md-icon>
+                        </div>
+                      </td>
+                      <td md-cell class="actions">
+                        <md-menu>
+                          <md-button
+                            class="md-icon-button"
+                            aria-label="More"
+                            translate
+                            translate-attr-aria-label="SMS.MORE"
+                            ng-click="$mdOpenMenu($event)"
+                          >
+                            <md-icon
+                              md-font-icon="icon-dots-vertical"
+                            ></md-icon>
+                          </md-button>
+
+                          <md-menu-content width="3">
+                            <md-menu-item>
+                              <md-button
+                                ng-click="vm_dc.spysmsInteraction($event, interaction)"
+                                translate="SMS.SPYINTERACTION"
+                              >
+                                Spy Interaction
+                              </md-button>
+                            </md-menu-item>
+                            <md-menu-item>
+                              <md-button
+                                class="md-primary"
+                                ng-click="vm_dc.smsInteractionDownload(interaction, $event)"
+                                translate="SMS.DOWNLOAD_INTERACTION"
+                              >
+                                Download
+                              </md-button>
+                            </md-menu-item>
+                            <md-menu-item
+                              ng-if="vm_dc.crudPermissions.canDelete"
+                            >
+                              <md-button
+                                ng-click="vm_dc.deleteConfirm(interaction, $event)"
+                                translate="SMS.DELETE_INTERACTION"
+                              >
+                                Delete Interaction
+                              </md-button>
+                            </md-menu-item>
+                          </md-menu-content>
+                        </md-menu>
+                      </td>
+                    </tr>
+                    <tr
+                      md-row
+                      ng-if="!vm_dc.smsAccountInteractions.rows.length"
+                    >
+                      <td md-cell colspan="12">
+                        <div layout="row" layout-align="center center">
+                          <span
+                            class="text-boxed-light"
+                            translate="SMS.NO_INTERACTION_AVAILABLE"
+                            >No interaction available</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+              <md-table-pagination
+                md-label="{page: '{{'SMS.PAGE' | translate}}:', rowsPerPage: '{{'SMS.ROWSPERPAGE' | translate}}:', of: '{{'SMS.OF' | translate}}'}"
+                md-limit="vm_dc.query.limit"
+                md-limit-options="[10, 15, 20, 50, 100, 250]"
+                md-page="vm_dc.query.page"
+                md-total="{{vm_dc.smsAccountInteractions.count}}"
+                md-on-paginate="vm_dc.getSmsAccountInteractions"
+                md-page-select
+              ></md-table-pagination>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/smsAccounts.html/smsAccounts-[chunkhash].html b/public/src/js/modules/main/apps/sms/views/smsAccounts/smsAccounts.html/smsAccounts-[chunkhash].html
deleted file mode 100644
index 720ee5b..0000000
--- a/public/src/js/modules/main/apps/sms/views/smsAccounts/smsAccounts.html/smsAccounts-[chunkhash].html
+++ /dev/null
@@ -1,358 +0,0 @@
-<div
-  id="smsAccounts"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-message-text" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="SMS.SMSACCOUNTS">SmsAccounts</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="SMS.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedSmsAccounts.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedSmsAccounts =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="SMS.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-smsAccounts-count">
-          <span>{{vm.selectedSmsAccounts.length}}</span>
-          <span translate="SMS.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="SMS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllSmsAccounts()"
-                translate="SMS.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectSmsAccounts()"
-                translate="SMS.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedSmsAccounts"
-          csv-label="true"
-          filename="smsAccounts.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedSmsAccounts($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="SMS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- SMSACCOUNT TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedSmsAccounts"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getSmsAccounts"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'SMS.ID' | translate }}</th>
-                <th md-column md-order-by="name">
-                  {{ 'SMS.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="key">{{ 'SMS.KEY' | translate }}</th>
-                <th md-column md-order-by="ListId">
-                  {{ 'SMS.LIST' | translate }}
-                </th>
-                <th md-column md-order-by="type">
-                  {{ 'SMS.TYPE' | translate }}
-                </th>
-                <th md-column md-order-by="phone">
-                  {{ 'SMS.PHONE' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'SMS.DESCRIPTION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.smsAccounts.rows.length">
-                <td md-cell colspan="8">
-                  <div layout="row" layout-align="center center">
-                    <span translate="SMS.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="smsAccount"
-                md-select-id="id"
-                ng-repeat="smsAccount in vm.smsAccounts.rows"
-              >
-                <td md-cell ng-if="smsAccount.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{smsAccount.name}}"
-                    ng-src="api/users/{{smsAccount.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!smsAccount.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{smsAccount.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(smsAccount, ev) : vm.createOrEditSmsAccount($event, smsAccount)"
-                  md-cell
-                  class="id"
-                >
-                  {{smsAccount.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(smsAccount, ev) : vm.createOrEditSmsAccount($event, smsAccount)"
-                  md-cell
-                  class="name"
-                >
-                  {{smsAccount.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(smsAccount, ev) : vm.createOrEditSmsAccount($event, smsAccount)"
-                  md-cell
-                  class="key"
-                >
-                  {{smsAccount.key}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(smsAccount, ev) : vm.createOrEditSmsAccount($event, smsAccount)"
-                  md-cell
-                  class="ListId"
-                >
-                  {{ (vm.lists | filter : {'id':smsAccount.ListId} :
-                  true)[0].name }}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(smsAccount, ev) : vm.createOrEditSmsAccount($event, smsAccount)"
-                  md-cell
-                  class="type"
-                >
-                  {{ vm.arraytype[smsAccount.type].option }}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(smsAccount, ev) : vm.createOrEditSmsAccount($event, smsAccount)"
-                  md-cell
-                  class="phone"
-                >
-                  {{smsAccount.phone}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(smsAccount, ev) : vm.createOrEditSmsAccount($event, smsAccount)"
-                  md-cell
-                  class="description"
-                >
-                  {{smsAccount.description}}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="SMS.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(smsAccount, $event    )"
-                          translate="SMS.EDIT_SMSACCOUNT"
-                        >
-                          Edit SmsAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.interactionsgoto(smsAccount, $event    )"
-                          translate="SMS.INTERACTIONS_SMSACCOUNT"
-                        >
-                          Interactions SmsAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.agentadddialog(smsAccount, $event    )"
-                          translate="SMS.AGENTADD_SMSACCOUNT"
-                        >
-                          AgentAdd SmsAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(smsAccount, $event    )"
-                          translate="SMS.DELETE_SMSACCOUNT"
-                        >
-                          Delete SmsAccount
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'SMS.PAGE' | translate}}:', rowsPerPage: '{{'SMS.ROWSPERPAGE' | translate}}:', of: '{{'SMS.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.smsAccounts.count}}"
-          md-on-paginate="vm.getSmsAccounts"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / SMSACCOUNT TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD SMSACCOUNT BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-smsAccount-button"
-    ng-click="vm.createOrEditSmsAccount($event)"
-    aria-label="add smsAccount"
-    translate
-    translate-attr-aria-label="SMS.ADD_SMSACCOUNT"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD SMSACCOUNT BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/sms/views/smsAccounts/smsAccounts.html/smsAccounts.html b/public/src/js/modules/main/apps/sms/views/smsAccounts/smsAccounts.html/smsAccounts.html
new file mode 100644
index 0000000..720ee5b
--- /dev/null
+++ b/public/src/js/modules/main/apps/sms/views/smsAccounts/smsAccounts.html/smsAccounts.html
@@ -0,0 +1,358 @@
+<div
+  id="smsAccounts"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-message-text" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="SMS.SMSACCOUNTS">SmsAccounts</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="SMS.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedSmsAccounts.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedSmsAccounts =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="SMS.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-smsAccounts-count">
+          <span>{{vm.selectedSmsAccounts.length}}</span>
+          <span translate="SMS.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="SMS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllSmsAccounts()"
+                translate="SMS.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectSmsAccounts()"
+                translate="SMS.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedSmsAccounts"
+          csv-label="true"
+          filename="smsAccounts.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedSmsAccounts($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="SMS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- SMSACCOUNT TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedSmsAccounts"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getSmsAccounts"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'SMS.ID' | translate }}</th>
+                <th md-column md-order-by="name">
+                  {{ 'SMS.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="key">{{ 'SMS.KEY' | translate }}</th>
+                <th md-column md-order-by="ListId">
+                  {{ 'SMS.LIST' | translate }}
+                </th>
+                <th md-column md-order-by="type">
+                  {{ 'SMS.TYPE' | translate }}
+                </th>
+                <th md-column md-order-by="phone">
+                  {{ 'SMS.PHONE' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'SMS.DESCRIPTION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.smsAccounts.rows.length">
+                <td md-cell colspan="8">
+                  <div layout="row" layout-align="center center">
+                    <span translate="SMS.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="smsAccount"
+                md-select-id="id"
+                ng-repeat="smsAccount in vm.smsAccounts.rows"
+              >
+                <td md-cell ng-if="smsAccount.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{smsAccount.name}}"
+                    ng-src="api/users/{{smsAccount.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!smsAccount.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{smsAccount.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(smsAccount, ev) : vm.createOrEditSmsAccount($event, smsAccount)"
+                  md-cell
+                  class="id"
+                >
+                  {{smsAccount.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(smsAccount, ev) : vm.createOrEditSmsAccount($event, smsAccount)"
+                  md-cell
+                  class="name"
+                >
+                  {{smsAccount.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(smsAccount, ev) : vm.createOrEditSmsAccount($event, smsAccount)"
+                  md-cell
+                  class="key"
+                >
+                  {{smsAccount.key}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(smsAccount, ev) : vm.createOrEditSmsAccount($event, smsAccount)"
+                  md-cell
+                  class="ListId"
+                >
+                  {{ (vm.lists | filter : {'id':smsAccount.ListId} :
+                  true)[0].name }}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(smsAccount, ev) : vm.createOrEditSmsAccount($event, smsAccount)"
+                  md-cell
+                  class="type"
+                >
+                  {{ vm.arraytype[smsAccount.type].option }}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(smsAccount, ev) : vm.createOrEditSmsAccount($event, smsAccount)"
+                  md-cell
+                  class="phone"
+                >
+                  {{smsAccount.phone}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(smsAccount, ev) : vm.createOrEditSmsAccount($event, smsAccount)"
+                  md-cell
+                  class="description"
+                >
+                  {{smsAccount.description}}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="SMS.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(smsAccount, $event    )"
+                          translate="SMS.EDIT_SMSACCOUNT"
+                        >
+                          Edit SmsAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.interactionsgoto(smsAccount, $event    )"
+                          translate="SMS.INTERACTIONS_SMSACCOUNT"
+                        >
+                          Interactions SmsAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.agentadddialog(smsAccount, $event    )"
+                          translate="SMS.AGENTADD_SMSACCOUNT"
+                        >
+                          AgentAdd SmsAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(smsAccount, $event    )"
+                          translate="SMS.DELETE_SMSACCOUNT"
+                        >
+                          Delete SmsAccount
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'SMS.PAGE' | translate}}:', rowsPerPage: '{{'SMS.ROWSPERPAGE' | translate}}:', of: '{{'SMS.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.smsAccounts.count}}"
+          md-on-paginate="vm.getSmsAccounts"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / SMSACCOUNT TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD SMSACCOUNT BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-smsAccount-button"
+    ng-click="vm.createOrEditSmsAccount($event)"
+    aria-label="add smsAccount"
+    translate
+    translate-attr-aria-label="SMS.ADD_SMSACCOUNT"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD SMSACCOUNT BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/sms/views/smsQueues/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/sms/views/smsQueues/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 29d5a43..0000000
--- a/public/src/js/modules/main/apps/sms/views/smsQueues/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,217 +0,0 @@
-<md-dialog class="smsQueue-dialog" aria-label="New SmsQueue">
-  <form name="smsQueueForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="SMS.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.smsQueue.name"
-          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.newSmsQueue"
-        />
-
-        <div class="hint"><span translate="SMS.HELP.NAME"></span></div>
-        <div
-          ng-messages="smsQueueForm['name'].$error"
-          ng-show="smsQueueForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span
-              translate="SMS.ERRORS.NAME_MUST_VALID_PATTERN"
-              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-              >Name must be valid pattern
-            </span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="SMS.STRATEGY">Strategy</label>
-        <md-select name="strategy" ng-model="vm.smsQueue.strategy" required>
-          <md-option ng-value="'beepall'">Beepall</md-option>
-          <md-option ng-value="'rrmemory'">RR Memory</md-option>
-        </md-select>
-        <div
-          ng-messages="smsQueueForm['strategy'].$error"
-          ng-show="smsQueueForm['strategy'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.STRATEGY_REQUIRED"
-              >Strategy field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="SMS.AGENT_TIMEOUT">Agent_Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.smsQueue.timeout"
-          min="1"
-          max="2147483"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="smsQueueForm['timeout'].$error"
-          ng-show="smsQueueForm['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.AGENT_TIMEOUT_REQUIRED"
-              >Agent_Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="SMS.ERRORS.AGENT_TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Agent_Timeout must be a valid greater or equal than</span
-            >
-            <span>1</span>
-          </div>
-          <div ng-message="max">
-            <span
-              translate="SMS.ERRORS.AGENT_TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-              >Agent_Timeout must be a valid greater or equal than</span
-            >
-            <span>2147483</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="SMS.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.smsQueue.description"
-        />
-
-        <div
-          ng-messages="smsQueueForm['description'].$error"
-          ng-show="smsQueueForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="SMS.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newSmsQueue"
-          ng-click="vm.saveSmsQueue()"
-          class="send-button md-accent md-raised"
-          ng-disabled="smsQueueForm.$invalid || smsQueueForm.$pristine"
-          aria-label="SAVE"
-          translate="SMS.SAVE"
-          translate-attr-aria-label="SMS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newSmsQueue"
-          ng-click="vm.addNewSmsQueue()"
-          class="send-button md-accent md-raised"
-          ng-disabled="smsQueueForm.$invalid"
-          aria-label="ADD"
-          translate="SMS.ADD_SMSQUEUE"
-          translate-attr-aria-label="SMS.ADD_SMSQUEUE"
-        >
-          ADD SMSQUEUE
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newSmsQueue"
-          ng-click="vm.deleteSmsQueue($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="SMS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="SMS.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsQueues/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/sms/views/smsQueues/create/dialog.html/dialog.html
new file mode 100644
index 0000000..29d5a43
--- /dev/null
+++ b/public/src/js/modules/main/apps/sms/views/smsQueues/create/dialog.html/dialog.html
@@ -0,0 +1,217 @@
+<md-dialog class="smsQueue-dialog" aria-label="New SmsQueue">
+  <form name="smsQueueForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="SMS.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.smsQueue.name"
+          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.newSmsQueue"
+        />
+
+        <div class="hint"><span translate="SMS.HELP.NAME"></span></div>
+        <div
+          ng-messages="smsQueueForm['name'].$error"
+          ng-show="smsQueueForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span
+              translate="SMS.ERRORS.NAME_MUST_VALID_PATTERN"
+              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+              >Name must be valid pattern
+            </span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="SMS.STRATEGY">Strategy</label>
+        <md-select name="strategy" ng-model="vm.smsQueue.strategy" required>
+          <md-option ng-value="'beepall'">Beepall</md-option>
+          <md-option ng-value="'rrmemory'">RR Memory</md-option>
+        </md-select>
+        <div
+          ng-messages="smsQueueForm['strategy'].$error"
+          ng-show="smsQueueForm['strategy'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.STRATEGY_REQUIRED"
+              >Strategy field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="SMS.AGENT_TIMEOUT">Agent_Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.smsQueue.timeout"
+          min="1"
+          max="2147483"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="smsQueueForm['timeout'].$error"
+          ng-show="smsQueueForm['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.AGENT_TIMEOUT_REQUIRED"
+              >Agent_Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="SMS.ERRORS.AGENT_TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Agent_Timeout must be a valid greater or equal than</span
+            >
+            <span>1</span>
+          </div>
+          <div ng-message="max">
+            <span
+              translate="SMS.ERRORS.AGENT_TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+              >Agent_Timeout must be a valid greater or equal than</span
+            >
+            <span>2147483</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="SMS.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.smsQueue.description"
+        />
+
+        <div
+          ng-messages="smsQueueForm['description'].$error"
+          ng-show="smsQueueForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="SMS.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newSmsQueue"
+          ng-click="vm.saveSmsQueue()"
+          class="send-button md-accent md-raised"
+          ng-disabled="smsQueueForm.$invalid || smsQueueForm.$pristine"
+          aria-label="SAVE"
+          translate="SMS.SAVE"
+          translate-attr-aria-label="SMS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newSmsQueue"
+          ng-click="vm.addNewSmsQueue()"
+          class="send-button md-accent md-raised"
+          ng-disabled="smsQueueForm.$invalid"
+          aria-label="ADD"
+          translate="SMS.ADD_SMSQUEUE"
+          translate-attr-aria-label="SMS.ADD_SMSQUEUE"
+        >
+          ADD SMSQUEUE
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newSmsQueue"
+          ng-click="vm.deleteSmsQueue($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="SMS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="SMS.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsQueues/edit/agentadd/agentadd.html/agentadd-[chunkhash].html b/public/src/js/modules/main/apps/sms/views/smsQueues/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
deleted file mode 100644
index 5c3e014..0000000
--- a/public/src/js/modules/main/apps/sms/views/smsQueues/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
+++ /dev/null
@@ -1,40 +0,0 @@
-<md-dialog class="smsQueue-dialog" aria-label="smsQueue" ng-init="vm.onInit()">
-  <form name="smsQueueForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="SMS.AGENTADD_SMSQUEUE">Add Agent to smsQueue</h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <ms-dual-multiselect
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveAgents()"
-        class="send-button md-accent md-raised"
-        ng-disabled="!vm.pendingChanges"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsQueues/edit/agentadd/agentadd.html/agentadd.html b/public/src/js/modules/main/apps/sms/views/smsQueues/edit/agentadd/agentadd.html/agentadd.html
new file mode 100644
index 0000000..5c3e014
--- /dev/null
+++ b/public/src/js/modules/main/apps/sms/views/smsQueues/edit/agentadd/agentadd.html/agentadd.html
@@ -0,0 +1,40 @@
+<md-dialog class="smsQueue-dialog" aria-label="smsQueue" ng-init="vm.onInit()">
+  <form name="smsQueueForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="SMS.AGENTADD_SMSQUEUE">Add Agent to smsQueue</h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <ms-dual-multiselect
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveAgents()"
+        class="send-button md-accent md-raised"
+        ng-disabled="!vm.pendingChanges"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsQueues/edit/teamadd/teamadd.html/teamadd-[chunkhash].html b/public/src/js/modules/main/apps/sms/views/smsQueues/edit/teamadd/teamadd.html/teamadd-[chunkhash].html
deleted file mode 100644
index 7de8316..0000000
--- a/public/src/js/modules/main/apps/sms/views/smsQueues/edit/teamadd/teamadd.html/teamadd-[chunkhash].html
+++ /dev/null
@@ -1,40 +0,0 @@
-<md-dialog class="smsQueue-dialog" aria-label="smsQueue" ng-init="vm.onInit()">
-  <form name="smsQueueForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="SMS.TEAMS_ASSOCIATION">Teams Association</h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <ms-dual-multiselect
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveTeams()"
-        ng-disabled="!vm.pendingChanges"
-        class="send-button md-accent md-raised"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsQueues/edit/teamadd/teamadd.html/teamadd.html b/public/src/js/modules/main/apps/sms/views/smsQueues/edit/teamadd/teamadd.html/teamadd.html
new file mode 100644
index 0000000..7de8316
--- /dev/null
+++ b/public/src/js/modules/main/apps/sms/views/smsQueues/edit/teamadd/teamadd.html/teamadd.html
@@ -0,0 +1,40 @@
+<md-dialog class="smsQueue-dialog" aria-label="smsQueue" ng-init="vm.onInit()">
+  <form name="smsQueueForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="SMS.TEAMS_ASSOCIATION">Teams Association</h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <ms-dual-multiselect
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveTeams()"
+        ng-disabled="!vm.pendingChanges"
+        class="send-button md-accent md-raised"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/sms/views/smsQueues/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/sms/views/smsQueues/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index 686d31c..0000000
--- a/public/src/js/modules/main/apps/sms/views/smsQueues/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,214 +0,0 @@
-<div id="sms-smsQueue" class="page-layout simple tabbed" layout="column">
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-smsQueues-button md-icon-button"
-        aria-label="Go to smsQueues"
-        ng-click="vm.gotoSmsQueues()"
-        translate
-        translate-attr-aria-label="SMS.GO_TO_SMSQUEUES"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="smsQueue-image" hide-xs>
-          <img ng-src="assets/images/business/smsQueues.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.smsQueue.id}}
-            <span ng-if="vm.smsQueue.name">{{vm.smsQueue.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="SMS.CREATED_AT"></span>
-            <span>{{vm.smsQueue.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.teamadddialog(vm.smsQueue, $event)"
-        class="md-fab md-orange-500-bg md-icon-button"
-        aria-label="teamadd"
-      >
-        <md-tooltip><span translate="SMS.TEAMADD_SMSQUEUE"></span></md-tooltip>
-        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
-      </md-button>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.agentadddialog(vm.smsQueue, $event)"
-        class="md-fab md-purple-500-bg md-icon-button"
-        aria-label="agentadd"
-      >
-        <md-tooltip><span translate="SMS.AGENTADD_SMSQUEUE"></span></md-tooltip>
-        <md-icon md-font-icon="icon-account-plus"></md-icon>
-      </md-button>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveSmsQueue()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid)"
-        translate="SMS.SAVE"
-        translate-attr-aria-label="SMS.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="SMS.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="smsQueue-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="SMS.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="SMS.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.smsQueue.name"
-                  ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-                  ng-required="true"
-                  autofocus
-                  disabled
-                />
-
-                <div class="hint"><span translate="SMS.HELP.NAME"></span></div>
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="SMS.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                  <div ng-message="pattern">
-                    <span
-                      translate="SMS.ERRORS.NAME_MUST_VALID_PATTERN"
-                      translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-                      >Name must be valid pattern
-                    </span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="SMS.STRATEGY">Strategy</label>
-                <md-select
-                  name="strategy"
-                  ng-model="vm.smsQueue.strategy"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'beepall'">Beepall</md-option>
-                  <md-option ng-value="'rrmemory'">RR Memory</md-option>
-                </md-select>
-                <div
-                  ng-messages="generalForm['strategy'].$error"
-                  ng-show="generalForm['strategy'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="SMS.ERRORS.STRATEGY_REQUIRED"
-                      >Strategy field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="SMS.AGENT_TIMEOUT">Agent_Timeout</label>
-                <input
-                  type="number"
-                  name="timeout"
-                  ng-model="vm.smsQueue.timeout"
-                  min="1"
-                  max="2147483"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['timeout'].$error"
-                  ng-show="generalForm['timeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="SMS.ERRORS.AGENT_TIMEOUT_REQUIRED"
-                      >Agent_Timeout field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="SMS.ERRORS.AGENT_TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >Agent_Timeout must be a valid greater or equal than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="SMS.ERRORS.AGENT_TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >Agent_Timeout must be a valid greater or equal than</span
-                    >
-                    <span>2147483</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="SMS.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.smsQueue.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="SMS.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/sms/views/smsQueues/edit/view.html/view.html b/public/src/js/modules/main/apps/sms/views/smsQueues/edit/view.html/view.html
new file mode 100644
index 0000000..686d31c
--- /dev/null
+++ b/public/src/js/modules/main/apps/sms/views/smsQueues/edit/view.html/view.html
@@ -0,0 +1,214 @@
+<div id="sms-smsQueue" class="page-layout simple tabbed" layout="column">
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-smsQueues-button md-icon-button"
+        aria-label="Go to smsQueues"
+        ng-click="vm.gotoSmsQueues()"
+        translate
+        translate-attr-aria-label="SMS.GO_TO_SMSQUEUES"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="smsQueue-image" hide-xs>
+          <img ng-src="assets/images/business/smsQueues.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.smsQueue.id}}
+            <span ng-if="vm.smsQueue.name">{{vm.smsQueue.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="SMS.CREATED_AT"></span>
+            <span>{{vm.smsQueue.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.teamadddialog(vm.smsQueue, $event)"
+        class="md-fab md-orange-500-bg md-icon-button"
+        aria-label="teamadd"
+      >
+        <md-tooltip><span translate="SMS.TEAMADD_SMSQUEUE"></span></md-tooltip>
+        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
+      </md-button>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.agentadddialog(vm.smsQueue, $event)"
+        class="md-fab md-purple-500-bg md-icon-button"
+        aria-label="agentadd"
+      >
+        <md-tooltip><span translate="SMS.AGENTADD_SMSQUEUE"></span></md-tooltip>
+        <md-icon md-font-icon="icon-account-plus"></md-icon>
+      </md-button>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveSmsQueue()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid)"
+        translate="SMS.SAVE"
+        translate-attr-aria-label="SMS.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="SMS.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="smsQueue-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="SMS.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="SMS.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.smsQueue.name"
+                  ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+                  ng-required="true"
+                  autofocus
+                  disabled
+                />
+
+                <div class="hint"><span translate="SMS.HELP.NAME"></span></div>
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="SMS.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                  <div ng-message="pattern">
+                    <span
+                      translate="SMS.ERRORS.NAME_MUST_VALID_PATTERN"
+                      translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+                      >Name must be valid pattern
+                    </span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="SMS.STRATEGY">Strategy</label>
+                <md-select
+                  name="strategy"
+                  ng-model="vm.smsQueue.strategy"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'beepall'">Beepall</md-option>
+                  <md-option ng-value="'rrmemory'">RR Memory</md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['strategy'].$error"
+                  ng-show="generalForm['strategy'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="SMS.ERRORS.STRATEGY_REQUIRED"
+                      >Strategy field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="SMS.AGENT_TIMEOUT">Agent_Timeout</label>
+                <input
+                  type="number"
+                  name="timeout"
+                  ng-model="vm.smsQueue.timeout"
+                  min="1"
+                  max="2147483"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['timeout'].$error"
+                  ng-show="generalForm['timeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="SMS.ERRORS.AGENT_TIMEOUT_REQUIRED"
+                      >Agent_Timeout field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="SMS.ERRORS.AGENT_TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >Agent_Timeout must be a valid greater or equal than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="SMS.ERRORS.AGENT_TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >Agent_Timeout must be a valid greater or equal than</span
+                    >
+                    <span>2147483</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="SMS.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.smsQueue.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="SMS.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/sms/views/smsQueues/smsQueues.html/smsQueues-[chunkhash].html b/public/src/js/modules/main/apps/sms/views/smsQueues/smsQueues.html/smsQueues-[chunkhash].html
deleted file mode 100644
index cfa6b0d..0000000
--- a/public/src/js/modules/main/apps/sms/views/smsQueues/smsQueues.html/smsQueues-[chunkhash].html
+++ /dev/null
@@ -1,332 +0,0 @@
-<div
-  id="smsQueues"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-message-text" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="SMS.SMSQUEUES">SmsQueues</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="SMS.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedSmsQueues.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedSmsQueues =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="SMS.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-smsQueues-count">
-          <span>{{vm.selectedSmsQueues.length}}</span>
-          <span translate="SMS.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="SMS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllSmsQueues()"
-                translate="SMS.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectSmsQueues()"
-                translate="SMS.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedSmsQueues"
-          csv-label="true"
-          filename="smsQueues.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedSmsQueues($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="SMS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- SMSQUEUE TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedSmsQueues"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getSmsQueues"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'SMS.ID' | translate }}</th>
-                <th md-column md-order-by="name">
-                  {{ 'SMS.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="strategy">
-                  {{ 'SMS.STRATEGY' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.smsQueues.rows.length">
-                <td md-cell colspan="4">
-                  <div layout="row" layout-align="center center">
-                    <span translate="SMS.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="smsQueue"
-                md-select-id="id"
-                ng-repeat="smsQueue in vm.smsQueues.rows"
-              >
-                <td md-cell ng-if="smsQueue.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{smsQueue.name}}"
-                    ng-src="api/users/{{smsQueue.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!smsQueue.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{smsQueue.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(smsQueue, ev) : vm.createOrEditSmsQueue($event, smsQueue)"
-                  md-cell
-                  class="id"
-                >
-                  {{smsQueue.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(smsQueue, ev) : vm.createOrEditSmsQueue($event, smsQueue)"
-                  md-cell
-                  class="name"
-                >
-                  {{smsQueue.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(smsQueue, ev) : vm.createOrEditSmsQueue($event, smsQueue)"
-                  md-cell
-                  class="strategy"
-                >
-                  {{ vm.arraystrategy[smsQueue.strategy].option }}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="SMS.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(smsQueue, $event    )"
-                          translate="SMS.EDIT_SMSQUEUE"
-                        >
-                          Edit SmsQueue
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.teamadddialog(smsQueue, $event    )"
-                          translate="SMS.TEAMADD_SMSQUEUE"
-                        >
-                          teamadd SmsQueue
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.agentadddialog(smsQueue, $event    )"
-                          translate="SMS.AGENTADD_SMSQUEUE"
-                        >
-                          agentadd SmsQueue
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(smsQueue, $event    )"
-                          translate="SMS.DELETE_SMSQUEUE"
-                        >
-                          Delete SmsQueue
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.gotorealtimegoto(smsQueue, $event    )"
-                          translate="SMS.GOTOREALTIME_SMSQUEUE"
-                        >
-                          goToRealtime SmsQueue
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'SMS.PAGE' | translate}}:', rowsPerPage: '{{'SMS.ROWSPERPAGE' | translate}}:', of: '{{'SMS.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.smsQueues.count}}"
-          md-on-paginate="vm.getSmsQueues"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / SMSQUEUE TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD SMSQUEUE BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-smsQueue-button"
-    ng-click="vm.createOrEditSmsQueue($event)"
-    aria-label="add smsQueue"
-    translate
-    translate-attr-aria-label="SMS.ADD_SMSQUEUE"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD SMSQUEUE BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/sms/views/smsQueues/smsQueues.html/smsQueues.html b/public/src/js/modules/main/apps/sms/views/smsQueues/smsQueues.html/smsQueues.html
new file mode 100644
index 0000000..cfa6b0d
--- /dev/null
+++ b/public/src/js/modules/main/apps/sms/views/smsQueues/smsQueues.html/smsQueues.html
@@ -0,0 +1,332 @@
+<div
+  id="smsQueues"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-message-text" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="SMS.SMSQUEUES">SmsQueues</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="SMS.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedSmsQueues.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedSmsQueues =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="SMS.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-smsQueues-count">
+          <span>{{vm.selectedSmsQueues.length}}</span>
+          <span translate="SMS.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="SMS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllSmsQueues()"
+                translate="SMS.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectSmsQueues()"
+                translate="SMS.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedSmsQueues"
+          csv-label="true"
+          filename="smsQueues.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedSmsQueues($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="SMS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- SMSQUEUE TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedSmsQueues"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getSmsQueues"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'SMS.ID' | translate }}</th>
+                <th md-column md-order-by="name">
+                  {{ 'SMS.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="strategy">
+                  {{ 'SMS.STRATEGY' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.smsQueues.rows.length">
+                <td md-cell colspan="4">
+                  <div layout="row" layout-align="center center">
+                    <span translate="SMS.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="smsQueue"
+                md-select-id="id"
+                ng-repeat="smsQueue in vm.smsQueues.rows"
+              >
+                <td md-cell ng-if="smsQueue.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{smsQueue.name}}"
+                    ng-src="api/users/{{smsQueue.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!smsQueue.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{smsQueue.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(smsQueue, ev) : vm.createOrEditSmsQueue($event, smsQueue)"
+                  md-cell
+                  class="id"
+                >
+                  {{smsQueue.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(smsQueue, ev) : vm.createOrEditSmsQueue($event, smsQueue)"
+                  md-cell
+                  class="name"
+                >
+                  {{smsQueue.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(smsQueue, ev) : vm.createOrEditSmsQueue($event, smsQueue)"
+                  md-cell
+                  class="strategy"
+                >
+                  {{ vm.arraystrategy[smsQueue.strategy].option }}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="SMS.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(smsQueue, $event    )"
+                          translate="SMS.EDIT_SMSQUEUE"
+                        >
+                          Edit SmsQueue
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.teamadddialog(smsQueue, $event    )"
+                          translate="SMS.TEAMADD_SMSQUEUE"
+                        >
+                          teamadd SmsQueue
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.agentadddialog(smsQueue, $event    )"
+                          translate="SMS.AGENTADD_SMSQUEUE"
+                        >
+                          agentadd SmsQueue
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(smsQueue, $event    )"
+                          translate="SMS.DELETE_SMSQUEUE"
+                        >
+                          Delete SmsQueue
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.gotorealtimegoto(smsQueue, $event    )"
+                          translate="SMS.GOTOREALTIME_SMSQUEUE"
+                        >
+                          goToRealtime SmsQueue
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'SMS.PAGE' | translate}}:', rowsPerPage: '{{'SMS.ROWSPERPAGE' | translate}}:', of: '{{'SMS.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.smsQueues.count}}"
+          md-on-paginate="vm.getSmsQueues"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / SMSQUEUE TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD SMSQUEUE BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-smsQueue-button"
+    ng-click="vm.createOrEditSmsQueue($event)"
+    aria-label="add smsQueue"
+    translate
+    translate-attr-aria-label="SMS.ADD_SMSQUEUE"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD SMSQUEUE BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/staff/views/agents/agents.html/agents-[chunkhash].html b/public/src/js/modules/main/apps/staff/views/agents/agents.html/agents-[chunkhash].html
deleted file mode 100644
index 9a44766..0000000
--- a/public/src/js/modules/main/apps/staff/views/agents/agents.html/agents-[chunkhash].html
+++ /dev/null
@@ -1,374 +0,0 @@
-<div
-  id="agents"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-account-multiple" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="STAFF.AGENTS">Agents</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="STAFF.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedAgents.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedAgents =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="STAFF.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-agents-count">
-          <span>{{vm.selectedAgents.length}}</span>
-          <span translate="STAFF.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="STAFF.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllAgents()"
-                translate="STAFF.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectAgents()"
-                translate="STAFF.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedAgents"
-          csv-label="true"
-          filename="agents.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedAgents($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="STAFF.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- AGENT TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedAgents"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getAgents"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="fullname">
-                  {{ 'STAFF.FULLNAME' | translate }}
-                </th>
-                <th md-column md-order-by="name">
-                  {{ 'STAFF.USERNAME' | translate }}
-                </th>
-                <th md-column md-order-by="showWebBar">
-                  {{ 'STAFF.SHOWWEBCONTROL' | translate }}
-                </th>
-                <th md-column md-order-by="email">
-                  {{ 'STAFF.EMAIL' | translate }}
-                </th>
-                <th md-column md-order-by="phone">
-                  {{ 'STAFF.PHONE' | translate }}
-                </th>
-                <th md-column md-order-by="mobile">
-                  {{ 'STAFF.MOBILE' | translate }}
-                </th>
-                <th md-column md-order-by="internal">
-                  {{ 'STAFF.INTERNAL' | translate }}
-                </th>
-                <th md-column md-order-by="disabled">
-                  {{ 'STAFF.DISABLED' | translate }}
-                </th>
-                <th md-column md-order-by="blocked">
-                  {{ 'STAFF.BLOCKED' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.agents.rows.length">
-                <td md-cell colspan="10">
-                  <div layout="row" layout-align="center center">
-                    <span translate="STAFF.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="agent"
-                md-select-id="id"
-                ng-repeat="agent in vm.agents.rows"
-              >
-                <td md-cell ng-if="agent.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{agent.name}}"
-                    ng-src="api/users/{{agent.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!agent.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{agent.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(agent, ev) : vm.createOrEditAgent($event, agent)"
-                  md-cell
-                  class="fullname font-weight-600"
-                >
-                  {{agent.fullname}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(agent, ev) : vm.createOrEditAgent($event, agent)"
-                  md-cell
-                  class="name"
-                >
-                  {{agent.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(agent, ev) : vm.createOrEditAgent($event, agent)"
-                  md-cell
-                  class="showWebBar"
-                >
-                  {{ vm.arrayshowWebBar[agent.showWebBar].option }}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(agent, ev) : vm.createOrEditAgent($event, agent)"
-                  md-cell
-                  class="email"
-                >
-                  {{agent.email}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(agent, ev) : vm.createOrEditAgent($event, agent)"
-                  md-cell
-                  class="phone"
-                >
-                  {{agent.phone}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(agent, ev) : vm.createOrEditAgent($event, agent)"
-                  md-cell
-                  class="mobile"
-                >
-                  {{agent.mobile}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(agent, ev) : vm.createOrEditAgent($event, agent)"
-                  md-cell
-                  class="internal"
-                >
-                  {{agent.internal}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(agent, ev) : vm.createOrEditAgent($event, agent)"
-                  md-cell
-                  class="disabled"
-                >
-                  <md-icon
-                    md-colors="{color: {{agent.disabled ? '\'green\'' : '\'grey\''}}}"
-                    md-font-icon="{{agent.disabled ? 'icon-check' : 'icon-close'}}"
-                  ></md-icon>
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(agent, ev) : vm.createOrEditAgent($event, agent)"
-                  md-cell
-                  class="blocked"
-                >
-                  <md-icon
-                    md-colors="{color: {{agent.blocked ? '\'green\'' : '\'grey\''}}}"
-                    md-font-icon="{{agent.blocked ? 'icon-check' : 'icon-close'}}"
-                  ></md-icon>
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="STAFF.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(agent, $event    )"
-                          translate="STAFF.EDIT_AGENT"
-                        >
-                          Edit Agent
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.teamadddialog(agent, $event    )"
-                          translate="STAFF.TEAMADD_AGENT"
-                        >
-                          teamadd Agent
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(agent, $event    )"
-                          translate="STAFF.DELETE_AGENT"
-                        >
-                          Delete Agent
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'STAFF.PAGE' | translate}}:', rowsPerPage: '{{'STAFF.ROWSPERPAGE' | translate}}:', of: '{{'STAFF.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.agents.count}}"
-          md-on-paginate="vm.getAgents"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / AGENT TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD AGENT BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-agent-button"
-    ng-click="vm.createOrEditAgent($event)"
-    aria-label="add agent"
-    translate
-    translate-attr-aria-label="STAFF.ADD_AGENT"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD AGENT BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/staff/views/agents/agents.html/agents.html b/public/src/js/modules/main/apps/staff/views/agents/agents.html/agents.html
new file mode 100644
index 0000000..9a44766
--- /dev/null
+++ b/public/src/js/modules/main/apps/staff/views/agents/agents.html/agents.html
@@ -0,0 +1,374 @@
+<div
+  id="agents"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-account-multiple" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="STAFF.AGENTS">Agents</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="STAFF.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedAgents.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedAgents =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="STAFF.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-agents-count">
+          <span>{{vm.selectedAgents.length}}</span>
+          <span translate="STAFF.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="STAFF.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllAgents()"
+                translate="STAFF.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectAgents()"
+                translate="STAFF.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedAgents"
+          csv-label="true"
+          filename="agents.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedAgents($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="STAFF.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- AGENT TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedAgents"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getAgents"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="fullname">
+                  {{ 'STAFF.FULLNAME' | translate }}
+                </th>
+                <th md-column md-order-by="name">
+                  {{ 'STAFF.USERNAME' | translate }}
+                </th>
+                <th md-column md-order-by="showWebBar">
+                  {{ 'STAFF.SHOWWEBCONTROL' | translate }}
+                </th>
+                <th md-column md-order-by="email">
+                  {{ 'STAFF.EMAIL' | translate }}
+                </th>
+                <th md-column md-order-by="phone">
+                  {{ 'STAFF.PHONE' | translate }}
+                </th>
+                <th md-column md-order-by="mobile">
+                  {{ 'STAFF.MOBILE' | translate }}
+                </th>
+                <th md-column md-order-by="internal">
+                  {{ 'STAFF.INTERNAL' | translate }}
+                </th>
+                <th md-column md-order-by="disabled">
+                  {{ 'STAFF.DISABLED' | translate }}
+                </th>
+                <th md-column md-order-by="blocked">
+                  {{ 'STAFF.BLOCKED' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.agents.rows.length">
+                <td md-cell colspan="10">
+                  <div layout="row" layout-align="center center">
+                    <span translate="STAFF.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="agent"
+                md-select-id="id"
+                ng-repeat="agent in vm.agents.rows"
+              >
+                <td md-cell ng-if="agent.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{agent.name}}"
+                    ng-src="api/users/{{agent.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!agent.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{agent.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(agent, ev) : vm.createOrEditAgent($event, agent)"
+                  md-cell
+                  class="fullname font-weight-600"
+                >
+                  {{agent.fullname}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(agent, ev) : vm.createOrEditAgent($event, agent)"
+                  md-cell
+                  class="name"
+                >
+                  {{agent.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(agent, ev) : vm.createOrEditAgent($event, agent)"
+                  md-cell
+                  class="showWebBar"
+                >
+                  {{ vm.arrayshowWebBar[agent.showWebBar].option }}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(agent, ev) : vm.createOrEditAgent($event, agent)"
+                  md-cell
+                  class="email"
+                >
+                  {{agent.email}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(agent, ev) : vm.createOrEditAgent($event, agent)"
+                  md-cell
+                  class="phone"
+                >
+                  {{agent.phone}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(agent, ev) : vm.createOrEditAgent($event, agent)"
+                  md-cell
+                  class="mobile"
+                >
+                  {{agent.mobile}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(agent, ev) : vm.createOrEditAgent($event, agent)"
+                  md-cell
+                  class="internal"
+                >
+                  {{agent.internal}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(agent, ev) : vm.createOrEditAgent($event, agent)"
+                  md-cell
+                  class="disabled"
+                >
+                  <md-icon
+                    md-colors="{color: {{agent.disabled ? '\'green\'' : '\'grey\''}}}"
+                    md-font-icon="{{agent.disabled ? 'icon-check' : 'icon-close'}}"
+                  ></md-icon>
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(agent, ev) : vm.createOrEditAgent($event, agent)"
+                  md-cell
+                  class="blocked"
+                >
+                  <md-icon
+                    md-colors="{color: {{agent.blocked ? '\'green\'' : '\'grey\''}}}"
+                    md-font-icon="{{agent.blocked ? 'icon-check' : 'icon-close'}}"
+                  ></md-icon>
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="STAFF.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(agent, $event    )"
+                          translate="STAFF.EDIT_AGENT"
+                        >
+                          Edit Agent
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.teamadddialog(agent, $event    )"
+                          translate="STAFF.TEAMADD_AGENT"
+                        >
+                          teamadd Agent
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(agent, $event    )"
+                          translate="STAFF.DELETE_AGENT"
+                        >
+                          Delete Agent
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'STAFF.PAGE' | translate}}:', rowsPerPage: '{{'STAFF.ROWSPERPAGE' | translate}}:', of: '{{'STAFF.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.agents.count}}"
+          md-on-paginate="vm.getAgents"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / AGENT TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD AGENT BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-agent-button"
+    ng-click="vm.createOrEditAgent($event)"
+    aria-label="add agent"
+    translate
+    translate-attr-aria-label="STAFF.ADD_AGENT"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD AGENT BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/staff/views/agents/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/staff/views/agents/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 8d0ddd8..0000000
--- a/public/src/js/modules/main/apps/staff/views/agents/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,366 +0,0 @@
-<md-dialog class="agent-dialog" aria-label="New Agent">
-  <form name="agentForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="STAFF.FULLNAME">Fullname</label>
-        <input
-          type="text"
-          name="fullname"
-          ng-model="vm.agent.fullname"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="agentForm['fullname'].$error"
-          ng-show="agentForm['fullname'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.FULLNAME_REQUIRED"
-              >Fullname field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="STAFF.USERNAME">Username</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.agent.name"
-          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-          ng-required="true"
-          ng-disabled="!vm.newAgent"
-        />
-
-        <div class="hint"><span translate="STAFF.HELP.USERNAME"></span></div>
-        <div
-          ng-messages="agentForm['name'].$error"
-          ng-show="agentForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.USERNAME_REQUIRED"
-              >Username field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span
-              translate="STAFF.ERRORS.USERNAME_MUST_VALID_PATTERN"
-              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-              >Username must be valid pattern
-            </span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="STAFF.ALIAS">Alias</label>
-        <input type="text" name="alias" ng-model="vm.agent.alias" />
-
-        <div
-          ng-messages="agentForm['alias'].$error"
-          ng-show="agentForm['alias'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.ALIAS_REQUIRED"
-              >Alias field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="STAFF.SHOWWEBCONTROL">ShowWebControl</label>
-        <md-select name="showWebBar" ng-model="vm.agent.showWebBar">
-          <md-option ng-value="0">Phonebar</md-option>
-          <md-option ng-value="1">External</md-option>
-          <md-option ng-value="2">WebRTC</md-option>
-        </md-select>
-        <div
-          ng-messages="agentForm['showWebBar'].$error"
-          ng-show="agentForm['showWebBar'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.SHOWWEBCONTROL_REQUIRED"
-              >ShowWebControl field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="STAFF.EMAIL">Email</label>
-        <input
-          type="email"
-          name="email"
-          ng-model="vm.agent.email"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="agentForm['email'].$error"
-          ng-show="agentForm['email'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.EMAIL_REQUIRED"
-              >Email field is required</span
-            >
-          </div>
-          <div ng-message="email">
-            <span translate="STAFF.ERRORS.EMAIL_MUST_VALID"
-              >Email must be a valid e-mail address</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block" ng-if="vm.newAgent">
-        <label translate="STAFF.PASSWORD">Password</label>
-        <input
-          type="password"
-          name="password"
-          ng-model="vm.agent.password"
-          placeholder="Password"
-          ng-pattern="vm.passwordPattern"
-          translate
-          translate-attr-placeholder="STAFF.PASSWORD"
-          required
-        />
-        <div ng-messages="agentForm['password'].$error" role="alert">
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.PASSWORD_REQUIRED"
-              >Password field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span translate="STAFF.ERRORS.SECURE_PASSWORD_PATTERN"
-              >Must contain at least 8 characters, with a minimum of 1 lowercase
-              letter, 1 uppercase letter, 1 numeric character and 1 special
-              character ~!?*@#$%^&-_=+[{]}.</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <md-input-container
-        class="md-block"
-        ng-if="vm.newAgent  && (vm.newAgent)"
-      >
-        <label translate="STAFF.CONFIRM_PASSWORD">Confirm Password</label>
-        <input
-          type="password"
-          match-password="password"
-          name="confirmPassword"
-          ng-model="confirmPassword"
-          required
-        />
-        <div
-          ng-messages="agentForm.confirmPassword.$error"
-          role="alert"
-          multiple
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.CONFIRM_REQUIRED"
-              >Confirm field is required</span
-            >
-          </div>
-          <div ng-message="passwordMatch">
-            <span translate="STAFF.ERRORS.CONFIRM_NOT_MATCH"
-              >Your password did not match</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <md-input-container ng-if="vm.newAgent" class="md-block">
-        <md-switch ng-model="vm.agent.autointernal" aria-label="AutoInternal"
-          ><span translate="STAFF.AUTOINTERNAL">AutoInternal</span></md-switch
-        >
-      </md-input-container>
-      <md-input-container ng-if="!vm.agent.autointernal" class="md-block">
-        <label translate="STAFF.INTERNAL">Internal</label>
-        <input
-          type="text"
-          name="internal"
-          ng-model="vm.agent.internal"
-          ng-required="true"
-          ng-disabled="!vm.newAgent"
-        />
-
-        <div
-          ng-messages="agentForm['internal'].$error"
-          ng-show="agentForm['internal'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.INTERNAL_REQUIRED"
-              >Internal field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="STAFF.DESCRIPTION">Description</label>
-        <input type="text" name="description" ng-model="vm.agent.description" />
-
-        <div
-          ng-messages="agentForm['description'].$error"
-          ng-show="agentForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container ng-if="vm.newAgent" class="md-block">
-        <md-switch ng-model="vm.agent.voicemail" aria-label="Voicemail"
-          ><span translate="STAFF.VOICEMAIL">Voicemail</span></md-switch
-        >
-      </md-input-container>
-      <md-input-container ng-if="vm.agent.showWebBar == 0" class="md-block">
-        <md-switch
-          ng-model="vm.agent.phoneBarRemoteControl"
-          aria-label="RemoteControl"
-          ><span translate="STAFF.REMOTECONTROL">RemoteControl</span></md-switch
-        >
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.agent.phoneBarRemoteControl && vm.agent.showWebBar == 0"
-        class="md-block"
-      >
-        <label translate="STAFF.REMOTECONTROLPORT">RemoteControlPort</label>
-        <input
-          type="number"
-          name="phoneBarRemoteControlPort"
-          ng-model="vm.agent.phoneBarRemoteControlPort"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="agentForm['phoneBarRemoteControlPort'].$error"
-          ng-show="agentForm['phoneBarRemoteControlPort'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.REMOTECONTROLPORT_REQUIRED"
-              >RemoteControlPort field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container ng-if="vm.newUser" class="md-block">
-        <md-switch ng-model="vm.agent.voicemail" aria-label="Voicemail"
-          ><span translate="STAFF.VOICEMAIL">Voicemail</span></md-switch
-        >
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newAgent"
-          ng-click="vm.saveAgent()"
-          class="send-button md-accent md-raised"
-          ng-disabled="agentForm.$invalid || agentForm.$pristine"
-          aria-label="SAVE"
-          translate="STAFF.SAVE"
-          translate-attr-aria-label="STAFF.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newAgent"
-          ng-click="vm.addNewAgent()"
-          class="send-button md-accent md-raised"
-          ng-disabled="agentForm.$invalid"
-          aria-label="ADD"
-          translate="STAFF.ADD_AGENT"
-          translate-attr-aria-label="STAFF.ADD_AGENT"
-        >
-          ADD AGENT
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newAgent"
-          ng-click="vm.deleteAgent($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="STAFF.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="STAFF.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/staff/views/agents/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/staff/views/agents/create/dialog.html/dialog.html
new file mode 100644
index 0000000..8d0ddd8
--- /dev/null
+++ b/public/src/js/modules/main/apps/staff/views/agents/create/dialog.html/dialog.html
@@ -0,0 +1,366 @@
+<md-dialog class="agent-dialog" aria-label="New Agent">
+  <form name="agentForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="STAFF.FULLNAME">Fullname</label>
+        <input
+          type="text"
+          name="fullname"
+          ng-model="vm.agent.fullname"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="agentForm['fullname'].$error"
+          ng-show="agentForm['fullname'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.FULLNAME_REQUIRED"
+              >Fullname field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="STAFF.USERNAME">Username</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.agent.name"
+          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+          ng-required="true"
+          ng-disabled="!vm.newAgent"
+        />
+
+        <div class="hint"><span translate="STAFF.HELP.USERNAME"></span></div>
+        <div
+          ng-messages="agentForm['name'].$error"
+          ng-show="agentForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.USERNAME_REQUIRED"
+              >Username field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span
+              translate="STAFF.ERRORS.USERNAME_MUST_VALID_PATTERN"
+              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+              >Username must be valid pattern
+            </span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="STAFF.ALIAS">Alias</label>
+        <input type="text" name="alias" ng-model="vm.agent.alias" />
+
+        <div
+          ng-messages="agentForm['alias'].$error"
+          ng-show="agentForm['alias'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.ALIAS_REQUIRED"
+              >Alias field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="STAFF.SHOWWEBCONTROL">ShowWebControl</label>
+        <md-select name="showWebBar" ng-model="vm.agent.showWebBar">
+          <md-option ng-value="0">Phonebar</md-option>
+          <md-option ng-value="1">External</md-option>
+          <md-option ng-value="2">WebRTC</md-option>
+        </md-select>
+        <div
+          ng-messages="agentForm['showWebBar'].$error"
+          ng-show="agentForm['showWebBar'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.SHOWWEBCONTROL_REQUIRED"
+              >ShowWebControl field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="STAFF.EMAIL">Email</label>
+        <input
+          type="email"
+          name="email"
+          ng-model="vm.agent.email"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="agentForm['email'].$error"
+          ng-show="agentForm['email'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.EMAIL_REQUIRED"
+              >Email field is required</span
+            >
+          </div>
+          <div ng-message="email">
+            <span translate="STAFF.ERRORS.EMAIL_MUST_VALID"
+              >Email must be a valid e-mail address</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block" ng-if="vm.newAgent">
+        <label translate="STAFF.PASSWORD">Password</label>
+        <input
+          type="password"
+          name="password"
+          ng-model="vm.agent.password"
+          placeholder="Password"
+          ng-pattern="vm.passwordPattern"
+          translate
+          translate-attr-placeholder="STAFF.PASSWORD"
+          required
+        />
+        <div ng-messages="agentForm['password'].$error" role="alert">
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.PASSWORD_REQUIRED"
+              >Password field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span translate="STAFF.ERRORS.SECURE_PASSWORD_PATTERN"
+              >Must contain at least 8 characters, with a minimum of 1 lowercase
+              letter, 1 uppercase letter, 1 numeric character and 1 special
+              character ~!?*@#$%^&-_=+[{]}.</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <md-input-container
+        class="md-block"
+        ng-if="vm.newAgent  && (vm.newAgent)"
+      >
+        <label translate="STAFF.CONFIRM_PASSWORD">Confirm Password</label>
+        <input
+          type="password"
+          match-password="password"
+          name="confirmPassword"
+          ng-model="confirmPassword"
+          required
+        />
+        <div
+          ng-messages="agentForm.confirmPassword.$error"
+          role="alert"
+          multiple
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.CONFIRM_REQUIRED"
+              >Confirm field is required</span
+            >
+          </div>
+          <div ng-message="passwordMatch">
+            <span translate="STAFF.ERRORS.CONFIRM_NOT_MATCH"
+              >Your password did not match</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <md-input-container ng-if="vm.newAgent" class="md-block">
+        <md-switch ng-model="vm.agent.autointernal" aria-label="AutoInternal"
+          ><span translate="STAFF.AUTOINTERNAL">AutoInternal</span></md-switch
+        >
+      </md-input-container>
+      <md-input-container ng-if="!vm.agent.autointernal" class="md-block">
+        <label translate="STAFF.INTERNAL">Internal</label>
+        <input
+          type="text"
+          name="internal"
+          ng-model="vm.agent.internal"
+          ng-required="true"
+          ng-disabled="!vm.newAgent"
+        />
+
+        <div
+          ng-messages="agentForm['internal'].$error"
+          ng-show="agentForm['internal'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.INTERNAL_REQUIRED"
+              >Internal field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="STAFF.DESCRIPTION">Description</label>
+        <input type="text" name="description" ng-model="vm.agent.description" />
+
+        <div
+          ng-messages="agentForm['description'].$error"
+          ng-show="agentForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container ng-if="vm.newAgent" class="md-block">
+        <md-switch ng-model="vm.agent.voicemail" aria-label="Voicemail"
+          ><span translate="STAFF.VOICEMAIL">Voicemail</span></md-switch
+        >
+      </md-input-container>
+      <md-input-container ng-if="vm.agent.showWebBar == 0" class="md-block">
+        <md-switch
+          ng-model="vm.agent.phoneBarRemoteControl"
+          aria-label="RemoteControl"
+          ><span translate="STAFF.REMOTECONTROL">RemoteControl</span></md-switch
+        >
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.agent.phoneBarRemoteControl && vm.agent.showWebBar == 0"
+        class="md-block"
+      >
+        <label translate="STAFF.REMOTECONTROLPORT">RemoteControlPort</label>
+        <input
+          type="number"
+          name="phoneBarRemoteControlPort"
+          ng-model="vm.agent.phoneBarRemoteControlPort"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="agentForm['phoneBarRemoteControlPort'].$error"
+          ng-show="agentForm['phoneBarRemoteControlPort'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.REMOTECONTROLPORT_REQUIRED"
+              >RemoteControlPort field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container ng-if="vm.newUser" class="md-block">
+        <md-switch ng-model="vm.agent.voicemail" aria-label="Voicemail"
+          ><span translate="STAFF.VOICEMAIL">Voicemail</span></md-switch
+        >
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newAgent"
+          ng-click="vm.saveAgent()"
+          class="send-button md-accent md-raised"
+          ng-disabled="agentForm.$invalid || agentForm.$pristine"
+          aria-label="SAVE"
+          translate="STAFF.SAVE"
+          translate-attr-aria-label="STAFF.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newAgent"
+          ng-click="vm.addNewAgent()"
+          class="send-button md-accent md-raised"
+          ng-disabled="agentForm.$invalid"
+          aria-label="ADD"
+          translate="STAFF.ADD_AGENT"
+          translate-attr-aria-label="STAFF.ADD_AGENT"
+        >
+          ADD AGENT
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newAgent"
+          ng-click="vm.deleteAgent($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="STAFF.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="STAFF.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/staff/views/agents/edit/changepassword/changepassword.html/changepassword-[chunkhash].html b/public/src/js/modules/main/apps/staff/views/agents/edit/changepassword/changepassword.html/changepassword-[chunkhash].html
deleted file mode 100644
index 042d471..0000000
--- a/public/src/js/modules/main/apps/staff/views/agents/edit/changepassword/changepassword.html/changepassword-[chunkhash].html
+++ /dev/null
@@ -1,158 +0,0 @@
-<md-dialog class="agent-dialog" aria-label="{{vm.name}}">
-  <form name="agentForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ ' STAFF.CHANGE_PASSWORD' | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container
-        class="md-block"
-        ng-if="vm.currentUser.id == vm.agent.id"
-      >
-        <label translate="STAFF.OLD_PASSWORD">Old Password</label>
-        <input
-          type="password"
-          name="oldPassword"
-          ng-model="vm.oldPassword"
-          placeholder="Password"
-          translate
-          translate-attr-placeholder="STAFF.OLD_PASSWORD"
-          required
-        />
-        <div ng-messages="agentForm.oldPassword.$error" role="alert">
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.PASSWORD_REQUIRED"
-              >Password field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="STAFF.NEW_PASSWORD">New Password</label>
-        <input
-          type="password"
-          name="password"
-          ng-model="vm.password"
-          placeholder="Password"
-          translate
-          ng-pattern="vm.passwordPattern"
-          translate-attr-placeholder="STAFF.NEW_PASSWORD"
-          required
-        />
-        <div ng-messages="agentForm.password.$error" role="alert">
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.PASSWORD_REQUIRED"
-              >Password field is required</span
-            >
-          </div>
-
-          <div ng-message="pattern">
-            <span translate="STAFF.ERRORS.SECURE_PASSWORD_PATTERN"
-              >Must contain at least 8 characters, with a minimum of 1 lowercase
-              letter, 1 uppercase letter, 1 numeric character and 1 special
-              character ~!?*@#$%^&-_=+[{]}.</span
-            >
-          </div>
-          <div ng-message="oldPasswordMatch">
-            <span translate="STAFF.ERRORS.PASSWORD_OLDPASSWORD_MATCH"
-              >New password must be different from old one</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="STAFF.CONFIRM_PASSWORD">Confirm Password</label>
-        <input
-          type="password"
-          match-password="password"
-          name="confirmPassword"
-          ng-model="confirmPassword"
-        />
-        <div
-          ng-messages="agentForm.confirmPassword.$error"
-          role="alert"
-          multiple
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.CONFIRM_REQUIRED"
-              >Confirm field is required</span
-            >
-          </div>
-          <div ng-message="passwordMatch">
-            <span translate="STAFF.ERRORS.CONFIRM_NOT_MATCH"
-              >Your password did not match</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-click="vm.savePassword()"
-          class="send-button md-accent md-raised"
-          ng-disabled="agentForm.$invalid || agentForm.$pristine"
-          aria-label="SAVE"
-          translate="STAFF.SAVE"
-          translate-attr-aria-label="STAFF.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/staff/views/agents/edit/changepassword/changepassword.html/changepassword.html b/public/src/js/modules/main/apps/staff/views/agents/edit/changepassword/changepassword.html/changepassword.html
new file mode 100644
index 0000000..042d471
--- /dev/null
+++ b/public/src/js/modules/main/apps/staff/views/agents/edit/changepassword/changepassword.html/changepassword.html
@@ -0,0 +1,158 @@
+<md-dialog class="agent-dialog" aria-label="{{vm.name}}">
+  <form name="agentForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ ' STAFF.CHANGE_PASSWORD' | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container
+        class="md-block"
+        ng-if="vm.currentUser.id == vm.agent.id"
+      >
+        <label translate="STAFF.OLD_PASSWORD">Old Password</label>
+        <input
+          type="password"
+          name="oldPassword"
+          ng-model="vm.oldPassword"
+          placeholder="Password"
+          translate
+          translate-attr-placeholder="STAFF.OLD_PASSWORD"
+          required
+        />
+        <div ng-messages="agentForm.oldPassword.$error" role="alert">
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.PASSWORD_REQUIRED"
+              >Password field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="STAFF.NEW_PASSWORD">New Password</label>
+        <input
+          type="password"
+          name="password"
+          ng-model="vm.password"
+          placeholder="Password"
+          translate
+          ng-pattern="vm.passwordPattern"
+          translate-attr-placeholder="STAFF.NEW_PASSWORD"
+          required
+        />
+        <div ng-messages="agentForm.password.$error" role="alert">
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.PASSWORD_REQUIRED"
+              >Password field is required</span
+            >
+          </div>
+
+          <div ng-message="pattern">
+            <span translate="STAFF.ERRORS.SECURE_PASSWORD_PATTERN"
+              >Must contain at least 8 characters, with a minimum of 1 lowercase
+              letter, 1 uppercase letter, 1 numeric character and 1 special
+              character ~!?*@#$%^&-_=+[{]}.</span
+            >
+          </div>
+          <div ng-message="oldPasswordMatch">
+            <span translate="STAFF.ERRORS.PASSWORD_OLDPASSWORD_MATCH"
+              >New password must be different from old one</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="STAFF.CONFIRM_PASSWORD">Confirm Password</label>
+        <input
+          type="password"
+          match-password="password"
+          name="confirmPassword"
+          ng-model="confirmPassword"
+        />
+        <div
+          ng-messages="agentForm.confirmPassword.$error"
+          role="alert"
+          multiple
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.CONFIRM_REQUIRED"
+              >Confirm field is required</span
+            >
+          </div>
+          <div ng-message="passwordMatch">
+            <span translate="STAFF.ERRORS.CONFIRM_NOT_MATCH"
+              >Your password did not match</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-click="vm.savePassword()"
+          class="send-button md-accent md-raised"
+          ng-disabled="agentForm.$invalid || agentForm.$pristine"
+          aria-label="SAVE"
+          translate="STAFF.SAVE"
+          translate-attr-aria-label="STAFF.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/staff/views/agents/edit/queueadd/queueadd.html/queueadd-[chunkhash].html b/public/src/js/modules/main/apps/staff/views/agents/edit/queueadd/queueadd.html/queueadd-[chunkhash].html
deleted file mode 100644
index 60dcbb9..0000000
--- a/public/src/js/modules/main/apps/staff/views/agents/edit/queueadd/queueadd.html/queueadd-[chunkhash].html
+++ /dev/null
@@ -1,66 +0,0 @@
-<md-dialog class="agent-dialog" aria-label="agent" ng-init="vm.onInit()">
-  <form name="agentForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2>{{vm.title}}</h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <md-input-container
-        flex
-        class="no-margin"
-        ng-if="vm.agent.role === 'agent' && vm.channel === 'voice'"
-      >
-        <label translate="STAFF.PENALTY">Penalty</label>
-        <input
-          name="penalty"
-          ng-model="vm.penalty"
-          placeholder="0"
-          required
-          md-minlength="0"
-          md-maxlength="3"
-        />
-        <div ng-messages="agentForm.penalty.$error" role="alert" multiple>
-          <div ng-message="required">
-            <span>You must supply a penalty.</span>
-          </div>
-          <div ng-message="md-minlength">
-            <span>Min Penalty 0 characters.</span>
-          </div>
-          <div ng-message="md-maxlength">
-            <span>Max Penalty 3 characters.</span>
-          </div>
-        </div>
-      </md-input-container>
-      <ms-dual-multiselect
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveQueues()"
-        class="send-button md-accent md-raised"
-        ng-disabled="!vm.pendingChanges"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/staff/views/agents/edit/queueadd/queueadd.html/queueadd.html b/public/src/js/modules/main/apps/staff/views/agents/edit/queueadd/queueadd.html/queueadd.html
new file mode 100644
index 0000000..60dcbb9
--- /dev/null
+++ b/public/src/js/modules/main/apps/staff/views/agents/edit/queueadd/queueadd.html/queueadd.html
@@ -0,0 +1,66 @@
+<md-dialog class="agent-dialog" aria-label="agent" ng-init="vm.onInit()">
+  <form name="agentForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2>{{vm.title}}</h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <md-input-container
+        flex
+        class="no-margin"
+        ng-if="vm.agent.role === 'agent' && vm.channel === 'voice'"
+      >
+        <label translate="STAFF.PENALTY">Penalty</label>
+        <input
+          name="penalty"
+          ng-model="vm.penalty"
+          placeholder="0"
+          required
+          md-minlength="0"
+          md-maxlength="3"
+        />
+        <div ng-messages="agentForm.penalty.$error" role="alert" multiple>
+          <div ng-message="required">
+            <span>You must supply a penalty.</span>
+          </div>
+          <div ng-message="md-minlength">
+            <span>Min Penalty 0 characters.</span>
+          </div>
+          <div ng-message="md-maxlength">
+            <span>Max Penalty 3 characters.</span>
+          </div>
+        </div>
+      </md-input-container>
+      <ms-dual-multiselect
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveQueues()"
+        class="send-button md-accent md-raised"
+        ng-disabled="!vm.pendingChanges"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/staff/views/agents/edit/teamadd/teamadd.html/teamadd-[chunkhash].html b/public/src/js/modules/main/apps/staff/views/agents/edit/teamadd/teamadd.html/teamadd-[chunkhash].html
deleted file mode 100644
index 3a28603..0000000
--- a/public/src/js/modules/main/apps/staff/views/agents/edit/teamadd/teamadd.html/teamadd-[chunkhash].html
+++ /dev/null
@@ -1,40 +0,0 @@
-<md-dialog class="agent-dialog" aria-label="agent" ng-init="vm.onInit()">
-  <form name="agentForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="STAFF.TEAMS_ASSOCIATION">Teams Association</h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <ms-dual-multiselect
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveTeams()"
-        ng-disabled="!vm.pendingChanges"
-        class="send-button md-accent md-raised"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/staff/views/agents/edit/teamadd/teamadd.html/teamadd.html b/public/src/js/modules/main/apps/staff/views/agents/edit/teamadd/teamadd.html/teamadd.html
new file mode 100644
index 0000000..3a28603
--- /dev/null
+++ b/public/src/js/modules/main/apps/staff/views/agents/edit/teamadd/teamadd.html/teamadd.html
@@ -0,0 +1,40 @@
+<md-dialog class="agent-dialog" aria-label="agent" ng-init="vm.onInit()">
+  <form name="agentForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="STAFF.TEAMS_ASSOCIATION">Teams Association</h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <ms-dual-multiselect
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveTeams()"
+        ng-disabled="!vm.pendingChanges"
+        class="send-button md-accent md-raised"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/staff/views/agents/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/staff/views/agents/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index 03b8534..0000000
--- a/public/src/js/modules/main/apps/staff/views/agents/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,1795 +0,0 @@
-<div id="staff-agent" class="page-layout simple tabbed" layout="column">
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-agents-button md-icon-button"
-        aria-label="Go to agents"
-        ng-click="vm.gotoAgents()"
-        translate
-        translate-attr-aria-label="STAFF.GO_TO_AGENTS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="agent-image" hide-xs>
-          <img ng-src="assets/images/business/agents.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.agent.id}}
-            <span ng-if="vm.agent.name">{{vm.agent.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="STAFF.CREATED_AT"></span>
-            <span>{{vm.agent.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div ng-cloak>
-      <md-fab-speed-dial md-direction="left" class="md-scale md-fab">
-        <md-fab-trigger>
-          <md-button aria-label="menu" class="md-fab md-primary md-icon-button">
-            <md-tooltip md-direction="top" md-visible="false"
-              ><span translate="STAFF.CHANNELS">Channels</span></md-tooltip
-            >
-            <md-icon
-              md-font-icon="icon-stackoverflow"
-              aria-label="queueadd"
-            ></md-icon>
-          </md-button>
-        </md-fab-trigger>
-        <md-fab-actions>
-          <md-button
-            aria-label="voice"
-            class="md-fab md-raised md-icon-button md-mini"
-            ng-click="vm.queueaddchannel(vm.agent, 'voice', $event, 'inbound')"
-          >
-            <md-tooltip md-direction="bottom" md-visible="false"
-              ><span translate="VOICE.VOICE">Voice</span></md-tooltip
-            >
-            <md-icon md-font-icon="icon-phone" aria-label="voice"></md-icon>
-          </md-button>
-          <md-button
-            ng-if="vm.license.dialer"
-            aria-label="motion bull"
-            class="md-fab md-raised md-icon-button md-mini"
-            ng-click="vm.queueaddchannel(vm.agent, 'voice', $event, 'outbound')"
-          >
-            <md-tooltip md-direction="bottom" md-visible="false"
-              ><span translate="MOTIONDIALER.MOTIONDIALER"
-                >Motion Bull</span
-              ></md-tooltip
-            >
-            <md-icon
-              md-font-icon="icon-fire"
-              aria-label="motion bull"
-            ></md-icon>
-          </md-button>
-          <md-button
-            ng-if="vm.license.chat"
-            aria-label="chat"
-            class="md-fab md-raised md-icon-button md-mini"
-            ng-click="vm.queueaddchannel(vm.agent, 'chat', $event)"
-          >
-            <md-tooltip md-direction="bottom" md-visible="false"
-              ><span translate="CHAT.CHAT">Chat</span></md-tooltip
-            >
-            <md-icon md-font-icon="icon-hangouts" aria-label="chat"></md-icon>
-          </md-button>
-          <md-button
-            ng-if="vm.license.mail"
-            aria-label="mail"
-            class="md-fab md-raised md-icon-button md-mini"
-            ng-click="vm.queueaddchannel(vm.agent, 'mail', $event)"
-          >
-            <md-tooltip md-direction="bottom" md-visible="false"
-              ><span translate="MAIL.MAIL">Email</span></md-tooltip
-            >
-            <md-icon md-font-icon="icon-email" aria-label="mail"></md-icon>
-          </md-button>
-          <md-button
-            ng-if="vm.license.messaging"
-            aria-label="sms"
-            class="md-fab md-raised md-icon-button md-mini"
-            ng-click="vm.queueaddchannel(vm.agent, 'sms', $event)"
-          >
-            <md-tooltip md-direction="bottom" md-visible="false"
-              ><span translate="SMS.SMS">Sms</span></md-tooltip
-            >
-            <md-icon
-              md-font-icon="icon-message-text"
-              aria-label="sms"
-            ></md-icon>
-          </md-button>
-          <md-button
-            ng-if="vm.license.openchannel"
-            aria-label="openchannel"
-            class="md-fab md-raised md-icon-button md-mini"
-            ng-click="vm.queueaddchannel(vm.agent, 'openchannel', $event)"
-          >
-            <md-tooltip md-direction="bottom" md-visible="false"
-              ><span translate="OPENCHANNEL.OPENCHANNEL"
-                >Openchannel</span
-              ></md-tooltip
-            >
-            <md-icon
-              md-font-icon="icon-google-earth"
-              aria-label="openchannel"
-            ></md-icon>
-          </md-button>
-          <md-button
-            ng-if="vm.license.fax"
-            aria-label="fax"
-            class="md-fab md-raised md-icon-button md-mini"
-            ng-click="vm.queueaddchannel(vm.agent, 'fax', $event)"
-          >
-            <md-tooltip md-direction="bottom" md-visible="false"
-              ><span translate="FAX.FAX">Fax</span></md-tooltip
-            >
-            <md-icon md-font-icon="icon-deskphone" aria-label="fax"></md-icon>
-          </md-button>
-          <md-button
-            ng-if="vm.license.whatsapp"
-            aria-label="whatsapp"
-            class="md-fab md-raised md-icon-button md-mini"
-            ng-click="vm.queueaddchannel(vm.agent, 'whatsapp', $event)"
-          >
-            <md-tooltip md-direction="bottom" md-visible="false"
-              ><span translate="WHATSAPP.WHATSAPP">whatsapp</span></md-tooltip
-            >
-            <md-icon
-              md-font-icon="icon-whatsapp"
-              aria-label="whatsapp"
-            ></md-icon>
-          </md-button>
-        </md-fab-actions>
-      </md-fab-speed-dial>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.teamadddialog(vm.agent, $event)"
-        class="md-fab md-orange-500-bg md-icon-button"
-        aria-label="teamadd"
-      >
-        <md-tooltip><span translate="STAFF.TEAMADD_AGENT"></span></md-tooltip>
-        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
-      </md-button>
-    </div>
-
-    <div ng-cloak ng-if="vm.crudPermissions.canEdit">
-      <md-button
-        ng-click="vm.changepassworddialog(vm.agent, $event)"
-        class="md-fab md-warn md-icon-button"
-        aria-label="changepassword"
-      >
-        <md-tooltip
-          ><span translate="STAFF.CHANGEPASSWORD_AGENT"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-key-variant"></md-icon>
-      </md-button>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveAgent()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(personal_infoForm.$invalid) || (security_suiteForm.$invalid) || (change_avatarForm.$invalid) || (generalForm.$invalid) || (capacityForm.$invalid) || (settingsForm.$invalid) || (remote_controlForm.$invalid) || (sipForm.$invalid) || (callforwardingForm.$invalid) || (settings_webrtcForm.$invalid) || (sip_webrtcForm.$invalid) || (general_permissionsForm.$invalid) || (permissionsForm.$invalid)"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="STAFF.ACCOUNT">ACCOUNT</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="agent-detail-form-container personal_info md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="STAFF.PERSONAL_INFO">
-                PERSONAL_INFO
-              </div>
-            </div>
-            <form name="personal_infoForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="STAFF.FULLNAME">Fullname</label>
-                <input
-                  type="text"
-                  name="fullname"
-                  ng-model="vm.agent.fullname"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="personal_infoForm['fullname'].$error"
-                  ng-show="personal_infoForm['fullname'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.FULLNAME_REQUIRED"
-                      >Fullname field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.USERNAME">Username</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.agent.name"
-                  ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-                  ng-required="true"
-                  disabled
-                />
-
-                <div class="hint">
-                  <span translate="STAFF.HELP.USERNAME"></span>
-                </div>
-                <div
-                  ng-messages="personal_infoForm['name'].$error"
-                  ng-show="personal_infoForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.USERNAME_REQUIRED"
-                      >Username field is required</span
-                    >
-                  </div>
-                  <div ng-message="pattern">
-                    <span
-                      translate="STAFF.ERRORS.USERNAME_MUST_VALID_PATTERN"
-                      translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-                      >Username must be valid pattern
-                    </span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.ALIAS">Alias</label>
-                <input
-                  type="text"
-                  name="alias"
-                  ng-model="vm.agent.alias"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="personal_infoForm['alias'].$error"
-                  ng-show="personal_infoForm['alias'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.ALIAS_REQUIRED"
-                      >Alias field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.SHOWWEBCONTROL">ShowWebControl</label>
-                <md-select
-                  name="showWebBar"
-                  ng-model="vm.agent.showWebBar"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="0">Phonebar</md-option>
-                  <md-option ng-value="1">External</md-option>
-                  <md-option ng-value="2">WebRTC</md-option>
-                </md-select>
-                <div
-                  ng-messages="personal_infoForm['showWebBar'].$error"
-                  ng-show="personal_infoForm['showWebBar'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.SHOWWEBCONTROL_REQUIRED"
-                      >ShowWebControl field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.EMAIL">Email</label>
-                <input
-                  type="email"
-                  name="email"
-                  ng-model="vm.agent.email"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="personal_infoForm['email'].$error"
-                  ng-show="personal_infoForm['email'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.EMAIL_REQUIRED"
-                      >Email field is required</span
-                    >
-                  </div>
-                  <div ng-message="email">
-                    <span translate="STAFF.ERRORS.EMAIL_MUST_VALID"
-                      >Email must be a valid e-mail address</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.PHONE">Phone</label>
-                <input
-                  type="text"
-                  name="phone"
-                  ng-model="vm.agent.phone"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="personal_infoForm['phone'].$error"
-                  ng-show="personal_infoForm['phone'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.PHONE_REQUIRED"
-                      >Phone field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.MOBILE">Mobile</label>
-                <input
-                  type="text"
-                  name="mobile"
-                  ng-model="vm.agent.mobile"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="personal_infoForm['mobile'].$error"
-                  ng-show="personal_infoForm['mobile'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.MOBILE_REQUIRED"
-                      >Mobile field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.agent.showWebBar == 1"
-                class="md-block"
-              >
-                <md-switch
-                  ng-model="vm.agent.hotdesk"
-                  aria-label="Hotdesk"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="STAFF.HOTDESK">Hotdesk</span></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.agent.loginInPause"
-                  aria-label="LoginInPause"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="STAFF.LOGININPAUSE"
-                    >LoginInPause</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.agent.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="personal_infoForm['description'].$error"
-                  ng-show="personal_infoForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="agent-detail-form-container security_suite md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="STAFF.SECURITY_SUITE">
-                SECURITY_SUITE
-              </div>
-            </div>
-            <form name="security_suiteForm" novalidate>
-              <md-input-container
-                ng-if="vm.agent.passwordResetAt != null"
-                class="md-block"
-              >
-                <label translate="STAFF.LAST_PASSWORD_RESET_AT"
-                  >Last_Password_Reset_At</label
-                >
-                <input
-                  type="text"
-                  name="passwordResetAt"
-                  ng-model="vm.agent.passwordResetAt"
-                  autofocus
-                  disabled
-                />
-
-                <div class="hint">
-                  <span translate="STAFF.HELP.LAST_PASSWORD_RESET_AT"></span>
-                </div>
-                <div
-                  ng-messages="security_suiteForm['passwordResetAt'].$error"
-                  ng-show="security_suiteForm['passwordResetAt'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="STAFF.ERRORS.LAST_PASSWORD_RESET_AT_REQUIRED"
-                      >Last_Password_Reset_At field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.agent.passwordResetAt == null"
-                class="md-block"
-              >
-                <label translate="STAFF.NO_PASSWORD_CHANGE"
-                  >No_Password_Change</label
-                >
-                <input
-                  type="text"
-                  name="passwordResetAt"
-                  ng-model="vm.agent.passwordResetAt"
-                  disabled
-                />
-
-                <div
-                  ng-messages="security_suiteForm['passwordResetAt'].$error"
-                  ng-show="security_suiteForm['passwordResetAt'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.NO_PASSWORD_CHANGE_REQUIRED"
-                      >No_Password_Change field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.agent.disabled"
-                  aria-label="Disabled"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="STAFF.DISABLED">Disabled</span></md-switch
-                >
-
-                <div class="hint">
-                  <span translate="STAFF.HELP.DISABLED"></span>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.agent.disabled == 0"
-                class="md-block"
-              >
-                <md-switch
-                  ng-model="vm.agent.blocked"
-                  aria-label="Blocked"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="STAFF.BLOCKED">Blocked</span></md-switch
-                >
-
-                <div class="hint">
-                  <span translate="STAFF.HELP.BLOCKED"></span>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="agent-detail-form-container change_avatar md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="STAFF.CHANGE_AVATAR">
-                CHANGE_AVATAR
-              </div>
-            </div>
-            <div
-              ng-controller="Agentchange_avatarController as vm_ca"
-              ng-init="vm_ca.init(vm.agent, vm.crudPermissions)"
-              class="agent-detail-form-container md-background-bg md-whiteframe-1dp"
-            >
-              <div
-                id="agent-image-uploader"
-                flow-init="vm_ca.ngFlowOptions"
-                flow-name="vm_ca.ngFlow.flow"
-                flow-files-submitted="vm_ca.upload()"
-                flow-file-added="vm_ca.fileAdded($file)"
-                flow-file-success="vm_ca.fileSuccess($file, $message)"
-                flow-complete="vm_ca.uploadComplete()"
-                flow-drop
-                flow-drag-enter="vm_ca.dropping=true"
-                flow-drag-leave="vm_ca.dropping=false"
-                ng-class="{'dropping':vm.dropping}"
-              >
-                <div
-                  class="drop-text hint-text"
-                  layout="row"
-                  layout-align="center center"
-                >
-                  <span translate="EC.DROP_TO_UPLOAD">Drop to upload</span>
-                </div>
-
-                <div
-                  class="upload-button"
-                  layout="column"
-                  layout-align="center center"
-                >
-                  <md-button
-                    class="md-accent md-raised"
-                    flow-btn
-                    ng-disabled="!vm_ca.crudPermissions.canEdit"
-                  >
-                    Upload
-                  </md-button>
-                  <span class="secondary-text mt-8"
-                    >You can also drop images here to upload. Only PNG, JPG -
-                    Max. 8MB</span
-                  >
-                </div>
-
-                <div layout="row" layout-align="start start" layout-wrap>
-                  <div
-                    ng-repeat="change_avatarimage in vm_ca.agent.images"
-                    ng-switch="change_avatarimage.type"
-                  >
-                    <div
-                      class="agent-image uploading"
-                      ng-switch-when="uploading"
-                      layout="row"
-                      layout-align="center center"
-                    >
-                      <div
-                        class="overlay"
-                        layout="column"
-                        layout-align="center center"
-                      >
-                        <md-progress-linear
-                          md-mode="determinate"
-                          value="{{change_avatarimage.file.progress() * 100}}"
-                        >
-                        </md-progress-linear>
-                      </div>
-                      <img class="media" flow-img="change_avatarimage.file" />
-                    </div>
-
-                    <div
-                      class="agent-image"
-                      ng-switch-when="image"
-                      layout="row"
-                      layout-align="center center"
-                    >
-                      <img class="media" ng-src="{{change_avatarimage.url}}" />
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="STAFF.VOICE">VOICE</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="agent-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="STAFF.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container
-                ng-if="!vm.agent.autointernal"
-                class="md-block"
-              >
-                <label translate="STAFF.INTERNAL">Internal</label>
-                <input
-                  type="text"
-                  name="internal"
-                  ng-model="vm.agent.internal"
-                  ng-required="true"
-                  autofocus
-                  disabled
-                />
-
-                <div
-                  ng-messages="generalForm['internal'].$error"
-                  ng-show="generalForm['internal'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.INTERNAL_REQUIRED"
-                      >Internal field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.agent.showWebBar != 2"
-                class="md-block"
-              >
-                <label translate="STAFF.TRANSPORT">Transport</label>
-                <md-select
-                  name="transport"
-                  ng-model="vm.agent.transport"
-                  multiple
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'udp'">udp</md-option>
-                  <md-option ng-value="'tcp'">tcp</md-option>
-                  <md-option ng-value="'ws'" ng-if="vm.agent.showWebBar == 1"
-                    >ws</md-option
-                  >
-                  <md-option ng-value="'wss'" ng-if="vm.agent.showWebBar == 1"
-                    >wss</md-option
-                  >
-                  <md-option ng-value="'tls'" ng-if="vm.agent.showWebBar == 1"
-                    >tls</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span translate="STAFF.HELP.TRANSPORT"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['transport'].$error"
-                  ng-show="generalForm['transport'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.TRANSPORT_REQUIRED"
-                      >Transport field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.HOST">Host</label>
-                <input
-                  type="text"
-                  name="host"
-                  ng-model="vm.agent.host"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="STAFF.HELP.HOST"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['host'].$error"
-                  ng-show="generalForm['host'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.HOST_REQUIRED"
-                      >Host field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.NAT">NAT</label>
-                <md-select
-                  name="nat"
-                  ng-model="vm.agent.nat"
-                  multiple
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'force_rport'">force_rport</md-option>
-                  <md-option ng-value="'comedia'">comedia</md-option>
-                  <md-option ng-value="'yes'">yes</md-option>
-                  <md-option ng-value="'no'">no</md-option>
-                  <md-option ng-value="'never'">never</md-option>
-                  <md-option ng-value="'route'">route</md-option>
-                </md-select>
-                <div class="hint"><span translate="STAFF.HELP.NAT"></span></div>
-                <div
-                  ng-messages="generalForm['nat'].$error"
-                  ng-show="generalForm['nat'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.NAT_REQUIRED"
-                      >NAT field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.TYPE">Type</label>
-                <md-select
-                  name="type"
-                  ng-model="vm.agent.type"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'friend'">Friend</md-option>
-                  <md-option ng-value="'user'">User</md-option>
-                  <md-option ng-value="'peer'">Peer</md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="STAFF.HELP.TYPE"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['type'].$error"
-                  ng-show="generalForm['type'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.TYPE_REQUIRED"
-                      >Type field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.ALLOWCODECS">AllowCodecs</label>
-                <md-select
-                  name="allow"
-                  ng-model="vm.agent.allow"
-                  multiple
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'ulaw'">ulaw</md-option>
-                  <md-option ng-value="'alaw'">alaw</md-option>
-                  <md-option ng-value="'gsm'">gsm</md-option>
-                  <md-option ng-value="'g722'">g722</md-option>
-                  <md-option ng-value="'g729'">g729</md-option>
-                  <md-option ng-value="'opus'">opus</md-option>
-                  <md-option ng-value="'h264'">h264</md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="STAFF.HELP.ALLOWCODECS"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['allow'].$error"
-                  ng-show="generalForm['allow'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.ALLOWCODECS_REQUIRED"
-                      >AllowCodecs field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.CALLERID">CallerId</label>
-                <input
-                  type="text"
-                  name="callerid"
-                  ng-model="vm.agent.callerid"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['callerid'].$error"
-                  ng-show="generalForm['callerid'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.CALLERID_REQUIRED"
-                      >CallerId field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.CONTEXT">Context</label>
-                <md-select
-                  name="context"
-                  ng-model="vm.agent.context"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="context.name"
-                    ng-repeat="context in vm.contexts"
-                    ng-disabled="context.canSelect === false"
-                    >{{ context.name }}</md-option
-                  >
-                </md-select>
-                <div
-                  ng-messages="generalForm['context'].$error"
-                  ng-show="generalForm['context'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.CONTEXT_REQUIRED"
-                      >Context field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.CALLGROUP">Callgroup</label>
-                <input
-                  type="text"
-                  name="callgroup"
-                  ng-model="vm.agent.callgroup"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="STAFF.HELP.CALLGROUP"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['callgroup'].$error"
-                  ng-show="generalForm['callgroup'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.CALLGROUP_REQUIRED"
-                      >Callgroup field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.PICKUPGROUP">Pickupgroup</label>
-                <input
-                  type="text"
-                  name="pickupgroup"
-                  ng-model="vm.agent.pickupgroup"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="STAFF.HELP.PICKUPGROUP"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['pickupgroup'].$error"
-                  ng-show="generalForm['pickupgroup'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.PICKUPGROUP_REQUIRED"
-                      >Pickupgroup field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.agent.chanspy"
-                  aria-label="chanSpy"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="STAFF.CHANSPY">chanSpy</span></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.VIDEOSUPPORT">Videosupport</label>
-                <md-select
-                  name="videosupport"
-                  ng-model="vm.agent.videosupport"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">Yes</md-option>
-                  <md-option ng-value="'no'">No</md-option>
-                  <md-option ng-value="'always'">Always</md-option>
-                </md-select>
-                <div
-                  ng-messages="generalForm['videosupport'].$error"
-                  ng-show="generalForm['videosupport'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.VIDEOSUPPORT_REQUIRED"
-                      >Videosupport field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.MONITOREXTENSION"
-                  >MonitorExtension</label
-                >
-                <md-select
-                  name="extensionMonitor"
-                  ng-model="vm.agent.extensionMonitor"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="''">Inactive</md-option>
-                  <md-option ng-value="'wav'">wav</md-option>
-                  <md-option ng-value="'WAV'">wav49</md-option>
-                  <md-option ng-value="'gsm'">gsm</md-option>
-                </md-select>
-                <div
-                  ng-messages="generalForm['extensionMonitor'].$error"
-                  ng-show="generalForm['extensionMonitor'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.MONITOREXTENSION_REQUIRED"
-                      >MonitorExtension field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="STAFF.OTHER_CHANNELS">OTHER_CHANNELS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="agent-detail-form-container capacity md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="STAFF.CAPACITY">
-                CAPACITY
-              </div>
-            </div>
-            <form name="capacityForm" novalidate>
-              <md-input-container ng-if="vm.license.chat" class="md-block">
-                <label translate="STAFF.CHATCAPACITY">ChatCapacity</label>
-                <input
-                  type="number"
-                  name="chatCapacity"
-                  ng-model="vm.agent.chatCapacity"
-                  min="0"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="STAFF.HELP.CHATCAPACITY"></span>
-                </div>
-                <div
-                  ng-messages="capacityForm['chatCapacity'].$error"
-                  ng-show="capacityForm['chatCapacity'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.CHATCAPACITY_REQUIRED"
-                      >ChatCapacity field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="STAFF.ERRORS.CHATCAPACITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >ChatCapacity must be a valid greater or equal than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container ng-if="vm.license.mail" class="md-block">
-                <label translate="STAFF.MAILCAPACITY">MailCapacity</label>
-                <input
-                  type="number"
-                  name="mailCapacity"
-                  ng-model="vm.agent.mailCapacity"
-                  min="0"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="STAFF.HELP.MAILCAPACITY"></span>
-                </div>
-                <div
-                  ng-messages="capacityForm['mailCapacity'].$error"
-                  ng-show="capacityForm['mailCapacity'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.MAILCAPACITY_REQUIRED"
-                      >MailCapacity field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="STAFF.ERRORS.MAILCAPACITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >MailCapacity must be a valid greater or equal than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container ng-if="vm.license.messaging" class="md-block">
-                <label translate="STAFF.SMSCAPACITY">SMSCapacity</label>
-                <input
-                  type="number"
-                  name="smsCapacity"
-                  ng-model="vm.agent.smsCapacity"
-                  min="0"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="STAFF.HELP.SMSCAPACITY"></span>
-                </div>
-                <div
-                  ng-messages="capacityForm['smsCapacity'].$error"
-                  ng-show="capacityForm['smsCapacity'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.SMSCAPACITY_REQUIRED"
-                      >SMSCapacity field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="STAFF.ERRORS.SMSCAPACITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >SMSCapacity must be a valid greater or equal than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.license.openchannel"
-                class="md-block"
-              >
-                <label translate="STAFF.OPENCHANNELCAPACITY"
-                  >OpenchannelCapacity</label
-                >
-                <input
-                  type="number"
-                  name="openchannelCapacity"
-                  ng-model="vm.agent.openchannelCapacity"
-                  min="0"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="STAFF.HELP.OPENCHANNELCAPACITY"></span>
-                </div>
-                <div
-                  ng-messages="capacityForm['openchannelCapacity'].$error"
-                  ng-show="capacityForm['openchannelCapacity'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.OPENCHANNELCAPACITY_REQUIRED"
-                      >OpenchannelCapacity field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="STAFF.ERRORS.OPENCHANNELCAPACITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >OpenchannelCapacity must be a valid greater or equal
-                      than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container ng-if="vm.license.fax" class="md-block">
-                <label translate="STAFF.FAXCAPACITY">FaxCapacity</label>
-                <input
-                  type="number"
-                  name="faxCapacity"
-                  ng-model="vm.agent.faxCapacity"
-                  min="0"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="STAFF.HELP.FAXCAPACITY"></span>
-                </div>
-                <div
-                  ng-messages="capacityForm['faxCapacity'].$error"
-                  ng-show="capacityForm['faxCapacity'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.FAXCAPACITY_REQUIRED"
-                      >FaxCapacity field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="STAFF.ERRORS.FAXCAPACITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >FaxCapacity must be a valid greater or equal than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container ng-if="vm.license.whatsapp" class="md-block">
-                <label translate="STAFF.WHATSAPPCAPACITY"
-                  >WhatsappCapacity</label
-                >
-                <input
-                  type="number"
-                  name="whatsappCapacity"
-                  ng-model="vm.agent.whatsappCapacity"
-                  min="0"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="STAFF.HELP.WHATSAPPCAPACITY"></span>
-                </div>
-                <div
-                  ng-messages="capacityForm['whatsappCapacity'].$error"
-                  ng-show="capacityForm['whatsappCapacity'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.WHATSAPPCAPACITY_REQUIRED"
-                      >WhatsappCapacity field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="STAFF.ERRORS.WHATSAPPCAPACITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >WhatsappCapacity must be a valid greater or equal
-                      than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab ng-if="vm.agent.showWebBar == 0">
-        <md-tab-label>
-          <span translate="STAFF.MOTIONBAR">MOTIONBAR</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="agent-detail-form-container settings md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="STAFF.SETTINGS">
-                SETTINGS
-              </div>
-            </div>
-            <form name="settingsForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.agent.phoneBarEnableSettings"
-                  aria-label="EnableSettings"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="STAFF.ENABLESETTINGS"
-                    >EnableSettings</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.agent.phoneBarAutoAnswer"
-                  aria-label="AutoAnswer"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="STAFF.AUTOANSWER"
-                    >AutoAnswer</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.agent.phoneBarAutoAnswer"
-                class="md-block"
-              >
-                <label translate="STAFF.AUTOANSWERDELAY">AutoAnswerDelay</label>
-                <input
-                  type="number"
-                  name="phoneBarAutoAnswerDelay"
-                  ng-model="vm.agent.phoneBarAutoAnswerDelay"
-                  min="0"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="settingsForm['phoneBarAutoAnswerDelay'].$error"
-                  ng-show="settingsForm['phoneBarAutoAnswerDelay'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.AUTOANSWERDELAY_REQUIRED"
-                      >AutoAnswerDelay field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="STAFF.ERRORS.AUTOANSWERDELAY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AutoAnswerDelay must be a valid greater or equal
-                      than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.agent.phoneBarRingInUse"
-                  aria-label="RingInUse"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="STAFF.RINGINUSE">RingInUse</span></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.agent.phoneBarEnableRecording"
-                  aria-label="EnableRecording"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="STAFF.ENABLERECORDING"
-                    >EnableRecording</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.agent.phoneBarEnableDtmfTone"
-                  aria-label="EnableDtmfTone"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="STAFF.ENABLEDTMFTONE"
-                    >EnableDtmfTone</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.agent.phoneBarDnd"
-                  aria-label="Dnd"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="STAFF.DND">Dnd</span></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.agent.phoneBarUnansweredCallBadge"
-                  aria-label="UnansweredCallBadge"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="STAFF.UNANSWEREDCALLBADGE"
-                    >UnansweredCallBadge</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.agent.showWebBar == 0"
-                class="md-block"
-              >
-                <md-switch
-                  ng-model="vm.agent.phoneBarEnableJaws"
-                  aria-label="EnableJawsIntegration"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="STAFF.ENABLEJAWSINTEGRATION"
-                    >EnableJawsIntegration</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.agent.showWebBar == 0 && vm.license.screenrecording"
-                class="md-block"
-              >
-                <md-switch
-                  ng-change="vm.onEnableScreenRecordingByAgentSelection()"
-                  ng-model="vm.agent.phoneBarEnableScreenRecordingByAgent"
-                  aria-label="EnableScreenRecordingByAgent"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="STAFF.ENABLESCREENRECORDINGBYAGENT"
-                    >EnableScreenRecordingByAgent</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.agent.showWebBar == 0 && vm.license.screenrecording"
-                class="md-block"
-              >
-                <md-switch
-                  ng-change="vm.onEnableAutomaticScreenRecordingSelection()"
-                  ng-model="vm.agent.phoneBarEnableAutomaticScreenRecording"
-                  aria-label="EnableAutomaticScreenRecording"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="STAFF.ENABLEAUTOMATICSCREENRECORDING"
-                    >EnableAutomaticScreenRecording</span
-                  ></md-switch
-                >
-
-                <div class="hint">
-                  <span
-                    translate="STAFF.HELP.ENABLEAUTOMATICSCREENRECORDING"
-                  ></span>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="agent-detail-form-container remote_control md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="STAFF.REMOTE_CONTROL">
-                REMOTE_CONTROL
-              </div>
-            </div>
-            <form name="remote_controlForm" novalidate>
-              <md-input-container
-                ng-if="vm.agent.showWebBar == 0"
-                class="md-block"
-              >
-                <md-switch
-                  ng-model="vm.agent.phoneBarRemoteControl"
-                  aria-label="RemoteControl"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="STAFF.REMOTECONTROL"
-                    >RemoteControl</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.agent.phoneBarRemoteControl && vm.agent.showWebBar == 0"
-                class="md-block"
-              >
-                <label translate="STAFF.REMOTECONTROLPORT"
-                  >RemoteControlPort</label
-                >
-                <input
-                  type="number"
-                  name="phoneBarRemoteControlPort"
-                  ng-model="vm.agent.phoneBarRemoteControlPort"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="remote_controlForm['phoneBarRemoteControlPort'].$error"
-                  ng-show="remote_controlForm['phoneBarRemoteControlPort'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.REMOTECONTROLPORT_REQUIRED"
-                      >RemoteControlPort field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="agent-detail-form-container sip md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="STAFF.SIP">SIP</div>
-            </div>
-            <form name="sipForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="STAFF.SIPEXPIRES">SipExpires</label>
-                <input
-                  type="number"
-                  name="phoneBarExpires"
-                  ng-model="vm.agent.phoneBarExpires"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="STAFF.HELP.SIPEXPIRES"></span>
-                </div>
-                <div
-                  ng-messages="sipForm['phoneBarExpires'].$error"
-                  ng-show="sipForm['phoneBarExpires'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.SIPEXPIRES_REQUIRED"
-                      >SipExpires field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.SIPPORT">SipPort</label>
-                <input
-                  type="number"
-                  name="phoneBarListenPort"
-                  ng-model="vm.agent.phoneBarListenPort"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="STAFF.HELP.SIPPORT"></span>
-                </div>
-                <div
-                  ng-messages="sipForm['phoneBarListenPort'].$error"
-                  ng-show="sipForm['phoneBarListenPort'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.SIPPORT_REQUIRED"
-                      >SipPort field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="agent-detail-form-container callforwarding md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="STAFF.CALLFORWARDING">
-                CALLFORWARDING
-              </div>
-            </div>
-            <form name="callforwardingForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.agent.phoneBarUnconditional"
-                  aria-label="Unconditional"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="STAFF.UNCONDITIONAL"
-                    >Unconditional</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.agent.phoneBarUnconditional"
-                class="md-block"
-              >
-                <label translate="STAFF.UNCONDITIONALNUMBER"
-                  >UnconditionalNumber</label
-                >
-                <input
-                  type="text"
-                  name="phoneBarUnconditionalNumber"
-                  ng-model="vm.agent.phoneBarUnconditionalNumber"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="callforwardingForm['phoneBarUnconditionalNumber'].$error"
-                  ng-show="callforwardingForm['phoneBarUnconditionalNumber'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.UNCONDITIONALNUMBER_REQUIRED"
-                      >UnconditionalNumber field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab ng-if="vm.agent.showWebBar == 2">
-        <md-tab-label>
-          <span translate="STAFF.WEBRTC">WEBRTC</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="agent-detail-form-container settings_webrtc md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="STAFF.SETTINGS_WEBRTC">
-                SETTINGS_WEBRTC
-              </div>
-            </div>
-            <form name="settings_webrtcForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="STAFF.DTLSCERTFILE">dtlscertfile</label>
-                <input
-                  type="text"
-                  name="dtlscertfile"
-                  ng-model="vm.agent.dtlscertfile"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="STAFF.HELP.DTLSCERTFILE"></span>
-                </div>
-                <div
-                  ng-messages="settings_webrtcForm['dtlscertfile'].$error"
-                  ng-show="settings_webrtcForm['dtlscertfile'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.DTLSCERTFILE_REQUIRED"
-                      >dtlscertfile field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.DTLSPRIVATEKEY">dtlsprivatekey</label>
-                <input
-                  type="text"
-                  name="dtlsprivatekey"
-                  ng-model="vm.agent.dtlsprivatekey"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="STAFF.HELP.DTLSPRIVATEKEY"></span>
-                </div>
-                <div
-                  ng-messages="settings_webrtcForm['dtlsprivatekey'].$error"
-                  ng-show="settings_webrtcForm['dtlsprivatekey'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.DTLSPRIVATEKEY_REQUIRED"
-                      >dtlsprivatekey field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.agent.phoneBarEnableSettings"
-                  aria-label="EnableSettings"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="STAFF.ENABLESETTINGS"
-                    >EnableSettings</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.agent.phoneBarAutoAnswer"
-                  aria-label="AutoAnswer"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="STAFF.AUTOANSWER"
-                    >AutoAnswer</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.agent.phoneBarAutoAnswer"
-                class="md-block"
-              >
-                <label translate="STAFF.AUTOANSWERDELAY">AutoAnswerDelay</label>
-                <input
-                  type="number"
-                  name="phoneBarAutoAnswerDelay"
-                  ng-model="vm.agent.phoneBarAutoAnswerDelay"
-                  min="0"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="settings_webrtcForm['phoneBarAutoAnswerDelay'].$error"
-                  ng-show="settings_webrtcForm['phoneBarAutoAnswerDelay'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.AUTOANSWERDELAY_REQUIRED"
-                      >AutoAnswerDelay field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="STAFF.ERRORS.AUTOANSWERDELAY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AutoAnswerDelay must be a valid greater or equal
-                      than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.agent.phoneBarEnableRecording"
-                  aria-label="EnableRecording"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="STAFF.ENABLERECORDING"
-                    >EnableRecording</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.agent.phoneBarEnableDtmfTone"
-                  aria-label="EnableDtmfTone"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="STAFF.ENABLEDTMFTONE"
-                    >EnableDtmfTone</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.agent.phoneBarDnd"
-                  aria-label="Dnd"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="STAFF.DND">Dnd</span></md-switch
-                >
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="agent-detail-form-container sip_webrtc md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="STAFF.SIP_WEBRTC">
-                SIP_WEBRTC
-              </div>
-            </div>
-            <form name="sip_webrtcForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="STAFF.SIPEXPIRES">SipExpires</label>
-                <input
-                  type="number"
-                  name="phoneBarExpires"
-                  ng-model="vm.agent.phoneBarExpires"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="STAFF.HELP.SIPEXPIRES"></span>
-                </div>
-                <div
-                  ng-messages="sip_webrtcForm['phoneBarExpires'].$error"
-                  ng-show="sip_webrtcForm['phoneBarExpires'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.SIPEXPIRES_REQUIRED"
-                      >SipExpires field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="STAFF.PERMISSIONS">PERMISSIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="agent-detail-form-container general_permissions md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div
-                class="h2 secondary-text"
-                translate="STAFF.GENERAL_PERMISSIONS"
-              >
-                GENERAL_PERMISSIONS
-              </div>
-            </div>
-            <form name="general_permissionsForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.agent.allowmessenger"
-                  aria-label="EnableMessenger"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="STAFF.ENABLEMESSENGER"
-                    >EnableMessenger</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.agent.phoneBarPrefixRequired"
-                  aria-label="PrefixRequired"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="STAFF.PREFIXREQUIRED"
-                    >PrefixRequired</span
-                  ></md-switch
-                >
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="agent-detail-form-container permissions md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="STAFF.PERMISSIONS">
-                PERMISSIONS
-              </div>
-            </div>
-            <div
-              ng-controller="AgentPermissionsController as vm_pc"
-              ng-init="vm_pc.init(vm.agent, vm.crudPermissions)"
-              class="agent-detail-form-container"
-            >
-              <md-list
-                ng-repeat="father in vm_pc.navigation[0].children"
-                ng-include="'permission-nested.html'"
-                ng-if="vm_pc.agent.role !== 'admin' && !father.hidden()"
-              ></md-list>
-
-              <!-- Nested navigation template -->
-              <script type="text/ng-template" id="permission-nested.html">
-                <md-list-item>
-                  <md-icon md-font-icon="{{father.icon}}"></md-icon>
-                  <p translate="{{father.translate}}">{{ father.title }}</p>
-                  <md-switch class="md-secondary" ng-model="father.enabled" ng-change="vm_pc.onChange(father)" ng-init="father.enabled = vm_pc.agent.permissions.includes(father.id)"
-                            ng-disabled="!vm_pc.crudPermissions.canEdit"></md-switch>
-                </md-list-item>
-
-                <md-divider></md-divider>
-
-                <md-list>
-                  <md-list-item ng-repeat="child in father.children" ng-if="child.id !== 201">
-                    <md-icon ng-if="child.icon" md-font-icon="{{child.icon}}"></md-icon>
-                    <p translate="{{child.translate}}">{{ child.title }}</p>
-                    <md-switch ng-model="child.enabled" ng-change="vm_pc.onChange(father, child)" ng-init="child.enabled = vm_pc.agent.permissions.includes(child.id)"
-                              ng-disabled="!vm_pc.crudPermissions.canEdit"></md-switch>
-                    </md-list-item>
-                </md-list>
-              </script>
-              <!-- / Nested navigation template -->
-
-              <span
-                ng-if="vm_pc.agent.role === 'admin'"
-                class="md-headline"
-                translate="STAFF.ALL_MODULES_AVAILABLE"
-                >All modules are already available.</span
-              >
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/staff/views/agents/edit/view.html/view.html b/public/src/js/modules/main/apps/staff/views/agents/edit/view.html/view.html
new file mode 100644
index 0000000..03b8534
--- /dev/null
+++ b/public/src/js/modules/main/apps/staff/views/agents/edit/view.html/view.html
@@ -0,0 +1,1795 @@
+<div id="staff-agent" class="page-layout simple tabbed" layout="column">
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-agents-button md-icon-button"
+        aria-label="Go to agents"
+        ng-click="vm.gotoAgents()"
+        translate
+        translate-attr-aria-label="STAFF.GO_TO_AGENTS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="agent-image" hide-xs>
+          <img ng-src="assets/images/business/agents.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.agent.id}}
+            <span ng-if="vm.agent.name">{{vm.agent.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="STAFF.CREATED_AT"></span>
+            <span>{{vm.agent.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div ng-cloak>
+      <md-fab-speed-dial md-direction="left" class="md-scale md-fab">
+        <md-fab-trigger>
+          <md-button aria-label="menu" class="md-fab md-primary md-icon-button">
+            <md-tooltip md-direction="top" md-visible="false"
+              ><span translate="STAFF.CHANNELS">Channels</span></md-tooltip
+            >
+            <md-icon
+              md-font-icon="icon-stackoverflow"
+              aria-label="queueadd"
+            ></md-icon>
+          </md-button>
+        </md-fab-trigger>
+        <md-fab-actions>
+          <md-button
+            aria-label="voice"
+            class="md-fab md-raised md-icon-button md-mini"
+            ng-click="vm.queueaddchannel(vm.agent, 'voice', $event, 'inbound')"
+          >
+            <md-tooltip md-direction="bottom" md-visible="false"
+              ><span translate="VOICE.VOICE">Voice</span></md-tooltip
+            >
+            <md-icon md-font-icon="icon-phone" aria-label="voice"></md-icon>
+          </md-button>
+          <md-button
+            ng-if="vm.license.dialer"
+            aria-label="motion bull"
+            class="md-fab md-raised md-icon-button md-mini"
+            ng-click="vm.queueaddchannel(vm.agent, 'voice', $event, 'outbound')"
+          >
+            <md-tooltip md-direction="bottom" md-visible="false"
+              ><span translate="MOTIONDIALER.MOTIONDIALER"
+                >Motion Bull</span
+              ></md-tooltip
+            >
+            <md-icon
+              md-font-icon="icon-fire"
+              aria-label="motion bull"
+            ></md-icon>
+          </md-button>
+          <md-button
+            ng-if="vm.license.chat"
+            aria-label="chat"
+            class="md-fab md-raised md-icon-button md-mini"
+            ng-click="vm.queueaddchannel(vm.agent, 'chat', $event)"
+          >
+            <md-tooltip md-direction="bottom" md-visible="false"
+              ><span translate="CHAT.CHAT">Chat</span></md-tooltip
+            >
+            <md-icon md-font-icon="icon-hangouts" aria-label="chat"></md-icon>
+          </md-button>
+          <md-button
+            ng-if="vm.license.mail"
+            aria-label="mail"
+            class="md-fab md-raised md-icon-button md-mini"
+            ng-click="vm.queueaddchannel(vm.agent, 'mail', $event)"
+          >
+            <md-tooltip md-direction="bottom" md-visible="false"
+              ><span translate="MAIL.MAIL">Email</span></md-tooltip
+            >
+            <md-icon md-font-icon="icon-email" aria-label="mail"></md-icon>
+          </md-button>
+          <md-button
+            ng-if="vm.license.messaging"
+            aria-label="sms"
+            class="md-fab md-raised md-icon-button md-mini"
+            ng-click="vm.queueaddchannel(vm.agent, 'sms', $event)"
+          >
+            <md-tooltip md-direction="bottom" md-visible="false"
+              ><span translate="SMS.SMS">Sms</span></md-tooltip
+            >
+            <md-icon
+              md-font-icon="icon-message-text"
+              aria-label="sms"
+            ></md-icon>
+          </md-button>
+          <md-button
+            ng-if="vm.license.openchannel"
+            aria-label="openchannel"
+            class="md-fab md-raised md-icon-button md-mini"
+            ng-click="vm.queueaddchannel(vm.agent, 'openchannel', $event)"
+          >
+            <md-tooltip md-direction="bottom" md-visible="false"
+              ><span translate="OPENCHANNEL.OPENCHANNEL"
+                >Openchannel</span
+              ></md-tooltip
+            >
+            <md-icon
+              md-font-icon="icon-google-earth"
+              aria-label="openchannel"
+            ></md-icon>
+          </md-button>
+          <md-button
+            ng-if="vm.license.fax"
+            aria-label="fax"
+            class="md-fab md-raised md-icon-button md-mini"
+            ng-click="vm.queueaddchannel(vm.agent, 'fax', $event)"
+          >
+            <md-tooltip md-direction="bottom" md-visible="false"
+              ><span translate="FAX.FAX">Fax</span></md-tooltip
+            >
+            <md-icon md-font-icon="icon-deskphone" aria-label="fax"></md-icon>
+          </md-button>
+          <md-button
+            ng-if="vm.license.whatsapp"
+            aria-label="whatsapp"
+            class="md-fab md-raised md-icon-button md-mini"
+            ng-click="vm.queueaddchannel(vm.agent, 'whatsapp', $event)"
+          >
+            <md-tooltip md-direction="bottom" md-visible="false"
+              ><span translate="WHATSAPP.WHATSAPP">whatsapp</span></md-tooltip
+            >
+            <md-icon
+              md-font-icon="icon-whatsapp"
+              aria-label="whatsapp"
+            ></md-icon>
+          </md-button>
+        </md-fab-actions>
+      </md-fab-speed-dial>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.teamadddialog(vm.agent, $event)"
+        class="md-fab md-orange-500-bg md-icon-button"
+        aria-label="teamadd"
+      >
+        <md-tooltip><span translate="STAFF.TEAMADD_AGENT"></span></md-tooltip>
+        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
+      </md-button>
+    </div>
+
+    <div ng-cloak ng-if="vm.crudPermissions.canEdit">
+      <md-button
+        ng-click="vm.changepassworddialog(vm.agent, $event)"
+        class="md-fab md-warn md-icon-button"
+        aria-label="changepassword"
+      >
+        <md-tooltip
+          ><span translate="STAFF.CHANGEPASSWORD_AGENT"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-key-variant"></md-icon>
+      </md-button>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveAgent()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(personal_infoForm.$invalid) || (security_suiteForm.$invalid) || (change_avatarForm.$invalid) || (generalForm.$invalid) || (capacityForm.$invalid) || (settingsForm.$invalid) || (remote_controlForm.$invalid) || (sipForm.$invalid) || (callforwardingForm.$invalid) || (settings_webrtcForm.$invalid) || (sip_webrtcForm.$invalid) || (general_permissionsForm.$invalid) || (permissionsForm.$invalid)"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="STAFF.ACCOUNT">ACCOUNT</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="agent-detail-form-container personal_info md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="STAFF.PERSONAL_INFO">
+                PERSONAL_INFO
+              </div>
+            </div>
+            <form name="personal_infoForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="STAFF.FULLNAME">Fullname</label>
+                <input
+                  type="text"
+                  name="fullname"
+                  ng-model="vm.agent.fullname"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="personal_infoForm['fullname'].$error"
+                  ng-show="personal_infoForm['fullname'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.FULLNAME_REQUIRED"
+                      >Fullname field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.USERNAME">Username</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.agent.name"
+                  ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+                  ng-required="true"
+                  disabled
+                />
+
+                <div class="hint">
+                  <span translate="STAFF.HELP.USERNAME"></span>
+                </div>
+                <div
+                  ng-messages="personal_infoForm['name'].$error"
+                  ng-show="personal_infoForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.USERNAME_REQUIRED"
+                      >Username field is required</span
+                    >
+                  </div>
+                  <div ng-message="pattern">
+                    <span
+                      translate="STAFF.ERRORS.USERNAME_MUST_VALID_PATTERN"
+                      translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+                      >Username must be valid pattern
+                    </span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.ALIAS">Alias</label>
+                <input
+                  type="text"
+                  name="alias"
+                  ng-model="vm.agent.alias"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="personal_infoForm['alias'].$error"
+                  ng-show="personal_infoForm['alias'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.ALIAS_REQUIRED"
+                      >Alias field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.SHOWWEBCONTROL">ShowWebControl</label>
+                <md-select
+                  name="showWebBar"
+                  ng-model="vm.agent.showWebBar"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="0">Phonebar</md-option>
+                  <md-option ng-value="1">External</md-option>
+                  <md-option ng-value="2">WebRTC</md-option>
+                </md-select>
+                <div
+                  ng-messages="personal_infoForm['showWebBar'].$error"
+                  ng-show="personal_infoForm['showWebBar'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.SHOWWEBCONTROL_REQUIRED"
+                      >ShowWebControl field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.EMAIL">Email</label>
+                <input
+                  type="email"
+                  name="email"
+                  ng-model="vm.agent.email"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="personal_infoForm['email'].$error"
+                  ng-show="personal_infoForm['email'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.EMAIL_REQUIRED"
+                      >Email field is required</span
+                    >
+                  </div>
+                  <div ng-message="email">
+                    <span translate="STAFF.ERRORS.EMAIL_MUST_VALID"
+                      >Email must be a valid e-mail address</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.PHONE">Phone</label>
+                <input
+                  type="text"
+                  name="phone"
+                  ng-model="vm.agent.phone"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="personal_infoForm['phone'].$error"
+                  ng-show="personal_infoForm['phone'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.PHONE_REQUIRED"
+                      >Phone field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.MOBILE">Mobile</label>
+                <input
+                  type="text"
+                  name="mobile"
+                  ng-model="vm.agent.mobile"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="personal_infoForm['mobile'].$error"
+                  ng-show="personal_infoForm['mobile'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.MOBILE_REQUIRED"
+                      >Mobile field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.agent.showWebBar == 1"
+                class="md-block"
+              >
+                <md-switch
+                  ng-model="vm.agent.hotdesk"
+                  aria-label="Hotdesk"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="STAFF.HOTDESK">Hotdesk</span></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.agent.loginInPause"
+                  aria-label="LoginInPause"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="STAFF.LOGININPAUSE"
+                    >LoginInPause</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.agent.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="personal_infoForm['description'].$error"
+                  ng-show="personal_infoForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="agent-detail-form-container security_suite md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="STAFF.SECURITY_SUITE">
+                SECURITY_SUITE
+              </div>
+            </div>
+            <form name="security_suiteForm" novalidate>
+              <md-input-container
+                ng-if="vm.agent.passwordResetAt != null"
+                class="md-block"
+              >
+                <label translate="STAFF.LAST_PASSWORD_RESET_AT"
+                  >Last_Password_Reset_At</label
+                >
+                <input
+                  type="text"
+                  name="passwordResetAt"
+                  ng-model="vm.agent.passwordResetAt"
+                  autofocus
+                  disabled
+                />
+
+                <div class="hint">
+                  <span translate="STAFF.HELP.LAST_PASSWORD_RESET_AT"></span>
+                </div>
+                <div
+                  ng-messages="security_suiteForm['passwordResetAt'].$error"
+                  ng-show="security_suiteForm['passwordResetAt'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="STAFF.ERRORS.LAST_PASSWORD_RESET_AT_REQUIRED"
+                      >Last_Password_Reset_At field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.agent.passwordResetAt == null"
+                class="md-block"
+              >
+                <label translate="STAFF.NO_PASSWORD_CHANGE"
+                  >No_Password_Change</label
+                >
+                <input
+                  type="text"
+                  name="passwordResetAt"
+                  ng-model="vm.agent.passwordResetAt"
+                  disabled
+                />
+
+                <div
+                  ng-messages="security_suiteForm['passwordResetAt'].$error"
+                  ng-show="security_suiteForm['passwordResetAt'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.NO_PASSWORD_CHANGE_REQUIRED"
+                      >No_Password_Change field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.agent.disabled"
+                  aria-label="Disabled"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="STAFF.DISABLED">Disabled</span></md-switch
+                >
+
+                <div class="hint">
+                  <span translate="STAFF.HELP.DISABLED"></span>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.agent.disabled == 0"
+                class="md-block"
+              >
+                <md-switch
+                  ng-model="vm.agent.blocked"
+                  aria-label="Blocked"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="STAFF.BLOCKED">Blocked</span></md-switch
+                >
+
+                <div class="hint">
+                  <span translate="STAFF.HELP.BLOCKED"></span>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="agent-detail-form-container change_avatar md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="STAFF.CHANGE_AVATAR">
+                CHANGE_AVATAR
+              </div>
+            </div>
+            <div
+              ng-controller="Agentchange_avatarController as vm_ca"
+              ng-init="vm_ca.init(vm.agent, vm.crudPermissions)"
+              class="agent-detail-form-container md-background-bg md-whiteframe-1dp"
+            >
+              <div
+                id="agent-image-uploader"
+                flow-init="vm_ca.ngFlowOptions"
+                flow-name="vm_ca.ngFlow.flow"
+                flow-files-submitted="vm_ca.upload()"
+                flow-file-added="vm_ca.fileAdded($file)"
+                flow-file-success="vm_ca.fileSuccess($file, $message)"
+                flow-complete="vm_ca.uploadComplete()"
+                flow-drop
+                flow-drag-enter="vm_ca.dropping=true"
+                flow-drag-leave="vm_ca.dropping=false"
+                ng-class="{'dropping':vm.dropping}"
+              >
+                <div
+                  class="drop-text hint-text"
+                  layout="row"
+                  layout-align="center center"
+                >
+                  <span translate="EC.DROP_TO_UPLOAD">Drop to upload</span>
+                </div>
+
+                <div
+                  class="upload-button"
+                  layout="column"
+                  layout-align="center center"
+                >
+                  <md-button
+                    class="md-accent md-raised"
+                    flow-btn
+                    ng-disabled="!vm_ca.crudPermissions.canEdit"
+                  >
+                    Upload
+                  </md-button>
+                  <span class="secondary-text mt-8"
+                    >You can also drop images here to upload. Only PNG, JPG -
+                    Max. 8MB</span
+                  >
+                </div>
+
+                <div layout="row" layout-align="start start" layout-wrap>
+                  <div
+                    ng-repeat="change_avatarimage in vm_ca.agent.images"
+                    ng-switch="change_avatarimage.type"
+                  >
+                    <div
+                      class="agent-image uploading"
+                      ng-switch-when="uploading"
+                      layout="row"
+                      layout-align="center center"
+                    >
+                      <div
+                        class="overlay"
+                        layout="column"
+                        layout-align="center center"
+                      >
+                        <md-progress-linear
+                          md-mode="determinate"
+                          value="{{change_avatarimage.file.progress() * 100}}"
+                        >
+                        </md-progress-linear>
+                      </div>
+                      <img class="media" flow-img="change_avatarimage.file" />
+                    </div>
+
+                    <div
+                      class="agent-image"
+                      ng-switch-when="image"
+                      layout="row"
+                      layout-align="center center"
+                    >
+                      <img class="media" ng-src="{{change_avatarimage.url}}" />
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="STAFF.VOICE">VOICE</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="agent-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="STAFF.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container
+                ng-if="!vm.agent.autointernal"
+                class="md-block"
+              >
+                <label translate="STAFF.INTERNAL">Internal</label>
+                <input
+                  type="text"
+                  name="internal"
+                  ng-model="vm.agent.internal"
+                  ng-required="true"
+                  autofocus
+                  disabled
+                />
+
+                <div
+                  ng-messages="generalForm['internal'].$error"
+                  ng-show="generalForm['internal'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.INTERNAL_REQUIRED"
+                      >Internal field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.agent.showWebBar != 2"
+                class="md-block"
+              >
+                <label translate="STAFF.TRANSPORT">Transport</label>
+                <md-select
+                  name="transport"
+                  ng-model="vm.agent.transport"
+                  multiple
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'udp'">udp</md-option>
+                  <md-option ng-value="'tcp'">tcp</md-option>
+                  <md-option ng-value="'ws'" ng-if="vm.agent.showWebBar == 1"
+                    >ws</md-option
+                  >
+                  <md-option ng-value="'wss'" ng-if="vm.agent.showWebBar == 1"
+                    >wss</md-option
+                  >
+                  <md-option ng-value="'tls'" ng-if="vm.agent.showWebBar == 1"
+                    >tls</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span translate="STAFF.HELP.TRANSPORT"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['transport'].$error"
+                  ng-show="generalForm['transport'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.TRANSPORT_REQUIRED"
+                      >Transport field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.HOST">Host</label>
+                <input
+                  type="text"
+                  name="host"
+                  ng-model="vm.agent.host"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="STAFF.HELP.HOST"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['host'].$error"
+                  ng-show="generalForm['host'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.HOST_REQUIRED"
+                      >Host field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.NAT">NAT</label>
+                <md-select
+                  name="nat"
+                  ng-model="vm.agent.nat"
+                  multiple
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'force_rport'">force_rport</md-option>
+                  <md-option ng-value="'comedia'">comedia</md-option>
+                  <md-option ng-value="'yes'">yes</md-option>
+                  <md-option ng-value="'no'">no</md-option>
+                  <md-option ng-value="'never'">never</md-option>
+                  <md-option ng-value="'route'">route</md-option>
+                </md-select>
+                <div class="hint"><span translate="STAFF.HELP.NAT"></span></div>
+                <div
+                  ng-messages="generalForm['nat'].$error"
+                  ng-show="generalForm['nat'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.NAT_REQUIRED"
+                      >NAT field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.TYPE">Type</label>
+                <md-select
+                  name="type"
+                  ng-model="vm.agent.type"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'friend'">Friend</md-option>
+                  <md-option ng-value="'user'">User</md-option>
+                  <md-option ng-value="'peer'">Peer</md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="STAFF.HELP.TYPE"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['type'].$error"
+                  ng-show="generalForm['type'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.TYPE_REQUIRED"
+                      >Type field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.ALLOWCODECS">AllowCodecs</label>
+                <md-select
+                  name="allow"
+                  ng-model="vm.agent.allow"
+                  multiple
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'ulaw'">ulaw</md-option>
+                  <md-option ng-value="'alaw'">alaw</md-option>
+                  <md-option ng-value="'gsm'">gsm</md-option>
+                  <md-option ng-value="'g722'">g722</md-option>
+                  <md-option ng-value="'g729'">g729</md-option>
+                  <md-option ng-value="'opus'">opus</md-option>
+                  <md-option ng-value="'h264'">h264</md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="STAFF.HELP.ALLOWCODECS"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['allow'].$error"
+                  ng-show="generalForm['allow'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.ALLOWCODECS_REQUIRED"
+                      >AllowCodecs field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.CALLERID">CallerId</label>
+                <input
+                  type="text"
+                  name="callerid"
+                  ng-model="vm.agent.callerid"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['callerid'].$error"
+                  ng-show="generalForm['callerid'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.CALLERID_REQUIRED"
+                      >CallerId field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.CONTEXT">Context</label>
+                <md-select
+                  name="context"
+                  ng-model="vm.agent.context"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="context.name"
+                    ng-repeat="context in vm.contexts"
+                    ng-disabled="context.canSelect === false"
+                    >{{ context.name }}</md-option
+                  >
+                </md-select>
+                <div
+                  ng-messages="generalForm['context'].$error"
+                  ng-show="generalForm['context'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.CONTEXT_REQUIRED"
+                      >Context field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.CALLGROUP">Callgroup</label>
+                <input
+                  type="text"
+                  name="callgroup"
+                  ng-model="vm.agent.callgroup"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="STAFF.HELP.CALLGROUP"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['callgroup'].$error"
+                  ng-show="generalForm['callgroup'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.CALLGROUP_REQUIRED"
+                      >Callgroup field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.PICKUPGROUP">Pickupgroup</label>
+                <input
+                  type="text"
+                  name="pickupgroup"
+                  ng-model="vm.agent.pickupgroup"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="STAFF.HELP.PICKUPGROUP"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['pickupgroup'].$error"
+                  ng-show="generalForm['pickupgroup'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.PICKUPGROUP_REQUIRED"
+                      >Pickupgroup field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.agent.chanspy"
+                  aria-label="chanSpy"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="STAFF.CHANSPY">chanSpy</span></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.VIDEOSUPPORT">Videosupport</label>
+                <md-select
+                  name="videosupport"
+                  ng-model="vm.agent.videosupport"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">Yes</md-option>
+                  <md-option ng-value="'no'">No</md-option>
+                  <md-option ng-value="'always'">Always</md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['videosupport'].$error"
+                  ng-show="generalForm['videosupport'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.VIDEOSUPPORT_REQUIRED"
+                      >Videosupport field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.MONITOREXTENSION"
+                  >MonitorExtension</label
+                >
+                <md-select
+                  name="extensionMonitor"
+                  ng-model="vm.agent.extensionMonitor"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="''">Inactive</md-option>
+                  <md-option ng-value="'wav'">wav</md-option>
+                  <md-option ng-value="'WAV'">wav49</md-option>
+                  <md-option ng-value="'gsm'">gsm</md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['extensionMonitor'].$error"
+                  ng-show="generalForm['extensionMonitor'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.MONITOREXTENSION_REQUIRED"
+                      >MonitorExtension field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="STAFF.OTHER_CHANNELS">OTHER_CHANNELS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="agent-detail-form-container capacity md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="STAFF.CAPACITY">
+                CAPACITY
+              </div>
+            </div>
+            <form name="capacityForm" novalidate>
+              <md-input-container ng-if="vm.license.chat" class="md-block">
+                <label translate="STAFF.CHATCAPACITY">ChatCapacity</label>
+                <input
+                  type="number"
+                  name="chatCapacity"
+                  ng-model="vm.agent.chatCapacity"
+                  min="0"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="STAFF.HELP.CHATCAPACITY"></span>
+                </div>
+                <div
+                  ng-messages="capacityForm['chatCapacity'].$error"
+                  ng-show="capacityForm['chatCapacity'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.CHATCAPACITY_REQUIRED"
+                      >ChatCapacity field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="STAFF.ERRORS.CHATCAPACITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >ChatCapacity must be a valid greater or equal than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container ng-if="vm.license.mail" class="md-block">
+                <label translate="STAFF.MAILCAPACITY">MailCapacity</label>
+                <input
+                  type="number"
+                  name="mailCapacity"
+                  ng-model="vm.agent.mailCapacity"
+                  min="0"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="STAFF.HELP.MAILCAPACITY"></span>
+                </div>
+                <div
+                  ng-messages="capacityForm['mailCapacity'].$error"
+                  ng-show="capacityForm['mailCapacity'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.MAILCAPACITY_REQUIRED"
+                      >MailCapacity field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="STAFF.ERRORS.MAILCAPACITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >MailCapacity must be a valid greater or equal than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container ng-if="vm.license.messaging" class="md-block">
+                <label translate="STAFF.SMSCAPACITY">SMSCapacity</label>
+                <input
+                  type="number"
+                  name="smsCapacity"
+                  ng-model="vm.agent.smsCapacity"
+                  min="0"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="STAFF.HELP.SMSCAPACITY"></span>
+                </div>
+                <div
+                  ng-messages="capacityForm['smsCapacity'].$error"
+                  ng-show="capacityForm['smsCapacity'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.SMSCAPACITY_REQUIRED"
+                      >SMSCapacity field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="STAFF.ERRORS.SMSCAPACITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >SMSCapacity must be a valid greater or equal than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.license.openchannel"
+                class="md-block"
+              >
+                <label translate="STAFF.OPENCHANNELCAPACITY"
+                  >OpenchannelCapacity</label
+                >
+                <input
+                  type="number"
+                  name="openchannelCapacity"
+                  ng-model="vm.agent.openchannelCapacity"
+                  min="0"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="STAFF.HELP.OPENCHANNELCAPACITY"></span>
+                </div>
+                <div
+                  ng-messages="capacityForm['openchannelCapacity'].$error"
+                  ng-show="capacityForm['openchannelCapacity'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.OPENCHANNELCAPACITY_REQUIRED"
+                      >OpenchannelCapacity field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="STAFF.ERRORS.OPENCHANNELCAPACITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >OpenchannelCapacity must be a valid greater or equal
+                      than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container ng-if="vm.license.fax" class="md-block">
+                <label translate="STAFF.FAXCAPACITY">FaxCapacity</label>
+                <input
+                  type="number"
+                  name="faxCapacity"
+                  ng-model="vm.agent.faxCapacity"
+                  min="0"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="STAFF.HELP.FAXCAPACITY"></span>
+                </div>
+                <div
+                  ng-messages="capacityForm['faxCapacity'].$error"
+                  ng-show="capacityForm['faxCapacity'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.FAXCAPACITY_REQUIRED"
+                      >FaxCapacity field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="STAFF.ERRORS.FAXCAPACITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >FaxCapacity must be a valid greater or equal than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container ng-if="vm.license.whatsapp" class="md-block">
+                <label translate="STAFF.WHATSAPPCAPACITY"
+                  >WhatsappCapacity</label
+                >
+                <input
+                  type="number"
+                  name="whatsappCapacity"
+                  ng-model="vm.agent.whatsappCapacity"
+                  min="0"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="STAFF.HELP.WHATSAPPCAPACITY"></span>
+                </div>
+                <div
+                  ng-messages="capacityForm['whatsappCapacity'].$error"
+                  ng-show="capacityForm['whatsappCapacity'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.WHATSAPPCAPACITY_REQUIRED"
+                      >WhatsappCapacity field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="STAFF.ERRORS.WHATSAPPCAPACITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >WhatsappCapacity must be a valid greater or equal
+                      than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab ng-if="vm.agent.showWebBar == 0">
+        <md-tab-label>
+          <span translate="STAFF.MOTIONBAR">MOTIONBAR</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="agent-detail-form-container settings md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="STAFF.SETTINGS">
+                SETTINGS
+              </div>
+            </div>
+            <form name="settingsForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.agent.phoneBarEnableSettings"
+                  aria-label="EnableSettings"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="STAFF.ENABLESETTINGS"
+                    >EnableSettings</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.agent.phoneBarAutoAnswer"
+                  aria-label="AutoAnswer"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="STAFF.AUTOANSWER"
+                    >AutoAnswer</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.agent.phoneBarAutoAnswer"
+                class="md-block"
+              >
+                <label translate="STAFF.AUTOANSWERDELAY">AutoAnswerDelay</label>
+                <input
+                  type="number"
+                  name="phoneBarAutoAnswerDelay"
+                  ng-model="vm.agent.phoneBarAutoAnswerDelay"
+                  min="0"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="settingsForm['phoneBarAutoAnswerDelay'].$error"
+                  ng-show="settingsForm['phoneBarAutoAnswerDelay'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.AUTOANSWERDELAY_REQUIRED"
+                      >AutoAnswerDelay field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="STAFF.ERRORS.AUTOANSWERDELAY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AutoAnswerDelay must be a valid greater or equal
+                      than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.agent.phoneBarRingInUse"
+                  aria-label="RingInUse"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="STAFF.RINGINUSE">RingInUse</span></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.agent.phoneBarEnableRecording"
+                  aria-label="EnableRecording"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="STAFF.ENABLERECORDING"
+                    >EnableRecording</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.agent.phoneBarEnableDtmfTone"
+                  aria-label="EnableDtmfTone"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="STAFF.ENABLEDTMFTONE"
+                    >EnableDtmfTone</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.agent.phoneBarDnd"
+                  aria-label="Dnd"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="STAFF.DND">Dnd</span></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.agent.phoneBarUnansweredCallBadge"
+                  aria-label="UnansweredCallBadge"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="STAFF.UNANSWEREDCALLBADGE"
+                    >UnansweredCallBadge</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.agent.showWebBar == 0"
+                class="md-block"
+              >
+                <md-switch
+                  ng-model="vm.agent.phoneBarEnableJaws"
+                  aria-label="EnableJawsIntegration"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="STAFF.ENABLEJAWSINTEGRATION"
+                    >EnableJawsIntegration</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.agent.showWebBar == 0 && vm.license.screenrecording"
+                class="md-block"
+              >
+                <md-switch
+                  ng-change="vm.onEnableScreenRecordingByAgentSelection()"
+                  ng-model="vm.agent.phoneBarEnableScreenRecordingByAgent"
+                  aria-label="EnableScreenRecordingByAgent"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="STAFF.ENABLESCREENRECORDINGBYAGENT"
+                    >EnableScreenRecordingByAgent</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.agent.showWebBar == 0 && vm.license.screenrecording"
+                class="md-block"
+              >
+                <md-switch
+                  ng-change="vm.onEnableAutomaticScreenRecordingSelection()"
+                  ng-model="vm.agent.phoneBarEnableAutomaticScreenRecording"
+                  aria-label="EnableAutomaticScreenRecording"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="STAFF.ENABLEAUTOMATICSCREENRECORDING"
+                    >EnableAutomaticScreenRecording</span
+                  ></md-switch
+                >
+
+                <div class="hint">
+                  <span
+                    translate="STAFF.HELP.ENABLEAUTOMATICSCREENRECORDING"
+                  ></span>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="agent-detail-form-container remote_control md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="STAFF.REMOTE_CONTROL">
+                REMOTE_CONTROL
+              </div>
+            </div>
+            <form name="remote_controlForm" novalidate>
+              <md-input-container
+                ng-if="vm.agent.showWebBar == 0"
+                class="md-block"
+              >
+                <md-switch
+                  ng-model="vm.agent.phoneBarRemoteControl"
+                  aria-label="RemoteControl"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="STAFF.REMOTECONTROL"
+                    >RemoteControl</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.agent.phoneBarRemoteControl && vm.agent.showWebBar == 0"
+                class="md-block"
+              >
+                <label translate="STAFF.REMOTECONTROLPORT"
+                  >RemoteControlPort</label
+                >
+                <input
+                  type="number"
+                  name="phoneBarRemoteControlPort"
+                  ng-model="vm.agent.phoneBarRemoteControlPort"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="remote_controlForm['phoneBarRemoteControlPort'].$error"
+                  ng-show="remote_controlForm['phoneBarRemoteControlPort'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.REMOTECONTROLPORT_REQUIRED"
+                      >RemoteControlPort field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="agent-detail-form-container sip md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="STAFF.SIP">SIP</div>
+            </div>
+            <form name="sipForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="STAFF.SIPEXPIRES">SipExpires</label>
+                <input
+                  type="number"
+                  name="phoneBarExpires"
+                  ng-model="vm.agent.phoneBarExpires"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="STAFF.HELP.SIPEXPIRES"></span>
+                </div>
+                <div
+                  ng-messages="sipForm['phoneBarExpires'].$error"
+                  ng-show="sipForm['phoneBarExpires'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.SIPEXPIRES_REQUIRED"
+                      >SipExpires field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.SIPPORT">SipPort</label>
+                <input
+                  type="number"
+                  name="phoneBarListenPort"
+                  ng-model="vm.agent.phoneBarListenPort"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="STAFF.HELP.SIPPORT"></span>
+                </div>
+                <div
+                  ng-messages="sipForm['phoneBarListenPort'].$error"
+                  ng-show="sipForm['phoneBarListenPort'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.SIPPORT_REQUIRED"
+                      >SipPort field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="agent-detail-form-container callforwarding md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="STAFF.CALLFORWARDING">
+                CALLFORWARDING
+              </div>
+            </div>
+            <form name="callforwardingForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.agent.phoneBarUnconditional"
+                  aria-label="Unconditional"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="STAFF.UNCONDITIONAL"
+                    >Unconditional</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.agent.phoneBarUnconditional"
+                class="md-block"
+              >
+                <label translate="STAFF.UNCONDITIONALNUMBER"
+                  >UnconditionalNumber</label
+                >
+                <input
+                  type="text"
+                  name="phoneBarUnconditionalNumber"
+                  ng-model="vm.agent.phoneBarUnconditionalNumber"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="callforwardingForm['phoneBarUnconditionalNumber'].$error"
+                  ng-show="callforwardingForm['phoneBarUnconditionalNumber'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.UNCONDITIONALNUMBER_REQUIRED"
+                      >UnconditionalNumber field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab ng-if="vm.agent.showWebBar == 2">
+        <md-tab-label>
+          <span translate="STAFF.WEBRTC">WEBRTC</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="agent-detail-form-container settings_webrtc md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="STAFF.SETTINGS_WEBRTC">
+                SETTINGS_WEBRTC
+              </div>
+            </div>
+            <form name="settings_webrtcForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="STAFF.DTLSCERTFILE">dtlscertfile</label>
+                <input
+                  type="text"
+                  name="dtlscertfile"
+                  ng-model="vm.agent.dtlscertfile"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="STAFF.HELP.DTLSCERTFILE"></span>
+                </div>
+                <div
+                  ng-messages="settings_webrtcForm['dtlscertfile'].$error"
+                  ng-show="settings_webrtcForm['dtlscertfile'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.DTLSCERTFILE_REQUIRED"
+                      >dtlscertfile field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.DTLSPRIVATEKEY">dtlsprivatekey</label>
+                <input
+                  type="text"
+                  name="dtlsprivatekey"
+                  ng-model="vm.agent.dtlsprivatekey"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="STAFF.HELP.DTLSPRIVATEKEY"></span>
+                </div>
+                <div
+                  ng-messages="settings_webrtcForm['dtlsprivatekey'].$error"
+                  ng-show="settings_webrtcForm['dtlsprivatekey'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.DTLSPRIVATEKEY_REQUIRED"
+                      >dtlsprivatekey field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.agent.phoneBarEnableSettings"
+                  aria-label="EnableSettings"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="STAFF.ENABLESETTINGS"
+                    >EnableSettings</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.agent.phoneBarAutoAnswer"
+                  aria-label="AutoAnswer"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="STAFF.AUTOANSWER"
+                    >AutoAnswer</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.agent.phoneBarAutoAnswer"
+                class="md-block"
+              >
+                <label translate="STAFF.AUTOANSWERDELAY">AutoAnswerDelay</label>
+                <input
+                  type="number"
+                  name="phoneBarAutoAnswerDelay"
+                  ng-model="vm.agent.phoneBarAutoAnswerDelay"
+                  min="0"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="settings_webrtcForm['phoneBarAutoAnswerDelay'].$error"
+                  ng-show="settings_webrtcForm['phoneBarAutoAnswerDelay'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.AUTOANSWERDELAY_REQUIRED"
+                      >AutoAnswerDelay field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="STAFF.ERRORS.AUTOANSWERDELAY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AutoAnswerDelay must be a valid greater or equal
+                      than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.agent.phoneBarEnableRecording"
+                  aria-label="EnableRecording"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="STAFF.ENABLERECORDING"
+                    >EnableRecording</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.agent.phoneBarEnableDtmfTone"
+                  aria-label="EnableDtmfTone"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="STAFF.ENABLEDTMFTONE"
+                    >EnableDtmfTone</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.agent.phoneBarDnd"
+                  aria-label="Dnd"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="STAFF.DND">Dnd</span></md-switch
+                >
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="agent-detail-form-container sip_webrtc md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="STAFF.SIP_WEBRTC">
+                SIP_WEBRTC
+              </div>
+            </div>
+            <form name="sip_webrtcForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="STAFF.SIPEXPIRES">SipExpires</label>
+                <input
+                  type="number"
+                  name="phoneBarExpires"
+                  ng-model="vm.agent.phoneBarExpires"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="STAFF.HELP.SIPEXPIRES"></span>
+                </div>
+                <div
+                  ng-messages="sip_webrtcForm['phoneBarExpires'].$error"
+                  ng-show="sip_webrtcForm['phoneBarExpires'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.SIPEXPIRES_REQUIRED"
+                      >SipExpires field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="STAFF.PERMISSIONS">PERMISSIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="agent-detail-form-container general_permissions md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div
+                class="h2 secondary-text"
+                translate="STAFF.GENERAL_PERMISSIONS"
+              >
+                GENERAL_PERMISSIONS
+              </div>
+            </div>
+            <form name="general_permissionsForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.agent.allowmessenger"
+                  aria-label="EnableMessenger"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="STAFF.ENABLEMESSENGER"
+                    >EnableMessenger</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.agent.phoneBarPrefixRequired"
+                  aria-label="PrefixRequired"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="STAFF.PREFIXREQUIRED"
+                    >PrefixRequired</span
+                  ></md-switch
+                >
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="agent-detail-form-container permissions md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="STAFF.PERMISSIONS">
+                PERMISSIONS
+              </div>
+            </div>
+            <div
+              ng-controller="AgentPermissionsController as vm_pc"
+              ng-init="vm_pc.init(vm.agent, vm.crudPermissions)"
+              class="agent-detail-form-container"
+            >
+              <md-list
+                ng-repeat="father in vm_pc.navigation[0].children"
+                ng-include="'permission-nested.html'"
+                ng-if="vm_pc.agent.role !== 'admin' && !father.hidden()"
+              ></md-list>
+
+              <!-- Nested navigation template -->
+              <script type="text/ng-template" id="permission-nested.html">
+                <md-list-item>
+                  <md-icon md-font-icon="{{father.icon}}"></md-icon>
+                  <p translate="{{father.translate}}">{{ father.title }}</p>
+                  <md-switch class="md-secondary" ng-model="father.enabled" ng-change="vm_pc.onChange(father)" ng-init="father.enabled = vm_pc.agent.permissions.includes(father.id)"
+                            ng-disabled="!vm_pc.crudPermissions.canEdit"></md-switch>
+                </md-list-item>
+
+                <md-divider></md-divider>
+
+                <md-list>
+                  <md-list-item ng-repeat="child in father.children" ng-if="child.id !== 201">
+                    <md-icon ng-if="child.icon" md-font-icon="{{child.icon}}"></md-icon>
+                    <p translate="{{child.translate}}">{{ child.title }}</p>
+                    <md-switch ng-model="child.enabled" ng-change="vm_pc.onChange(father, child)" ng-init="child.enabled = vm_pc.agent.permissions.includes(child.id)"
+                              ng-disabled="!vm_pc.crudPermissions.canEdit"></md-switch>
+                    </md-list-item>
+                </md-list>
+              </script>
+              <!-- / Nested navigation template -->
+
+              <span
+                ng-if="vm_pc.agent.role === 'admin'"
+                class="md-headline"
+                translate="STAFF.ALL_MODULES_AVAILABLE"
+                >All modules are already available.</span
+              >
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/staff/views/teams/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/staff/views/teams/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index cce0b4b..0000000
--- a/public/src/js/modules/main/apps/staff/views/teams/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,148 +0,0 @@
-<md-dialog class="team-dialog" aria-label="New Team">
-  <form name="teamForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="STAFF.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.team.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="teamForm['name'].$error"
-          ng-show="teamForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="STAFF.DESCRIPTION">Description</label>
-        <input type="text" name="description" ng-model="vm.team.description" />
-
-        <div
-          ng-messages="teamForm['description'].$error"
-          ng-show="teamForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newTeam"
-          ng-click="vm.saveTeam()"
-          class="send-button md-accent md-raised"
-          ng-disabled="teamForm.$invalid || teamForm.$pristine"
-          aria-label="SAVE"
-          translate="STAFF.SAVE"
-          translate-attr-aria-label="STAFF.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newTeam"
-          ng-click="vm.addNewTeam()"
-          class="send-button md-accent md-raised"
-          ng-disabled="teamForm.$invalid"
-          aria-label="ADD"
-          translate="STAFF.ADD_TEAM"
-          translate-attr-aria-label="STAFF.ADD_TEAM"
-        >
-          ADD TEAM
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newTeam"
-          ng-click="vm.deleteTeam($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="STAFF.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="STAFF.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/staff/views/teams/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/staff/views/teams/create/dialog.html/dialog.html
new file mode 100644
index 0000000..cce0b4b
--- /dev/null
+++ b/public/src/js/modules/main/apps/staff/views/teams/create/dialog.html/dialog.html
@@ -0,0 +1,148 @@
+<md-dialog class="team-dialog" aria-label="New Team">
+  <form name="teamForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="STAFF.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.team.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="teamForm['name'].$error"
+          ng-show="teamForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="STAFF.DESCRIPTION">Description</label>
+        <input type="text" name="description" ng-model="vm.team.description" />
+
+        <div
+          ng-messages="teamForm['description'].$error"
+          ng-show="teamForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newTeam"
+          ng-click="vm.saveTeam()"
+          class="send-button md-accent md-raised"
+          ng-disabled="teamForm.$invalid || teamForm.$pristine"
+          aria-label="SAVE"
+          translate="STAFF.SAVE"
+          translate-attr-aria-label="STAFF.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newTeam"
+          ng-click="vm.addNewTeam()"
+          class="send-button md-accent md-raised"
+          ng-disabled="teamForm.$invalid"
+          aria-label="ADD"
+          translate="STAFF.ADD_TEAM"
+          translate-attr-aria-label="STAFF.ADD_TEAM"
+        >
+          ADD TEAM
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newTeam"
+          ng-click="vm.deleteTeam($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="STAFF.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="STAFF.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/staff/views/teams/edit/agentadd/agentadd.html/agentadd-[chunkhash].html b/public/src/js/modules/main/apps/staff/views/teams/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
deleted file mode 100644
index f87f3d2..0000000
--- a/public/src/js/modules/main/apps/staff/views/teams/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
+++ /dev/null
@@ -1,40 +0,0 @@
-<md-dialog class="team-dialog" aria-label="team" ng-init="vm.onInit()">
-  <form name="teamForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="STAFF.AGENTADD_TEAM">Add Agent to team</h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <ms-dual-multiselect
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveAgents()"
-        class="send-button md-accent md-raised"
-        ng-disabled="!vm.pendingChanges"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/staff/views/teams/edit/agentadd/agentadd.html/agentadd.html b/public/src/js/modules/main/apps/staff/views/teams/edit/agentadd/agentadd.html/agentadd.html
new file mode 100644
index 0000000..f87f3d2
--- /dev/null
+++ b/public/src/js/modules/main/apps/staff/views/teams/edit/agentadd/agentadd.html/agentadd.html
@@ -0,0 +1,40 @@
+<md-dialog class="team-dialog" aria-label="team" ng-init="vm.onInit()">
+  <form name="teamForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="STAFF.AGENTADD_TEAM">Add Agent to team</h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <ms-dual-multiselect
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveAgents()"
+        class="send-button md-accent md-raised"
+        ng-disabled="!vm.pendingChanges"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/staff/views/teams/teams.html/teams-[chunkhash].html b/public/src/js/modules/main/apps/staff/views/teams/teams.html/teams-[chunkhash].html
deleted file mode 100644
index 68f3c7d..0000000
--- a/public/src/js/modules/main/apps/staff/views/teams/teams.html/teams-[chunkhash].html
+++ /dev/null
@@ -1,302 +0,0 @@
-<div
-  id="teams"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-account-multiple" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="STAFF.TEAMS">Teams</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="STAFF.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedTeams.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedTeams =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="STAFF.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-teams-count">
-          <span>{{vm.selectedTeams.length}}</span>
-          <span translate="STAFF.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="STAFF.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllTeams()"
-                translate="STAFF.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectTeams()"
-                translate="STAFF.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedTeams"
-          csv-label="true"
-          filename="teams.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedTeams($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="STAFF.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- TEAM TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedTeams"
-            md-progress="vm.promise"
-          >
-            <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getTeams">
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'STAFF.ID' | translate }}</th>
-                <th md-column md-order-by="name">
-                  {{ 'STAFF.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'STAFF.DESCRIPTION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.teams.rows.length">
-                <td md-cell colspan="4">
-                  <div layout="row" layout-align="center center">
-                    <span translate="STAFF.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="team"
-                md-select-id="id"
-                ng-repeat="team in vm.teams.rows"
-              >
-                <td md-cell ng-if="team.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{team.name}}"
-                    ng-src="api/users/{{team.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!team.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{team.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.createOrEditTeam($event, team)"
-                  md-cell
-                  class="id"
-                >
-                  {{team.id}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditTeam($event, team)"
-                  md-cell
-                  class="name"
-                >
-                  {{team.name}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditTeam($event, team)"
-                  md-cell
-                  class="description"
-                >
-                  {{team.description}}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="STAFF.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editdialog(team, $event    )"
-                          translate="STAFF.EDIT_TEAM"
-                        >
-                          Edit Team
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.agentadddialog(team, $event    )"
-                          translate="STAFF.AGENTADD_TEAM"
-                        >
-                          AgentAdd Team
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(team, $event    )"
-                          translate="STAFF.DELETE_TEAM"
-                        >
-                          Delete Team
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'STAFF.PAGE' | translate}}:', rowsPerPage: '{{'STAFF.ROWSPERPAGE' | translate}}:', of: '{{'STAFF.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.teams.count}}"
-          md-on-paginate="vm.getTeams"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / TEAM TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD TEAM BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-team-button"
-    ng-click="vm.createOrEditTeam($event)"
-    aria-label="add team"
-    translate
-    translate-attr-aria-label="STAFF.ADD_TEAM"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD TEAM BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/staff/views/teams/teams.html/teams.html b/public/src/js/modules/main/apps/staff/views/teams/teams.html/teams.html
new file mode 100644
index 0000000..68f3c7d
--- /dev/null
+++ b/public/src/js/modules/main/apps/staff/views/teams/teams.html/teams.html
@@ -0,0 +1,302 @@
+<div
+  id="teams"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-account-multiple" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="STAFF.TEAMS">Teams</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="STAFF.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedTeams.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedTeams =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="STAFF.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-teams-count">
+          <span>{{vm.selectedTeams.length}}</span>
+          <span translate="STAFF.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="STAFF.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllTeams()"
+                translate="STAFF.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectTeams()"
+                translate="STAFF.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedTeams"
+          csv-label="true"
+          filename="teams.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedTeams($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="STAFF.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- TEAM TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedTeams"
+            md-progress="vm.promise"
+          >
+            <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getTeams">
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'STAFF.ID' | translate }}</th>
+                <th md-column md-order-by="name">
+                  {{ 'STAFF.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'STAFF.DESCRIPTION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.teams.rows.length">
+                <td md-cell colspan="4">
+                  <div layout="row" layout-align="center center">
+                    <span translate="STAFF.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="team"
+                md-select-id="id"
+                ng-repeat="team in vm.teams.rows"
+              >
+                <td md-cell ng-if="team.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{team.name}}"
+                    ng-src="api/users/{{team.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!team.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{team.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.createOrEditTeam($event, team)"
+                  md-cell
+                  class="id"
+                >
+                  {{team.id}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditTeam($event, team)"
+                  md-cell
+                  class="name"
+                >
+                  {{team.name}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditTeam($event, team)"
+                  md-cell
+                  class="description"
+                >
+                  {{team.description}}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="STAFF.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editdialog(team, $event    )"
+                          translate="STAFF.EDIT_TEAM"
+                        >
+                          Edit Team
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.agentadddialog(team, $event    )"
+                          translate="STAFF.AGENTADD_TEAM"
+                        >
+                          AgentAdd Team
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(team, $event    )"
+                          translate="STAFF.DELETE_TEAM"
+                        >
+                          Delete Team
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'STAFF.PAGE' | translate}}:', rowsPerPage: '{{'STAFF.ROWSPERPAGE' | translate}}:', of: '{{'STAFF.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.teams.count}}"
+          md-on-paginate="vm.getTeams"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / TEAM TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD TEAM BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-team-button"
+    ng-click="vm.createOrEditTeam($event)"
+    aria-label="add team"
+    translate
+    translate-attr-aria-label="STAFF.ADD_TEAM"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD TEAM BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/staff/views/telephones/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/staff/views/telephones/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 90ebd45..0000000
--- a/public/src/js/modules/main/apps/staff/views/telephones/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,301 +0,0 @@
-<md-dialog class="telephone-dialog" aria-label="New Telephone">
-  <form name="telephoneForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="STAFF.ACCOUNTNAME">Accountname</label>
-        <input
-          type="text"
-          name="fullname"
-          ng-model="vm.telephone.fullname"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="telephoneForm['fullname'].$error"
-          ng-show="telephoneForm['fullname'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.ACCOUNTNAME_REQUIRED"
-              >Accountname field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="STAFF.USERNAME">Username</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.telephone.name"
-          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-          ng-required="true"
-          ng-disabled="!vm.newTelephone"
-        />
-
-        <div class="hint"><span translate="STAFF.HELP.USERNAME"></span></div>
-        <div
-          ng-messages="telephoneForm['name'].$error"
-          ng-show="telephoneForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.USERNAME_REQUIRED"
-              >Username field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span
-              translate="STAFF.ERRORS.USERNAME_MUST_VALID_PATTERN"
-              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-              >Username must be valid pattern
-            </span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="STAFF.EMAIL">Email</label>
-        <input
-          type="email"
-          name="email"
-          ng-model="vm.telephone.email"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="telephoneForm['email'].$error"
-          ng-show="telephoneForm['email'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.EMAIL_REQUIRED"
-              >Email field is required</span
-            >
-          </div>
-          <div ng-message="email">
-            <span translate="STAFF.ERRORS.EMAIL_MUST_VALID"
-              >Email must be a valid e-mail address</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block" ng-if="vm.newTelephone">
-        <label translate="STAFF.PASSWORD">Password</label>
-        <input
-          type="password"
-          name="password"
-          ng-model="vm.telephone.password"
-          placeholder="Password"
-          ng-pattern="vm.passwordPattern"
-          translate
-          translate-attr-placeholder="STAFF.PASSWORD"
-          required
-        />
-        <div ng-messages="telephoneForm['password'].$error" role="alert">
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.PASSWORD_REQUIRED"
-              >Password field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span translate="STAFF.ERRORS.SECURE_PASSWORD_PATTERN"
-              >Must contain at least 8 characters, with a minimum of 1 lowercase
-              letter, 1 uppercase letter, 1 numeric character and 1 special
-              character ~!?*@#$%^&-_=+[{]}.</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <md-input-container
-        class="md-block"
-        ng-if="vm.newTelephone  && (vm.newTelephone)"
-      >
-        <label translate="STAFF.CONFIRM_PASSWORD">Confirm Password</label>
-        <input
-          type="password"
-          match-password="password"
-          name="confirmPassword"
-          ng-model="confirmPassword"
-          required
-        />
-        <div
-          ng-messages="telephoneForm.confirmPassword.$error"
-          role="alert"
-          multiple
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.CONFIRM_REQUIRED"
-              >Confirm field is required</span
-            >
-          </div>
-          <div ng-message="passwordMatch">
-            <span translate="STAFF.ERRORS.CONFIRM_NOT_MATCH"
-              >Your password did not match</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <md-input-container class="md-block">
-        <label translate="STAFF.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.telephone.description"
-        />
-
-        <div
-          ng-messages="telephoneForm['description'].$error"
-          ng-show="telephoneForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container ng-if="vm.newTelephone" class="md-block">
-        <md-switch
-          ng-model="vm.telephone.autointernal"
-          aria-label="AutoInternal"
-          ><span translate="STAFF.AUTOINTERNAL">AutoInternal</span></md-switch
-        >
-      </md-input-container>
-      <md-input-container ng-if="!vm.telephone.autointernal" class="md-block">
-        <label translate="STAFF.INTERNAL">Internal</label>
-        <input
-          type="text"
-          name="internal"
-          ng-model="vm.telephone.internal"
-          ng-required="true"
-          ng-disabled="!vm.newTelephone"
-        />
-
-        <div
-          ng-messages="telephoneForm['internal'].$error"
-          ng-show="telephoneForm['internal'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.INTERNAL_REQUIRED"
-              >Internal field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container ng-if="vm.newTelephone" class="md-block">
-        <md-switch ng-model="vm.telephone.voicemail" aria-label="Voicemail"
-          ><span translate="STAFF.VOICEMAIL">Voicemail</span></md-switch
-        >
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newTelephone"
-          ng-click="vm.saveTelephone()"
-          class="send-button md-accent md-raised"
-          ng-disabled="telephoneForm.$invalid || telephoneForm.$pristine"
-          aria-label="SAVE"
-          translate="STAFF.SAVE"
-          translate-attr-aria-label="STAFF.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newTelephone"
-          ng-click="vm.addNewTelephone()"
-          class="send-button md-accent md-raised"
-          ng-disabled="telephoneForm.$invalid"
-          aria-label="ADD"
-          translate="STAFF.ADD_TELEPHONE"
-          translate-attr-aria-label="STAFF.ADD_TELEPHONE"
-        >
-          ADD TELEPHONE
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newTelephone"
-          ng-click="vm.deleteTelephone($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="STAFF.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="STAFF.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/staff/views/telephones/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/staff/views/telephones/create/dialog.html/dialog.html
new file mode 100644
index 0000000..90ebd45
--- /dev/null
+++ b/public/src/js/modules/main/apps/staff/views/telephones/create/dialog.html/dialog.html
@@ -0,0 +1,301 @@
+<md-dialog class="telephone-dialog" aria-label="New Telephone">
+  <form name="telephoneForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="STAFF.ACCOUNTNAME">Accountname</label>
+        <input
+          type="text"
+          name="fullname"
+          ng-model="vm.telephone.fullname"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="telephoneForm['fullname'].$error"
+          ng-show="telephoneForm['fullname'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.ACCOUNTNAME_REQUIRED"
+              >Accountname field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="STAFF.USERNAME">Username</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.telephone.name"
+          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+          ng-required="true"
+          ng-disabled="!vm.newTelephone"
+        />
+
+        <div class="hint"><span translate="STAFF.HELP.USERNAME"></span></div>
+        <div
+          ng-messages="telephoneForm['name'].$error"
+          ng-show="telephoneForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.USERNAME_REQUIRED"
+              >Username field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span
+              translate="STAFF.ERRORS.USERNAME_MUST_VALID_PATTERN"
+              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+              >Username must be valid pattern
+            </span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="STAFF.EMAIL">Email</label>
+        <input
+          type="email"
+          name="email"
+          ng-model="vm.telephone.email"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="telephoneForm['email'].$error"
+          ng-show="telephoneForm['email'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.EMAIL_REQUIRED"
+              >Email field is required</span
+            >
+          </div>
+          <div ng-message="email">
+            <span translate="STAFF.ERRORS.EMAIL_MUST_VALID"
+              >Email must be a valid e-mail address</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block" ng-if="vm.newTelephone">
+        <label translate="STAFF.PASSWORD">Password</label>
+        <input
+          type="password"
+          name="password"
+          ng-model="vm.telephone.password"
+          placeholder="Password"
+          ng-pattern="vm.passwordPattern"
+          translate
+          translate-attr-placeholder="STAFF.PASSWORD"
+          required
+        />
+        <div ng-messages="telephoneForm['password'].$error" role="alert">
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.PASSWORD_REQUIRED"
+              >Password field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span translate="STAFF.ERRORS.SECURE_PASSWORD_PATTERN"
+              >Must contain at least 8 characters, with a minimum of 1 lowercase
+              letter, 1 uppercase letter, 1 numeric character and 1 special
+              character ~!?*@#$%^&-_=+[{]}.</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <md-input-container
+        class="md-block"
+        ng-if="vm.newTelephone  && (vm.newTelephone)"
+      >
+        <label translate="STAFF.CONFIRM_PASSWORD">Confirm Password</label>
+        <input
+          type="password"
+          match-password="password"
+          name="confirmPassword"
+          ng-model="confirmPassword"
+          required
+        />
+        <div
+          ng-messages="telephoneForm.confirmPassword.$error"
+          role="alert"
+          multiple
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.CONFIRM_REQUIRED"
+              >Confirm field is required</span
+            >
+          </div>
+          <div ng-message="passwordMatch">
+            <span translate="STAFF.ERRORS.CONFIRM_NOT_MATCH"
+              >Your password did not match</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <md-input-container class="md-block">
+        <label translate="STAFF.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.telephone.description"
+        />
+
+        <div
+          ng-messages="telephoneForm['description'].$error"
+          ng-show="telephoneForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container ng-if="vm.newTelephone" class="md-block">
+        <md-switch
+          ng-model="vm.telephone.autointernal"
+          aria-label="AutoInternal"
+          ><span translate="STAFF.AUTOINTERNAL">AutoInternal</span></md-switch
+        >
+      </md-input-container>
+      <md-input-container ng-if="!vm.telephone.autointernal" class="md-block">
+        <label translate="STAFF.INTERNAL">Internal</label>
+        <input
+          type="text"
+          name="internal"
+          ng-model="vm.telephone.internal"
+          ng-required="true"
+          ng-disabled="!vm.newTelephone"
+        />
+
+        <div
+          ng-messages="telephoneForm['internal'].$error"
+          ng-show="telephoneForm['internal'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.INTERNAL_REQUIRED"
+              >Internal field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container ng-if="vm.newTelephone" class="md-block">
+        <md-switch ng-model="vm.telephone.voicemail" aria-label="Voicemail"
+          ><span translate="STAFF.VOICEMAIL">Voicemail</span></md-switch
+        >
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newTelephone"
+          ng-click="vm.saveTelephone()"
+          class="send-button md-accent md-raised"
+          ng-disabled="telephoneForm.$invalid || telephoneForm.$pristine"
+          aria-label="SAVE"
+          translate="STAFF.SAVE"
+          translate-attr-aria-label="STAFF.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newTelephone"
+          ng-click="vm.addNewTelephone()"
+          class="send-button md-accent md-raised"
+          ng-disabled="telephoneForm.$invalid"
+          aria-label="ADD"
+          translate="STAFF.ADD_TELEPHONE"
+          translate-attr-aria-label="STAFF.ADD_TELEPHONE"
+        >
+          ADD TELEPHONE
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newTelephone"
+          ng-click="vm.deleteTelephone($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="STAFF.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="STAFF.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/staff/views/telephones/edit/changepassword/changepassword.html/changepassword-[chunkhash].html b/public/src/js/modules/main/apps/staff/views/telephones/edit/changepassword/changepassword.html/changepassword-[chunkhash].html
deleted file mode 100644
index 4ac2c88..0000000
--- a/public/src/js/modules/main/apps/staff/views/telephones/edit/changepassword/changepassword.html/changepassword-[chunkhash].html
+++ /dev/null
@@ -1,158 +0,0 @@
-<md-dialog class="telephone-dialog" aria-label="{{vm.name}}">
-  <form name="telephoneForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ ' STAFF.CHANGE_PASSWORD' | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container
-        class="md-block"
-        ng-if="vm.currentUser.id == vm.telephone.id"
-      >
-        <label translate="STAFF.OLD_PASSWORD">Old Password</label>
-        <input
-          type="password"
-          name="oldPassword"
-          ng-model="vm.oldPassword"
-          placeholder="Password"
-          translate
-          translate-attr-placeholder="STAFF.OLD_PASSWORD"
-          required
-        />
-        <div ng-messages="telephoneForm.oldPassword.$error" role="alert">
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.PASSWORD_REQUIRED"
-              >Password field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="STAFF.NEW_PASSWORD">New Password</label>
-        <input
-          type="password"
-          name="password"
-          ng-model="vm.password"
-          placeholder="Password"
-          translate
-          ng-pattern="vm.passwordPattern"
-          translate-attr-placeholder="STAFF.NEW_PASSWORD"
-          required
-        />
-        <div ng-messages="telephoneForm.password.$error" role="alert">
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.PASSWORD_REQUIRED"
-              >Password field is required</span
-            >
-          </div>
-
-          <div ng-message="pattern">
-            <span translate="STAFF.ERRORS.SECURE_PASSWORD_PATTERN"
-              >Must contain at least 8 characters, with a minimum of 1 lowercase
-              letter, 1 uppercase letter, 1 numeric character and 1 special
-              character ~!?*@#$%^&-_=+[{]}.</span
-            >
-          </div>
-          <div ng-message="oldPasswordMatch">
-            <span translate="STAFF.ERRORS.PASSWORD_OLDPASSWORD_MATCH"
-              >New password must be different from old one</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="STAFF.CONFIRM_PASSWORD">Confirm Password</label>
-        <input
-          type="password"
-          match-password="password"
-          name="confirmPassword"
-          ng-model="confirmPassword"
-        />
-        <div
-          ng-messages="telephoneForm.confirmPassword.$error"
-          role="alert"
-          multiple
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.CONFIRM_REQUIRED"
-              >Confirm field is required</span
-            >
-          </div>
-          <div ng-message="passwordMatch">
-            <span translate="STAFF.ERRORS.CONFIRM_NOT_MATCH"
-              >Your password did not match</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-click="vm.savePassword()"
-          class="send-button md-accent md-raised"
-          ng-disabled="telephoneForm.$invalid || telephoneForm.$pristine"
-          aria-label="SAVE"
-          translate="STAFF.SAVE"
-          translate-attr-aria-label="STAFF.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/staff/views/telephones/edit/changepassword/changepassword.html/changepassword.html b/public/src/js/modules/main/apps/staff/views/telephones/edit/changepassword/changepassword.html/changepassword.html
new file mode 100644
index 0000000..4ac2c88
--- /dev/null
+++ b/public/src/js/modules/main/apps/staff/views/telephones/edit/changepassword/changepassword.html/changepassword.html
@@ -0,0 +1,158 @@
+<md-dialog class="telephone-dialog" aria-label="{{vm.name}}">
+  <form name="telephoneForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ ' STAFF.CHANGE_PASSWORD' | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container
+        class="md-block"
+        ng-if="vm.currentUser.id == vm.telephone.id"
+      >
+        <label translate="STAFF.OLD_PASSWORD">Old Password</label>
+        <input
+          type="password"
+          name="oldPassword"
+          ng-model="vm.oldPassword"
+          placeholder="Password"
+          translate
+          translate-attr-placeholder="STAFF.OLD_PASSWORD"
+          required
+        />
+        <div ng-messages="telephoneForm.oldPassword.$error" role="alert">
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.PASSWORD_REQUIRED"
+              >Password field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="STAFF.NEW_PASSWORD">New Password</label>
+        <input
+          type="password"
+          name="password"
+          ng-model="vm.password"
+          placeholder="Password"
+          translate
+          ng-pattern="vm.passwordPattern"
+          translate-attr-placeholder="STAFF.NEW_PASSWORD"
+          required
+        />
+        <div ng-messages="telephoneForm.password.$error" role="alert">
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.PASSWORD_REQUIRED"
+              >Password field is required</span
+            >
+          </div>
+
+          <div ng-message="pattern">
+            <span translate="STAFF.ERRORS.SECURE_PASSWORD_PATTERN"
+              >Must contain at least 8 characters, with a minimum of 1 lowercase
+              letter, 1 uppercase letter, 1 numeric character and 1 special
+              character ~!?*@#$%^&-_=+[{]}.</span
+            >
+          </div>
+          <div ng-message="oldPasswordMatch">
+            <span translate="STAFF.ERRORS.PASSWORD_OLDPASSWORD_MATCH"
+              >New password must be different from old one</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="STAFF.CONFIRM_PASSWORD">Confirm Password</label>
+        <input
+          type="password"
+          match-password="password"
+          name="confirmPassword"
+          ng-model="confirmPassword"
+        />
+        <div
+          ng-messages="telephoneForm.confirmPassword.$error"
+          role="alert"
+          multiple
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.CONFIRM_REQUIRED"
+              >Confirm field is required</span
+            >
+          </div>
+          <div ng-message="passwordMatch">
+            <span translate="STAFF.ERRORS.CONFIRM_NOT_MATCH"
+              >Your password did not match</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-click="vm.savePassword()"
+          class="send-button md-accent md-raised"
+          ng-disabled="telephoneForm.$invalid || telephoneForm.$pristine"
+          aria-label="SAVE"
+          translate="STAFF.SAVE"
+          translate-attr-aria-label="STAFF.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/staff/views/telephones/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/staff/views/telephones/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index a849392..0000000
--- a/public/src/js/modules/main/apps/staff/views/telephones/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,518 +0,0 @@
-<div id="staff-telephone" class="page-layout simple tabbed" layout="column">
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-telephones-button md-icon-button"
-        aria-label="Go to telephones"
-        ng-click="vm.gotoTelephones()"
-        translate
-        translate-attr-aria-label="STAFF.GO_TO_TELEPHONES"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="telephone-image" hide-xs>
-          <img ng-src="assets/images/business/telephones.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.telephone.id}}
-            <span ng-if="vm.telephone.name">{{vm.telephone.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="STAFF.CREATED_AT"></span>
-            <span>{{vm.telephone.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div ng-cloak ng-if="vm.crudPermissions.canEdit">
-      <md-button
-        ng-click="vm.changepassworddialog(vm.telephone, $event)"
-        class="md-fab md-warn md-icon-button"
-        aria-label="changepassword"
-      >
-        <md-tooltip
-          ><span translate="STAFF.CHANGEPASSWORD_TELEPHONE"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-key-variant"></md-icon>
-      </md-button>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveTelephone()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(accountForm.$invalid) || (generalForm.$invalid)"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="STAFF.ACCOUNT">ACCOUNT</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="telephone-detail-form-container account md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="STAFF.ACCOUNT">
-                ACCOUNT
-              </div>
-            </div>
-            <form name="accountForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="STAFF.ACCOUNTNAME">Accountname</label>
-                <input
-                  type="text"
-                  name="fullname"
-                  ng-model="vm.telephone.fullname"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="accountForm['fullname'].$error"
-                  ng-show="accountForm['fullname'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.ACCOUNTNAME_REQUIRED"
-                      >Accountname field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.USERNAME">Username</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.telephone.name"
-                  ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-                  ng-required="true"
-                  disabled
-                />
-
-                <div class="hint">
-                  <span translate="STAFF.HELP.USERNAME"></span>
-                </div>
-                <div
-                  ng-messages="accountForm['name'].$error"
-                  ng-show="accountForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.USERNAME_REQUIRED"
-                      >Username field is required</span
-                    >
-                  </div>
-                  <div ng-message="pattern">
-                    <span
-                      translate="STAFF.ERRORS.USERNAME_MUST_VALID_PATTERN"
-                      translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-                      >Username must be valid pattern
-                    </span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.EMAIL">Email</label>
-                <input
-                  type="email"
-                  name="email"
-                  ng-model="vm.telephone.email"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="accountForm['email'].$error"
-                  ng-show="accountForm['email'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.EMAIL_REQUIRED"
-                      >Email field is required</span
-                    >
-                  </div>
-                  <div ng-message="email">
-                    <span translate="STAFF.ERRORS.EMAIL_MUST_VALID"
-                      >Email must be a valid e-mail address</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.telephone.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="accountForm['description'].$error"
-                  ng-show="accountForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.PHONE">Phone</label>
-                <input
-                  type="text"
-                  name="phone"
-                  ng-model="vm.telephone.phone"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="accountForm['phone'].$error"
-                  ng-show="accountForm['phone'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.PHONE_REQUIRED"
-                      >Phone field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.MOBILE">Mobile</label>
-                <input
-                  type="text"
-                  name="mobile"
-                  ng-model="vm.telephone.mobile"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="accountForm['mobile'].$error"
-                  ng-show="accountForm['mobile'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.MOBILE_REQUIRED"
-                      >Mobile field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="STAFF.VOICE">VOICE</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="telephone-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="STAFF.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container
-                ng-if="!vm.telephone.autointernal"
-                class="md-block"
-              >
-                <label translate="STAFF.INTERNAL">Internal</label>
-                <input
-                  type="text"
-                  name="internal"
-                  ng-model="vm.telephone.internal"
-                  ng-required="true"
-                  autofocus
-                  disabled
-                />
-
-                <div
-                  ng-messages="generalForm['internal'].$error"
-                  ng-show="generalForm['internal'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.INTERNAL_REQUIRED"
-                      >Internal field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.TRANSPORT">Transport</label>
-                <md-select
-                  name="transport"
-                  ng-model="vm.telephone.transport"
-                  multiple
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'udp'">udp</md-option>
-                  <md-option ng-value="'tcp'">tcp</md-option>
-                  <md-option ng-value="'ws'">ws</md-option>
-                  <md-option ng-value="'wss'">wss</md-option>
-                  <md-option ng-value="'tls'">tls</md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="STAFF.HELP.TRANSPORT"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['transport'].$error"
-                  ng-show="generalForm['transport'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.TRANSPORT_REQUIRED"
-                      >Transport field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.NAT">NAT</label>
-                <md-select
-                  name="nat"
-                  ng-model="vm.telephone.nat"
-                  multiple
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'force_rport'">force_rport</md-option>
-                  <md-option ng-value="'comedia'">comedia</md-option>
-                  <md-option ng-value="'yes'">yes</md-option>
-                  <md-option ng-value="'no'">no</md-option>
-                  <md-option ng-value="'never'">never</md-option>
-                  <md-option ng-value="'route'">route</md-option>
-                </md-select>
-                <div class="hint"><span translate="STAFF.HELP.NAT"></span></div>
-                <div
-                  ng-messages="generalForm['nat'].$error"
-                  ng-show="generalForm['nat'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.NAT_REQUIRED"
-                      >NAT field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.ALLOWCODECS">AllowCodecs</label>
-                <md-select
-                  name="allow"
-                  ng-model="vm.telephone.allow"
-                  multiple
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'ulaw'">ulaw</md-option>
-                  <md-option ng-value="'alaw'">alaw</md-option>
-                  <md-option ng-value="'gsm'">gsm</md-option>
-                  <md-option ng-value="'g722'">g722</md-option>
-                  <md-option ng-value="'g729'">g729</md-option>
-                  <md-option ng-value="'opus'">opus</md-option>
-                  <md-option ng-value="'h264'">h264</md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="STAFF.HELP.ALLOWCODECS"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['allow'].$error"
-                  ng-show="generalForm['allow'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.ALLOWCODECS_REQUIRED"
-                      >AllowCodecs field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.CALLERID">CallerId</label>
-                <input
-                  type="text"
-                  name="callerid"
-                  ng-model="vm.telephone.callerid"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['callerid'].$error"
-                  ng-show="generalForm['callerid'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.CALLERID_REQUIRED"
-                      >CallerId field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.CONTEXT">Context</label>
-                <md-select
-                  name="context"
-                  ng-model="vm.telephone.context"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="context.name"
-                    ng-repeat="context in vm.contexts"
-                    ng-disabled="context.canSelect === false"
-                    >{{ context.name }}</md-option
-                  >
-                </md-select>
-                <div
-                  ng-messages="generalForm['context'].$error"
-                  ng-show="generalForm['context'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.CONTEXT_REQUIRED"
-                      >Context field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.CALLGROUP">Callgroup</label>
-                <input
-                  type="text"
-                  name="callgroup"
-                  ng-model="vm.telephone.callgroup"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="STAFF.HELP.CALLGROUP"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['callgroup'].$error"
-                  ng-show="generalForm['callgroup'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.CALLGROUP_REQUIRED"
-                      >Callgroup field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.PICKUPGROUP">Pickupgroup</label>
-                <input
-                  type="text"
-                  name="pickupgroup"
-                  ng-model="vm.telephone.pickupgroup"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="STAFF.HELP.PICKUPGROUP"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['pickupgroup'].$error"
-                  ng-show="generalForm['pickupgroup'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.PICKUPGROUP_REQUIRED"
-                      >Pickupgroup field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.VIDEOSUPPORT">Videosupport</label>
-                <md-select
-                  name="videosupport"
-                  ng-model="vm.telephone.videosupport"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">Yes</md-option>
-                  <md-option ng-value="'no'">No</md-option>
-                  <md-option ng-value="'always'">Always</md-option>
-                </md-select>
-                <div
-                  ng-messages="generalForm['videosupport'].$error"
-                  ng-show="generalForm['videosupport'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.VIDEOSUPPORT_REQUIRED"
-                      >Videosupport field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.ENCRYPTION">Encryption</label>
-                <md-select
-                  name="encryption"
-                  ng-model="vm.telephone.encryption"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">yes</md-option>
-                  <md-option ng-value="'no'">no</md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="STAFF.HELP.ENCRYPTION"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['encryption'].$error"
-                  ng-show="generalForm['encryption'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.ENCRYPTION_REQUIRED"
-                      >Encryption field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/staff/views/telephones/edit/view.html/view.html b/public/src/js/modules/main/apps/staff/views/telephones/edit/view.html/view.html
new file mode 100644
index 0000000..a849392
--- /dev/null
+++ b/public/src/js/modules/main/apps/staff/views/telephones/edit/view.html/view.html
@@ -0,0 +1,518 @@
+<div id="staff-telephone" class="page-layout simple tabbed" layout="column">
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-telephones-button md-icon-button"
+        aria-label="Go to telephones"
+        ng-click="vm.gotoTelephones()"
+        translate
+        translate-attr-aria-label="STAFF.GO_TO_TELEPHONES"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="telephone-image" hide-xs>
+          <img ng-src="assets/images/business/telephones.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.telephone.id}}
+            <span ng-if="vm.telephone.name">{{vm.telephone.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="STAFF.CREATED_AT"></span>
+            <span>{{vm.telephone.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div ng-cloak ng-if="vm.crudPermissions.canEdit">
+      <md-button
+        ng-click="vm.changepassworddialog(vm.telephone, $event)"
+        class="md-fab md-warn md-icon-button"
+        aria-label="changepassword"
+      >
+        <md-tooltip
+          ><span translate="STAFF.CHANGEPASSWORD_TELEPHONE"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-key-variant"></md-icon>
+      </md-button>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveTelephone()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(accountForm.$invalid) || (generalForm.$invalid)"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="STAFF.ACCOUNT">ACCOUNT</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="telephone-detail-form-container account md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="STAFF.ACCOUNT">
+                ACCOUNT
+              </div>
+            </div>
+            <form name="accountForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="STAFF.ACCOUNTNAME">Accountname</label>
+                <input
+                  type="text"
+                  name="fullname"
+                  ng-model="vm.telephone.fullname"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="accountForm['fullname'].$error"
+                  ng-show="accountForm['fullname'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.ACCOUNTNAME_REQUIRED"
+                      >Accountname field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.USERNAME">Username</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.telephone.name"
+                  ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+                  ng-required="true"
+                  disabled
+                />
+
+                <div class="hint">
+                  <span translate="STAFF.HELP.USERNAME"></span>
+                </div>
+                <div
+                  ng-messages="accountForm['name'].$error"
+                  ng-show="accountForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.USERNAME_REQUIRED"
+                      >Username field is required</span
+                    >
+                  </div>
+                  <div ng-message="pattern">
+                    <span
+                      translate="STAFF.ERRORS.USERNAME_MUST_VALID_PATTERN"
+                      translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+                      >Username must be valid pattern
+                    </span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.EMAIL">Email</label>
+                <input
+                  type="email"
+                  name="email"
+                  ng-model="vm.telephone.email"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="accountForm['email'].$error"
+                  ng-show="accountForm['email'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.EMAIL_REQUIRED"
+                      >Email field is required</span
+                    >
+                  </div>
+                  <div ng-message="email">
+                    <span translate="STAFF.ERRORS.EMAIL_MUST_VALID"
+                      >Email must be a valid e-mail address</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.telephone.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="accountForm['description'].$error"
+                  ng-show="accountForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.PHONE">Phone</label>
+                <input
+                  type="text"
+                  name="phone"
+                  ng-model="vm.telephone.phone"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="accountForm['phone'].$error"
+                  ng-show="accountForm['phone'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.PHONE_REQUIRED"
+                      >Phone field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.MOBILE">Mobile</label>
+                <input
+                  type="text"
+                  name="mobile"
+                  ng-model="vm.telephone.mobile"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="accountForm['mobile'].$error"
+                  ng-show="accountForm['mobile'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.MOBILE_REQUIRED"
+                      >Mobile field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="STAFF.VOICE">VOICE</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="telephone-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="STAFF.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container
+                ng-if="!vm.telephone.autointernal"
+                class="md-block"
+              >
+                <label translate="STAFF.INTERNAL">Internal</label>
+                <input
+                  type="text"
+                  name="internal"
+                  ng-model="vm.telephone.internal"
+                  ng-required="true"
+                  autofocus
+                  disabled
+                />
+
+                <div
+                  ng-messages="generalForm['internal'].$error"
+                  ng-show="generalForm['internal'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.INTERNAL_REQUIRED"
+                      >Internal field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.TRANSPORT">Transport</label>
+                <md-select
+                  name="transport"
+                  ng-model="vm.telephone.transport"
+                  multiple
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'udp'">udp</md-option>
+                  <md-option ng-value="'tcp'">tcp</md-option>
+                  <md-option ng-value="'ws'">ws</md-option>
+                  <md-option ng-value="'wss'">wss</md-option>
+                  <md-option ng-value="'tls'">tls</md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="STAFF.HELP.TRANSPORT"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['transport'].$error"
+                  ng-show="generalForm['transport'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.TRANSPORT_REQUIRED"
+                      >Transport field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.NAT">NAT</label>
+                <md-select
+                  name="nat"
+                  ng-model="vm.telephone.nat"
+                  multiple
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'force_rport'">force_rport</md-option>
+                  <md-option ng-value="'comedia'">comedia</md-option>
+                  <md-option ng-value="'yes'">yes</md-option>
+                  <md-option ng-value="'no'">no</md-option>
+                  <md-option ng-value="'never'">never</md-option>
+                  <md-option ng-value="'route'">route</md-option>
+                </md-select>
+                <div class="hint"><span translate="STAFF.HELP.NAT"></span></div>
+                <div
+                  ng-messages="generalForm['nat'].$error"
+                  ng-show="generalForm['nat'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.NAT_REQUIRED"
+                      >NAT field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.ALLOWCODECS">AllowCodecs</label>
+                <md-select
+                  name="allow"
+                  ng-model="vm.telephone.allow"
+                  multiple
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'ulaw'">ulaw</md-option>
+                  <md-option ng-value="'alaw'">alaw</md-option>
+                  <md-option ng-value="'gsm'">gsm</md-option>
+                  <md-option ng-value="'g722'">g722</md-option>
+                  <md-option ng-value="'g729'">g729</md-option>
+                  <md-option ng-value="'opus'">opus</md-option>
+                  <md-option ng-value="'h264'">h264</md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="STAFF.HELP.ALLOWCODECS"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['allow'].$error"
+                  ng-show="generalForm['allow'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.ALLOWCODECS_REQUIRED"
+                      >AllowCodecs field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.CALLERID">CallerId</label>
+                <input
+                  type="text"
+                  name="callerid"
+                  ng-model="vm.telephone.callerid"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['callerid'].$error"
+                  ng-show="generalForm['callerid'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.CALLERID_REQUIRED"
+                      >CallerId field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.CONTEXT">Context</label>
+                <md-select
+                  name="context"
+                  ng-model="vm.telephone.context"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="context.name"
+                    ng-repeat="context in vm.contexts"
+                    ng-disabled="context.canSelect === false"
+                    >{{ context.name }}</md-option
+                  >
+                </md-select>
+                <div
+                  ng-messages="generalForm['context'].$error"
+                  ng-show="generalForm['context'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.CONTEXT_REQUIRED"
+                      >Context field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.CALLGROUP">Callgroup</label>
+                <input
+                  type="text"
+                  name="callgroup"
+                  ng-model="vm.telephone.callgroup"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="STAFF.HELP.CALLGROUP"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['callgroup'].$error"
+                  ng-show="generalForm['callgroup'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.CALLGROUP_REQUIRED"
+                      >Callgroup field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.PICKUPGROUP">Pickupgroup</label>
+                <input
+                  type="text"
+                  name="pickupgroup"
+                  ng-model="vm.telephone.pickupgroup"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="STAFF.HELP.PICKUPGROUP"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['pickupgroup'].$error"
+                  ng-show="generalForm['pickupgroup'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.PICKUPGROUP_REQUIRED"
+                      >Pickupgroup field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.VIDEOSUPPORT">Videosupport</label>
+                <md-select
+                  name="videosupport"
+                  ng-model="vm.telephone.videosupport"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">Yes</md-option>
+                  <md-option ng-value="'no'">No</md-option>
+                  <md-option ng-value="'always'">Always</md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['videosupport'].$error"
+                  ng-show="generalForm['videosupport'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.VIDEOSUPPORT_REQUIRED"
+                      >Videosupport field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.ENCRYPTION">Encryption</label>
+                <md-select
+                  name="encryption"
+                  ng-model="vm.telephone.encryption"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">yes</md-option>
+                  <md-option ng-value="'no'">no</md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="STAFF.HELP.ENCRYPTION"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['encryption'].$error"
+                  ng-show="generalForm['encryption'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.ENCRYPTION_REQUIRED"
+                      >Encryption field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/staff/views/telephones/telephones.html/telephones-[chunkhash].html b/public/src/js/modules/main/apps/staff/views/telephones/telephones.html/telephones-[chunkhash].html
deleted file mode 100644
index 9b45485..0000000
--- a/public/src/js/modules/main/apps/staff/views/telephones/telephones.html/telephones-[chunkhash].html
+++ /dev/null
@@ -1,309 +0,0 @@
-<div
-  id="telephones"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-account-multiple" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="STAFF.TELEPHONES">Telephones</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="STAFF.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedTelephones.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedTelephones =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="STAFF.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-telephones-count">
-          <span>{{vm.selectedTelephones.length}}</span>
-          <span translate="STAFF.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="STAFF.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllTelephones()"
-                translate="STAFF.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectTelephones()"
-                translate="STAFF.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedTelephones"
-          csv-label="true"
-          filename="telephones.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedTelephones($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="STAFF.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- TELEPHONE TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedTelephones"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getTelephones"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="fullname">
-                  {{ 'STAFF.ACCOUNTNAME' | translate }}
-                </th>
-                <th md-column md-order-by="name">
-                  {{ 'STAFF.USERNAME' | translate }}
-                </th>
-                <th md-column md-order-by="email">
-                  {{ 'STAFF.EMAIL' | translate }}
-                </th>
-                <th md-column md-order-by="internal">
-                  {{ 'STAFF.INTERNAL' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.telephones.rows.length">
-                <td md-cell colspan="5">
-                  <div layout="row" layout-align="center center">
-                    <span translate="STAFF.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="telephone"
-                md-select-id="id"
-                ng-repeat="telephone in vm.telephones.rows"
-              >
-                <td md-cell ng-if="telephone.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{telephone.name}}"
-                    ng-src="api/users/{{telephone.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!telephone.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{telephone.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(telephone, ev) : vm.createOrEditTelephone($event, telephone)"
-                  md-cell
-                  class="fullname font-weight-600"
-                >
-                  {{telephone.fullname}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(telephone, ev) : vm.createOrEditTelephone($event, telephone)"
-                  md-cell
-                  class="name"
-                >
-                  {{telephone.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(telephone, ev) : vm.createOrEditTelephone($event, telephone)"
-                  md-cell
-                  class="email"
-                >
-                  {{telephone.email}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(telephone, ev) : vm.createOrEditTelephone($event, telephone)"
-                  md-cell
-                  class="internal"
-                >
-                  {{telephone.internal}}
-                </td>
-
-                <td
-                  md-cell
-                  class="actions"
-                  ng-if="!vm.crudPermissions.readOnly"
-                >
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="STAFF.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(telephone, $event    )"
-                          translate="STAFF.EDIT_TELEPHONE"
-                        >
-                          Edit Telephone
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(telephone, $event    )"
-                          translate="STAFF.DELETE_TELEPHONE"
-                        >
-                          Delete Telephone
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'STAFF.PAGE' | translate}}:', rowsPerPage: '{{'STAFF.ROWSPERPAGE' | translate}}:', of: '{{'STAFF.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.telephones.count}}"
-          md-on-paginate="vm.getTelephones"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / TELEPHONE TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD TELEPHONE BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-telephone-button"
-    ng-click="vm.createOrEditTelephone($event)"
-    aria-label="add telephone"
-    translate
-    translate-attr-aria-label="STAFF.ADD_TELEPHONE"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD TELEPHONE BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/staff/views/telephones/telephones.html/telephones.html b/public/src/js/modules/main/apps/staff/views/telephones/telephones.html/telephones.html
new file mode 100644
index 0000000..9b45485
--- /dev/null
+++ b/public/src/js/modules/main/apps/staff/views/telephones/telephones.html/telephones.html
@@ -0,0 +1,309 @@
+<div
+  id="telephones"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-account-multiple" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="STAFF.TELEPHONES">Telephones</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="STAFF.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedTelephones.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedTelephones =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="STAFF.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-telephones-count">
+          <span>{{vm.selectedTelephones.length}}</span>
+          <span translate="STAFF.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="STAFF.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllTelephones()"
+                translate="STAFF.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectTelephones()"
+                translate="STAFF.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedTelephones"
+          csv-label="true"
+          filename="telephones.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedTelephones($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="STAFF.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- TELEPHONE TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedTelephones"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getTelephones"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="fullname">
+                  {{ 'STAFF.ACCOUNTNAME' | translate }}
+                </th>
+                <th md-column md-order-by="name">
+                  {{ 'STAFF.USERNAME' | translate }}
+                </th>
+                <th md-column md-order-by="email">
+                  {{ 'STAFF.EMAIL' | translate }}
+                </th>
+                <th md-column md-order-by="internal">
+                  {{ 'STAFF.INTERNAL' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.telephones.rows.length">
+                <td md-cell colspan="5">
+                  <div layout="row" layout-align="center center">
+                    <span translate="STAFF.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="telephone"
+                md-select-id="id"
+                ng-repeat="telephone in vm.telephones.rows"
+              >
+                <td md-cell ng-if="telephone.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{telephone.name}}"
+                    ng-src="api/users/{{telephone.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!telephone.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{telephone.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(telephone, ev) : vm.createOrEditTelephone($event, telephone)"
+                  md-cell
+                  class="fullname font-weight-600"
+                >
+                  {{telephone.fullname}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(telephone, ev) : vm.createOrEditTelephone($event, telephone)"
+                  md-cell
+                  class="name"
+                >
+                  {{telephone.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(telephone, ev) : vm.createOrEditTelephone($event, telephone)"
+                  md-cell
+                  class="email"
+                >
+                  {{telephone.email}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(telephone, ev) : vm.createOrEditTelephone($event, telephone)"
+                  md-cell
+                  class="internal"
+                >
+                  {{telephone.internal}}
+                </td>
+
+                <td
+                  md-cell
+                  class="actions"
+                  ng-if="!vm.crudPermissions.readOnly"
+                >
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="STAFF.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(telephone, $event    )"
+                          translate="STAFF.EDIT_TELEPHONE"
+                        >
+                          Edit Telephone
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(telephone, $event    )"
+                          translate="STAFF.DELETE_TELEPHONE"
+                        >
+                          Delete Telephone
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'STAFF.PAGE' | translate}}:', rowsPerPage: '{{'STAFF.ROWSPERPAGE' | translate}}:', of: '{{'STAFF.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.telephones.count}}"
+          md-on-paginate="vm.getTelephones"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / TELEPHONE TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD TELEPHONE BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-telephone-button"
+    ng-click="vm.createOrEditTelephone($event)"
+    aria-label="add telephone"
+    translate
+    translate-attr-aria-label="STAFF.ADD_TELEPHONE"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD TELEPHONE BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/staff/views/userProfiles/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/staff/views/userProfiles/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index faf0f39..0000000
--- a/public/src/js/modules/main/apps/staff/views/userProfiles/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,185 +0,0 @@
-<md-dialog class="userProfile-dialog" aria-label="New UserProfile">
-  <form name="userProfileForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="STAFF.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.userProfile.name"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.newUserProfile"
-        />
-
-        <div
-          ng-messages="userProfileForm['name'].$error"
-          ng-show="userProfileForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="STAFF.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.userProfile.description"
-        />
-
-        <div
-          ng-messages="userProfileForm['description'].$error"
-          ng-show="userProfileForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="STAFF.CRUDPERMISSIONS">CrudPermissions</label>
-        <md-select
-          name="crudPermissions"
-          ng-model="vm.userProfile.crudPermissions"
-          multiple
-          required
-        >
-          <md-option ng-value="'r'" disabled>
-            {{ 'STAFF.READ_PERMISSION' | translate }}
-          </md-option>
-
-          <md-option ng-value="'e'">
-            {{ 'STAFF.EDIT_PERMISSION' | translate }}
-          </md-option>
-
-          <md-option ng-value="'d'">
-            {{ 'STAFF.DELETE_PERMISSION' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="userProfileForm['crudPermissions'].$error"
-          ng-show="userProfileForm['crudPermissions'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.CRUDPERMISSIONS_REQUIRED"
-              >CrudPermissions field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newUserProfile"
-          ng-click="vm.saveUserProfile()"
-          class="send-button md-accent md-raised"
-          ng-disabled="userProfileForm.$invalid || userProfileForm.$pristine"
-          aria-label="SAVE"
-          translate="STAFF.SAVE"
-          translate-attr-aria-label="STAFF.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newUserProfile"
-          ng-click="vm.addNewUserProfile()"
-          class="send-button md-accent md-raised"
-          ng-disabled="userProfileForm.$invalid"
-          aria-label="ADD"
-          translate="STAFF.ADD_USERPROFILE"
-          translate-attr-aria-label="STAFF.ADD_USERPROFILE"
-        >
-          ADD USERPROFILE
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newUserProfile"
-          ng-click="vm.deleteUserProfile($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="STAFF.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="STAFF.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/staff/views/userProfiles/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/staff/views/userProfiles/create/dialog.html/dialog.html
new file mode 100644
index 0000000..faf0f39
--- /dev/null
+++ b/public/src/js/modules/main/apps/staff/views/userProfiles/create/dialog.html/dialog.html
@@ -0,0 +1,185 @@
+<md-dialog class="userProfile-dialog" aria-label="New UserProfile">
+  <form name="userProfileForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="STAFF.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.userProfile.name"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.newUserProfile"
+        />
+
+        <div
+          ng-messages="userProfileForm['name'].$error"
+          ng-show="userProfileForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="STAFF.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.userProfile.description"
+        />
+
+        <div
+          ng-messages="userProfileForm['description'].$error"
+          ng-show="userProfileForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="STAFF.CRUDPERMISSIONS">CrudPermissions</label>
+        <md-select
+          name="crudPermissions"
+          ng-model="vm.userProfile.crudPermissions"
+          multiple
+          required
+        >
+          <md-option ng-value="'r'" disabled>
+            {{ 'STAFF.READ_PERMISSION' | translate }}
+          </md-option>
+
+          <md-option ng-value="'e'">
+            {{ 'STAFF.EDIT_PERMISSION' | translate }}
+          </md-option>
+
+          <md-option ng-value="'d'">
+            {{ 'STAFF.DELETE_PERMISSION' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="userProfileForm['crudPermissions'].$error"
+          ng-show="userProfileForm['crudPermissions'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.CRUDPERMISSIONS_REQUIRED"
+              >CrudPermissions field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newUserProfile"
+          ng-click="vm.saveUserProfile()"
+          class="send-button md-accent md-raised"
+          ng-disabled="userProfileForm.$invalid || userProfileForm.$pristine"
+          aria-label="SAVE"
+          translate="STAFF.SAVE"
+          translate-attr-aria-label="STAFF.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newUserProfile"
+          ng-click="vm.addNewUserProfile()"
+          class="send-button md-accent md-raised"
+          ng-disabled="userProfileForm.$invalid"
+          aria-label="ADD"
+          translate="STAFF.ADD_USERPROFILE"
+          translate-attr-aria-label="STAFF.ADD_USERPROFILE"
+        >
+          ADD USERPROFILE
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newUserProfile"
+          ng-click="vm.deleteUserProfile($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="STAFF.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="STAFF.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/staff/views/userProfiles/edit/clone/clone.html/clone-[chunkhash].html b/public/src/js/modules/main/apps/staff/views/userProfiles/edit/clone/clone.html/clone-[chunkhash].html
deleted file mode 100644
index 84c9663..0000000
--- a/public/src/js/modules/main/apps/staff/views/userProfiles/edit/clone/clone.html/clone-[chunkhash].html
+++ /dev/null
@@ -1,152 +0,0 @@
-<md-dialog class="userProfile-dialog" aria-label="Clone UserProfile">
-  <form name="userProfileForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="STAFF.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.userProfile.name"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.newUserProfile"
-        />
-
-        <div
-          ng-messages="userProfileForm['name'].$error"
-          ng-show="userProfileForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="STAFF.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.userProfile.description"
-        />
-
-        <div
-          ng-messages="userProfileForm['description'].$error"
-          ng-show="userProfileForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="STAFF.CRUDPERMISSIONS">CrudPermissions</label>
-        <md-select
-          name="crudPermissions"
-          ng-model="vm.userProfile.crudPermissions"
-          multiple
-          required
-        >
-          <md-option ng-value="'r'" disabled>
-            {{ 'STAFF.READ_PERMISSION' | translate }}
-          </md-option>
-
-          <md-option ng-value="'e'">
-            {{ 'STAFF.EDIT_PERMISSION' | translate }}
-          </md-option>
-
-          <md-option ng-value="'d'">
-            {{ 'STAFF.DELETE_PERMISSION' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="userProfileForm['crudPermissions'].$error"
-          ng-show="userProfileForm['crudPermissions'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.CRUDPERMISSIONS_REQUIRED"
-              >CrudPermissions field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <md-button
-        type="submit"
-        ng-click="vm.cloneUserProfile()"
-        class="send-button md-accent md-raised"
-        ng-disabled="userProfileForm.$invalid"
-        aria-label="CLONE"
-        translate="STAFF.CLONE_USERPROFILE"
-        translate-attr-aria-label="STAFF.CLONE_USERPROFILE"
-      >
-        CLONE USERPROFILE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/staff/views/userProfiles/edit/clone/clone.html/clone.html b/public/src/js/modules/main/apps/staff/views/userProfiles/edit/clone/clone.html/clone.html
new file mode 100644
index 0000000..84c9663
--- /dev/null
+++ b/public/src/js/modules/main/apps/staff/views/userProfiles/edit/clone/clone.html/clone.html
@@ -0,0 +1,152 @@
+<md-dialog class="userProfile-dialog" aria-label="Clone UserProfile">
+  <form name="userProfileForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="STAFF.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.userProfile.name"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.newUserProfile"
+        />
+
+        <div
+          ng-messages="userProfileForm['name'].$error"
+          ng-show="userProfileForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="STAFF.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.userProfile.description"
+        />
+
+        <div
+          ng-messages="userProfileForm['description'].$error"
+          ng-show="userProfileForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="STAFF.CRUDPERMISSIONS">CrudPermissions</label>
+        <md-select
+          name="crudPermissions"
+          ng-model="vm.userProfile.crudPermissions"
+          multiple
+          required
+        >
+          <md-option ng-value="'r'" disabled>
+            {{ 'STAFF.READ_PERMISSION' | translate }}
+          </md-option>
+
+          <md-option ng-value="'e'">
+            {{ 'STAFF.EDIT_PERMISSION' | translate }}
+          </md-option>
+
+          <md-option ng-value="'d'">
+            {{ 'STAFF.DELETE_PERMISSION' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="userProfileForm['crudPermissions'].$error"
+          ng-show="userProfileForm['crudPermissions'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.CRUDPERMISSIONS_REQUIRED"
+              >CrudPermissions field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <md-button
+        type="submit"
+        ng-click="vm.cloneUserProfile()"
+        class="send-button md-accent md-raised"
+        ng-disabled="userProfileForm.$invalid"
+        aria-label="CLONE"
+        translate="STAFF.CLONE_USERPROFILE"
+        translate-attr-aria-label="STAFF.CLONE_USERPROFILE"
+      >
+        CLONE USERPROFILE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/staff/views/userProfiles/edit/permissionsmanage/permissionsmanage.html/permissionsmanage-[chunkhash].html b/public/src/js/modules/main/apps/staff/views/userProfiles/edit/permissionsmanage/permissionsmanage.html/permissionsmanage-[chunkhash].html
deleted file mode 100644
index 337c0c7..0000000
--- a/public/src/js/modules/main/apps/staff/views/userProfiles/edit/permissionsmanage/permissionsmanage.html/permissionsmanage-[chunkhash].html
+++ /dev/null
@@ -1,190 +0,0 @@
-<md-dialog class="userProfile-dialog" aria-label="userProfile">
-  <form name="userProfileForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2>{{vm.title}}</h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog($event)">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <div layout="column" class="padding-bottom-10">
-        <div layout="row" class="padding-bottom-10">
-          <md-input-container flex class="no-margin">
-            <label translate="STAFF.SECTIONS">Sections</label>
-            <md-select
-              name="sections"
-              ng-model="vm.selectedSection"
-              placeholder="{{'STAFF.PERMISSIONS_SELECT_SECTION' | translate}}"
-              ng-change="vm.onChangeSection()"
-              required
-            >
-              <md-option
-                ng-value="subsection"
-                ng-repeat="subsection in vm.subsections"
-                ng-selected="{{vm.subsections.length === 1 ? 'true' : 'false'}}"
-                >{{subsection.translate | translate}}</md-option
-              >
-            </md-select>
-          </md-input-container>
-          <div layout="row" ng-show="vm.selectedSection" class="margin-left-10">
-            <md-button
-              ng-switch="vm.selectedSection.enabled"
-              class="md-icon-button md-fab md-mini size-8 padding-10"
-              ng-class="vm.selectedSection.enabled ? 'blue-500-bg' : 'grey-A400-bg'"
-              ng-click="vm.onChangeVisibility()"
-              aria-label="Visibility"
-            >
-              <md-icon
-                ng-switch-when="true"
-                md-font-icon="icon-eye"
-                aria-label="Visible section"
-              >
-                <md-tooltip
-                  >{{'STAFF.PERMISSIONS_SECTION_HIDE' | translate}}</md-tooltip
-                >
-              </md-icon>
-              <md-icon
-                ng-switch-when="false"
-                md-font-icon="icon-eye-off"
-                aria-label="Hidden section"
-              >
-                <md-tooltip
-                  >{{'STAFF.PERMISSIONS_SECTION_SHOW' | translate}}</md-tooltip
-                >
-              </md-icon>
-            </md-button>
-            <div>
-              <md-button
-                class="md-icon-button md-fab md-mini size-8 green-A700-bg no-margin"
-                ng-disabled="true"
-              >
-                <md-icon
-                  md-font-icon="icon-monitor"
-                  class="md-background-fg"
-                  aria-label="Read permission"
-                >
-                  <md-tooltip
-                    >{{'STAFF.READ_PERMISSION' | translate}}</md-tooltip
-                  >
-                </md-icon>
-              </md-button>
-              <md-button
-                class="md-icon-button md-fab md-mini size-8 no-margin"
-                ng-class="vm.selectedSection.allowEdit ? 'green-A700-bg' : 'grey-A400-bg'"
-                ng-click="vm.setPermission('edit')"
-              >
-                <md-icon
-                  md-font-icon="icon-pencil"
-                  aria-label="Edit permission"
-                >
-                  <md-tooltip
-                    >{{'STAFF.EDIT_PERMISSION' | translate}}</md-tooltip
-                  >
-                </md-icon>
-              </md-button>
-              <md-button
-                class="md-icon-button md-fab md-mini size-8 no-margin"
-                ng-class="vm.selectedSection.allowDelete ? 'green-A700-bg' : 'grey-A400-bg'"
-                ng-click="vm.setPermission('delete')"
-              >
-                <md-icon
-                  md-font-icon="icon-delete"
-                  aria-label="Delete permission"
-                >
-                  <md-tooltip
-                    >{{'STAFF.DELETE_PERMISSION' | translate}}</md-tooltip
-                  >
-                </md-icon>
-              </md-button>
-            </div>
-          </div>
-        </div>
-        <div
-          layout="row"
-          ng-show="vm.selectedSection"
-          class="margin-left-10"
-          ng-if="!vm.selectedSection.permissions || vm.selectedSection.permissions.association"
-        >
-          <md-switch
-            ng-model="vm.selectedSection.autoAssociation"
-            class="no-margin padding-right-10"
-            aria-label="Auto association"
-            ng-change="vm.onChangeAutoAssociation()"
-          >
-          </md-switch>
-          <p class="no-margin font-size-12 line-height-30">
-            {{'STAFF.PERMISSIONS_AUTO_ASSOCIATION_INFO' | translate}}
-          </p>
-        </div>
-        <div
-          layout="row"
-          ng-show="vm.selectedSection && vm.selectedSection.title === 'Reports' && !vm.selectedSection.autoAssociation"
-          class="margin-bottom-10 margin-top-30"
-          ng-if="!vm.selectedSection.permissions || vm.selectedSection.permissions.association"
-        >
-          <md-input-container flex class="no-margin">
-            <label translate="STAFF.REPORT_TYPE">Report Type</label>
-            <md-select
-              name="type"
-              ng-model="vm.selectedSection.reportType"
-              placeholder="{{'STAFF.PERMISSIONS_SELECT_REPORT_TYPE' | translate}}"
-              ng-change="vm.onChangeReportType()"
-              required
-            >
-              <md-option ng-value="'default'">Default</md-option>
-              <md-option ng-value="'custom'">Custom</md-option>
-            </md-select>
-          </md-input-container>
-        </div>
-        <div
-          ng-show="vm.selectedSection && vm.selectedSection.title === 'Dashboards'"
-          class="user-profile-section-help margin-bottom-10 margin-top-20"
-        >
-          <md-icon
-            md-font-icon="icon-help"
-            aria-label="Dashboards help"
-          ></md-icon>
-          <span
-            class="no-margin font-size-12 line-height-30"
-            translate="STAFF.HELP.CUSTOM_DASHBOARDS_PERMISSIONS"
-          ></span>
-        </div>
-      </div>
-      <ms-dual-multiselect
-        options="vm.dualMultiselectOptions"
-        ng-if="!vm.selectedSection.permissions || vm.selectedSection.permissions.association"
-        ng-hide="vm.selectedSection.autoAssociation"
-      ></ms-dual-multiselect>
-    </md-dialog-content>
-    <md-dialog-actions layout="row" layout-align="end center">
-      <div>
-        <md-icon
-          md-font-icon="icon-information-outline"
-          aria-label="Delete permission"
-        ></md-icon>
-        <span
-          class="no-margin font-size-12 line-height-30"
-          translate="STAFF.HELP.SAVE_PERMISSIONS"
-        ></span>
-      </div>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveSection()"
-        class="send-button md-accent md-raised"
-        ng-disabled="!vm.pendingChanges"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/staff/views/userProfiles/edit/permissionsmanage/permissionsmanage.html/permissionsmanage.html b/public/src/js/modules/main/apps/staff/views/userProfiles/edit/permissionsmanage/permissionsmanage.html/permissionsmanage.html
new file mode 100644
index 0000000..337c0c7
--- /dev/null
+++ b/public/src/js/modules/main/apps/staff/views/userProfiles/edit/permissionsmanage/permissionsmanage.html/permissionsmanage.html
@@ -0,0 +1,190 @@
+<md-dialog class="userProfile-dialog" aria-label="userProfile">
+  <form name="userProfileForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2>{{vm.title}}</h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog($event)">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <div layout="column" class="padding-bottom-10">
+        <div layout="row" class="padding-bottom-10">
+          <md-input-container flex class="no-margin">
+            <label translate="STAFF.SECTIONS">Sections</label>
+            <md-select
+              name="sections"
+              ng-model="vm.selectedSection"
+              placeholder="{{'STAFF.PERMISSIONS_SELECT_SECTION' | translate}}"
+              ng-change="vm.onChangeSection()"
+              required
+            >
+              <md-option
+                ng-value="subsection"
+                ng-repeat="subsection in vm.subsections"
+                ng-selected="{{vm.subsections.length === 1 ? 'true' : 'false'}}"
+                >{{subsection.translate | translate}}</md-option
+              >
+            </md-select>
+          </md-input-container>
+          <div layout="row" ng-show="vm.selectedSection" class="margin-left-10">
+            <md-button
+              ng-switch="vm.selectedSection.enabled"
+              class="md-icon-button md-fab md-mini size-8 padding-10"
+              ng-class="vm.selectedSection.enabled ? 'blue-500-bg' : 'grey-A400-bg'"
+              ng-click="vm.onChangeVisibility()"
+              aria-label="Visibility"
+            >
+              <md-icon
+                ng-switch-when="true"
+                md-font-icon="icon-eye"
+                aria-label="Visible section"
+              >
+                <md-tooltip
+                  >{{'STAFF.PERMISSIONS_SECTION_HIDE' | translate}}</md-tooltip
+                >
+              </md-icon>
+              <md-icon
+                ng-switch-when="false"
+                md-font-icon="icon-eye-off"
+                aria-label="Hidden section"
+              >
+                <md-tooltip
+                  >{{'STAFF.PERMISSIONS_SECTION_SHOW' | translate}}</md-tooltip
+                >
+              </md-icon>
+            </md-button>
+            <div>
+              <md-button
+                class="md-icon-button md-fab md-mini size-8 green-A700-bg no-margin"
+                ng-disabled="true"
+              >
+                <md-icon
+                  md-font-icon="icon-monitor"
+                  class="md-background-fg"
+                  aria-label="Read permission"
+                >
+                  <md-tooltip
+                    >{{'STAFF.READ_PERMISSION' | translate}}</md-tooltip
+                  >
+                </md-icon>
+              </md-button>
+              <md-button
+                class="md-icon-button md-fab md-mini size-8 no-margin"
+                ng-class="vm.selectedSection.allowEdit ? 'green-A700-bg' : 'grey-A400-bg'"
+                ng-click="vm.setPermission('edit')"
+              >
+                <md-icon
+                  md-font-icon="icon-pencil"
+                  aria-label="Edit permission"
+                >
+                  <md-tooltip
+                    >{{'STAFF.EDIT_PERMISSION' | translate}}</md-tooltip
+                  >
+                </md-icon>
+              </md-button>
+              <md-button
+                class="md-icon-button md-fab md-mini size-8 no-margin"
+                ng-class="vm.selectedSection.allowDelete ? 'green-A700-bg' : 'grey-A400-bg'"
+                ng-click="vm.setPermission('delete')"
+              >
+                <md-icon
+                  md-font-icon="icon-delete"
+                  aria-label="Delete permission"
+                >
+                  <md-tooltip
+                    >{{'STAFF.DELETE_PERMISSION' | translate}}</md-tooltip
+                  >
+                </md-icon>
+              </md-button>
+            </div>
+          </div>
+        </div>
+        <div
+          layout="row"
+          ng-show="vm.selectedSection"
+          class="margin-left-10"
+          ng-if="!vm.selectedSection.permissions || vm.selectedSection.permissions.association"
+        >
+          <md-switch
+            ng-model="vm.selectedSection.autoAssociation"
+            class="no-margin padding-right-10"
+            aria-label="Auto association"
+            ng-change="vm.onChangeAutoAssociation()"
+          >
+          </md-switch>
+          <p class="no-margin font-size-12 line-height-30">
+            {{'STAFF.PERMISSIONS_AUTO_ASSOCIATION_INFO' | translate}}
+          </p>
+        </div>
+        <div
+          layout="row"
+          ng-show="vm.selectedSection && vm.selectedSection.title === 'Reports' && !vm.selectedSection.autoAssociation"
+          class="margin-bottom-10 margin-top-30"
+          ng-if="!vm.selectedSection.permissions || vm.selectedSection.permissions.association"
+        >
+          <md-input-container flex class="no-margin">
+            <label translate="STAFF.REPORT_TYPE">Report Type</label>
+            <md-select
+              name="type"
+              ng-model="vm.selectedSection.reportType"
+              placeholder="{{'STAFF.PERMISSIONS_SELECT_REPORT_TYPE' | translate}}"
+              ng-change="vm.onChangeReportType()"
+              required
+            >
+              <md-option ng-value="'default'">Default</md-option>
+              <md-option ng-value="'custom'">Custom</md-option>
+            </md-select>
+          </md-input-container>
+        </div>
+        <div
+          ng-show="vm.selectedSection && vm.selectedSection.title === 'Dashboards'"
+          class="user-profile-section-help margin-bottom-10 margin-top-20"
+        >
+          <md-icon
+            md-font-icon="icon-help"
+            aria-label="Dashboards help"
+          ></md-icon>
+          <span
+            class="no-margin font-size-12 line-height-30"
+            translate="STAFF.HELP.CUSTOM_DASHBOARDS_PERMISSIONS"
+          ></span>
+        </div>
+      </div>
+      <ms-dual-multiselect
+        options="vm.dualMultiselectOptions"
+        ng-if="!vm.selectedSection.permissions || vm.selectedSection.permissions.association"
+        ng-hide="vm.selectedSection.autoAssociation"
+      ></ms-dual-multiselect>
+    </md-dialog-content>
+    <md-dialog-actions layout="row" layout-align="end center">
+      <div>
+        <md-icon
+          md-font-icon="icon-information-outline"
+          aria-label="Delete permission"
+        ></md-icon>
+        <span
+          class="no-margin font-size-12 line-height-30"
+          translate="STAFF.HELP.SAVE_PERMISSIONS"
+        ></span>
+      </div>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveSection()"
+        class="send-button md-accent md-raised"
+        ng-disabled="!vm.pendingChanges"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/staff/views/userProfiles/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/staff/views/userProfiles/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index f060548..0000000
--- a/public/src/js/modules/main/apps/staff/views/userProfiles/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,267 +0,0 @@
-<div id="staff-userProfile" class="page-layout simple tabbed" layout="column">
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-userProfiles-button md-icon-button"
-        aria-label="Go to userProfiles"
-        ng-click="vm.gotoUserProfiles()"
-        translate
-        translate-attr-aria-label="STAFF.GO_TO_USERPROFILES"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="userProfile-image" hide-xs>
-          <img ng-src="assets/images/business/userProfiles.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.userProfile.id}}
-            <span ng-if="vm.userProfile.name">{{vm.userProfile.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="STAFF.CREATED_AT"></span>
-            <span>{{vm.userProfile.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div ng-cloak ng-if="vm.crudPermissions.canEdit">
-      <md-button
-        ng-click="vm.clonedialog(vm.userProfile, $event)"
-        class="md-fab md-amber-500-bg md-icon-button"
-        aria-label="clone"
-      >
-        <md-tooltip
-          ><span translate="STAFF.CLONE_USERPROFILE"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-content-duplicate"></md-icon>
-      </md-button>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveUserProfile()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (modulesForm.$invalid)"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="STAFF.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="userProfile-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="STAFF.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="STAFF.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.userProfile.name"
-                  ng-required="true"
-                  autofocus
-                  disabled
-                />
-
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.userProfile.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.CRUDPERMISSIONS">CrudPermissions</label>
-                <md-select
-                  name="crudPermissions"
-                  ng-model="vm.userProfile.crudPermissions"
-                  multiple
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'r'" disabled>
-                    {{ 'STAFF.READ_PERMISSION' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'e'">
-                    {{ 'STAFF.EDIT_PERMISSION' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'d'">
-                    {{ 'STAFF.DELETE_PERMISSION' | translate }}
-                  </md-option>
-                </md-select>
-                <div
-                  ng-messages="generalForm['crudPermissions'].$error"
-                  ng-show="generalForm['crudPermissions'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.CRUDPERMISSIONS_REQUIRED"
-                      >CrudPermissions field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="STAFF.PERMISSIONS">PERMISSIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="userProfile-detail-form-container modules md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="STAFF.MODULES">
-                MODULES
-              </div>
-            </div>
-            <div
-              ng-controller="UserProfilePermissionsController as vm_pc"
-              ng-init="vm_pc.init(vm.userProfile, vm.license)"
-              class="userProfile-detail-form-container"
-            >
-              <md-grid-list
-                flex
-                md-cols-gt-xs="2"
-                md-cols-gt-sm="2"
-                md-cols-gt-md="4"
-                md-cols-gt-lg="6"
-                md-row-height-gt-xs="2:1"
-                md-row-height-gt-sm="2:1"
-                md-row-height-gt-md="3:1"
-                gt-xs-gutter="4px"
-                gt-sm-gutter="8px"
-                gt-md-gutter="8px"
-                gt-lg-gutter="16px"
-              >
-                <md-grid-tile
-                  ng-repeat="father in vm_pc.modules"
-                  ng-if="vm_pc.userProfile.role !== 'admin' && !father.permissions.hidden"
-                  md-colspan="2"
-                >
-                  <md-card
-                    flex-xs
-                    flex-gt-xs="90"
-                    layout="column"
-                    no-padding
-                    no-margin
-                  >
-                    <md-card-header>
-                      <md-card-avatar>
-                        <md-icon
-                          class="md-avatar-icon auto-size"
-                          md-font-icon="{{father.icon}}"
-                          ng-class="{ true: father.status.color }[true]"
-                        >
-                        </md-icon>
-                        <md-tooltip>{{ father.status.info }}</md-tooltip>
-                      </md-card-avatar>
-                      <md-card-header-text layout-align="center start">
-                        <span class="md-title" translate="{{father.translate}}"
-                          >{{ father.title }}</span
-                        >
-                      </md-card-header-text>
-                      <md-card-actions
-                        class="no-margin"
-                        layout="row"
-                        ng-init="vm_pc.checkSectionResources(father)"
-                        ng-if="father.status.tag != 'unlicensed'"
-                      >
-                        <md-switch
-                          class="auto-height no-margin"
-                          ng-model="father.allResourcesEnabled"
-                          ng-change="vm_pc.onChangeEnableAllResources(father)"
-                          aria-label="Enable all"
-                        ></md-switch>
-                        <md-button
-                          class="md-mini auto-width"
-                          aria-label="Manage"
-                          ng-click="vm_pc.manageResources(father)"
-                          ng-hide="father.permissions && !father.permissions.association"
-                        >
-                          <md-tooltip
-                            >{{'STAFF.PERMISSIONS_MANAGE' | translate}}
-                          </md-tooltip>
-                          <md-icon md-font-icon="icon-cog"></md-icon>
-                        </md-button>
-                      </md-card-actions>
-                      <md-card-header-text
-                        ng-if="father.status.tag === 'unlicensed'"
-                        layout-align="center end"
-                      >
-                        <span class="md-subhead red-A700-fg"
-                          >{{ father.status.name }}</span
-                        >
-                      </md-card-header-text>
-                    </md-card-header>
-                  </md-card>
-                </md-grid-tile>
-              </md-grid-list>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/staff/views/userProfiles/edit/view.html/view.html b/public/src/js/modules/main/apps/staff/views/userProfiles/edit/view.html/view.html
new file mode 100644
index 0000000..f060548
--- /dev/null
+++ b/public/src/js/modules/main/apps/staff/views/userProfiles/edit/view.html/view.html
@@ -0,0 +1,267 @@
+<div id="staff-userProfile" class="page-layout simple tabbed" layout="column">
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-userProfiles-button md-icon-button"
+        aria-label="Go to userProfiles"
+        ng-click="vm.gotoUserProfiles()"
+        translate
+        translate-attr-aria-label="STAFF.GO_TO_USERPROFILES"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="userProfile-image" hide-xs>
+          <img ng-src="assets/images/business/userProfiles.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.userProfile.id}}
+            <span ng-if="vm.userProfile.name">{{vm.userProfile.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="STAFF.CREATED_AT"></span>
+            <span>{{vm.userProfile.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div ng-cloak ng-if="vm.crudPermissions.canEdit">
+      <md-button
+        ng-click="vm.clonedialog(vm.userProfile, $event)"
+        class="md-fab md-amber-500-bg md-icon-button"
+        aria-label="clone"
+      >
+        <md-tooltip
+          ><span translate="STAFF.CLONE_USERPROFILE"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-content-duplicate"></md-icon>
+      </md-button>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveUserProfile()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (modulesForm.$invalid)"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="STAFF.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="userProfile-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="STAFF.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="STAFF.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.userProfile.name"
+                  ng-required="true"
+                  autofocus
+                  disabled
+                />
+
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.userProfile.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.CRUDPERMISSIONS">CrudPermissions</label>
+                <md-select
+                  name="crudPermissions"
+                  ng-model="vm.userProfile.crudPermissions"
+                  multiple
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'r'" disabled>
+                    {{ 'STAFF.READ_PERMISSION' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'e'">
+                    {{ 'STAFF.EDIT_PERMISSION' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'d'">
+                    {{ 'STAFF.DELETE_PERMISSION' | translate }}
+                  </md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['crudPermissions'].$error"
+                  ng-show="generalForm['crudPermissions'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.CRUDPERMISSIONS_REQUIRED"
+                      >CrudPermissions field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="STAFF.PERMISSIONS">PERMISSIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="userProfile-detail-form-container modules md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="STAFF.MODULES">
+                MODULES
+              </div>
+            </div>
+            <div
+              ng-controller="UserProfilePermissionsController as vm_pc"
+              ng-init="vm_pc.init(vm.userProfile, vm.license)"
+              class="userProfile-detail-form-container"
+            >
+              <md-grid-list
+                flex
+                md-cols-gt-xs="2"
+                md-cols-gt-sm="2"
+                md-cols-gt-md="4"
+                md-cols-gt-lg="6"
+                md-row-height-gt-xs="2:1"
+                md-row-height-gt-sm="2:1"
+                md-row-height-gt-md="3:1"
+                gt-xs-gutter="4px"
+                gt-sm-gutter="8px"
+                gt-md-gutter="8px"
+                gt-lg-gutter="16px"
+              >
+                <md-grid-tile
+                  ng-repeat="father in vm_pc.modules"
+                  ng-if="vm_pc.userProfile.role !== 'admin' && !father.permissions.hidden"
+                  md-colspan="2"
+                >
+                  <md-card
+                    flex-xs
+                    flex-gt-xs="90"
+                    layout="column"
+                    no-padding
+                    no-margin
+                  >
+                    <md-card-header>
+                      <md-card-avatar>
+                        <md-icon
+                          class="md-avatar-icon auto-size"
+                          md-font-icon="{{father.icon}}"
+                          ng-class="{ true: father.status.color }[true]"
+                        >
+                        </md-icon>
+                        <md-tooltip>{{ father.status.info }}</md-tooltip>
+                      </md-card-avatar>
+                      <md-card-header-text layout-align="center start">
+                        <span class="md-title" translate="{{father.translate}}"
+                          >{{ father.title }}</span
+                        >
+                      </md-card-header-text>
+                      <md-card-actions
+                        class="no-margin"
+                        layout="row"
+                        ng-init="vm_pc.checkSectionResources(father)"
+                        ng-if="father.status.tag != 'unlicensed'"
+                      >
+                        <md-switch
+                          class="auto-height no-margin"
+                          ng-model="father.allResourcesEnabled"
+                          ng-change="vm_pc.onChangeEnableAllResources(father)"
+                          aria-label="Enable all"
+                        ></md-switch>
+                        <md-button
+                          class="md-mini auto-width"
+                          aria-label="Manage"
+                          ng-click="vm_pc.manageResources(father)"
+                          ng-hide="father.permissions && !father.permissions.association"
+                        >
+                          <md-tooltip
+                            >{{'STAFF.PERMISSIONS_MANAGE' | translate}}
+                          </md-tooltip>
+                          <md-icon md-font-icon="icon-cog"></md-icon>
+                        </md-button>
+                      </md-card-actions>
+                      <md-card-header-text
+                        ng-if="father.status.tag === 'unlicensed'"
+                        layout-align="center end"
+                      >
+                        <span class="md-subhead red-A700-fg"
+                          >{{ father.status.name }}</span
+                        >
+                      </md-card-header-text>
+                    </md-card-header>
+                  </md-card>
+                </md-grid-tile>
+              </md-grid-list>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/staff/views/userProfiles/userProfiles.html/userProfiles-[chunkhash].html b/public/src/js/modules/main/apps/staff/views/userProfiles/userProfiles.html/userProfiles-[chunkhash].html
deleted file mode 100644
index a9cec65..0000000
--- a/public/src/js/modules/main/apps/staff/views/userProfiles/userProfiles.html/userProfiles-[chunkhash].html
+++ /dev/null
@@ -1,266 +0,0 @@
-<div id="staff-userProfile" class="page-layout simple tabbed" layout="column">
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-userProfiles-button md-icon-button"
-        aria-label="Go to userProfiles"
-        ng-click="vm.gotoUserProfiles()"
-        translate
-        translate-attr-aria-label="STAFF.GO_TO_USERPROFILES"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="userProfile-image" hide-xs>
-          <img ng-src="assets/images/business/userProfiles.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.userProfile.id}}
-            <span ng-if="vm.userProfile.name">{{vm.userProfile.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="STAFF.CREATED_AT"></span>
-            <span>{{vm.userProfile.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div ng-cloak ng-if="vm.crudPermissions.canEdit">
-      <md-button
-        ng-click="vm.clonedialog(vm.userProfile, $event)"
-        class="md-fab md-amber-500-bg md-icon-button"
-        aria-label="clone"
-      >
-        <md-tooltip
-          ><span translate="STAFF.CLONE_USERPROFILE"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-content-duplicate"></md-icon>
-      </md-button>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveUserProfile()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (modulesForm.$invalid)"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="STAFF.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="userProfile-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="STAFF.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="STAFF.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.userProfile.name"
-                  ng-required="true"
-                  autofocus
-                  disabled
-                />
-
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.userProfile.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.CRUDPERMISSIONS">CrudPermissions</label>
-                <md-select
-                  name="crudPermissions"
-                  ng-model="vm.userProfile.crudPermissions"
-                  multiple
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'r'" disabled>
-                    {{ 'STAFF.READ_PERMISSION' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'e'">
-                    {{ 'STAFF.EDIT_PERMISSION' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'d'">
-                    {{ 'STAFF.DELETE_PERMISSION' | translate }}
-                  </md-option>
-                </md-select>
-                <div
-                  ng-messages="generalForm['crudPermissions'].$error"
-                  ng-show="generalForm['crudPermissions'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.CRUDPERMISSIONS_REQUIRED"
-                      >CrudPermissions field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="STAFF.PERMISSIONS">PERMISSIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="userProfile-detail-form-container modules md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="STAFF.MODULES">
-                MODULES
-              </div>
-            </div>
-            <div
-              ng-controller="UserProfilePermissionsController as vm_pc"
-              ng-init="vm_pc.init(vm.userProfile, vm.license)"
-              class="userProfile-detail-form-container"
-            >
-              <md-grid-list
-                flex
-                md-cols-gt-xs="2"
-                md-cols-gt-sm="2"
-                md-cols-gt-md="4"
-                md-cols-gt-lg="6"
-                md-row-height-gt-xs="2:1"
-                md-row-height-gt-sm="2:1"
-                md-row-height-gt-md="3:1"
-                gt-xs-gutter="4px"
-                gt-sm-gutter="8px"
-                gt-md-gutter="8px"
-                gt-lg-gutter="16px"
-              >
-                <md-grid-tile
-                  ng-repeat="father in vm_pc.modules"
-                  ng-if="vm_pc.userProfile.role !== 'admin' && !father.permissions.hidden"
-                  md-colspan="2"
-                >
-                  <md-card
-                    flex-xs
-                    flex-gt-xs="90"
-                    layout="column"
-                    no-padding
-                    no-margin
-                  >
-                    <md-card-header>
-                      <md-card-avatar>
-                        <md-icon
-                          class="md-avatar-icon auto-size"
-                          md-font-icon="{{father.icon}}"
-                          ng-class="{ true: father.status.color }[true]"
-                        ></md-icon>
-                        <md-tooltip>{{ father.status.info }}</md-tooltip>
-                      </md-card-avatar>
-                      <md-card-header-text layout-align="center start">
-                        <span class="md-title" translate="{{father.translate}}"
-                          >{{ father.title }}</span
-                        >
-                      </md-card-header-text>
-                      <md-card-actions
-                        class="no-margin"
-                        layout="row"
-                        ng-init="vm_pc.checkSectionResources(father)"
-                        ng-if="father.status.tag != 'unlicensed'"
-                      >
-                        <md-switch
-                          class="auto-height no-margin"
-                          ng-model="father.allResourcesEnabled"
-                          ng-change="vm_pc.onChangeEnableAllResources(father)"
-                          aria-label="Enable all"
-                        ></md-switch>
-                        <md-button
-                          class="md-mini auto-width"
-                          aria-label="Manage"
-                          ng-click="vm_pc.manageResources(father)"
-                          ng-hide="father.permissions && !father.permissions.association"
-                        >
-                          <md-tooltip
-                            >{{'STAFF.PERMISSIONS_MANAGE' | translate}}
-                          </md-tooltip>
-                          <md-icon md-font-icon="icon-cog"></md-icon>
-                        </md-button>
-                      </md-card-actions>
-                      <md-card-header-text
-                        ng-if="father.status.tag === 'unlicensed'"
-                        layout-align="center end"
-                      >
-                        <span class="md-subhead red-A700-fg"
-                          >{{ father.status.name }}</span
-                        >
-                      </md-card-header-text>
-                    </md-card-header>
-                  </md-card>
-                </md-grid-tile>
-              </md-grid-list>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/staff/views/userProfiles/userProfiles.html/userProfiles.html b/public/src/js/modules/main/apps/staff/views/userProfiles/userProfiles.html/userProfiles.html
new file mode 100644
index 0000000..a9cec65
--- /dev/null
+++ b/public/src/js/modules/main/apps/staff/views/userProfiles/userProfiles.html/userProfiles.html
@@ -0,0 +1,266 @@
+<div id="staff-userProfile" class="page-layout simple tabbed" layout="column">
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-userProfiles-button md-icon-button"
+        aria-label="Go to userProfiles"
+        ng-click="vm.gotoUserProfiles()"
+        translate
+        translate-attr-aria-label="STAFF.GO_TO_USERPROFILES"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="userProfile-image" hide-xs>
+          <img ng-src="assets/images/business/userProfiles.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.userProfile.id}}
+            <span ng-if="vm.userProfile.name">{{vm.userProfile.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="STAFF.CREATED_AT"></span>
+            <span>{{vm.userProfile.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div ng-cloak ng-if="vm.crudPermissions.canEdit">
+      <md-button
+        ng-click="vm.clonedialog(vm.userProfile, $event)"
+        class="md-fab md-amber-500-bg md-icon-button"
+        aria-label="clone"
+      >
+        <md-tooltip
+          ><span translate="STAFF.CLONE_USERPROFILE"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-content-duplicate"></md-icon>
+      </md-button>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveUserProfile()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (modulesForm.$invalid)"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="STAFF.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="userProfile-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="STAFF.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="STAFF.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.userProfile.name"
+                  ng-required="true"
+                  autofocus
+                  disabled
+                />
+
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.userProfile.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.CRUDPERMISSIONS">CrudPermissions</label>
+                <md-select
+                  name="crudPermissions"
+                  ng-model="vm.userProfile.crudPermissions"
+                  multiple
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'r'" disabled>
+                    {{ 'STAFF.READ_PERMISSION' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'e'">
+                    {{ 'STAFF.EDIT_PERMISSION' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'d'">
+                    {{ 'STAFF.DELETE_PERMISSION' | translate }}
+                  </md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['crudPermissions'].$error"
+                  ng-show="generalForm['crudPermissions'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.CRUDPERMISSIONS_REQUIRED"
+                      >CrudPermissions field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="STAFF.PERMISSIONS">PERMISSIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="userProfile-detail-form-container modules md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="STAFF.MODULES">
+                MODULES
+              </div>
+            </div>
+            <div
+              ng-controller="UserProfilePermissionsController as vm_pc"
+              ng-init="vm_pc.init(vm.userProfile, vm.license)"
+              class="userProfile-detail-form-container"
+            >
+              <md-grid-list
+                flex
+                md-cols-gt-xs="2"
+                md-cols-gt-sm="2"
+                md-cols-gt-md="4"
+                md-cols-gt-lg="6"
+                md-row-height-gt-xs="2:1"
+                md-row-height-gt-sm="2:1"
+                md-row-height-gt-md="3:1"
+                gt-xs-gutter="4px"
+                gt-sm-gutter="8px"
+                gt-md-gutter="8px"
+                gt-lg-gutter="16px"
+              >
+                <md-grid-tile
+                  ng-repeat="father in vm_pc.modules"
+                  ng-if="vm_pc.userProfile.role !== 'admin' && !father.permissions.hidden"
+                  md-colspan="2"
+                >
+                  <md-card
+                    flex-xs
+                    flex-gt-xs="90"
+                    layout="column"
+                    no-padding
+                    no-margin
+                  >
+                    <md-card-header>
+                      <md-card-avatar>
+                        <md-icon
+                          class="md-avatar-icon auto-size"
+                          md-font-icon="{{father.icon}}"
+                          ng-class="{ true: father.status.color }[true]"
+                        ></md-icon>
+                        <md-tooltip>{{ father.status.info }}</md-tooltip>
+                      </md-card-avatar>
+                      <md-card-header-text layout-align="center start">
+                        <span class="md-title" translate="{{father.translate}}"
+                          >{{ father.title }}</span
+                        >
+                      </md-card-header-text>
+                      <md-card-actions
+                        class="no-margin"
+                        layout="row"
+                        ng-init="vm_pc.checkSectionResources(father)"
+                        ng-if="father.status.tag != 'unlicensed'"
+                      >
+                        <md-switch
+                          class="auto-height no-margin"
+                          ng-model="father.allResourcesEnabled"
+                          ng-change="vm_pc.onChangeEnableAllResources(father)"
+                          aria-label="Enable all"
+                        ></md-switch>
+                        <md-button
+                          class="md-mini auto-width"
+                          aria-label="Manage"
+                          ng-click="vm_pc.manageResources(father)"
+                          ng-hide="father.permissions && !father.permissions.association"
+                        >
+                          <md-tooltip
+                            >{{'STAFF.PERMISSIONS_MANAGE' | translate}}
+                          </md-tooltip>
+                          <md-icon md-font-icon="icon-cog"></md-icon>
+                        </md-button>
+                      </md-card-actions>
+                      <md-card-header-text
+                        ng-if="father.status.tag === 'unlicensed'"
+                        layout-align="center end"
+                      >
+                        <span class="md-subhead red-A700-fg"
+                          >{{ father.status.name }}</span
+                        >
+                      </md-card-header-text>
+                    </md-card-header>
+                  </md-card>
+                </md-grid-tile>
+              </md-grid-list>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/staff/views/users/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/staff/views/users/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index aaff1d2..0000000
--- a/public/src/js/modules/main/apps/staff/views/users/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,336 +0,0 @@
-<md-dialog class="user-dialog" aria-label="New User">
-  <form name="userForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="STAFF.ROLE">Role</label>
-        <md-select
-          name="role"
-          ng-model="vm.user.role"
-          autofocus
-          required
-          ng-disabled="!vm.newUser"
-        >
-          <md-option ng-value="'admin'">Admin</md-option>
-          <md-option ng-value="'user'">User</md-option>
-        </md-select>
-        <div
-          ng-messages="userForm['role'].$error"
-          ng-show="userForm['role'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.ROLE_REQUIRED"
-              >Role field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container ng-if="vm.user.role === 'user'" class="md-block">
-        <label translate="STAFF.USERPROFILE">UserProfile</label>
-        <md-select
-          name="userProfileId"
-          ng-model="vm.user.userProfileId"
-          required
-        >
-          <md-option
-            ng-value="userProfileId.id"
-            ng-repeat="userProfileId in vm.userProfiles"
-            ng-disabled="userProfileId.canSelect === false"
-            >{{ userProfileId.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="userForm['userProfileId'].$error"
-          ng-show="userForm['userProfileId'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.USERPROFILE_REQUIRED"
-              >UserProfile field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="STAFF.FULLNAME">Fullname</label>
-        <input
-          type="text"
-          name="fullname"
-          ng-model="vm.user.fullname"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="userForm['fullname'].$error"
-          ng-show="userForm['fullname'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.FULLNAME_REQUIRED"
-              >Fullname field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="STAFF.USERNAME">Username</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.user.name"
-          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-          ng-required="true"
-          ng-disabled="!vm.newUser"
-        />
-
-        <div class="hint"><span translate="STAFF.HELP.USERNAME"></span></div>
-        <div
-          ng-messages="userForm['name'].$error"
-          ng-show="userForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.USERNAME_REQUIRED"
-              >Username field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span
-              translate="STAFF.ERRORS.USERNAME_MUST_VALID_PATTERN"
-              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-              >Username must be valid pattern
-            </span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="STAFF.EMAIL">Email</label>
-        <input
-          type="email"
-          name="email"
-          ng-model="vm.user.email"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="userForm['email'].$error"
-          ng-show="userForm['email'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.EMAIL_REQUIRED"
-              >Email field is required</span
-            >
-          </div>
-          <div ng-message="email">
-            <span translate="STAFF.ERRORS.EMAIL_MUST_VALID"
-              >Email must be a valid e-mail address</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block" ng-if="vm.newUser">
-        <label translate="STAFF.PASSWORD">Password</label>
-        <input
-          type="password"
-          name="password"
-          ng-model="vm.user.password"
-          placeholder="Password"
-          ng-pattern="vm.passwordPattern"
-          translate
-          translate-attr-placeholder="STAFF.PASSWORD"
-          required
-        />
-        <div ng-messages="userForm['password'].$error" role="alert">
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.PASSWORD_REQUIRED"
-              >Password field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span translate="STAFF.ERRORS.SECURE_PASSWORD_PATTERN"
-              >Must contain at least 8 characters, with a minimum of 1 lowercase
-              letter, 1 uppercase letter, 1 numeric character and 1 special
-              character ~!?*@#$%^&-_=+[{]}.</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <md-input-container class="md-block" ng-if="vm.newUser  && (vm.newUser)">
-        <label translate="STAFF.CONFIRM_PASSWORD">Confirm Password</label>
-        <input
-          type="password"
-          match-password="password"
-          name="confirmPassword"
-          ng-model="confirmPassword"
-          required
-        />
-        <div
-          ng-messages="userForm.confirmPassword.$error"
-          role="alert"
-          multiple
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.CONFIRM_REQUIRED"
-              >Confirm field is required</span
-            >
-          </div>
-          <div ng-message="passwordMatch">
-            <span translate="STAFF.ERRORS.CONFIRM_NOT_MATCH"
-              >Your password did not match</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <md-input-container class="md-block">
-        <label translate="STAFF.DESCRIPTION">Description</label>
-        <input type="text" name="description" ng-model="vm.user.description" />
-
-        <div
-          ng-messages="userForm['description'].$error"
-          ng-show="userForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container ng-if="vm.newUser" class="md-block">
-        <md-switch ng-model="vm.user.autointernal" aria-label="AutoInternal"
-          ><span translate="STAFF.AUTOINTERNAL">AutoInternal</span></md-switch
-        >
-      </md-input-container>
-      <md-input-container ng-if="!vm.user.autointernal" class="md-block">
-        <label translate="STAFF.INTERNAL">Internal</label>
-        <input
-          type="text"
-          name="internal"
-          ng-model="vm.user.internal"
-          ng-required="true"
-          ng-disabled="!vm.newUser"
-        />
-
-        <div
-          ng-messages="userForm['internal'].$error"
-          ng-show="userForm['internal'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.INTERNAL_REQUIRED"
-              >Internal field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newUser"
-          ng-click="vm.saveUser()"
-          class="send-button md-accent md-raised"
-          ng-disabled="userForm.$invalid || userForm.$pristine"
-          aria-label="SAVE"
-          translate="STAFF.SAVE"
-          translate-attr-aria-label="STAFF.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newUser"
-          ng-click="vm.addNewUser()"
-          class="send-button md-accent md-raised"
-          ng-disabled="userForm.$invalid"
-          aria-label="ADD"
-          translate="STAFF.ADD_USER"
-          translate-attr-aria-label="STAFF.ADD_USER"
-        >
-          ADD USER
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newUser"
-          ng-click="vm.deleteUser($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="STAFF.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="STAFF.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/staff/views/users/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/staff/views/users/create/dialog.html/dialog.html
new file mode 100644
index 0000000..aaff1d2
--- /dev/null
+++ b/public/src/js/modules/main/apps/staff/views/users/create/dialog.html/dialog.html
@@ -0,0 +1,336 @@
+<md-dialog class="user-dialog" aria-label="New User">
+  <form name="userForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="STAFF.ROLE">Role</label>
+        <md-select
+          name="role"
+          ng-model="vm.user.role"
+          autofocus
+          required
+          ng-disabled="!vm.newUser"
+        >
+          <md-option ng-value="'admin'">Admin</md-option>
+          <md-option ng-value="'user'">User</md-option>
+        </md-select>
+        <div
+          ng-messages="userForm['role'].$error"
+          ng-show="userForm['role'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.ROLE_REQUIRED"
+              >Role field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container ng-if="vm.user.role === 'user'" class="md-block">
+        <label translate="STAFF.USERPROFILE">UserProfile</label>
+        <md-select
+          name="userProfileId"
+          ng-model="vm.user.userProfileId"
+          required
+        >
+          <md-option
+            ng-value="userProfileId.id"
+            ng-repeat="userProfileId in vm.userProfiles"
+            ng-disabled="userProfileId.canSelect === false"
+            >{{ userProfileId.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="userForm['userProfileId'].$error"
+          ng-show="userForm['userProfileId'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.USERPROFILE_REQUIRED"
+              >UserProfile field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="STAFF.FULLNAME">Fullname</label>
+        <input
+          type="text"
+          name="fullname"
+          ng-model="vm.user.fullname"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="userForm['fullname'].$error"
+          ng-show="userForm['fullname'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.FULLNAME_REQUIRED"
+              >Fullname field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="STAFF.USERNAME">Username</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.user.name"
+          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+          ng-required="true"
+          ng-disabled="!vm.newUser"
+        />
+
+        <div class="hint"><span translate="STAFF.HELP.USERNAME"></span></div>
+        <div
+          ng-messages="userForm['name'].$error"
+          ng-show="userForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.USERNAME_REQUIRED"
+              >Username field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span
+              translate="STAFF.ERRORS.USERNAME_MUST_VALID_PATTERN"
+              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+              >Username must be valid pattern
+            </span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="STAFF.EMAIL">Email</label>
+        <input
+          type="email"
+          name="email"
+          ng-model="vm.user.email"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="userForm['email'].$error"
+          ng-show="userForm['email'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.EMAIL_REQUIRED"
+              >Email field is required</span
+            >
+          </div>
+          <div ng-message="email">
+            <span translate="STAFF.ERRORS.EMAIL_MUST_VALID"
+              >Email must be a valid e-mail address</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block" ng-if="vm.newUser">
+        <label translate="STAFF.PASSWORD">Password</label>
+        <input
+          type="password"
+          name="password"
+          ng-model="vm.user.password"
+          placeholder="Password"
+          ng-pattern="vm.passwordPattern"
+          translate
+          translate-attr-placeholder="STAFF.PASSWORD"
+          required
+        />
+        <div ng-messages="userForm['password'].$error" role="alert">
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.PASSWORD_REQUIRED"
+              >Password field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span translate="STAFF.ERRORS.SECURE_PASSWORD_PATTERN"
+              >Must contain at least 8 characters, with a minimum of 1 lowercase
+              letter, 1 uppercase letter, 1 numeric character and 1 special
+              character ~!?*@#$%^&-_=+[{]}.</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <md-input-container class="md-block" ng-if="vm.newUser  && (vm.newUser)">
+        <label translate="STAFF.CONFIRM_PASSWORD">Confirm Password</label>
+        <input
+          type="password"
+          match-password="password"
+          name="confirmPassword"
+          ng-model="confirmPassword"
+          required
+        />
+        <div
+          ng-messages="userForm.confirmPassword.$error"
+          role="alert"
+          multiple
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.CONFIRM_REQUIRED"
+              >Confirm field is required</span
+            >
+          </div>
+          <div ng-message="passwordMatch">
+            <span translate="STAFF.ERRORS.CONFIRM_NOT_MATCH"
+              >Your password did not match</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <md-input-container class="md-block">
+        <label translate="STAFF.DESCRIPTION">Description</label>
+        <input type="text" name="description" ng-model="vm.user.description" />
+
+        <div
+          ng-messages="userForm['description'].$error"
+          ng-show="userForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container ng-if="vm.newUser" class="md-block">
+        <md-switch ng-model="vm.user.autointernal" aria-label="AutoInternal"
+          ><span translate="STAFF.AUTOINTERNAL">AutoInternal</span></md-switch
+        >
+      </md-input-container>
+      <md-input-container ng-if="!vm.user.autointernal" class="md-block">
+        <label translate="STAFF.INTERNAL">Internal</label>
+        <input
+          type="text"
+          name="internal"
+          ng-model="vm.user.internal"
+          ng-required="true"
+          ng-disabled="!vm.newUser"
+        />
+
+        <div
+          ng-messages="userForm['internal'].$error"
+          ng-show="userForm['internal'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.INTERNAL_REQUIRED"
+              >Internal field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newUser"
+          ng-click="vm.saveUser()"
+          class="send-button md-accent md-raised"
+          ng-disabled="userForm.$invalid || userForm.$pristine"
+          aria-label="SAVE"
+          translate="STAFF.SAVE"
+          translate-attr-aria-label="STAFF.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newUser"
+          ng-click="vm.addNewUser()"
+          class="send-button md-accent md-raised"
+          ng-disabled="userForm.$invalid"
+          aria-label="ADD"
+          translate="STAFF.ADD_USER"
+          translate-attr-aria-label="STAFF.ADD_USER"
+        >
+          ADD USER
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newUser"
+          ng-click="vm.deleteUser($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="STAFF.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="STAFF.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/staff/views/users/edit/apikeymanager/apikeymanager.html/apikeymanager-[chunkhash].html b/public/src/js/modules/main/apps/staff/views/users/edit/apikeymanager/apikeymanager.html/apikeymanager-[chunkhash].html
deleted file mode 100644
index 5507f36..0000000
--- a/public/src/js/modules/main/apps/staff/views/users/edit/apikeymanager/apikeymanager.html/apikeymanager-[chunkhash].html
+++ /dev/null
@@ -1,53 +0,0 @@
-<md-dialog class="user-dialog" aria-label="{{vm.name}}">
-  <form name="userForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ ' STAFF.MANAGE_API_KEY' | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-card layout-fill layout-padding>
-      <textarea
-        class="api-key-area"
-        ng-model="vm.user.apiKey"
-        rows="6"
-        disabled
-      ></textarea>
-    </md-card>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-click="vm.generateApiKey()"
-          class="send-button md-accent md-raised"
-          aria-label="Generate"
-          translate="{{ vm.user.apiKey === 'N/A' ? 'STAFF.GENERATE' : 'STAFF.REGENERATE' }}"
-          translate-attr-aria-label="STAFF.GENERATE"
-        >
-          Generate
-        </md-button>
-        <md-button
-          type="submit"
-          ng-click="vm.removeApiKey()"
-          class="send-button md-accent md-raised"
-          aria-label="Remove"
-          translate="STAFF.REMOVE"
-          translate-attr-aria-label="STAFF.DELETE"
-        >
-          Delete
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/staff/views/users/edit/apikeymanager/apikeymanager.html/apikeymanager.html b/public/src/js/modules/main/apps/staff/views/users/edit/apikeymanager/apikeymanager.html/apikeymanager.html
new file mode 100644
index 0000000..5507f36
--- /dev/null
+++ b/public/src/js/modules/main/apps/staff/views/users/edit/apikeymanager/apikeymanager.html/apikeymanager.html
@@ -0,0 +1,53 @@
+<md-dialog class="user-dialog" aria-label="{{vm.name}}">
+  <form name="userForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ ' STAFF.MANAGE_API_KEY' | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-card layout-fill layout-padding>
+      <textarea
+        class="api-key-area"
+        ng-model="vm.user.apiKey"
+        rows="6"
+        disabled
+      ></textarea>
+    </md-card>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-click="vm.generateApiKey()"
+          class="send-button md-accent md-raised"
+          aria-label="Generate"
+          translate="{{ vm.user.apiKey === 'N/A' ? 'STAFF.GENERATE' : 'STAFF.REGENERATE' }}"
+          translate-attr-aria-label="STAFF.GENERATE"
+        >
+          Generate
+        </md-button>
+        <md-button
+          type="submit"
+          ng-click="vm.removeApiKey()"
+          class="send-button md-accent md-raised"
+          aria-label="Remove"
+          translate="STAFF.REMOVE"
+          translate-attr-aria-label="STAFF.DELETE"
+        >
+          Delete
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/staff/views/users/edit/changepassword/changepassword.html/changepassword-[chunkhash].html b/public/src/js/modules/main/apps/staff/views/users/edit/changepassword/changepassword.html/changepassword-[chunkhash].html
deleted file mode 100644
index feda915..0000000
--- a/public/src/js/modules/main/apps/staff/views/users/edit/changepassword/changepassword.html/changepassword-[chunkhash].html
+++ /dev/null
@@ -1,158 +0,0 @@
-<md-dialog class="user-dialog" aria-label="{{vm.name}}">
-  <form name="userForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ ' STAFF.CHANGE_PASSWORD' | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container
-        class="md-block"
-        ng-if="vm.currentUser.id == vm.user.id"
-      >
-        <label translate="STAFF.OLD_PASSWORD">Old Password</label>
-        <input
-          type="password"
-          name="oldPassword"
-          ng-model="vm.oldPassword"
-          placeholder="Password"
-          translate
-          translate-attr-placeholder="STAFF.OLD_PASSWORD"
-          required
-        />
-        <div ng-messages="userForm.oldPassword.$error" role="alert">
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.PASSWORD_REQUIRED"
-              >Password field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="STAFF.NEW_PASSWORD">New Password</label>
-        <input
-          type="password"
-          name="password"
-          ng-model="vm.password"
-          placeholder="Password"
-          translate
-          ng-pattern="vm.passwordPattern"
-          translate-attr-placeholder="STAFF.NEW_PASSWORD"
-          required
-        />
-        <div ng-messages="userForm.password.$error" role="alert">
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.PASSWORD_REQUIRED"
-              >Password field is required</span
-            >
-          </div>
-
-          <div ng-message="pattern">
-            <span translate="STAFF.ERRORS.SECURE_PASSWORD_PATTERN"
-              >Must contain at least 8 characters, with a minimum of 1 lowercase
-              letter, 1 uppercase letter, 1 numeric character and 1 special
-              character ~!?*@#$%^&-_=+[{]}.</span
-            >
-          </div>
-          <div ng-message="oldPasswordMatch">
-            <span translate="STAFF.ERRORS.PASSWORD_OLDPASSWORD_MATCH"
-              >New password must be different from old one</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="STAFF.CONFIRM_PASSWORD">Confirm Password</label>
-        <input
-          type="password"
-          match-password="password"
-          name="confirmPassword"
-          ng-model="confirmPassword"
-        />
-        <div
-          ng-messages="userForm.confirmPassword.$error"
-          role="alert"
-          multiple
-        >
-          <div ng-message="required">
-            <span translate="STAFF.ERRORS.CONFIRM_REQUIRED"
-              >Confirm field is required</span
-            >
-          </div>
-          <div ng-message="passwordMatch">
-            <span translate="STAFF.ERRORS.CONFIRM_NOT_MATCH"
-              >Your password did not match</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-click="vm.savePassword()"
-          class="send-button md-accent md-raised"
-          ng-disabled="userForm.$invalid || userForm.$pristine"
-          aria-label="SAVE"
-          translate="STAFF.SAVE"
-          translate-attr-aria-label="STAFF.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/staff/views/users/edit/changepassword/changepassword.html/changepassword.html b/public/src/js/modules/main/apps/staff/views/users/edit/changepassword/changepassword.html/changepassword.html
new file mode 100644
index 0000000..feda915
--- /dev/null
+++ b/public/src/js/modules/main/apps/staff/views/users/edit/changepassword/changepassword.html/changepassword.html
@@ -0,0 +1,158 @@
+<md-dialog class="user-dialog" aria-label="{{vm.name}}">
+  <form name="userForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ ' STAFF.CHANGE_PASSWORD' | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container
+        class="md-block"
+        ng-if="vm.currentUser.id == vm.user.id"
+      >
+        <label translate="STAFF.OLD_PASSWORD">Old Password</label>
+        <input
+          type="password"
+          name="oldPassword"
+          ng-model="vm.oldPassword"
+          placeholder="Password"
+          translate
+          translate-attr-placeholder="STAFF.OLD_PASSWORD"
+          required
+        />
+        <div ng-messages="userForm.oldPassword.$error" role="alert">
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.PASSWORD_REQUIRED"
+              >Password field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="STAFF.NEW_PASSWORD">New Password</label>
+        <input
+          type="password"
+          name="password"
+          ng-model="vm.password"
+          placeholder="Password"
+          translate
+          ng-pattern="vm.passwordPattern"
+          translate-attr-placeholder="STAFF.NEW_PASSWORD"
+          required
+        />
+        <div ng-messages="userForm.password.$error" role="alert">
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.PASSWORD_REQUIRED"
+              >Password field is required</span
+            >
+          </div>
+
+          <div ng-message="pattern">
+            <span translate="STAFF.ERRORS.SECURE_PASSWORD_PATTERN"
+              >Must contain at least 8 characters, with a minimum of 1 lowercase
+              letter, 1 uppercase letter, 1 numeric character and 1 special
+              character ~!?*@#$%^&-_=+[{]}.</span
+            >
+          </div>
+          <div ng-message="oldPasswordMatch">
+            <span translate="STAFF.ERRORS.PASSWORD_OLDPASSWORD_MATCH"
+              >New password must be different from old one</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="STAFF.CONFIRM_PASSWORD">Confirm Password</label>
+        <input
+          type="password"
+          match-password="password"
+          name="confirmPassword"
+          ng-model="confirmPassword"
+        />
+        <div
+          ng-messages="userForm.confirmPassword.$error"
+          role="alert"
+          multiple
+        >
+          <div ng-message="required">
+            <span translate="STAFF.ERRORS.CONFIRM_REQUIRED"
+              >Confirm field is required</span
+            >
+          </div>
+          <div ng-message="passwordMatch">
+            <span translate="STAFF.ERRORS.CONFIRM_NOT_MATCH"
+              >Your password did not match</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-click="vm.savePassword()"
+          class="send-button md-accent md-raised"
+          ng-disabled="userForm.$invalid || userForm.$pristine"
+          aria-label="SAVE"
+          translate="STAFF.SAVE"
+          translate-attr-aria-label="STAFF.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/staff/views/users/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/staff/views/users/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index 042a3fd..0000000
--- a/public/src/js/modules/main/apps/staff/views/users/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,772 +0,0 @@
-<div id="staff-user" class="page-layout simple tabbed" layout="column">
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-users-button md-icon-button"
-        aria-label="Go to users"
-        ng-click="vm.gotoUsers()"
-        translate
-        translate-attr-aria-label="STAFF.GO_TO_USERS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="user-image" hide-xs>
-          <img ng-src="assets/images/business/users.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.user.id}}
-            <span ng-if="vm.user.name">{{vm.user.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="STAFF.CREATED_AT"></span>
-            <span>{{vm.user.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div ng-cloak ng-if="vm.crudPermissions.canEdit">
-      <md-button
-        ng-click="vm.apikeymanagerdialog(vm.user, $event)"
-        class="md-fab md-orange-500-bg md-icon-button"
-        aria-label="apikeymanager"
-      >
-        <md-tooltip
-          ><span translate="STAFF.APIKEYMANAGER_USER"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="fab fa-hubspot"></md-icon>
-      </md-button>
-    </div>
-
-    <div ng-cloak ng-if="vm.crudPermissions.canEdit">
-      <md-button
-        ng-click="vm.changepassworddialog(vm.user, $event)"
-        class="md-fab md-warn md-icon-button"
-        aria-label="changepassword"
-      >
-        <md-tooltip
-          ><span translate="STAFF.CHANGEPASSWORD_USER"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-key-variant"></md-icon>
-      </md-button>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveUser()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(personal_infoForm.$invalid) || (security_suiteForm.$invalid) || (change_avatarForm.$invalid) || (generalForm.$invalid)"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="STAFF.ACCOUNT">ACCOUNT</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="user-detail-form-container personal_info md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="STAFF.PERSONAL_INFO">
-                PERSONAL_INFO
-              </div>
-            </div>
-            <form name="personal_infoForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="STAFF.ROLE">Role</label>
-                <md-select
-                  name="role"
-                  ng-model="vm.user.role"
-                  autofocus
-                  required
-                  disabled
-                >
-                  <md-option ng-value="'admin'">Admin</md-option>
-                  <md-option ng-value="'user'">User</md-option>
-                </md-select>
-                <div
-                  ng-messages="personal_infoForm['role'].$error"
-                  ng-show="personal_infoForm['role'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.ROLE_REQUIRED"
-                      >Role field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.user.role === 'user'"
-                class="md-block"
-              >
-                <label translate="STAFF.USERPROFILE">UserProfile</label>
-                <md-select
-                  name="userProfileId"
-                  ng-model="vm.user.userProfileId"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="userProfileId.id"
-                    ng-repeat="userProfileId in vm.userProfiles"
-                    ng-disabled="userProfileId.canSelect === false"
-                    >{{ userProfileId.name }}</md-option
-                  >
-                </md-select>
-                <div
-                  ng-messages="personal_infoForm['userProfileId'].$error"
-                  ng-show="personal_infoForm['userProfileId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.USERPROFILE_REQUIRED"
-                      >UserProfile field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.FULLNAME">Fullname</label>
-                <input
-                  type="text"
-                  name="fullname"
-                  ng-model="vm.user.fullname"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="personal_infoForm['fullname'].$error"
-                  ng-show="personal_infoForm['fullname'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.FULLNAME_REQUIRED"
-                      >Fullname field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.USERNAME">Username</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.user.name"
-                  ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-                  ng-required="true"
-                  disabled
-                />
-
-                <div class="hint">
-                  <span translate="STAFF.HELP.USERNAME"></span>
-                </div>
-                <div
-                  ng-messages="personal_infoForm['name'].$error"
-                  ng-show="personal_infoForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.USERNAME_REQUIRED"
-                      >Username field is required</span
-                    >
-                  </div>
-                  <div ng-message="pattern">
-                    <span
-                      translate="STAFF.ERRORS.USERNAME_MUST_VALID_PATTERN"
-                      translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-                      >Username must be valid pattern
-                    </span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.EMAIL">Email</label>
-                <input
-                  type="email"
-                  name="email"
-                  ng-model="vm.user.email"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="personal_infoForm['email'].$error"
-                  ng-show="personal_infoForm['email'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.EMAIL_REQUIRED"
-                      >Email field is required</span
-                    >
-                  </div>
-                  <div ng-message="email">
-                    <span translate="STAFF.ERRORS.EMAIL_MUST_VALID"
-                      >Email must be a valid e-mail address</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.PHONE">Phone</label>
-                <input
-                  type="text"
-                  name="phone"
-                  ng-model="vm.user.phone"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="personal_infoForm['phone'].$error"
-                  ng-show="personal_infoForm['phone'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.PHONE_REQUIRED"
-                      >Phone field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.MOBILE">Mobile</label>
-                <input
-                  type="text"
-                  name="mobile"
-                  ng-model="vm.user.mobile"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="personal_infoForm['mobile'].$error"
-                  ng-show="personal_infoForm['mobile'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.MOBILE_REQUIRED"
-                      >Mobile field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.user.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="personal_infoForm['description'].$error"
-                  ng-show="personal_infoForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="user-detail-form-container security_suite md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="STAFF.SECURITY_SUITE">
-                SECURITY_SUITE
-              </div>
-            </div>
-            <form name="security_suiteForm" novalidate>
-              <md-input-container
-                ng-if="vm.user.passwordResetAt != null"
-                class="md-block"
-              >
-                <label translate="STAFF.LAST_PASSWORD_RESET_AT"
-                  >Last_Password_Reset_At</label
-                >
-                <input
-                  type="text"
-                  name="passwordResetAt"
-                  ng-model="vm.user.passwordResetAt"
-                  autofocus
-                  disabled
-                />
-
-                <div class="hint">
-                  <span translate="STAFF.HELP.LAST_PASSWORD_RESET_AT"></span>
-                </div>
-                <div
-                  ng-messages="security_suiteForm['passwordResetAt'].$error"
-                  ng-show="security_suiteForm['passwordResetAt'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="STAFF.ERRORS.LAST_PASSWORD_RESET_AT_REQUIRED"
-                      >Last_Password_Reset_At field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.user.passwordResetAt == null"
-                class="md-block"
-              >
-                <label translate="STAFF.NO_PASSWORD_CHANGE"
-                  >No_Password_Change</label
-                >
-                <input
-                  type="text"
-                  name="passwordResetAt"
-                  ng-model="vm.user.passwordResetAt"
-                  disabled
-                />
-
-                <div
-                  ng-messages="security_suiteForm['passwordResetAt'].$error"
-                  ng-show="security_suiteForm['passwordResetAt'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.NO_PASSWORD_CHANGE_REQUIRED"
-                      >No_Password_Change field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.APIKEY">ApiKey</label>
-                <div layout="row" layout-align="center center">
-                  <button
-                    class="md-button md-fab md-mini md-primary"
-                    ngclipboard
-                    data-clipboard-target="#copytoclipboard-apiKey"
-                    ngclipboard-success="vm.alert({title: 'copied to clipboard', msg: e.text});"
-                    ngclipboard-error="vm.alert({title: 'error', msg: 'copy to clipboard failed'});"
-                  >
-                    <md-icon md-font-icon="icon-clipboard-text"></md-icon>
-                  </button>
-                  <input
-                    class="md-input"
-                    type="text"
-                    id="copytoclipboard-apiKey"
-                    name="apiKey"
-                    ng-model="vm.user.apiKey"
-                    ng-readonly="true"
-                  />
-                </div>
-                <div class="hint">
-                  <span translate="STAFF.HELP.APIKEY"></span>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.user.id != vm.currentUser.id && vm.currentUser.role == 'admin'"
-                class="md-block"
-              >
-                <md-switch
-                  ng-model="vm.user.disabled"
-                  aria-label="Disabled"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="STAFF.DISABLED">Disabled</span></md-switch
-                >
-
-                <div class="hint">
-                  <span translate="STAFF.HELP.DISABLED"></span>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.user.id != vm.currentUser.id && vm.currentUser.role == 'admin' && vm.user.disabled == 0"
-                class="md-block"
-              >
-                <md-switch
-                  ng-model="vm.user.blocked"
-                  aria-label="Blocked"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="STAFF.BLOCKED">Blocked</span></md-switch
-                >
-
-                <div class="hint">
-                  <span translate="STAFF.HELP.BLOCKED"></span>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="user-detail-form-container change_avatar md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="STAFF.CHANGE_AVATAR">
-                CHANGE_AVATAR
-              </div>
-            </div>
-            <div
-              ng-controller="Userchange_avatarController as vm_ca"
-              ng-init="vm_ca.init(vm.user, vm.crudPermissions)"
-              class="user-detail-form-container md-background-bg md-whiteframe-1dp"
-            >
-              <div
-                id="user-image-uploader"
-                flow-init="vm_ca.ngFlowOptions"
-                flow-name="vm_ca.ngFlow.flow"
-                flow-files-submitted="vm_ca.upload()"
-                flow-file-added="vm_ca.fileAdded($file)"
-                flow-file-success="vm_ca.fileSuccess($file, $message)"
-                flow-complete="vm_ca.uploadComplete()"
-                flow-drop
-                flow-drag-enter="vm_ca.dropping=true"
-                flow-drag-leave="vm_ca.dropping=false"
-                ng-class="{'dropping':vm.dropping}"
-              >
-                <div
-                  class="drop-text hint-text"
-                  layout="row"
-                  layout-align="center center"
-                >
-                  <span translate="EC.DROP_TO_UPLOAD">Drop to upload</span>
-                </div>
-
-                <div
-                  class="upload-button"
-                  layout="column"
-                  layout-align="center center"
-                >
-                  <md-button
-                    class="md-accent md-raised"
-                    flow-btn
-                    ng-disabled="!vm_ca.crudPermissions.canEdit"
-                  >
-                    Upload
-                  </md-button>
-                  <span class="secondary-text mt-8"
-                    >You can also drop images here to upload. Only PNG, JPG -
-                    Max. 8MB</span
-                  >
-                </div>
-
-                <div layout="row" layout-align="start start" layout-wrap>
-                  <div
-                    ng-repeat="change_avatarimage in vm_ca.user.images"
-                    ng-switch="change_avatarimage.type"
-                  >
-                    <div
-                      class="user-image uploading"
-                      ng-switch-when="uploading"
-                      layout="row"
-                      layout-align="center center"
-                    >
-                      <div
-                        class="overlay"
-                        layout="column"
-                        layout-align="center center"
-                      >
-                        <md-progress-linear
-                          md-mode="determinate"
-                          value="{{change_avatarimage.file.progress() * 100}}"
-                        >
-                        </md-progress-linear>
-                      </div>
-                      <img class="media" flow-img="change_avatarimage.file" />
-                    </div>
-
-                    <div
-                      class="user-image"
-                      ng-switch-when="image"
-                      layout="row"
-                      layout-align="center center"
-                    >
-                      <img class="media" ng-src="{{change_avatarimage.url}}" />
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="STAFF.VOICE">VOICE</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="user-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="STAFF.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container
-                ng-if="!vm.user.autointernal"
-                class="md-block"
-              >
-                <label translate="STAFF.INTERNAL">Internal</label>
-                <input
-                  type="text"
-                  name="internal"
-                  ng-model="vm.user.internal"
-                  ng-required="true"
-                  autofocus
-                  disabled
-                />
-
-                <div
-                  ng-messages="generalForm['internal'].$error"
-                  ng-show="generalForm['internal'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.INTERNAL_REQUIRED"
-                      >Internal field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.TRANSPORT">Transport</label>
-                <md-select
-                  name="transport"
-                  ng-model="vm.user.transport"
-                  multiple
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'udp'">udp</md-option>
-                  <md-option ng-value="'tcp'">tcp</md-option>
-                  <md-option ng-value="'ws'">ws</md-option>
-                  <md-option ng-value="'wss'">wss</md-option>
-                  <md-option ng-value="'tls'">tls</md-option>
-                </md-select>
-                <div
-                  ng-messages="generalForm['transport'].$error"
-                  ng-show="generalForm['transport'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.TRANSPORT_REQUIRED"
-                      >Transport field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.NAT">NAT</label>
-                <md-select
-                  name="nat"
-                  ng-model="vm.user.nat"
-                  multiple
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'force_rport'">force_rport</md-option>
-                  <md-option ng-value="'comedia'">comedia</md-option>
-                  <md-option ng-value="'yes'">yes</md-option>
-                  <md-option ng-value="'no'">no</md-option>
-                  <md-option ng-value="'never'">never</md-option>
-                  <md-option ng-value="'route'">route</md-option>
-                </md-select>
-                <div class="hint"><span translate="STAFF.HELP.NAT"></span></div>
-                <div
-                  ng-messages="generalForm['nat'].$error"
-                  ng-show="generalForm['nat'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.NAT_REQUIRED"
-                      >NAT field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.ALLOWCODECS">AllowCodecs</label>
-                <md-select
-                  name="allow"
-                  ng-model="vm.user.allow"
-                  multiple
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'ulaw'">ulaw</md-option>
-                  <md-option ng-value="'alaw'">alaw</md-option>
-                  <md-option ng-value="'gsm'">gsm</md-option>
-                  <md-option ng-value="'g722'">g722</md-option>
-                  <md-option ng-value="'g729'">g729</md-option>
-                  <md-option ng-value="'opus'">opus</md-option>
-                  <md-option ng-value="'h264'">h264</md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="STAFF.HELP.ALLOWCODECS"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['allow'].$error"
-                  ng-show="generalForm['allow'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.ALLOWCODECS_REQUIRED"
-                      >AllowCodecs field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.CONTEXT">Context</label>
-                <md-select
-                  name="context"
-                  ng-model="vm.user.context"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="context.name"
-                    ng-repeat="context in vm.contexts"
-                    ng-disabled="context.canSelect === false"
-                    >{{ context.name }}</md-option
-                  >
-                </md-select>
-                <div
-                  ng-messages="generalForm['context'].$error"
-                  ng-show="generalForm['context'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.CONTEXT_REQUIRED"
-                      >Context field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.CALLGROUP">Callgroup</label>
-                <input
-                  type="text"
-                  name="callgroup"
-                  ng-model="vm.user.callgroup"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="STAFF.HELP.CALLGROUP"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['callgroup'].$error"
-                  ng-show="generalForm['callgroup'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.CALLGROUP_REQUIRED"
-                      >Callgroup field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.PICKUPGROUP">Pickupgroup</label>
-                <input
-                  type="text"
-                  name="pickupgroup"
-                  ng-model="vm.user.pickupgroup"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="STAFF.HELP.PICKUPGROUP"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['pickupgroup'].$error"
-                  ng-show="generalForm['pickupgroup'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.PICKUPGROUP_REQUIRED"
-                      >Pickupgroup field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.APIKEY">ApiKey</label>
-                <div layout="row" layout-align="center center">
-                  <button
-                    class="md-button md-fab md-mini md-primary"
-                    ngclipboard
-                    data-clipboard-target="#copytoclipboard-apiKey"
-                    ngclipboard-success="vm.alert({title: 'copied to clipboard', msg: e.text});"
-                    ngclipboard-error="vm.alert({title: 'error', msg: 'copy to clipboard failed'});"
-                  >
-                    <md-icon md-font-icon="icon-clipboard-text"></md-icon>
-                  </button>
-                  <input
-                    class="md-input"
-                    type="text"
-                    id="copytoclipboard-apiKey"
-                    name="apiKey"
-                    ng-model="vm.user.apiKey"
-                    ng-readonly="true"
-                  />
-                </div>
-                <div class="hint">
-                  <span translate="STAFF.HELP.APIKEY"></span>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="STAFF.VIDEOSUPPORT">Videosupport</label>
-                <md-select
-                  name="videosupport"
-                  ng-model="vm.user.videosupport"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">Yes</md-option>
-                  <md-option ng-value="'no'">No</md-option>
-                  <md-option ng-value="'always'">Always</md-option>
-                </md-select>
-                <div
-                  ng-messages="generalForm['videosupport'].$error"
-                  ng-show="generalForm['videosupport'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="STAFF.ERRORS.VIDEOSUPPORT_REQUIRED"
-                      >Videosupport field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/staff/views/users/edit/view.html/view.html b/public/src/js/modules/main/apps/staff/views/users/edit/view.html/view.html
new file mode 100644
index 0000000..042a3fd
--- /dev/null
+++ b/public/src/js/modules/main/apps/staff/views/users/edit/view.html/view.html
@@ -0,0 +1,772 @@
+<div id="staff-user" class="page-layout simple tabbed" layout="column">
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-users-button md-icon-button"
+        aria-label="Go to users"
+        ng-click="vm.gotoUsers()"
+        translate
+        translate-attr-aria-label="STAFF.GO_TO_USERS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="user-image" hide-xs>
+          <img ng-src="assets/images/business/users.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.user.id}}
+            <span ng-if="vm.user.name">{{vm.user.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="STAFF.CREATED_AT"></span>
+            <span>{{vm.user.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div ng-cloak ng-if="vm.crudPermissions.canEdit">
+      <md-button
+        ng-click="vm.apikeymanagerdialog(vm.user, $event)"
+        class="md-fab md-orange-500-bg md-icon-button"
+        aria-label="apikeymanager"
+      >
+        <md-tooltip
+          ><span translate="STAFF.APIKEYMANAGER_USER"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="fab fa-hubspot"></md-icon>
+      </md-button>
+    </div>
+
+    <div ng-cloak ng-if="vm.crudPermissions.canEdit">
+      <md-button
+        ng-click="vm.changepassworddialog(vm.user, $event)"
+        class="md-fab md-warn md-icon-button"
+        aria-label="changepassword"
+      >
+        <md-tooltip
+          ><span translate="STAFF.CHANGEPASSWORD_USER"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-key-variant"></md-icon>
+      </md-button>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveUser()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(personal_infoForm.$invalid) || (security_suiteForm.$invalid) || (change_avatarForm.$invalid) || (generalForm.$invalid)"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="STAFF.ACCOUNT">ACCOUNT</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="user-detail-form-container personal_info md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="STAFF.PERSONAL_INFO">
+                PERSONAL_INFO
+              </div>
+            </div>
+            <form name="personal_infoForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="STAFF.ROLE">Role</label>
+                <md-select
+                  name="role"
+                  ng-model="vm.user.role"
+                  autofocus
+                  required
+                  disabled
+                >
+                  <md-option ng-value="'admin'">Admin</md-option>
+                  <md-option ng-value="'user'">User</md-option>
+                </md-select>
+                <div
+                  ng-messages="personal_infoForm['role'].$error"
+                  ng-show="personal_infoForm['role'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.ROLE_REQUIRED"
+                      >Role field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.user.role === 'user'"
+                class="md-block"
+              >
+                <label translate="STAFF.USERPROFILE">UserProfile</label>
+                <md-select
+                  name="userProfileId"
+                  ng-model="vm.user.userProfileId"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="userProfileId.id"
+                    ng-repeat="userProfileId in vm.userProfiles"
+                    ng-disabled="userProfileId.canSelect === false"
+                    >{{ userProfileId.name }}</md-option
+                  >
+                </md-select>
+                <div
+                  ng-messages="personal_infoForm['userProfileId'].$error"
+                  ng-show="personal_infoForm['userProfileId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.USERPROFILE_REQUIRED"
+                      >UserProfile field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.FULLNAME">Fullname</label>
+                <input
+                  type="text"
+                  name="fullname"
+                  ng-model="vm.user.fullname"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="personal_infoForm['fullname'].$error"
+                  ng-show="personal_infoForm['fullname'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.FULLNAME_REQUIRED"
+                      >Fullname field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.USERNAME">Username</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.user.name"
+                  ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+                  ng-required="true"
+                  disabled
+                />
+
+                <div class="hint">
+                  <span translate="STAFF.HELP.USERNAME"></span>
+                </div>
+                <div
+                  ng-messages="personal_infoForm['name'].$error"
+                  ng-show="personal_infoForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.USERNAME_REQUIRED"
+                      >Username field is required</span
+                    >
+                  </div>
+                  <div ng-message="pattern">
+                    <span
+                      translate="STAFF.ERRORS.USERNAME_MUST_VALID_PATTERN"
+                      translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+                      >Username must be valid pattern
+                    </span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.EMAIL">Email</label>
+                <input
+                  type="email"
+                  name="email"
+                  ng-model="vm.user.email"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="personal_infoForm['email'].$error"
+                  ng-show="personal_infoForm['email'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.EMAIL_REQUIRED"
+                      >Email field is required</span
+                    >
+                  </div>
+                  <div ng-message="email">
+                    <span translate="STAFF.ERRORS.EMAIL_MUST_VALID"
+                      >Email must be a valid e-mail address</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.PHONE">Phone</label>
+                <input
+                  type="text"
+                  name="phone"
+                  ng-model="vm.user.phone"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="personal_infoForm['phone'].$error"
+                  ng-show="personal_infoForm['phone'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.PHONE_REQUIRED"
+                      >Phone field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.MOBILE">Mobile</label>
+                <input
+                  type="text"
+                  name="mobile"
+                  ng-model="vm.user.mobile"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="personal_infoForm['mobile'].$error"
+                  ng-show="personal_infoForm['mobile'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.MOBILE_REQUIRED"
+                      >Mobile field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.user.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="personal_infoForm['description'].$error"
+                  ng-show="personal_infoForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="user-detail-form-container security_suite md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="STAFF.SECURITY_SUITE">
+                SECURITY_SUITE
+              </div>
+            </div>
+            <form name="security_suiteForm" novalidate>
+              <md-input-container
+                ng-if="vm.user.passwordResetAt != null"
+                class="md-block"
+              >
+                <label translate="STAFF.LAST_PASSWORD_RESET_AT"
+                  >Last_Password_Reset_At</label
+                >
+                <input
+                  type="text"
+                  name="passwordResetAt"
+                  ng-model="vm.user.passwordResetAt"
+                  autofocus
+                  disabled
+                />
+
+                <div class="hint">
+                  <span translate="STAFF.HELP.LAST_PASSWORD_RESET_AT"></span>
+                </div>
+                <div
+                  ng-messages="security_suiteForm['passwordResetAt'].$error"
+                  ng-show="security_suiteForm['passwordResetAt'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="STAFF.ERRORS.LAST_PASSWORD_RESET_AT_REQUIRED"
+                      >Last_Password_Reset_At field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.user.passwordResetAt == null"
+                class="md-block"
+              >
+                <label translate="STAFF.NO_PASSWORD_CHANGE"
+                  >No_Password_Change</label
+                >
+                <input
+                  type="text"
+                  name="passwordResetAt"
+                  ng-model="vm.user.passwordResetAt"
+                  disabled
+                />
+
+                <div
+                  ng-messages="security_suiteForm['passwordResetAt'].$error"
+                  ng-show="security_suiteForm['passwordResetAt'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.NO_PASSWORD_CHANGE_REQUIRED"
+                      >No_Password_Change field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.APIKEY">ApiKey</label>
+                <div layout="row" layout-align="center center">
+                  <button
+                    class="md-button md-fab md-mini md-primary"
+                    ngclipboard
+                    data-clipboard-target="#copytoclipboard-apiKey"
+                    ngclipboard-success="vm.alert({title: 'copied to clipboard', msg: e.text});"
+                    ngclipboard-error="vm.alert({title: 'error', msg: 'copy to clipboard failed'});"
+                  >
+                    <md-icon md-font-icon="icon-clipboard-text"></md-icon>
+                  </button>
+                  <input
+                    class="md-input"
+                    type="text"
+                    id="copytoclipboard-apiKey"
+                    name="apiKey"
+                    ng-model="vm.user.apiKey"
+                    ng-readonly="true"
+                  />
+                </div>
+                <div class="hint">
+                  <span translate="STAFF.HELP.APIKEY"></span>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.user.id != vm.currentUser.id && vm.currentUser.role == 'admin'"
+                class="md-block"
+              >
+                <md-switch
+                  ng-model="vm.user.disabled"
+                  aria-label="Disabled"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="STAFF.DISABLED">Disabled</span></md-switch
+                >
+
+                <div class="hint">
+                  <span translate="STAFF.HELP.DISABLED"></span>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.user.id != vm.currentUser.id && vm.currentUser.role == 'admin' && vm.user.disabled == 0"
+                class="md-block"
+              >
+                <md-switch
+                  ng-model="vm.user.blocked"
+                  aria-label="Blocked"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="STAFF.BLOCKED">Blocked</span></md-switch
+                >
+
+                <div class="hint">
+                  <span translate="STAFF.HELP.BLOCKED"></span>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="user-detail-form-container change_avatar md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="STAFF.CHANGE_AVATAR">
+                CHANGE_AVATAR
+              </div>
+            </div>
+            <div
+              ng-controller="Userchange_avatarController as vm_ca"
+              ng-init="vm_ca.init(vm.user, vm.crudPermissions)"
+              class="user-detail-form-container md-background-bg md-whiteframe-1dp"
+            >
+              <div
+                id="user-image-uploader"
+                flow-init="vm_ca.ngFlowOptions"
+                flow-name="vm_ca.ngFlow.flow"
+                flow-files-submitted="vm_ca.upload()"
+                flow-file-added="vm_ca.fileAdded($file)"
+                flow-file-success="vm_ca.fileSuccess($file, $message)"
+                flow-complete="vm_ca.uploadComplete()"
+                flow-drop
+                flow-drag-enter="vm_ca.dropping=true"
+                flow-drag-leave="vm_ca.dropping=false"
+                ng-class="{'dropping':vm.dropping}"
+              >
+                <div
+                  class="drop-text hint-text"
+                  layout="row"
+                  layout-align="center center"
+                >
+                  <span translate="EC.DROP_TO_UPLOAD">Drop to upload</span>
+                </div>
+
+                <div
+                  class="upload-button"
+                  layout="column"
+                  layout-align="center center"
+                >
+                  <md-button
+                    class="md-accent md-raised"
+                    flow-btn
+                    ng-disabled="!vm_ca.crudPermissions.canEdit"
+                  >
+                    Upload
+                  </md-button>
+                  <span class="secondary-text mt-8"
+                    >You can also drop images here to upload. Only PNG, JPG -
+                    Max. 8MB</span
+                  >
+                </div>
+
+                <div layout="row" layout-align="start start" layout-wrap>
+                  <div
+                    ng-repeat="change_avatarimage in vm_ca.user.images"
+                    ng-switch="change_avatarimage.type"
+                  >
+                    <div
+                      class="user-image uploading"
+                      ng-switch-when="uploading"
+                      layout="row"
+                      layout-align="center center"
+                    >
+                      <div
+                        class="overlay"
+                        layout="column"
+                        layout-align="center center"
+                      >
+                        <md-progress-linear
+                          md-mode="determinate"
+                          value="{{change_avatarimage.file.progress() * 100}}"
+                        >
+                        </md-progress-linear>
+                      </div>
+                      <img class="media" flow-img="change_avatarimage.file" />
+                    </div>
+
+                    <div
+                      class="user-image"
+                      ng-switch-when="image"
+                      layout="row"
+                      layout-align="center center"
+                    >
+                      <img class="media" ng-src="{{change_avatarimage.url}}" />
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="STAFF.VOICE">VOICE</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="user-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="STAFF.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container
+                ng-if="!vm.user.autointernal"
+                class="md-block"
+              >
+                <label translate="STAFF.INTERNAL">Internal</label>
+                <input
+                  type="text"
+                  name="internal"
+                  ng-model="vm.user.internal"
+                  ng-required="true"
+                  autofocus
+                  disabled
+                />
+
+                <div
+                  ng-messages="generalForm['internal'].$error"
+                  ng-show="generalForm['internal'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.INTERNAL_REQUIRED"
+                      >Internal field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.TRANSPORT">Transport</label>
+                <md-select
+                  name="transport"
+                  ng-model="vm.user.transport"
+                  multiple
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'udp'">udp</md-option>
+                  <md-option ng-value="'tcp'">tcp</md-option>
+                  <md-option ng-value="'ws'">ws</md-option>
+                  <md-option ng-value="'wss'">wss</md-option>
+                  <md-option ng-value="'tls'">tls</md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['transport'].$error"
+                  ng-show="generalForm['transport'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.TRANSPORT_REQUIRED"
+                      >Transport field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.NAT">NAT</label>
+                <md-select
+                  name="nat"
+                  ng-model="vm.user.nat"
+                  multiple
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'force_rport'">force_rport</md-option>
+                  <md-option ng-value="'comedia'">comedia</md-option>
+                  <md-option ng-value="'yes'">yes</md-option>
+                  <md-option ng-value="'no'">no</md-option>
+                  <md-option ng-value="'never'">never</md-option>
+                  <md-option ng-value="'route'">route</md-option>
+                </md-select>
+                <div class="hint"><span translate="STAFF.HELP.NAT"></span></div>
+                <div
+                  ng-messages="generalForm['nat'].$error"
+                  ng-show="generalForm['nat'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.NAT_REQUIRED"
+                      >NAT field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.ALLOWCODECS">AllowCodecs</label>
+                <md-select
+                  name="allow"
+                  ng-model="vm.user.allow"
+                  multiple
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'ulaw'">ulaw</md-option>
+                  <md-option ng-value="'alaw'">alaw</md-option>
+                  <md-option ng-value="'gsm'">gsm</md-option>
+                  <md-option ng-value="'g722'">g722</md-option>
+                  <md-option ng-value="'g729'">g729</md-option>
+                  <md-option ng-value="'opus'">opus</md-option>
+                  <md-option ng-value="'h264'">h264</md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="STAFF.HELP.ALLOWCODECS"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['allow'].$error"
+                  ng-show="generalForm['allow'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.ALLOWCODECS_REQUIRED"
+                      >AllowCodecs field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.CONTEXT">Context</label>
+                <md-select
+                  name="context"
+                  ng-model="vm.user.context"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="context.name"
+                    ng-repeat="context in vm.contexts"
+                    ng-disabled="context.canSelect === false"
+                    >{{ context.name }}</md-option
+                  >
+                </md-select>
+                <div
+                  ng-messages="generalForm['context'].$error"
+                  ng-show="generalForm['context'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.CONTEXT_REQUIRED"
+                      >Context field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.CALLGROUP">Callgroup</label>
+                <input
+                  type="text"
+                  name="callgroup"
+                  ng-model="vm.user.callgroup"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="STAFF.HELP.CALLGROUP"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['callgroup'].$error"
+                  ng-show="generalForm['callgroup'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.CALLGROUP_REQUIRED"
+                      >Callgroup field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.PICKUPGROUP">Pickupgroup</label>
+                <input
+                  type="text"
+                  name="pickupgroup"
+                  ng-model="vm.user.pickupgroup"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="STAFF.HELP.PICKUPGROUP"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['pickupgroup'].$error"
+                  ng-show="generalForm['pickupgroup'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.PICKUPGROUP_REQUIRED"
+                      >Pickupgroup field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.APIKEY">ApiKey</label>
+                <div layout="row" layout-align="center center">
+                  <button
+                    class="md-button md-fab md-mini md-primary"
+                    ngclipboard
+                    data-clipboard-target="#copytoclipboard-apiKey"
+                    ngclipboard-success="vm.alert({title: 'copied to clipboard', msg: e.text});"
+                    ngclipboard-error="vm.alert({title: 'error', msg: 'copy to clipboard failed'});"
+                  >
+                    <md-icon md-font-icon="icon-clipboard-text"></md-icon>
+                  </button>
+                  <input
+                    class="md-input"
+                    type="text"
+                    id="copytoclipboard-apiKey"
+                    name="apiKey"
+                    ng-model="vm.user.apiKey"
+                    ng-readonly="true"
+                  />
+                </div>
+                <div class="hint">
+                  <span translate="STAFF.HELP.APIKEY"></span>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="STAFF.VIDEOSUPPORT">Videosupport</label>
+                <md-select
+                  name="videosupport"
+                  ng-model="vm.user.videosupport"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">Yes</md-option>
+                  <md-option ng-value="'no'">No</md-option>
+                  <md-option ng-value="'always'">Always</md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['videosupport'].$error"
+                  ng-show="generalForm['videosupport'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="STAFF.ERRORS.VIDEOSUPPORT_REQUIRED"
+                      >Videosupport field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/staff/views/users/users.html/users-[chunkhash].html b/public/src/js/modules/main/apps/staff/views/users/users.html/users-[chunkhash].html
deleted file mode 100644
index ff2f49f..0000000
--- a/public/src/js/modules/main/apps/staff/views/users/users.html/users-[chunkhash].html
+++ /dev/null
@@ -1,360 +0,0 @@
-<div
-  id="users"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-account-multiple" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="STAFF.USERS">Users</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="STAFF.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedUsers.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedUsers =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="STAFF.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-users-count">
-          <span>{{vm.selectedUsers.length}}</span>
-          <span translate="STAFF.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="STAFF.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllUsers()"
-                translate="STAFF.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectUsers()"
-                translate="STAFF.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedUsers"
-          csv-label="true"
-          filename="users.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- USER TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedUsers"
-            md-progress="vm.promise"
-          >
-            <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getUsers">
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="role">
-                  {{ 'STAFF.ROLE' | translate }}
-                </th>
-                <th md-column md-order-by="userProfileId">
-                  {{ 'STAFF.USERPROFILE' | translate }}
-                </th>
-                <th md-column md-order-by="fullname">
-                  {{ 'STAFF.FULLNAME' | translate }}
-                </th>
-                <th md-column md-order-by="name">
-                  {{ 'STAFF.USERNAME' | translate }}
-                </th>
-                <th md-column md-order-by="email">
-                  {{ 'STAFF.EMAIL' | translate }}
-                </th>
-                <th md-column md-order-by="phone">
-                  {{ 'STAFF.PHONE' | translate }}
-                </th>
-                <th md-column md-order-by="mobile">
-                  {{ 'STAFF.MOBILE' | translate }}
-                </th>
-                <th md-column md-order-by="internal">
-                  {{ 'STAFF.INTERNAL' | translate }}
-                </th>
-                <th md-column md-order-by="disabled">
-                  {{ 'STAFF.DISABLED' | translate }}
-                </th>
-                <th md-column md-order-by="blocked">
-                  {{ 'STAFF.BLOCKED' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.users.rows.length">
-                <td md-cell colspan="11">
-                  <div layout="row" layout-align="center center">
-                    <span translate="STAFF.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="user"
-                md-select-id="id"
-                ng-repeat="user in vm.users.rows"
-              >
-                <td md-cell ng-if="user.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{user.name}}"
-                    ng-src="api/users/{{user.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!user.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{user.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(user, ev) : vm.createOrEditUser($event, user)"
-                  md-cell
-                  class="role"
-                >
-                  {{ vm.arrayrole[user.role].option }}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(user, ev) : vm.createOrEditUser($event, user)"
-                  md-cell
-                  class="userProfileId font-weight-600"
-                >
-                  {{ (vm.userProfiles | filter : {'id':user.userProfileId} :
-                  true)[0].name }}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(user, ev) : vm.createOrEditUser($event, user)"
-                  md-cell
-                  class="fullname font-weight-600"
-                >
-                  {{user.fullname}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(user, ev) : vm.createOrEditUser($event, user)"
-                  md-cell
-                  class="name"
-                >
-                  {{user.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(user, ev) : vm.createOrEditUser($event, user)"
-                  md-cell
-                  class="email"
-                >
-                  {{user.email}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(user, ev) : vm.createOrEditUser($event, user)"
-                  md-cell
-                  class="phone"
-                >
-                  {{user.phone}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(user, ev) : vm.createOrEditUser($event, user)"
-                  md-cell
-                  class="mobile"
-                >
-                  {{user.mobile}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(user, ev) : vm.createOrEditUser($event, user)"
-                  md-cell
-                  class="internal"
-                >
-                  {{user.internal}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(user, ev) : vm.createOrEditUser($event, user)"
-                  md-cell
-                  class="disabled"
-                >
-                  <md-icon
-                    md-colors="{color: {{user.disabled ? '\'green\'' : '\'grey\''}}}"
-                    md-font-icon="{{user.disabled ? 'icon-check' : 'icon-close'}}"
-                  ></md-icon>
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(user, ev) : vm.createOrEditUser($event, user)"
-                  md-cell
-                  class="blocked"
-                >
-                  <md-icon
-                    md-colors="{color: {{user.blocked ? '\'green\'' : '\'grey\''}}}"
-                    md-font-icon="{{user.blocked ? 'icon-check' : 'icon-close'}}"
-                  ></md-icon>
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="STAFF.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(user, $event    )"
-                          translate="STAFF.EDIT_USER"
-                        >
-                          Edit User
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item
-                        ng-if="vm.currentUser.role === 'admin' && user.id !== vm.currentUser.id"
-                      >
-                        <md-button
-                          ng-click="vm.deleteconfirm(user, $event    )"
-                          translate="STAFF.DELETE_USER"
-                        >
-                          Delete User
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'STAFF.PAGE' | translate}}:', rowsPerPage: '{{'STAFF.ROWSPERPAGE' | translate}}:', of: '{{'STAFF.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.users.count}}"
-          md-on-paginate="vm.getUsers"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / USER TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD USER BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-user-button"
-    ng-click="vm.createOrEditUser($event)"
-    aria-label="add user"
-    translate
-    translate-attr-aria-label="STAFF.ADD_USER"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD USER BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/staff/views/users/users.html/users.html b/public/src/js/modules/main/apps/staff/views/users/users.html/users.html
new file mode 100644
index 0000000..ff2f49f
--- /dev/null
+++ b/public/src/js/modules/main/apps/staff/views/users/users.html/users.html
@@ -0,0 +1,360 @@
+<div
+  id="users"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-account-multiple" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="STAFF.USERS">Users</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="STAFF.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedUsers.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedUsers =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="STAFF.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-users-count">
+          <span>{{vm.selectedUsers.length}}</span>
+          <span translate="STAFF.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="STAFF.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllUsers()"
+                translate="STAFF.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectUsers()"
+                translate="STAFF.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedUsers"
+          csv-label="true"
+          filename="users.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- USER TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedUsers"
+            md-progress="vm.promise"
+          >
+            <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getUsers">
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="role">
+                  {{ 'STAFF.ROLE' | translate }}
+                </th>
+                <th md-column md-order-by="userProfileId">
+                  {{ 'STAFF.USERPROFILE' | translate }}
+                </th>
+                <th md-column md-order-by="fullname">
+                  {{ 'STAFF.FULLNAME' | translate }}
+                </th>
+                <th md-column md-order-by="name">
+                  {{ 'STAFF.USERNAME' | translate }}
+                </th>
+                <th md-column md-order-by="email">
+                  {{ 'STAFF.EMAIL' | translate }}
+                </th>
+                <th md-column md-order-by="phone">
+                  {{ 'STAFF.PHONE' | translate }}
+                </th>
+                <th md-column md-order-by="mobile">
+                  {{ 'STAFF.MOBILE' | translate }}
+                </th>
+                <th md-column md-order-by="internal">
+                  {{ 'STAFF.INTERNAL' | translate }}
+                </th>
+                <th md-column md-order-by="disabled">
+                  {{ 'STAFF.DISABLED' | translate }}
+                </th>
+                <th md-column md-order-by="blocked">
+                  {{ 'STAFF.BLOCKED' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.users.rows.length">
+                <td md-cell colspan="11">
+                  <div layout="row" layout-align="center center">
+                    <span translate="STAFF.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="user"
+                md-select-id="id"
+                ng-repeat="user in vm.users.rows"
+              >
+                <td md-cell ng-if="user.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{user.name}}"
+                    ng-src="api/users/{{user.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!user.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{user.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(user, ev) : vm.createOrEditUser($event, user)"
+                  md-cell
+                  class="role"
+                >
+                  {{ vm.arrayrole[user.role].option }}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(user, ev) : vm.createOrEditUser($event, user)"
+                  md-cell
+                  class="userProfileId font-weight-600"
+                >
+                  {{ (vm.userProfiles | filter : {'id':user.userProfileId} :
+                  true)[0].name }}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(user, ev) : vm.createOrEditUser($event, user)"
+                  md-cell
+                  class="fullname font-weight-600"
+                >
+                  {{user.fullname}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(user, ev) : vm.createOrEditUser($event, user)"
+                  md-cell
+                  class="name"
+                >
+                  {{user.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(user, ev) : vm.createOrEditUser($event, user)"
+                  md-cell
+                  class="email"
+                >
+                  {{user.email}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(user, ev) : vm.createOrEditUser($event, user)"
+                  md-cell
+                  class="phone"
+                >
+                  {{user.phone}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(user, ev) : vm.createOrEditUser($event, user)"
+                  md-cell
+                  class="mobile"
+                >
+                  {{user.mobile}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(user, ev) : vm.createOrEditUser($event, user)"
+                  md-cell
+                  class="internal"
+                >
+                  {{user.internal}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(user, ev) : vm.createOrEditUser($event, user)"
+                  md-cell
+                  class="disabled"
+                >
+                  <md-icon
+                    md-colors="{color: {{user.disabled ? '\'green\'' : '\'grey\''}}}"
+                    md-font-icon="{{user.disabled ? 'icon-check' : 'icon-close'}}"
+                  ></md-icon>
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(user, ev) : vm.createOrEditUser($event, user)"
+                  md-cell
+                  class="blocked"
+                >
+                  <md-icon
+                    md-colors="{color: {{user.blocked ? '\'green\'' : '\'grey\''}}}"
+                    md-font-icon="{{user.blocked ? 'icon-check' : 'icon-close'}}"
+                  ></md-icon>
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="STAFF.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(user, $event    )"
+                          translate="STAFF.EDIT_USER"
+                        >
+                          Edit User
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item
+                        ng-if="vm.currentUser.role === 'admin' && user.id !== vm.currentUser.id"
+                      >
+                        <md-button
+                          ng-click="vm.deleteconfirm(user, $event    )"
+                          translate="STAFF.DELETE_USER"
+                        >
+                          Delete User
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'STAFF.PAGE' | translate}}:', rowsPerPage: '{{'STAFF.ROWSPERPAGE' | translate}}:', of: '{{'STAFF.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.users.count}}"
+          md-on-paginate="vm.getUsers"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / USER TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD USER BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-user-button"
+    ng-click="vm.createOrEditUser($event)"
+    aria-label="add user"
+    translate
+    translate-attr-aria-label="STAFF.ADD_USER"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD USER BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/tools/views/cannedAnswers/cannedAnswers.html/cannedAnswers-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/cannedAnswers/cannedAnswers.html/cannedAnswers-[chunkhash].html
deleted file mode 100644
index 81fbce2..0000000
--- a/public/src/js/modules/main/apps/tools/views/cannedAnswers/cannedAnswers.html/cannedAnswers-[chunkhash].html
+++ /dev/null
@@ -1,309 +0,0 @@
-<div
-  id="cannedAnswers"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-auto-fix" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="TOOLS.CANNEDANSWERS"
-          >CannedAnswers</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="TOOLS.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedCannedAnswers.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedCannedAnswers =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="TOOLS.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-cannedAnswers-count">
-          <span>{{vm.selectedCannedAnswers.length}}</span>
-          <span translate="TOOLS.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="TOOLS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllCannedAnswers()"
-                translate="TOOLS.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectCannedAnswers()"
-                translate="TOOLS.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedCannedAnswers"
-          csv-label="true"
-          filename="cannedAnswers.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedCannedAnswers($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="TOOLS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- CANNEDANSWER TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedCannedAnswers"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getCannedAnswers"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'TOOLS.ID' | translate }}</th>
-                <th md-column md-order-by="key">
-                  {{ 'TOOLS.KEY' | translate }}
-                </th>
-                <th md-column md-order-by="value">
-                  {{ 'TOOLS.VALUE' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'TOOLS.DESCRIPTION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.cannedAnswers.rows.length">
-                <td md-cell colspan="5">
-                  <div layout="row" layout-align="center center">
-                    <span translate="TOOLS.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="cannedAnswer"
-                md-select-id="id"
-                ng-repeat="cannedAnswer in vm.cannedAnswers.rows"
-              >
-                <td md-cell ng-if="cannedAnswer.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{cannedAnswer.name}}"
-                    ng-src="api/users/{{cannedAnswer.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!cannedAnswer.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{cannedAnswer.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.createOrEditCannedAnswer($event, cannedAnswer)"
-                  md-cell
-                  class="id"
-                >
-                  {{cannedAnswer.id}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditCannedAnswer($event, cannedAnswer)"
-                  md-cell
-                  class="key"
-                >
-                  {{cannedAnswer.key}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditCannedAnswer($event, cannedAnswer)"
-                  md-cell
-                  class="value"
-                >
-                  {{cannedAnswer.value}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditCannedAnswer($event, cannedAnswer)"
-                  md-cell
-                  class="description"
-                >
-                  {{cannedAnswer.description}}
-                </td>
-
-                <td
-                  md-cell
-                  class="actions"
-                  ng-if="!vm.crudPermissions.readOnly"
-                >
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="TOOLS.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editdialog(cannedAnswer, $event    )"
-                          translate="TOOLS.EDIT_CANNEDANSWER"
-                        >
-                          Edit CannedAnswer
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(cannedAnswer, $event    )"
-                          translate="TOOLS.DELETE_CANNEDANSWER"
-                        >
-                          Delete CannedAnswer
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'TOOLS.PAGE' | translate}}:', rowsPerPage: '{{'TOOLS.ROWSPERPAGE' | translate}}:', of: '{{'TOOLS.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.cannedAnswers.count}}"
-          md-on-paginate="vm.getCannedAnswers"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / CANNEDANSWER TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD CANNEDANSWER BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-cannedAnswer-button"
-    ng-click="vm.createOrEditCannedAnswer($event)"
-    aria-label="add cannedAnswer"
-    translate
-    translate-attr-aria-label="TOOLS.ADD_CANNEDANSWER"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD CANNEDANSWER BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/tools/views/cannedAnswers/cannedAnswers.html/cannedAnswers.html b/public/src/js/modules/main/apps/tools/views/cannedAnswers/cannedAnswers.html/cannedAnswers.html
new file mode 100644
index 0000000..81fbce2
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/cannedAnswers/cannedAnswers.html/cannedAnswers.html
@@ -0,0 +1,309 @@
+<div
+  id="cannedAnswers"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-auto-fix" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="TOOLS.CANNEDANSWERS"
+          >CannedAnswers</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="TOOLS.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedCannedAnswers.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedCannedAnswers =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="TOOLS.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-cannedAnswers-count">
+          <span>{{vm.selectedCannedAnswers.length}}</span>
+          <span translate="TOOLS.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="TOOLS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllCannedAnswers()"
+                translate="TOOLS.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectCannedAnswers()"
+                translate="TOOLS.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedCannedAnswers"
+          csv-label="true"
+          filename="cannedAnswers.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedCannedAnswers($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="TOOLS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- CANNEDANSWER TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedCannedAnswers"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getCannedAnswers"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'TOOLS.ID' | translate }}</th>
+                <th md-column md-order-by="key">
+                  {{ 'TOOLS.KEY' | translate }}
+                </th>
+                <th md-column md-order-by="value">
+                  {{ 'TOOLS.VALUE' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'TOOLS.DESCRIPTION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.cannedAnswers.rows.length">
+                <td md-cell colspan="5">
+                  <div layout="row" layout-align="center center">
+                    <span translate="TOOLS.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="cannedAnswer"
+                md-select-id="id"
+                ng-repeat="cannedAnswer in vm.cannedAnswers.rows"
+              >
+                <td md-cell ng-if="cannedAnswer.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{cannedAnswer.name}}"
+                    ng-src="api/users/{{cannedAnswer.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!cannedAnswer.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{cannedAnswer.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.createOrEditCannedAnswer($event, cannedAnswer)"
+                  md-cell
+                  class="id"
+                >
+                  {{cannedAnswer.id}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditCannedAnswer($event, cannedAnswer)"
+                  md-cell
+                  class="key"
+                >
+                  {{cannedAnswer.key}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditCannedAnswer($event, cannedAnswer)"
+                  md-cell
+                  class="value"
+                >
+                  {{cannedAnswer.value}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditCannedAnswer($event, cannedAnswer)"
+                  md-cell
+                  class="description"
+                >
+                  {{cannedAnswer.description}}
+                </td>
+
+                <td
+                  md-cell
+                  class="actions"
+                  ng-if="!vm.crudPermissions.readOnly"
+                >
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="TOOLS.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editdialog(cannedAnswer, $event    )"
+                          translate="TOOLS.EDIT_CANNEDANSWER"
+                        >
+                          Edit CannedAnswer
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(cannedAnswer, $event    )"
+                          translate="TOOLS.DELETE_CANNEDANSWER"
+                        >
+                          Delete CannedAnswer
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'TOOLS.PAGE' | translate}}:', rowsPerPage: '{{'TOOLS.ROWSPERPAGE' | translate}}:', of: '{{'TOOLS.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.cannedAnswers.count}}"
+          md-on-paginate="vm.getCannedAnswers"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / CANNEDANSWER TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD CANNEDANSWER BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-cannedAnswer-button"
+    ng-click="vm.createOrEditCannedAnswer($event)"
+    aria-label="add cannedAnswer"
+    translate
+    translate-attr-aria-label="TOOLS.ADD_CANNEDANSWER"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD CANNEDANSWER BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/tools/views/cannedAnswers/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/cannedAnswers/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index f59670a..0000000
--- a/public/src/js/modules/main/apps/tools/views/cannedAnswers/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,180 +0,0 @@
-<md-dialog class="cannedAnswer-dialog" aria-label="New CannedAnswer">
-  <form name="cannedAnswerForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.KEY">Key</label>
-        <input
-          type="text"
-          name="key"
-          ng-model="vm.cannedAnswer.key"
-          md-maxlength="255"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="cannedAnswerForm['key'].$error"
-          ng-show="cannedAnswerForm['key'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.KEY_REQUIRED"
-              >Key field is required</span
-            >
-          </div>
-          <div ng-message="md-maxlength">
-            <span
-              translate="TOOLS.ERRORS.KEY_MAX_LENGTH"
-              translate-values="{max: 255}"
-              >Key must have a maximum length equal to 255</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.VALUE">Value</label>
-        <textarea
-          name="value"
-          ng-model="vm.cannedAnswer.value"
-          required
-        ></textarea>
-
-        <div
-          ng-messages="cannedAnswerForm['value'].$error"
-          ng-show="cannedAnswerForm['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.VALUE_REQUIRED"
-              >Value field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.cannedAnswer.description"
-        />
-
-        <div
-          ng-messages="cannedAnswerForm['description'].$error"
-          ng-show="cannedAnswerForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newCannedAnswer"
-          ng-click="vm.saveCannedAnswer()"
-          class="send-button md-accent md-raised"
-          ng-disabled="cannedAnswerForm.$invalid || cannedAnswerForm.$pristine"
-          aria-label="SAVE"
-          translate="TOOLS.SAVE"
-          translate-attr-aria-label="TOOLS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newCannedAnswer"
-          ng-click="vm.addNewCannedAnswer()"
-          class="send-button md-accent md-raised"
-          ng-disabled="cannedAnswerForm.$invalid"
-          aria-label="ADD"
-          translate="TOOLS.ADD_CANNEDANSWER"
-          translate-attr-aria-label="TOOLS.ADD_CANNEDANSWER"
-        >
-          ADD CANNEDANSWER
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newCannedAnswer"
-          ng-click="vm.deleteCannedAnswer($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="TOOLS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/cannedAnswers/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/tools/views/cannedAnswers/create/dialog.html/dialog.html
new file mode 100644
index 0000000..f59670a
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/cannedAnswers/create/dialog.html/dialog.html
@@ -0,0 +1,180 @@
+<md-dialog class="cannedAnswer-dialog" aria-label="New CannedAnswer">
+  <form name="cannedAnswerForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.KEY">Key</label>
+        <input
+          type="text"
+          name="key"
+          ng-model="vm.cannedAnswer.key"
+          md-maxlength="255"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="cannedAnswerForm['key'].$error"
+          ng-show="cannedAnswerForm['key'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.KEY_REQUIRED"
+              >Key field is required</span
+            >
+          </div>
+          <div ng-message="md-maxlength">
+            <span
+              translate="TOOLS.ERRORS.KEY_MAX_LENGTH"
+              translate-values="{max: 255}"
+              >Key must have a maximum length equal to 255</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.VALUE">Value</label>
+        <textarea
+          name="value"
+          ng-model="vm.cannedAnswer.value"
+          required
+        ></textarea>
+
+        <div
+          ng-messages="cannedAnswerForm['value'].$error"
+          ng-show="cannedAnswerForm['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.VALUE_REQUIRED"
+              >Value field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.cannedAnswer.description"
+        />
+
+        <div
+          ng-messages="cannedAnswerForm['description'].$error"
+          ng-show="cannedAnswerForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newCannedAnswer"
+          ng-click="vm.saveCannedAnswer()"
+          class="send-button md-accent md-raised"
+          ng-disabled="cannedAnswerForm.$invalid || cannedAnswerForm.$pristine"
+          aria-label="SAVE"
+          translate="TOOLS.SAVE"
+          translate-attr-aria-label="TOOLS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newCannedAnswer"
+          ng-click="vm.addNewCannedAnswer()"
+          class="send-button md-accent md-raised"
+          ng-disabled="cannedAnswerForm.$invalid"
+          aria-label="ADD"
+          translate="TOOLS.ADD_CANNEDANSWER"
+          translate-attr-aria-label="TOOLS.ADD_CANNEDANSWER"
+        >
+          ADD CANNEDANSWER
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newCannedAnswer"
+          ng-click="vm.deleteCannedAnswer($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="TOOLS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/customDashboards/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/customDashboards/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 0d12b56..0000000
--- a/public/src/js/modules/main/apps/tools/views/customDashboards/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,152 +0,0 @@
-<md-dialog class="customDashboard-dialog" aria-label="New CustomDashboard">
-  <form name="customDashboardForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.customDashboard.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="customDashboardForm['name'].$error"
-          ng-show="customDashboardForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.customDashboard.description"
-        />
-
-        <div
-          ng-messages="customDashboardForm['description'].$error"
-          ng-show="customDashboardForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newCustomDashboard"
-          ng-click="vm.saveCustomDashboard()"
-          class="send-button md-accent md-raised"
-          ng-disabled="customDashboardForm.$invalid || customDashboardForm.$pristine"
-          aria-label="SAVE"
-          translate="TOOLS.SAVE"
-          translate-attr-aria-label="TOOLS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newCustomDashboard"
-          ng-click="vm.addNewCustomDashboard()"
-          class="send-button md-accent md-raised"
-          ng-disabled="customDashboardForm.$invalid"
-          aria-label="ADD"
-          translate="TOOLS.ADD_CUSTOMDASHBOARD"
-          translate-attr-aria-label="TOOLS.ADD_CUSTOMDASHBOARD"
-        >
-          ADD CUSTOMDASHBOARD
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newCustomDashboard"
-          ng-click="vm.deleteCustomDashboard($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="TOOLS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/customDashboards/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/tools/views/customDashboards/create/dialog.html/dialog.html
new file mode 100644
index 0000000..0d12b56
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/customDashboards/create/dialog.html/dialog.html
@@ -0,0 +1,152 @@
+<md-dialog class="customDashboard-dialog" aria-label="New CustomDashboard">
+  <form name="customDashboardForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.customDashboard.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="customDashboardForm['name'].$error"
+          ng-show="customDashboardForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.customDashboard.description"
+        />
+
+        <div
+          ng-messages="customDashboardForm['description'].$error"
+          ng-show="customDashboardForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newCustomDashboard"
+          ng-click="vm.saveCustomDashboard()"
+          class="send-button md-accent md-raised"
+          ng-disabled="customDashboardForm.$invalid || customDashboardForm.$pristine"
+          aria-label="SAVE"
+          translate="TOOLS.SAVE"
+          translate-attr-aria-label="TOOLS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newCustomDashboard"
+          ng-click="vm.addNewCustomDashboard()"
+          class="send-button md-accent md-raised"
+          ng-disabled="customDashboardForm.$invalid"
+          aria-label="ADD"
+          translate="TOOLS.ADD_CUSTOMDASHBOARD"
+          translate-attr-aria-label="TOOLS.ADD_CUSTOMDASHBOARD"
+        >
+          ADD CUSTOMDASHBOARD
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newCustomDashboard"
+          ng-click="vm.deleteCustomDashboard($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="TOOLS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/customDashboards/customDashboards.html/customDashboards-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/customDashboards/customDashboards.html/customDashboards-[chunkhash].html
deleted file mode 100644
index c7ec4ad..0000000
--- a/public/src/js/modules/main/apps/tools/views/customDashboards/customDashboards.html/customDashboards-[chunkhash].html
+++ /dev/null
@@ -1,324 +0,0 @@
-<div
-  id="customDashboards"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-auto-fix" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="TOOLS.CUSTOMDASHBOARDS"
-          >CustomDashboards</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="TOOLS.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedCustomDashboards.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div
-      class="close-button-wrapper"
-      ng-click="vm.selectedCustomDashboards =[]"
-    >
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="TOOLS.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-customDashboards-count">
-          <span>{{vm.selectedCustomDashboards.length}}</span>
-          <span translate="TOOLS.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="TOOLS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllCustomDashboards()"
-                translate="TOOLS.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectCustomDashboards()"
-                translate="TOOLS.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedCustomDashboards"
-          csv-label="true"
-          filename="customDashboards.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedCustomDashboards($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="TOOLS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- CUSTOMDASHBOARD TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedCustomDashboards"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getCustomDashboards"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'TOOLS.ID' | translate }}</th>
-                <th md-column md-order-by="name">
-                  {{ 'TOOLS.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'TOOLS.DESCRIPTION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.customDashboards.rows.length">
-                <td md-cell colspan="4">
-                  <div layout="row" layout-align="center center">
-                    <span translate="TOOLS.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="customDashboard"
-                md-select-id="id"
-                ng-repeat="customDashboard in vm.customDashboards.rows"
-              >
-                <td md-cell ng-if="customDashboard.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{customDashboard.name}}"
-                    ng-src="api/users/{{customDashboard.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!customDashboard.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{customDashboard.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(customDashboard, ev) : vm.createOrEditCustomDashboard($event, customDashboard)"
-                  md-cell
-                  class="id"
-                >
-                  {{customDashboard.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(customDashboard, ev) : vm.createOrEditCustomDashboard($event, customDashboard)"
-                  md-cell
-                  class="name"
-                >
-                  {{customDashboard.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(customDashboard, ev) : vm.createOrEditCustomDashboard($event, customDashboard)"
-                  md-cell
-                  class="description"
-                >
-                  {{customDashboard.description}}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="TOOLS.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(customDashboard, $event    )"
-                          translate="TOOLS.EDIT_CUSTOMDASHBOARD"
-                        >
-                          Edit CustomDashboard
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.clonedialog(customDashboard, $event    )"
-                          translate="TOOLS.CLONE_CUSTOMDASHBOARD"
-                        >
-                          clone CustomDashboard
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.gotodashboardgoto(customDashboard, $event    )"
-                          translate="TOOLS.GOTODASHBOARD_CUSTOMDASHBOARD"
-                        >
-                          goToDashboard CustomDashboard
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(customDashboard, $event    )"
-                          translate="TOOLS.DELETE_CUSTOMDASHBOARD"
-                        >
-                          Delete CustomDashboard
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'TOOLS.PAGE' | translate}}:', rowsPerPage: '{{'TOOLS.ROWSPERPAGE' | translate}}:', of: '{{'TOOLS.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.customDashboards.count}}"
-          md-on-paginate="vm.getCustomDashboards"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / CUSTOMDASHBOARD TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD CUSTOMDASHBOARD BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-customDashboard-button"
-    ng-click="vm.createOrEditCustomDashboard($event)"
-    aria-label="add customDashboard"
-    translate
-    translate-attr-aria-label="TOOLS.ADD_CUSTOMDASHBOARD"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD CUSTOMDASHBOARD BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/tools/views/customDashboards/customDashboards.html/customDashboards.html b/public/src/js/modules/main/apps/tools/views/customDashboards/customDashboards.html/customDashboards.html
new file mode 100644
index 0000000..c7ec4ad
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/customDashboards/customDashboards.html/customDashboards.html
@@ -0,0 +1,324 @@
+<div
+  id="customDashboards"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-auto-fix" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="TOOLS.CUSTOMDASHBOARDS"
+          >CustomDashboards</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="TOOLS.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedCustomDashboards.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div
+      class="close-button-wrapper"
+      ng-click="vm.selectedCustomDashboards =[]"
+    >
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="TOOLS.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-customDashboards-count">
+          <span>{{vm.selectedCustomDashboards.length}}</span>
+          <span translate="TOOLS.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="TOOLS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllCustomDashboards()"
+                translate="TOOLS.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectCustomDashboards()"
+                translate="TOOLS.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedCustomDashboards"
+          csv-label="true"
+          filename="customDashboards.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedCustomDashboards($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="TOOLS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- CUSTOMDASHBOARD TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedCustomDashboards"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getCustomDashboards"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'TOOLS.ID' | translate }}</th>
+                <th md-column md-order-by="name">
+                  {{ 'TOOLS.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'TOOLS.DESCRIPTION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.customDashboards.rows.length">
+                <td md-cell colspan="4">
+                  <div layout="row" layout-align="center center">
+                    <span translate="TOOLS.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="customDashboard"
+                md-select-id="id"
+                ng-repeat="customDashboard in vm.customDashboards.rows"
+              >
+                <td md-cell ng-if="customDashboard.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{customDashboard.name}}"
+                    ng-src="api/users/{{customDashboard.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!customDashboard.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{customDashboard.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(customDashboard, ev) : vm.createOrEditCustomDashboard($event, customDashboard)"
+                  md-cell
+                  class="id"
+                >
+                  {{customDashboard.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(customDashboard, ev) : vm.createOrEditCustomDashboard($event, customDashboard)"
+                  md-cell
+                  class="name"
+                >
+                  {{customDashboard.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(customDashboard, ev) : vm.createOrEditCustomDashboard($event, customDashboard)"
+                  md-cell
+                  class="description"
+                >
+                  {{customDashboard.description}}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="TOOLS.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(customDashboard, $event    )"
+                          translate="TOOLS.EDIT_CUSTOMDASHBOARD"
+                        >
+                          Edit CustomDashboard
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.clonedialog(customDashboard, $event    )"
+                          translate="TOOLS.CLONE_CUSTOMDASHBOARD"
+                        >
+                          clone CustomDashboard
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.gotodashboardgoto(customDashboard, $event    )"
+                          translate="TOOLS.GOTODASHBOARD_CUSTOMDASHBOARD"
+                        >
+                          goToDashboard CustomDashboard
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(customDashboard, $event    )"
+                          translate="TOOLS.DELETE_CUSTOMDASHBOARD"
+                        >
+                          Delete CustomDashboard
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'TOOLS.PAGE' | translate}}:', rowsPerPage: '{{'TOOLS.ROWSPERPAGE' | translate}}:', of: '{{'TOOLS.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.customDashboards.count}}"
+          md-on-paginate="vm.getCustomDashboards"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / CUSTOMDASHBOARD TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD CUSTOMDASHBOARD BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-customDashboard-button"
+    ng-click="vm.createOrEditCustomDashboard($event)"
+    aria-label="add customDashboard"
+    translate
+    translate-attr-aria-label="TOOLS.ADD_CUSTOMDASHBOARD"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD CUSTOMDASHBOARD BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/tools/views/customDashboards/edit/clone/clone.html/clone-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/customDashboards/edit/clone/clone.html/clone-[chunkhash].html
deleted file mode 100644
index 0a161f4..0000000
--- a/public/src/js/modules/main/apps/tools/views/customDashboards/edit/clone/clone.html/clone-[chunkhash].html
+++ /dev/null
@@ -1,99 +0,0 @@
-<md-dialog class="customDashboard-dialog" aria-label="Clone CustomDashboard">
-  <form name="customDashboardForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.customDashboard.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="customDashboardForm['name'].$error"
-          ng-show="customDashboardForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <md-button
-        type="submit"
-        ng-click="vm.cloneCustomDashboard()"
-        class="send-button md-accent md-raised"
-        ng-disabled="customDashboardForm.$invalid"
-        aria-label="CLONE"
-        translate="TOOLS.CLONE_CUSTOMDASHBOARD"
-        translate-attr-aria-label="TOOLS.CLONE_CUSTOMDASHBOARD"
-      >
-        CLONE CUSTOMDASHBOARD
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/customDashboards/edit/clone/clone.html/clone.html b/public/src/js/modules/main/apps/tools/views/customDashboards/edit/clone/clone.html/clone.html
new file mode 100644
index 0000000..0a161f4
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/customDashboards/edit/clone/clone.html/clone.html
@@ -0,0 +1,99 @@
+<md-dialog class="customDashboard-dialog" aria-label="Clone CustomDashboard">
+  <form name="customDashboardForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.customDashboard.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="customDashboardForm['name'].$error"
+          ng-show="customDashboardForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <md-button
+        type="submit"
+        ng-click="vm.cloneCustomDashboard()"
+        class="send-button md-accent md-raised"
+        ng-disabled="customDashboardForm.$invalid"
+        aria-label="CLONE"
+        translate="TOOLS.CLONE_CUSTOMDASHBOARD"
+        translate-attr-aria-label="TOOLS.CLONE_CUSTOMDASHBOARD"
+      >
+        CLONE CUSTOMDASHBOARD
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/customDashboards/edit/dashboard/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/customDashboards/edit/dashboard/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index f85fec6..0000000
--- a/public/src/js/modules/main/apps/tools/views/customDashboards/edit/dashboard/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,682 +0,0 @@
-<md-dialog class="dashboarditem-dialog" aria-label="New DashboardItem">
-  <form name="dashboarditemForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.TYPE">Type</label>
-        <md-select
-          name="type"
-          ng-model="vm.dashboarditem.type"
-          autofocus
-          ng-disabled="!vm.newDashboardItem"
-        >
-          <md-option ng-value="'counter'">
-            {{ 'TOOLS.COUNTER' | translate }}
-          </md-option>
-
-          <md-option ng-value="'multibar-chart'">
-            {{ 'TOOLS.MULTIBARCHART' | translate }}
-          </md-option>
-
-          <md-option ng-value="'pie-chart'">
-            {{ 'TOOLS.PIECHART' | translate }}
-          </md-option>
-
-          <md-option ng-value="'web-report'">
-            {{ 'TOOLS.WEBREPORT' | translate }}
-          </md-option>
-
-          <md-option ng-value="'iframe'">
-            {{ 'TOOLS.IFRAME' | translate }}
-          </md-option>
-
-          <md-option ng-value="'clock'">
-            {{ 'TOOLS.CLOCK' | translate }}
-          </md-option>
-
-          <md-option ng-value="'custom'">
-            {{ 'TOOLS.CUSTOMTYPE' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="dashboarditemForm['type'].$error"
-          ng-show="dashboarditemForm['type'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.TYPE_REQUIRED"
-              >Type field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.TITLE">Title</label>
-        <input
-          type="text"
-          name="title"
-          ng-model="vm.dashboarditem.title"
-          md-maxlength="255"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="dashboarditemForm['title'].$error"
-          ng-show="dashboarditemForm['title'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.TITLE_REQUIRED"
-              >Title field is required</span
-            >
-          </div>
-          <div ng-message="md-maxlength">
-            <span
-              translate="TOOLS.ERRORS.TITLE_MAX_LENGTH"
-              translate-values="{max: 255}"
-              >Title must have a maximum length equal to 255</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.dashboarditem.type == 'iframe'"
-        class="md-block"
-      >
-        <label translate="TOOLS.URL">Url</label>
-        <input
-          type="url"
-          name="attrUrl"
-          ng-model="vm.dashboarditem.attrUrl"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="dashboarditemForm['attrUrl'].$error"
-          ng-show="dashboarditemForm['attrUrl'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.URL_REQUIRED"
-              >Url field is required</span
-            >
-          </div>
-          <div ng-message="url">
-            <span translate="TOOLS.ERRORS.URL_MUST_VALID_URL"
-              >Url must be a valid url http://www.xcally.com</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.dashboarditem.type == 'custom'"
-        class="md-block"
-      >
-        <label translate="TOOLS.PATH">Path</label>
-        <input
-          type="text"
-          name="attrPath"
-          ng-model="vm.dashboarditem.attrPath"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="dashboarditemForm['attrPath'].$error"
-          ng-show="dashboarditemForm['attrPath'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.PATH_REQUIRED"
-              >Path field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.dashboarditem.type == 'clock'"
-        class="md-block"
-      >
-        <label translate="TOOLS.FORMAT">Format</label>
-        <input
-          type="text"
-          name="attrHourFormat"
-          ng-model="vm.dashboarditem.attrHourFormat"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="dashboarditemForm['attrHourFormat'].$error"
-          ng-show="dashboarditemForm['attrHourFormat'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.FORMAT_REQUIRED"
-              >Format field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.dashboarditem.type == 'clock'"
-        class="md-block"
-      >
-        <label translate="TOOLS.TIMEZONE">Timezone</label>
-        <md-select
-          name="attrTimezone"
-          ng-model="vm.dashboarditem.attrTimezone"
-          required
-        >
-          <md-option ng-value="'-12.00'">GMT-12.00</md-option>
-          <md-option ng-value="'-11.00'">GMT-11.00</md-option>
-          <md-option ng-value="'-10.00'">GMT-10.00</md-option>
-          <md-option ng-value="'-9.00'">GMT-9.00</md-option>
-          <md-option ng-value="'-8.00'">GMT-8.00</md-option>
-          <md-option ng-value="'-7.00'">GMT-7.00</md-option>
-          <md-option ng-value="'-6.00'">GMT-6.00</md-option>
-          <md-option ng-value="'-5.00'">GMT-5.00</md-option>
-          <md-option ng-value="'-4.00'">GMT-4.00</md-option>
-          <md-option ng-value="'-3.30'">GMT-3.30</md-option>
-          <md-option ng-value="'-3.00'">GMT-3.00</md-option>
-          <md-option ng-value="'-2.00'">GMT-2.00</md-option>
-          <md-option ng-value="'-1.00'">GMT-1.00</md-option>
-          <md-option ng-value="'0.00'">GMT 0.00</md-option>
-          <md-option ng-value="'1.00'">GMT+1.00</md-option>
-          <md-option ng-value="'2.00'">GMT+2.00</md-option>
-          <md-option ng-value="'3.00'">GMT+3.00</md-option>
-          <md-option ng-value="'3.30'">GMT+3.30</md-option>
-          <md-option ng-value="'4.00'">GMT+4.00</md-option>
-          <md-option ng-value="'4.30'">GMT+4.30</md-option>
-          <md-option ng-value="'5.00'">GMT+5.00</md-option>
-          <md-option ng-value="'5.30'">GMT+5.30</md-option>
-          <md-option ng-value="'5.45'">GMT+5.45</md-option>
-          <md-option ng-value="'6.00'">GMT+6.00</md-option>
-          <md-option ng-value="'6.30'">GMT+6.30</md-option>
-          <md-option ng-value="'7.00'">GMT+7.00</md-option>
-          <md-option ng-value="'8.00'">GMT+8.00</md-option>
-          <md-option ng-value="'9.00'">GMT+9.00</md-option>
-          <md-option ng-value="'9.30'">GMT+9.30</md-option>
-          <md-option ng-value="'10.00'">GMT+10.00</md-option>
-          <md-option ng-value="'11.00'">GMT+11.00</md-option>
-          <md-option ng-value="'12.00'">GMT+12.00</md-option>
-          <md-option ng-value="'13.00'">GMT+13.00</md-option>
-        </md-select>
-        <div
-          ng-messages="dashboarditemForm['attrTimezone'].$error"
-          ng-show="dashboarditemForm['attrTimezone'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.TIMEZONE_REQUIRED"
-              >Timezone field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.dashboarditem.type == 'counter'"
-        class="md-block"
-      >
-        <label translate="TOOLS.METRIC">Metric</label>
-        <md-select
-          name="attrMetric"
-          ng-model="vm.dashboarditem.attrMetric"
-          required
-        >
-          <md-option ng-value="'total'">
-            {{ 'TOOLS.TOTAL' | translate }}
-          </md-option>
-
-          <md-option ng-value="'abandoned'">
-            {{ 'TOOLS.ABANDONED' | translate }}
-          </md-option>
-
-          <md-option ng-value="'waiting'">
-            {{ 'TOOLS.WAITING' | translate }}
-          </md-option>
-
-          <md-option ng-value="'talking'">
-            {{ 'TOOLS.TALKING' | translate }}
-          </md-option>
-
-          <md-option ng-value="'answered'">
-            {{ 'TOOLS.ANSWERED' | translate }}
-          </md-option>
-
-          <md-option ng-value="'unmanaged'">
-            {{ 'TOOLS.UNMANAGED' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="dashboarditemForm['attrMetric'].$error"
-          ng-show="dashboarditemForm['attrMetric'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.METRIC_REQUIRED"
-              >Metric field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="['multibar-chart', 'pie-chart'].includes(vm.dashboarditem.type)"
-        class="md-block"
-      >
-        <label translate="TOOLS.SERIE1">Serie1</label>
-        <md-select
-          name="attrSerie1"
-          ng-model="vm.dashboarditem.attrSerie1"
-          required
-        >
-          <md-option ng-value="'total'">
-            {{ 'TOOLS.TOTAL' | translate }}
-          </md-option>
-
-          <md-option ng-value="'abandoned'">
-            {{ 'TOOLS.ABANDONED' | translate }}
-          </md-option>
-
-          <md-option ng-value="'waiting'">
-            {{ 'TOOLS.WAITING' | translate }}
-          </md-option>
-
-          <md-option ng-value="'talking'">
-            {{ 'TOOLS.TALKING' | translate }}
-          </md-option>
-
-          <md-option ng-value="'answered'">
-            {{ 'TOOLS.ANSWERED' | translate }}
-          </md-option>
-
-          <md-option ng-value="'unmanaged'">
-            {{ 'TOOLS.UNMANAGED' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="dashboarditemForm['attrSerie1'].$error"
-          ng-show="dashboarditemForm['attrSerie1'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.SERIE1_REQUIRED"
-              >Serie1 field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="['multibar-chart', 'pie-chart'].includes(vm.dashboarditem.type)"
-        class="md-block"
-      >
-        <label translate="TOOLS.SERIE2">Serie2</label>
-        <md-select name="attrSerie2" ng-model="vm.dashboarditem.attrSerie2">
-          <md-option ng-value="'null'">
-            {{ 'TOOLS.NONE' | translate }}
-          </md-option>
-
-          <md-option ng-value="'total'">
-            {{ 'TOOLS.TOTAL' | translate }}
-          </md-option>
-
-          <md-option ng-value="'abandoned'">
-            {{ 'TOOLS.ABANDONED' | translate }}
-          </md-option>
-
-          <md-option ng-value="'waiting'">
-            {{ 'TOOLS.WAITING' | translate }}
-          </md-option>
-
-          <md-option ng-value="'talking'">
-            {{ 'TOOLS.TALKING' | translate }}
-          </md-option>
-
-          <md-option ng-value="'answered'">
-            {{ 'TOOLS.ANSWERED' | translate }}
-          </md-option>
-
-          <md-option ng-value="'unmanaged'">
-            {{ 'TOOLS.UNMANAGED' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="dashboarditemForm['attrSerie2'].$error"
-          ng-show="dashboarditemForm['attrSerie2'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.SERIE2_REQUIRED"
-              >Serie2 field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="['multibar-chart', 'pie-chart'].includes(vm.dashboarditem.type)"
-        class="md-block"
-      >
-        <label translate="TOOLS.SERIE3">Serie3</label>
-        <md-select name="attrSerie3" ng-model="vm.dashboarditem.attrSerie3">
-          <md-option ng-value="'null'">
-            {{ 'TOOLS.NONE' | translate }}
-          </md-option>
-
-          <md-option ng-value="'total'">
-            {{ 'TOOLS.TOTAL' | translate }}
-          </md-option>
-
-          <md-option ng-value="'abandoned'">
-            {{ 'TOOLS.ABANDONED' | translate }}
-          </md-option>
-
-          <md-option ng-value="'waiting'">
-            {{ 'TOOLS.WAITING' | translate }}
-          </md-option>
-
-          <md-option ng-value="'talking'">
-            {{ 'TOOLS.TALKING' | translate }}
-          </md-option>
-
-          <md-option ng-value="'answered'">
-            {{ 'TOOLS.ANSWERED' | translate }}
-          </md-option>
-
-          <md-option ng-value="'unmanaged'">
-            {{ 'TOOLS.UNMANAGED' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="dashboarditemForm['attrSerie3'].$error"
-          ng-show="dashboarditemForm['attrSerie3'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.SERIE3_REQUIRED"
-              >Serie3 field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.dashboarditem.type == 'web-report'"
-        class="md-block"
-      >
-        <label translate="TOOLS.REPORT">Report</label>
-        <input
-          type="search"
-          name="report"
-          ng-model="vm.dashboarditem.report"
-          ng-required="true"
-          autocomplete="off"
-          ng-click="vm.searchReport()"
-        />
-        <md-icon
-          md-font-icon="icon-magnify"
-          ng-click="vm.searchReport()"
-          aria-label="Search Report"
-        ></md-icon>
-        <div
-          ng-messages="dashboarditemForm['report'].$error"
-          ng-show="dashboarditemForm['report'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.REPORT_REQUIRED"
-              >Report field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.dashboarditem.type == 'web-report'"
-        class="md-block"
-      >
-        <label translate="TOOLS.REFRESH">Refresh</label>
-        <input
-          type="number"
-          name="attrRefresh"
-          ng-model="vm.dashboarditem.attrRefresh"
-          min="5"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="dashboarditemForm['attrRefresh'].$error"
-          ng-show="dashboarditemForm['attrRefresh'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.REFRESH_REQUIRED"
-              >Refresh field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="TOOLS.ERRORS.REFRESH_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Refresh must be a valid greater or equal than</span
-            >
-            <span>5</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="['multibar-chart', 'pie-chart', 'counter'].includes(vm.dashboarditem.type)"
-        class="md-block"
-      >
-        <label translate="TOOLS.FILTERVOICEQUEUES">FilterVoiceQueues</label>
-        <md-select
-          name="attrVoiceQueues"
-          ng-model="vm.dashboarditem.attrVoiceQueues"
-          multiple
-        >
-          <md-option
-            ng-value="attrVoiceQueues.id"
-            ng-repeat="attrVoiceQueues in vm.voiceQueues"
-            ng-disabled="attrVoiceQueues.canSelect === false"
-            >{{ attrVoiceQueues.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="dashboarditemForm['attrVoiceQueues'].$error"
-          ng-show="dashboarditemForm['attrVoiceQueues'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.FILTERVOICEQUEUES_REQUIRED"
-              >FilterVoiceQueues field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="['counter', 'clock'].includes(vm.dashboarditem.type)"
-        class="md-block"
-      >
-        <label translate="TOOLS.FONTSIZE">FontSize</label>
-        <input
-          type="number"
-          name="attrFontSize"
-          ng-model="vm.dashboarditem.attrFontSize"
-          min="12"
-          max="40"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="dashboarditemForm['attrFontSize'].$error"
-          ng-show="dashboarditemForm['attrFontSize'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.FONTSIZE_REQUIRED"
-              >FontSize field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="TOOLS.ERRORS.FONTSIZE_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >FontSize must be a valid greater or equal than</span
-            >
-            <span>12</span>
-          </div>
-          <div ng-message="max">
-            <span
-              translate="TOOLS.ERRORS.FONTSIZE_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-              >FontSize must be a valid greater or equal than</span
-            >
-            <span>40</span>
-          </div>
-        </div>
-      </md-input-container>
-      <div
-        flex
-        md-color-picker
-        ng-model="vm.dashboarditem.foreground"
-        label="{{'TOOLS.FOREGROUND' | translate}}"
-        md-color-hex="true"
-        md-color-rgb="false"
-        md-color-hsl="false"
-        md-color-history="false"
-        md-color-material-palette="false"
-        md-color-alpha-channel="false"
-        open-on-input="true"
-      ></div>
-      <div
-        flex
-        md-color-picker
-        ng-model="vm.dashboarditem.background"
-        label="{{'TOOLS.BACKGROUND' | translate}}"
-        md-color-hex="true"
-        md-color-rgb="false"
-        md-color-hsl="false"
-        md-color-history="false"
-        md-color-material-palette="false"
-        md-color-alpha-channel="false"
-        open-on-input="true"
-      ></div>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.LINK">link</label>
-        <input type="url" name="link" ng-model="vm.dashboarditem.link" />
-
-        <div
-          ng-messages="dashboarditemForm['link'].$error"
-          ng-show="dashboarditemForm['link'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.LINK_REQUIRED"
-              >link field is required</span
-            >
-          </div>
-          <div ng-message="url">
-            <span translate="TOOLS.ERRORS.LINK_MUST_VALID_URL"
-              >link must be a valid url http://www.xcally.com</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newDashboardItem"
-          ng-click="vm.saveDashboardItem()"
-          class="send-button md-accent md-raised"
-          ng-disabled="dashboarditemForm.$invalid || dashboarditemForm.$pristine"
-          aria-label="SAVE"
-          translate="TOOLS.SAVE"
-          translate-attr-aria-label="TOOLS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newDashboardItem"
-          ng-click="vm.addNewDashboardItem()"
-          class="send-button md-accent md-raised"
-          ng-disabled="dashboarditemForm.$invalid"
-          aria-label="ADD"
-          translate="TOOLS.ADD_DASHBOARDITEM"
-          translate-attr-aria-label="TOOLS.ADD_DASHBOARDITEM"
-        >
-          ADD DASHBOARDITEM
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newDashboardItem"
-          ng-click="vm.deleteDashboardItem($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="TOOLS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/customDashboards/edit/dashboard/dialog.html/dialog.html b/public/src/js/modules/main/apps/tools/views/customDashboards/edit/dashboard/dialog.html/dialog.html
new file mode 100644
index 0000000..f85fec6
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/customDashboards/edit/dashboard/dialog.html/dialog.html
@@ -0,0 +1,682 @@
+<md-dialog class="dashboarditem-dialog" aria-label="New DashboardItem">
+  <form name="dashboarditemForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.TYPE">Type</label>
+        <md-select
+          name="type"
+          ng-model="vm.dashboarditem.type"
+          autofocus
+          ng-disabled="!vm.newDashboardItem"
+        >
+          <md-option ng-value="'counter'">
+            {{ 'TOOLS.COUNTER' | translate }}
+          </md-option>
+
+          <md-option ng-value="'multibar-chart'">
+            {{ 'TOOLS.MULTIBARCHART' | translate }}
+          </md-option>
+
+          <md-option ng-value="'pie-chart'">
+            {{ 'TOOLS.PIECHART' | translate }}
+          </md-option>
+
+          <md-option ng-value="'web-report'">
+            {{ 'TOOLS.WEBREPORT' | translate }}
+          </md-option>
+
+          <md-option ng-value="'iframe'">
+            {{ 'TOOLS.IFRAME' | translate }}
+          </md-option>
+
+          <md-option ng-value="'clock'">
+            {{ 'TOOLS.CLOCK' | translate }}
+          </md-option>
+
+          <md-option ng-value="'custom'">
+            {{ 'TOOLS.CUSTOMTYPE' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="dashboarditemForm['type'].$error"
+          ng-show="dashboarditemForm['type'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.TYPE_REQUIRED"
+              >Type field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.TITLE">Title</label>
+        <input
+          type="text"
+          name="title"
+          ng-model="vm.dashboarditem.title"
+          md-maxlength="255"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="dashboarditemForm['title'].$error"
+          ng-show="dashboarditemForm['title'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.TITLE_REQUIRED"
+              >Title field is required</span
+            >
+          </div>
+          <div ng-message="md-maxlength">
+            <span
+              translate="TOOLS.ERRORS.TITLE_MAX_LENGTH"
+              translate-values="{max: 255}"
+              >Title must have a maximum length equal to 255</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.dashboarditem.type == 'iframe'"
+        class="md-block"
+      >
+        <label translate="TOOLS.URL">Url</label>
+        <input
+          type="url"
+          name="attrUrl"
+          ng-model="vm.dashboarditem.attrUrl"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="dashboarditemForm['attrUrl'].$error"
+          ng-show="dashboarditemForm['attrUrl'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.URL_REQUIRED"
+              >Url field is required</span
+            >
+          </div>
+          <div ng-message="url">
+            <span translate="TOOLS.ERRORS.URL_MUST_VALID_URL"
+              >Url must be a valid url http://www.xcally.com</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.dashboarditem.type == 'custom'"
+        class="md-block"
+      >
+        <label translate="TOOLS.PATH">Path</label>
+        <input
+          type="text"
+          name="attrPath"
+          ng-model="vm.dashboarditem.attrPath"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="dashboarditemForm['attrPath'].$error"
+          ng-show="dashboarditemForm['attrPath'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.PATH_REQUIRED"
+              >Path field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.dashboarditem.type == 'clock'"
+        class="md-block"
+      >
+        <label translate="TOOLS.FORMAT">Format</label>
+        <input
+          type="text"
+          name="attrHourFormat"
+          ng-model="vm.dashboarditem.attrHourFormat"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="dashboarditemForm['attrHourFormat'].$error"
+          ng-show="dashboarditemForm['attrHourFormat'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.FORMAT_REQUIRED"
+              >Format field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.dashboarditem.type == 'clock'"
+        class="md-block"
+      >
+        <label translate="TOOLS.TIMEZONE">Timezone</label>
+        <md-select
+          name="attrTimezone"
+          ng-model="vm.dashboarditem.attrTimezone"
+          required
+        >
+          <md-option ng-value="'-12.00'">GMT-12.00</md-option>
+          <md-option ng-value="'-11.00'">GMT-11.00</md-option>
+          <md-option ng-value="'-10.00'">GMT-10.00</md-option>
+          <md-option ng-value="'-9.00'">GMT-9.00</md-option>
+          <md-option ng-value="'-8.00'">GMT-8.00</md-option>
+          <md-option ng-value="'-7.00'">GMT-7.00</md-option>
+          <md-option ng-value="'-6.00'">GMT-6.00</md-option>
+          <md-option ng-value="'-5.00'">GMT-5.00</md-option>
+          <md-option ng-value="'-4.00'">GMT-4.00</md-option>
+          <md-option ng-value="'-3.30'">GMT-3.30</md-option>
+          <md-option ng-value="'-3.00'">GMT-3.00</md-option>
+          <md-option ng-value="'-2.00'">GMT-2.00</md-option>
+          <md-option ng-value="'-1.00'">GMT-1.00</md-option>
+          <md-option ng-value="'0.00'">GMT 0.00</md-option>
+          <md-option ng-value="'1.00'">GMT+1.00</md-option>
+          <md-option ng-value="'2.00'">GMT+2.00</md-option>
+          <md-option ng-value="'3.00'">GMT+3.00</md-option>
+          <md-option ng-value="'3.30'">GMT+3.30</md-option>
+          <md-option ng-value="'4.00'">GMT+4.00</md-option>
+          <md-option ng-value="'4.30'">GMT+4.30</md-option>
+          <md-option ng-value="'5.00'">GMT+5.00</md-option>
+          <md-option ng-value="'5.30'">GMT+5.30</md-option>
+          <md-option ng-value="'5.45'">GMT+5.45</md-option>
+          <md-option ng-value="'6.00'">GMT+6.00</md-option>
+          <md-option ng-value="'6.30'">GMT+6.30</md-option>
+          <md-option ng-value="'7.00'">GMT+7.00</md-option>
+          <md-option ng-value="'8.00'">GMT+8.00</md-option>
+          <md-option ng-value="'9.00'">GMT+9.00</md-option>
+          <md-option ng-value="'9.30'">GMT+9.30</md-option>
+          <md-option ng-value="'10.00'">GMT+10.00</md-option>
+          <md-option ng-value="'11.00'">GMT+11.00</md-option>
+          <md-option ng-value="'12.00'">GMT+12.00</md-option>
+          <md-option ng-value="'13.00'">GMT+13.00</md-option>
+        </md-select>
+        <div
+          ng-messages="dashboarditemForm['attrTimezone'].$error"
+          ng-show="dashboarditemForm['attrTimezone'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.TIMEZONE_REQUIRED"
+              >Timezone field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.dashboarditem.type == 'counter'"
+        class="md-block"
+      >
+        <label translate="TOOLS.METRIC">Metric</label>
+        <md-select
+          name="attrMetric"
+          ng-model="vm.dashboarditem.attrMetric"
+          required
+        >
+          <md-option ng-value="'total'">
+            {{ 'TOOLS.TOTAL' | translate }}
+          </md-option>
+
+          <md-option ng-value="'abandoned'">
+            {{ 'TOOLS.ABANDONED' | translate }}
+          </md-option>
+
+          <md-option ng-value="'waiting'">
+            {{ 'TOOLS.WAITING' | translate }}
+          </md-option>
+
+          <md-option ng-value="'talking'">
+            {{ 'TOOLS.TALKING' | translate }}
+          </md-option>
+
+          <md-option ng-value="'answered'">
+            {{ 'TOOLS.ANSWERED' | translate }}
+          </md-option>
+
+          <md-option ng-value="'unmanaged'">
+            {{ 'TOOLS.UNMANAGED' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="dashboarditemForm['attrMetric'].$error"
+          ng-show="dashboarditemForm['attrMetric'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.METRIC_REQUIRED"
+              >Metric field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="['multibar-chart', 'pie-chart'].includes(vm.dashboarditem.type)"
+        class="md-block"
+      >
+        <label translate="TOOLS.SERIE1">Serie1</label>
+        <md-select
+          name="attrSerie1"
+          ng-model="vm.dashboarditem.attrSerie1"
+          required
+        >
+          <md-option ng-value="'total'">
+            {{ 'TOOLS.TOTAL' | translate }}
+          </md-option>
+
+          <md-option ng-value="'abandoned'">
+            {{ 'TOOLS.ABANDONED' | translate }}
+          </md-option>
+
+          <md-option ng-value="'waiting'">
+            {{ 'TOOLS.WAITING' | translate }}
+          </md-option>
+
+          <md-option ng-value="'talking'">
+            {{ 'TOOLS.TALKING' | translate }}
+          </md-option>
+
+          <md-option ng-value="'answered'">
+            {{ 'TOOLS.ANSWERED' | translate }}
+          </md-option>
+
+          <md-option ng-value="'unmanaged'">
+            {{ 'TOOLS.UNMANAGED' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="dashboarditemForm['attrSerie1'].$error"
+          ng-show="dashboarditemForm['attrSerie1'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.SERIE1_REQUIRED"
+              >Serie1 field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="['multibar-chart', 'pie-chart'].includes(vm.dashboarditem.type)"
+        class="md-block"
+      >
+        <label translate="TOOLS.SERIE2">Serie2</label>
+        <md-select name="attrSerie2" ng-model="vm.dashboarditem.attrSerie2">
+          <md-option ng-value="'null'">
+            {{ 'TOOLS.NONE' | translate }}
+          </md-option>
+
+          <md-option ng-value="'total'">
+            {{ 'TOOLS.TOTAL' | translate }}
+          </md-option>
+
+          <md-option ng-value="'abandoned'">
+            {{ 'TOOLS.ABANDONED' | translate }}
+          </md-option>
+
+          <md-option ng-value="'waiting'">
+            {{ 'TOOLS.WAITING' | translate }}
+          </md-option>
+
+          <md-option ng-value="'talking'">
+            {{ 'TOOLS.TALKING' | translate }}
+          </md-option>
+
+          <md-option ng-value="'answered'">
+            {{ 'TOOLS.ANSWERED' | translate }}
+          </md-option>
+
+          <md-option ng-value="'unmanaged'">
+            {{ 'TOOLS.UNMANAGED' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="dashboarditemForm['attrSerie2'].$error"
+          ng-show="dashboarditemForm['attrSerie2'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.SERIE2_REQUIRED"
+              >Serie2 field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="['multibar-chart', 'pie-chart'].includes(vm.dashboarditem.type)"
+        class="md-block"
+      >
+        <label translate="TOOLS.SERIE3">Serie3</label>
+        <md-select name="attrSerie3" ng-model="vm.dashboarditem.attrSerie3">
+          <md-option ng-value="'null'">
+            {{ 'TOOLS.NONE' | translate }}
+          </md-option>
+
+          <md-option ng-value="'total'">
+            {{ 'TOOLS.TOTAL' | translate }}
+          </md-option>
+
+          <md-option ng-value="'abandoned'">
+            {{ 'TOOLS.ABANDONED' | translate }}
+          </md-option>
+
+          <md-option ng-value="'waiting'">
+            {{ 'TOOLS.WAITING' | translate }}
+          </md-option>
+
+          <md-option ng-value="'talking'">
+            {{ 'TOOLS.TALKING' | translate }}
+          </md-option>
+
+          <md-option ng-value="'answered'">
+            {{ 'TOOLS.ANSWERED' | translate }}
+          </md-option>
+
+          <md-option ng-value="'unmanaged'">
+            {{ 'TOOLS.UNMANAGED' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="dashboarditemForm['attrSerie3'].$error"
+          ng-show="dashboarditemForm['attrSerie3'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.SERIE3_REQUIRED"
+              >Serie3 field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.dashboarditem.type == 'web-report'"
+        class="md-block"
+      >
+        <label translate="TOOLS.REPORT">Report</label>
+        <input
+          type="search"
+          name="report"
+          ng-model="vm.dashboarditem.report"
+          ng-required="true"
+          autocomplete="off"
+          ng-click="vm.searchReport()"
+        />
+        <md-icon
+          md-font-icon="icon-magnify"
+          ng-click="vm.searchReport()"
+          aria-label="Search Report"
+        ></md-icon>
+        <div
+          ng-messages="dashboarditemForm['report'].$error"
+          ng-show="dashboarditemForm['report'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.REPORT_REQUIRED"
+              >Report field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.dashboarditem.type == 'web-report'"
+        class="md-block"
+      >
+        <label translate="TOOLS.REFRESH">Refresh</label>
+        <input
+          type="number"
+          name="attrRefresh"
+          ng-model="vm.dashboarditem.attrRefresh"
+          min="5"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="dashboarditemForm['attrRefresh'].$error"
+          ng-show="dashboarditemForm['attrRefresh'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.REFRESH_REQUIRED"
+              >Refresh field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="TOOLS.ERRORS.REFRESH_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Refresh must be a valid greater or equal than</span
+            >
+            <span>5</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="['multibar-chart', 'pie-chart', 'counter'].includes(vm.dashboarditem.type)"
+        class="md-block"
+      >
+        <label translate="TOOLS.FILTERVOICEQUEUES">FilterVoiceQueues</label>
+        <md-select
+          name="attrVoiceQueues"
+          ng-model="vm.dashboarditem.attrVoiceQueues"
+          multiple
+        >
+          <md-option
+            ng-value="attrVoiceQueues.id"
+            ng-repeat="attrVoiceQueues in vm.voiceQueues"
+            ng-disabled="attrVoiceQueues.canSelect === false"
+            >{{ attrVoiceQueues.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="dashboarditemForm['attrVoiceQueues'].$error"
+          ng-show="dashboarditemForm['attrVoiceQueues'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.FILTERVOICEQUEUES_REQUIRED"
+              >FilterVoiceQueues field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="['counter', 'clock'].includes(vm.dashboarditem.type)"
+        class="md-block"
+      >
+        <label translate="TOOLS.FONTSIZE">FontSize</label>
+        <input
+          type="number"
+          name="attrFontSize"
+          ng-model="vm.dashboarditem.attrFontSize"
+          min="12"
+          max="40"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="dashboarditemForm['attrFontSize'].$error"
+          ng-show="dashboarditemForm['attrFontSize'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.FONTSIZE_REQUIRED"
+              >FontSize field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="TOOLS.ERRORS.FONTSIZE_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >FontSize must be a valid greater or equal than</span
+            >
+            <span>12</span>
+          </div>
+          <div ng-message="max">
+            <span
+              translate="TOOLS.ERRORS.FONTSIZE_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+              >FontSize must be a valid greater or equal than</span
+            >
+            <span>40</span>
+          </div>
+        </div>
+      </md-input-container>
+      <div
+        flex
+        md-color-picker
+        ng-model="vm.dashboarditem.foreground"
+        label="{{'TOOLS.FOREGROUND' | translate}}"
+        md-color-hex="true"
+        md-color-rgb="false"
+        md-color-hsl="false"
+        md-color-history="false"
+        md-color-material-palette="false"
+        md-color-alpha-channel="false"
+        open-on-input="true"
+      ></div>
+      <div
+        flex
+        md-color-picker
+        ng-model="vm.dashboarditem.background"
+        label="{{'TOOLS.BACKGROUND' | translate}}"
+        md-color-hex="true"
+        md-color-rgb="false"
+        md-color-hsl="false"
+        md-color-history="false"
+        md-color-material-palette="false"
+        md-color-alpha-channel="false"
+        open-on-input="true"
+      ></div>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.LINK">link</label>
+        <input type="url" name="link" ng-model="vm.dashboarditem.link" />
+
+        <div
+          ng-messages="dashboarditemForm['link'].$error"
+          ng-show="dashboarditemForm['link'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.LINK_REQUIRED"
+              >link field is required</span
+            >
+          </div>
+          <div ng-message="url">
+            <span translate="TOOLS.ERRORS.LINK_MUST_VALID_URL"
+              >link must be a valid url http://www.xcally.com</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newDashboardItem"
+          ng-click="vm.saveDashboardItem()"
+          class="send-button md-accent md-raised"
+          ng-disabled="dashboarditemForm.$invalid || dashboarditemForm.$pristine"
+          aria-label="SAVE"
+          translate="TOOLS.SAVE"
+          translate-attr-aria-label="TOOLS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newDashboardItem"
+          ng-click="vm.addNewDashboardItem()"
+          class="send-button md-accent md-raised"
+          ng-disabled="dashboarditemForm.$invalid"
+          aria-label="ADD"
+          translate="TOOLS.ADD_DASHBOARDITEM"
+          translate-attr-aria-label="TOOLS.ADD_DASHBOARDITEM"
+        >
+          ADD DASHBOARDITEM
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newDashboardItem"
+          ng-click="vm.deleteDashboardItem($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="TOOLS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/customDashboards/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/customDashboards/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index c34d147..0000000
--- a/public/src/js/modules/main/apps/tools/views/customDashboards/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,209 +0,0 @@
-<div
-  id="tools-customDashboard"
-  class="page-layout simple tabbed"
-  layout="column"
->
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-customDashboards-button md-icon-button"
-        aria-label="Go to customDashboards"
-        ng-click="vm.gotoCustomDashboards()"
-        translate
-        translate-attr-aria-label="TOOLS.GO_TO_CUSTOMDASHBOARDS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="customDashboard-image" hide-xs>
-          <img ng-src="assets/images/business/customDashboards.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.customDashboard.id}}
-            <span ng-if="vm.customDashboard.name"
-              >{{vm.customDashboard.name}}</span
-            >
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="TOOLS.CREATED_AT"></span>
-            <span>{{vm.customDashboard.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div ng-cloak ng-if="vm.crudPermissions.canEdit">
-      <md-button
-        ng-click="vm.clonedialog(vm.customDashboard, $event)"
-        class="md-fab md-green-500-bg md-icon-button"
-        aria-label="clone"
-      >
-        <md-tooltip
-          ><span translate="TOOLS.CLONE_CUSTOMDASHBOARD"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-content-duplicate"></md-icon>
-      </md-button>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.gotogoto(vm.customDashboard, $event)"
-        class="md-fab md-warn md-icon-button"
-        aria-label="goto"
-      >
-        <md-tooltip
-          ><span translate="TOOLS.GOTO_CUSTOMDASHBOARD"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-forward"></md-icon>
-      </md-button>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveCustomDashboard()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (dashboardForm.$invalid)"
-        translate="TOOLS.SAVE"
-        translate-attr-aria-label="TOOLS.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="TOOLS.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="customDashboard-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="TOOLS.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.customDashboard.name"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.customDashboard.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="TOOLS.DASHBOARD">DASHBOARD</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="customDashboard-detail-form-container dashboard md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="CustomDashboardItemsController as vm_cd"
-              ng-init="vm_cd.init(vm.customDashboard, vm.crudPermissions)"
-              class="customDashboard-detail-form-container no-padding no-margin"
-              layout="column"
-            >
-              <div ng-if="vm_cd.customDashboard.widgets.length">
-                <md-button
-                  class="md-fab md-mini md-accent"
-                  ng-click="vm_cd.createOrEditWidget()"
-                  ng-if="vm_cd.crudPermissions.canEdit"
-                  aria-label="add item"
-                >
-                  <md-tooltip>{{ 'TOOLS.ADD_WIDGET' | translate }}</md-tooltip>
-                  <md-icon md-font-icon="icon-plus"></md-icon>
-                </md-button>
-                <md-content flex>
-                  <ms-widget-engine
-                    config="vm_cd.customDashboard"
-                    on-edit="vm_cd.createOrEditWidget(widget)"
-                    on-delete="vm_cd.deleteWidget(widget)"
-                  ></ms-widget-engine>
-                </md-content>
-              </div>
-              <div
-                ng-if="!vm_cd.customDashboard.widgets.length"
-                layout="row"
-                layout-align="center center"
-                flex
-              >
-                <md-button
-                  class="width-130 height-130 md-accent md-raised"
-                  ng-click="vm_cd.createOrEditWidget()"
-                  aria-label="add item"
-                  layout="column"
-                >
-                  <md-icon
-                    md-font-icon="icon-plus-circle"
-                    class="s50"
-                  ></md-icon>
-                  <span layout-wrap translate="TOOLS.ADD_WIDGET"></span>
-                </md-button>
-              </div>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/tools/views/customDashboards/edit/view.html/view.html b/public/src/js/modules/main/apps/tools/views/customDashboards/edit/view.html/view.html
new file mode 100644
index 0000000..c34d147
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/customDashboards/edit/view.html/view.html
@@ -0,0 +1,209 @@
+<div
+  id="tools-customDashboard"
+  class="page-layout simple tabbed"
+  layout="column"
+>
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-customDashboards-button md-icon-button"
+        aria-label="Go to customDashboards"
+        ng-click="vm.gotoCustomDashboards()"
+        translate
+        translate-attr-aria-label="TOOLS.GO_TO_CUSTOMDASHBOARDS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="customDashboard-image" hide-xs>
+          <img ng-src="assets/images/business/customDashboards.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.customDashboard.id}}
+            <span ng-if="vm.customDashboard.name"
+              >{{vm.customDashboard.name}}</span
+            >
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="TOOLS.CREATED_AT"></span>
+            <span>{{vm.customDashboard.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div ng-cloak ng-if="vm.crudPermissions.canEdit">
+      <md-button
+        ng-click="vm.clonedialog(vm.customDashboard, $event)"
+        class="md-fab md-green-500-bg md-icon-button"
+        aria-label="clone"
+      >
+        <md-tooltip
+          ><span translate="TOOLS.CLONE_CUSTOMDASHBOARD"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-content-duplicate"></md-icon>
+      </md-button>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.gotogoto(vm.customDashboard, $event)"
+        class="md-fab md-warn md-icon-button"
+        aria-label="goto"
+      >
+        <md-tooltip
+          ><span translate="TOOLS.GOTO_CUSTOMDASHBOARD"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-forward"></md-icon>
+      </md-button>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveCustomDashboard()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (dashboardForm.$invalid)"
+        translate="TOOLS.SAVE"
+        translate-attr-aria-label="TOOLS.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="TOOLS.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="customDashboard-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="TOOLS.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.customDashboard.name"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.customDashboard.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="TOOLS.DASHBOARD">DASHBOARD</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="customDashboard-detail-form-container dashboard md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="CustomDashboardItemsController as vm_cd"
+              ng-init="vm_cd.init(vm.customDashboard, vm.crudPermissions)"
+              class="customDashboard-detail-form-container no-padding no-margin"
+              layout="column"
+            >
+              <div ng-if="vm_cd.customDashboard.widgets.length">
+                <md-button
+                  class="md-fab md-mini md-accent"
+                  ng-click="vm_cd.createOrEditWidget()"
+                  ng-if="vm_cd.crudPermissions.canEdit"
+                  aria-label="add item"
+                >
+                  <md-tooltip>{{ 'TOOLS.ADD_WIDGET' | translate }}</md-tooltip>
+                  <md-icon md-font-icon="icon-plus"></md-icon>
+                </md-button>
+                <md-content flex>
+                  <ms-widget-engine
+                    config="vm_cd.customDashboard"
+                    on-edit="vm_cd.createOrEditWidget(widget)"
+                    on-delete="vm_cd.deleteWidget(widget)"
+                  ></ms-widget-engine>
+                </md-content>
+              </div>
+              <div
+                ng-if="!vm_cd.customDashboard.widgets.length"
+                layout="row"
+                layout-align="center center"
+                flex
+              >
+                <md-button
+                  class="width-130 height-130 md-accent md-raised"
+                  ng-click="vm_cd.createOrEditWidget()"
+                  aria-label="add item"
+                  layout="column"
+                >
+                  <md-icon
+                    md-font-icon="icon-plus-circle"
+                    class="s50"
+                  ></md-icon>
+                  <span layout-wrap translate="TOOLS.ADD_WIDGET"></span>
+                </md-button>
+              </div>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/tools/views/customDashboards/partialViews/reports/treeReports.html/treeReports-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/customDashboards/partialViews/reports/treeReports.html/treeReports-[chunkhash].html
deleted file mode 100644
index eaefc20..0000000
--- a/public/src/js/modules/main/apps/tools/views/customDashboards/partialViews/reports/treeReports.html/treeReports-[chunkhash].html
+++ /dev/null
@@ -1,125 +0,0 @@
-<md-dialog
-  class="report-selection-dialog"
-  aria-label="Report Selection"
-  flex="60"
->
-  <md-toolbar>
-    <div class="md-toolbar-tools">
-      <h2>Select Report</h2>
-      <span flex></span>
-      <md-button class="md-icon-button" ng-click="vm.closeReportDialog()">
-        <md-icon md-font-icon="icon-close" aria-label="Close dialog"></md-icon>
-      </md-button>
-    </div>
-  </md-toolbar>
-
-  <md-dialog-content>
-    <div
-      class="content"
-      md-background-bg
-      layout="row"
-      layout-align="start start"
-    >
-      <div layout="column" flex="30">
-        <md-card class="padding-10 scrollable" ms-scroll>
-          <div
-            js-tree="vm.treeConfig"
-            tree-events-obj="vm.treeDefaultEvents"
-            ng-model="vm.treeDefaultData"
-            tree="vm.treeDefaultInstance"
-          ></div>
-        </md-card>
-        <md-card class="padding-10 scrollable" ms-scroll>
-          <div
-            js-tree="vm.treeConfig"
-            tree-events-obj="vm.treeCustomEvents"
-            ng-model="vm.treeCustomData"
-            tree="vm.treeCustomInstance"
-          ></div>
-        </md-card>
-      </div>
-      <md-card flex="70">
-        <md-toolbar class="md-table-toolbar md-default">
-          <div class="md-toolbar-tools">
-            <span class="h2 secondary-text">{{vm.currentNode.text}}</span>
-            <p ng-if="vm.currentPath">
-              <span class="text-boxed">{{vm.currentPath}}</span>
-            </p>
-          </div>
-        </md-toolbar>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            ng-model="vm.selectedReport"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getReports"
-            >
-              <tr md-row>
-                <th md-column md-order-by="id" width="10px">
-                  {{ "ANALYTICS.ID" | translate }}
-                </th>
-                <th md-column md-order-by="name">
-                  {{ "ANALYTICS.NAME" | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ "ANALYTICS.DESCRIPTION" | translate }}
-                </th>
-                <th md-column md-order-by="createdAt">
-                  {{ "ANALYTICS.CREATED_AT" | translate }}
-                </th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.reports.rows.length">
-                <td md-cell colspan="5">
-                  <div layout="row" layout-align="center center">
-                    <span translate="ANALYTICS.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="report"
-                md-select-id="id"
-                ng-repeat="report in vm.reports.rows"
-              >
-                <td md-cell class="id">{{ report.id }}</td>
-                <td md-cell class="name">{{ report.name }}</td>
-                <td md-cell class="description">{{ report.description }}</td>
-                <td md-cell class="createdAt">
-                  {{ report.createdAt | date: "medium" }}
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{ 'ANALYTICS.PAGE' | translate }}:', rowsPerPage: '{{ 'ANALYTICS.ROWSPERPAGE' | translate }}:', of: '{{ 'ANALYTICS.OF' | translate }}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10]"
-          md-page="vm.query.page"
-          md-total="{{ vm.reports.count }}"
-          md-on-paginate="vm.getReports"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-    </div>
-  </md-dialog-content>
-  <md-dialog-actions layout="row">
-    <span flex></span>
-    <md-button class="md-raised" ng-click="vm.closeReportDialog()"
-      >CANCEL</md-button
-    >
-    <md-button class="md-accent md-raised" ng-click="vm.selectReport()"
-      >CONFIRM</md-button
-    >
-  </md-dialog-actions>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/customDashboards/partialViews/reports/treeReports.html/treeReports.html b/public/src/js/modules/main/apps/tools/views/customDashboards/partialViews/reports/treeReports.html/treeReports.html
new file mode 100644
index 0000000..eaefc20
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/customDashboards/partialViews/reports/treeReports.html/treeReports.html
@@ -0,0 +1,125 @@
+<md-dialog
+  class="report-selection-dialog"
+  aria-label="Report Selection"
+  flex="60"
+>
+  <md-toolbar>
+    <div class="md-toolbar-tools">
+      <h2>Select Report</h2>
+      <span flex></span>
+      <md-button class="md-icon-button" ng-click="vm.closeReportDialog()">
+        <md-icon md-font-icon="icon-close" aria-label="Close dialog"></md-icon>
+      </md-button>
+    </div>
+  </md-toolbar>
+
+  <md-dialog-content>
+    <div
+      class="content"
+      md-background-bg
+      layout="row"
+      layout-align="start start"
+    >
+      <div layout="column" flex="30">
+        <md-card class="padding-10 scrollable" ms-scroll>
+          <div
+            js-tree="vm.treeConfig"
+            tree-events-obj="vm.treeDefaultEvents"
+            ng-model="vm.treeDefaultData"
+            tree="vm.treeDefaultInstance"
+          ></div>
+        </md-card>
+        <md-card class="padding-10 scrollable" ms-scroll>
+          <div
+            js-tree="vm.treeConfig"
+            tree-events-obj="vm.treeCustomEvents"
+            ng-model="vm.treeCustomData"
+            tree="vm.treeCustomInstance"
+          ></div>
+        </md-card>
+      </div>
+      <md-card flex="70">
+        <md-toolbar class="md-table-toolbar md-default">
+          <div class="md-toolbar-tools">
+            <span class="h2 secondary-text">{{vm.currentNode.text}}</span>
+            <p ng-if="vm.currentPath">
+              <span class="text-boxed">{{vm.currentPath}}</span>
+            </p>
+          </div>
+        </md-toolbar>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            ng-model="vm.selectedReport"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getReports"
+            >
+              <tr md-row>
+                <th md-column md-order-by="id" width="10px">
+                  {{ "ANALYTICS.ID" | translate }}
+                </th>
+                <th md-column md-order-by="name">
+                  {{ "ANALYTICS.NAME" | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ "ANALYTICS.DESCRIPTION" | translate }}
+                </th>
+                <th md-column md-order-by="createdAt">
+                  {{ "ANALYTICS.CREATED_AT" | translate }}
+                </th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.reports.rows.length">
+                <td md-cell colspan="5">
+                  <div layout="row" layout-align="center center">
+                    <span translate="ANALYTICS.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="report"
+                md-select-id="id"
+                ng-repeat="report in vm.reports.rows"
+              >
+                <td md-cell class="id">{{ report.id }}</td>
+                <td md-cell class="name">{{ report.name }}</td>
+                <td md-cell class="description">{{ report.description }}</td>
+                <td md-cell class="createdAt">
+                  {{ report.createdAt | date: "medium" }}
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{ 'ANALYTICS.PAGE' | translate }}:', rowsPerPage: '{{ 'ANALYTICS.ROWSPERPAGE' | translate }}:', of: '{{ 'ANALYTICS.OF' | translate }}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10]"
+          md-page="vm.query.page"
+          md-total="{{ vm.reports.count }}"
+          md-on-paginate="vm.getReports"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+    </div>
+  </md-dialog-content>
+  <md-dialog-actions layout="row">
+    <span flex></span>
+    <md-button class="md-raised" ng-click="vm.closeReportDialog()"
+      >CANCEL</md-button
+    >
+    <md-button class="md-accent md-raised" ng-click="vm.selectReport()"
+      >CONFIRM</md-button
+    >
+  </md-dialog-actions>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/dispositions/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/dispositions/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index bf963da..0000000
--- a/public/src/js/modules/main/apps/tools/views/dispositions/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,208 +0,0 @@
-<md-dialog class="disposition-dialog" aria-label="New Disposition">
-  <form name="dispositionForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title"
-          >{{ vm.newDisposition ? 'TOOLS.NEW_DISPOSITION' :
-          'TOOLS.EDIT_DISPOSITION' | translate }}</span
-        >
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content ms-scroll>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.disposition.name"
-          md-maxlength="255"
-          required
-          md-autofocus
-        />
-        <div
-          ng-messages="dispositionForm['name'].$error"
-          ng-show="dispositionForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-          <div ng-message="md-maxlength">
-            <span
-              translate="TOOLS.ERRORS.NAME_MAX_LENGTH"
-              translate-values="{max: 255}"
-              >Name must have a maximum length equal to 255</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.disposition.description"
-          md-maxlength="255"
-        />
-        <div
-          ng-messages="dispositionForm['description'].$error"
-          ng-show="dispositionForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="md-maxlength">
-            <span
-              translate="TOOLS.ERRORS.DESCRIPTION_MAX_LENGTH"
-              translate-values="{max: 255}"
-              >Description must have a maximum length equal to 255</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <div
-        ng-if="vm.newDisposition && vm.dispositions.length > 0 || vm.disposition.ParentId"
-        layout="row"
-        layout-align="start center"
-      >
-        <md-input-container class="md-block" flex>
-          <label translate="TOOLS.FIRST_LEVEL_DISPOSITION"
-            >First Level Disposition</label
-          >
-          <md-select
-            name="firstLevelDisposition"
-            ng-model="vm.firstLevelDisposition"
-            ng-change="vm.onFirstLevelSelection()"
-          >
-            <md-option
-              ng-value="disposition"
-              ng-repeat="disposition in vm.dispositions | filter: { level: 'first' }"
-              ng-disabled="disposition.canSelect === false"
-              >{{ disposition.name }}</md-option
-            >
-          </md-select>
-        </md-input-container>
-        <md-button
-          ng-if="vm.firstLevelDisposition"
-          ng-click="vm.clearSelection('first'); dispositionForm.$setDirty();"
-          class="md-icon-button"
-        >
-          <md-icon
-            md-font-icon="icon-cancel"
-            aria-label="Clear first level disposition selection"
-          >
-          </md-icon>
-        </md-button>
-      </div>
-      <div
-        ng-if="vm.firstLevelDisposition && vm.anySecondLevelDisposition"
-        layout="row"
-        layout-align="start center"
-      >
-        <md-input-container class="md-block" flex>
-          <label translate="TOOLS.SECOND_LEVEL_DISPOSITION"
-            >Second Level Disposition</label
-          >
-          <md-select
-            name="secondLevelDisposition"
-            ng-model="vm.secondLevelDisposition"
-          >
-            <md-option
-              ng-value="disposition"
-              ng-if="disposition.id != vm.disposition.id"
-              ng-repeat="disposition in vm.dispositions | filter: { level: 'second', ParentId: vm.firstLevelDisposition.id }"
-              ng-disabled="disposition.canSelect === false"
-              >{{ disposition.name }}</md-option
-            >
-          </md-select>
-        </md-input-container>
-        <md-button
-          ng-if="vm.secondLevelDisposition"
-          ng-click="vm.clearSelection('second'); dispositionForm.$setDirty();"
-          class="md-icon-button"
-        >
-          <md-icon
-            md-font-icon="icon-cancel"
-            aria-label="Clear first level disposition selection"
-          >
-          </md-icon>
-        </md-button>
-      </div>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newDisposition"
-          ng-click="vm.saveDisposition()"
-          class="send-button md-accent md-raised"
-          ng-disabled="dispositionForm.$invalid || dispositionForm.$pristine"
-          aria-label="SAVE"
-          translate="TOOLS.SAVE"
-          translate-attr-aria-label="TOOLS.SAVE"
-        >
-          SAVE
-        </md-button>
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newDisposition"
-          ng-click="vm.addNewDisposition()"
-          class="send-button md-accent md-raised"
-          ng-disabled="dispositionForm.$invalid"
-          aria-label="ADD"
-          translate="TOOLS.ADD_DISPOSITION"
-          translate-attr-aria-label="TOOLS.ADD_DISPOSITION"
-        >
-          ADD DISPOSITION
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newDisposition"
-          ng-click="vm.deleteDisposition($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="TOOLS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/dispositions/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/tools/views/dispositions/create/dialog.html/dialog.html
new file mode 100644
index 0000000..bf963da
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/dispositions/create/dialog.html/dialog.html
@@ -0,0 +1,208 @@
+<md-dialog class="disposition-dialog" aria-label="New Disposition">
+  <form name="dispositionForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title"
+          >{{ vm.newDisposition ? 'TOOLS.NEW_DISPOSITION' :
+          'TOOLS.EDIT_DISPOSITION' | translate }}</span
+        >
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content ms-scroll>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.disposition.name"
+          md-maxlength="255"
+          required
+          md-autofocus
+        />
+        <div
+          ng-messages="dispositionForm['name'].$error"
+          ng-show="dispositionForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+          <div ng-message="md-maxlength">
+            <span
+              translate="TOOLS.ERRORS.NAME_MAX_LENGTH"
+              translate-values="{max: 255}"
+              >Name must have a maximum length equal to 255</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.disposition.description"
+          md-maxlength="255"
+        />
+        <div
+          ng-messages="dispositionForm['description'].$error"
+          ng-show="dispositionForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="md-maxlength">
+            <span
+              translate="TOOLS.ERRORS.DESCRIPTION_MAX_LENGTH"
+              translate-values="{max: 255}"
+              >Description must have a maximum length equal to 255</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <div
+        ng-if="vm.newDisposition && vm.dispositions.length > 0 || vm.disposition.ParentId"
+        layout="row"
+        layout-align="start center"
+      >
+        <md-input-container class="md-block" flex>
+          <label translate="TOOLS.FIRST_LEVEL_DISPOSITION"
+            >First Level Disposition</label
+          >
+          <md-select
+            name="firstLevelDisposition"
+            ng-model="vm.firstLevelDisposition"
+            ng-change="vm.onFirstLevelSelection()"
+          >
+            <md-option
+              ng-value="disposition"
+              ng-repeat="disposition in vm.dispositions | filter: { level: 'first' }"
+              ng-disabled="disposition.canSelect === false"
+              >{{ disposition.name }}</md-option
+            >
+          </md-select>
+        </md-input-container>
+        <md-button
+          ng-if="vm.firstLevelDisposition"
+          ng-click="vm.clearSelection('first'); dispositionForm.$setDirty();"
+          class="md-icon-button"
+        >
+          <md-icon
+            md-font-icon="icon-cancel"
+            aria-label="Clear first level disposition selection"
+          >
+          </md-icon>
+        </md-button>
+      </div>
+      <div
+        ng-if="vm.firstLevelDisposition && vm.anySecondLevelDisposition"
+        layout="row"
+        layout-align="start center"
+      >
+        <md-input-container class="md-block" flex>
+          <label translate="TOOLS.SECOND_LEVEL_DISPOSITION"
+            >Second Level Disposition</label
+          >
+          <md-select
+            name="secondLevelDisposition"
+            ng-model="vm.secondLevelDisposition"
+          >
+            <md-option
+              ng-value="disposition"
+              ng-if="disposition.id != vm.disposition.id"
+              ng-repeat="disposition in vm.dispositions | filter: { level: 'second', ParentId: vm.firstLevelDisposition.id }"
+              ng-disabled="disposition.canSelect === false"
+              >{{ disposition.name }}</md-option
+            >
+          </md-select>
+        </md-input-container>
+        <md-button
+          ng-if="vm.secondLevelDisposition"
+          ng-click="vm.clearSelection('second'); dispositionForm.$setDirty();"
+          class="md-icon-button"
+        >
+          <md-icon
+            md-font-icon="icon-cancel"
+            aria-label="Clear first level disposition selection"
+          >
+          </md-icon>
+        </md-button>
+      </div>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newDisposition"
+          ng-click="vm.saveDisposition()"
+          class="send-button md-accent md-raised"
+          ng-disabled="dispositionForm.$invalid || dispositionForm.$pristine"
+          aria-label="SAVE"
+          translate="TOOLS.SAVE"
+          translate-attr-aria-label="TOOLS.SAVE"
+        >
+          SAVE
+        </md-button>
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newDisposition"
+          ng-click="vm.addNewDisposition()"
+          class="send-button md-accent md-raised"
+          ng-disabled="dispositionForm.$invalid"
+          aria-label="ADD"
+          translate="TOOLS.ADD_DISPOSITION"
+          translate-attr-aria-label="TOOLS.ADD_DISPOSITION"
+        >
+          ADD DISPOSITION
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newDisposition"
+          ng-click="vm.deleteDisposition($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="TOOLS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/dispositions/dispositions.html/dispositions-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/dispositions/dispositions.html/dispositions-[chunkhash].html
deleted file mode 100644
index 3ee0a44..0000000
--- a/public/src/js/modules/main/apps/tools/views/dispositions/dispositions.html/dispositions-[chunkhash].html
+++ /dev/null
@@ -1,329 +0,0 @@
-<div id="dispositions" class="page-layout simple left-sidenav inner-sidenav">
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-auto-fix" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="TOOLS.DISPOSITIONS"
-          >Dispositions</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="TOOLS.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedDispositions.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedDispositions = []">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="TOOLS.BACK">Back</span>
-      </md-button>
-    </div>
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-dispositions-count">
-          <span>{{vm.selectedDispositions.length}}</span>
-          <span translate="TOOLS.SELECTED">selected</span>
-        </span>
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdOpenMenu($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="TOOLS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllDispositions()"
-                translate="TOOLS.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectDispositions()"
-                translate="TOOLS.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedDispositions"
-          csv-label="true"
-          filename="dispositions.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedDispositions($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="TOOLS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <div layout="row">
-        <div class="column" flex="20">
-          <md-card>
-            <md-card-content>
-              <button
-                layout-align="center center"
-                md-mini-fab
-                ng-click="vm.query.level = null; vm.getDispositions()"
-              >
-                <div layout="row" layout-align="start center">
-                  <md-icon md-font-icon="icon-refresh"></md-icon>
-                  <span class="ph-5"
-                    >{{ 'TOOLS.ALL_DISPOSITIONS' | translate }}</span
-                  >
-                </div>
-              </button>
-            </md-card-content>
-          </md-card>
-          <md-card>
-            <md-card-content>
-              <md-input-container class="md-block" flex-gt-sm="">
-                <label translate="TOOLS.SELECT_LEVEL">Select a level</label>
-                <md-select
-                  placeholder="{{ 'TOOLS.SELECT_LEVEL' | translate }}"
-                  ng-model="vm.query.level"
-                  ng-change="vm.getDispositions()"
-                >
-                  <md-option ng-value="null"
-                    ><em translate="TOOLS.ALL">All</em></md-option
-                  >
-                  <md-option
-                    ng-value="key"
-                    ng-repeat="(key, value) in vm.levels"
-                    >{{ value }}</md-option
-                  >
-                </md-select>
-              </md-input-container>
-            </md-card-content>
-          </md-card>
-        </div>
-        <!-- DISPOSITION TABLE -->
-        <md-card flex="80">
-          <md-table-container>
-            <table
-              md-table
-              md-row-select
-              multiple
-              ng-model="vm.selectedDispositions"
-              md-progress="vm.promise"
-            >
-              <thead
-                md-head
-                md-order="vm.query.sort"
-                md-on-reorder="vm.getDispositions"
-              >
-                <tr md-row>
-                  <th md-column md-order-by="id">
-                    {{ 'TOOLS.ID' | translate }}
-                  </th>
-                  <th md-column md-order-by="level">
-                    {{ 'TOOLS.LEVEL' | translate }}
-                  </th>
-                  <th md-column md-order-by="name">
-                    {{ 'TOOLS.NAME' | translate }}
-                  </th>
-                  <th md-column md-order-by="description">
-                    {{ 'TOOLS.DESCRIPTION' | translate }}
-                  </th>
-                  <th md-column width="10px"></th>
-                </tr>
-              </thead>
-              <tbody md-body>
-                <tr md-row ng-hide="vm.dispositions.rows.length">
-                  <td md-cell colspan="5">
-                    <div layout="row" layout-align="center center">
-                      <span translate="TOOLS.NO_AVAILABLE_INFO"
-                        >No Available Info</span
-                      >
-                    </div>
-                  </td>
-                </tr>
-                <tr
-                  md-row
-                  md-select="disposition"
-                  md-select-id="id"
-                  ng-repeat="disposition in vm.dispositions.rows"
-                >
-                  <td md-cell ng-if="disposition.userpic">
-                    <img
-                      class="avatar"
-                      alt="{{disposition.name}}"
-                      ng-src="api/users/{{disposition.id}}/avatar"
-                    />
-                  </td>
-                  <td
-                    md-cell
-                    ng-if="!disposition.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                  >
-                    <img
-                      class="avatar"
-                      alt="{{disposition.name}}"
-                      ng-src="assets/images/avatars/profile.png"
-                    />
-                  </td>
-                  <td
-                    ng-click="vm.createOrEditDisposition($event, disposition)"
-                    md-cell
-                    class="id"
-                  >
-                    {{disposition.id}}
-                  </td>
-                  <td
-                    ng-click="vm.createOrEditDisposition($event, disposition)"
-                    md-cell
-                    class="level"
-                  >
-                    {{ vm.levels[disposition.level] }}
-                  </td>
-                  <td
-                    ng-click="vm.createOrEditDisposition($event, disposition)"
-                    md-cell
-                    class="name"
-                  >
-                    {{disposition.name}}
-                  </td>
-                  <td
-                    ng-click="vm.createOrEditDisposition($event, disposition)"
-                    md-cell
-                    class="description"
-                  >
-                    {{disposition.description}}
-                  </td>
-                  <td
-                    md-cell
-                    class="actions"
-                    ng-if="!vm.crudPermissions.readOnly"
-                  >
-                    <md-menu>
-                      <md-button
-                        class="md-icon-button"
-                        aria-label="More"
-                        translate
-                        translate-attr-aria-label="TOOLS.MORE"
-                        ng-click="$mdOpenMenu($event)"
-                      >
-                        <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                      </md-button>
-                      <md-menu-content width="3">
-                        <!-- SUBACTIONS -->
-                        <!-- ACTIONS -->
-                        <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                          <md-button
-                            ng-click="vm.createOrEditDisposition($event, disposition)"
-                            translate="TOOLS.EDIT_DISPOSITION"
-                          >
-                            Edit Disposition
-                          </md-button>
-                        </md-menu-item>
-                        <!-- SUBACTIONS -->
-                        <!-- ACTIONS -->
-                        <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                          <md-button
-                            ng-click="vm.deleteconfirm(disposition, $event)"
-                            translate="TOOLS.DELETE_DISPOSITION"
-                          >
-                            Delete Disposition
-                          </md-button>
-                        </md-menu-item>
-                      </md-menu-content>
-                    </md-menu>
-                  </td>
-                </tr>
-              </tbody>
-            </table>
-          </md-table-container>
-          <md-table-pagination
-            md-label="{page: '{{'TOOLS.PAGE' | translate}}:', rowsPerPage: '{{'TOOLS.ROWSPERPAGE' | translate}}:', of: '{{'TOOLS.OF' | translate}}'}"
-            md-limit="vm.query.limit"
-            md-limit-options="[10, 15, 20, 50, 100, 250]"
-            md-page="vm.query.page"
-            md-total="{{vm.dispositions.count}}"
-            md-on-paginate="vm.getDispositions"
-            md-page-select
-          >
-          </md-table-pagination>
-        </md-card>
-        <!-- / DISPOSITION TABLE -->
-      </div>
-      <!-- NO RESULTS -->
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-  <!-- ADD DISPOSITION BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent"
-    id="add-disposition-button"
-    ng-click="vm.createOrEditDisposition($event)"
-    aria-label="add disposition"
-    translate
-    translate-attr-aria-label="TOOLS.ADD_DISPOSITION"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD DISPOSITION BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/tools/views/dispositions/dispositions.html/dispositions.html b/public/src/js/modules/main/apps/tools/views/dispositions/dispositions.html/dispositions.html
new file mode 100644
index 0000000..3ee0a44
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/dispositions/dispositions.html/dispositions.html
@@ -0,0 +1,329 @@
+<div id="dispositions" class="page-layout simple left-sidenav inner-sidenav">
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-auto-fix" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="TOOLS.DISPOSITIONS"
+          >Dispositions</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="TOOLS.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedDispositions.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedDispositions = []">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="TOOLS.BACK">Back</span>
+      </md-button>
+    </div>
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-dispositions-count">
+          <span>{{vm.selectedDispositions.length}}</span>
+          <span translate="TOOLS.SELECTED">selected</span>
+        </span>
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdOpenMenu($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="TOOLS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllDispositions()"
+                translate="TOOLS.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectDispositions()"
+                translate="TOOLS.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedDispositions"
+          csv-label="true"
+          filename="dispositions.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedDispositions($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="TOOLS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <div layout="row">
+        <div class="column" flex="20">
+          <md-card>
+            <md-card-content>
+              <button
+                layout-align="center center"
+                md-mini-fab
+                ng-click="vm.query.level = null; vm.getDispositions()"
+              >
+                <div layout="row" layout-align="start center">
+                  <md-icon md-font-icon="icon-refresh"></md-icon>
+                  <span class="ph-5"
+                    >{{ 'TOOLS.ALL_DISPOSITIONS' | translate }}</span
+                  >
+                </div>
+              </button>
+            </md-card-content>
+          </md-card>
+          <md-card>
+            <md-card-content>
+              <md-input-container class="md-block" flex-gt-sm="">
+                <label translate="TOOLS.SELECT_LEVEL">Select a level</label>
+                <md-select
+                  placeholder="{{ 'TOOLS.SELECT_LEVEL' | translate }}"
+                  ng-model="vm.query.level"
+                  ng-change="vm.getDispositions()"
+                >
+                  <md-option ng-value="null"
+                    ><em translate="TOOLS.ALL">All</em></md-option
+                  >
+                  <md-option
+                    ng-value="key"
+                    ng-repeat="(key, value) in vm.levels"
+                    >{{ value }}</md-option
+                  >
+                </md-select>
+              </md-input-container>
+            </md-card-content>
+          </md-card>
+        </div>
+        <!-- DISPOSITION TABLE -->
+        <md-card flex="80">
+          <md-table-container>
+            <table
+              md-table
+              md-row-select
+              multiple
+              ng-model="vm.selectedDispositions"
+              md-progress="vm.promise"
+            >
+              <thead
+                md-head
+                md-order="vm.query.sort"
+                md-on-reorder="vm.getDispositions"
+              >
+                <tr md-row>
+                  <th md-column md-order-by="id">
+                    {{ 'TOOLS.ID' | translate }}
+                  </th>
+                  <th md-column md-order-by="level">
+                    {{ 'TOOLS.LEVEL' | translate }}
+                  </th>
+                  <th md-column md-order-by="name">
+                    {{ 'TOOLS.NAME' | translate }}
+                  </th>
+                  <th md-column md-order-by="description">
+                    {{ 'TOOLS.DESCRIPTION' | translate }}
+                  </th>
+                  <th md-column width="10px"></th>
+                </tr>
+              </thead>
+              <tbody md-body>
+                <tr md-row ng-hide="vm.dispositions.rows.length">
+                  <td md-cell colspan="5">
+                    <div layout="row" layout-align="center center">
+                      <span translate="TOOLS.NO_AVAILABLE_INFO"
+                        >No Available Info</span
+                      >
+                    </div>
+                  </td>
+                </tr>
+                <tr
+                  md-row
+                  md-select="disposition"
+                  md-select-id="id"
+                  ng-repeat="disposition in vm.dispositions.rows"
+                >
+                  <td md-cell ng-if="disposition.userpic">
+                    <img
+                      class="avatar"
+                      alt="{{disposition.name}}"
+                      ng-src="api/users/{{disposition.id}}/avatar"
+                    />
+                  </td>
+                  <td
+                    md-cell
+                    ng-if="!disposition.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                  >
+                    <img
+                      class="avatar"
+                      alt="{{disposition.name}}"
+                      ng-src="assets/images/avatars/profile.png"
+                    />
+                  </td>
+                  <td
+                    ng-click="vm.createOrEditDisposition($event, disposition)"
+                    md-cell
+                    class="id"
+                  >
+                    {{disposition.id}}
+                  </td>
+                  <td
+                    ng-click="vm.createOrEditDisposition($event, disposition)"
+                    md-cell
+                    class="level"
+                  >
+                    {{ vm.levels[disposition.level] }}
+                  </td>
+                  <td
+                    ng-click="vm.createOrEditDisposition($event, disposition)"
+                    md-cell
+                    class="name"
+                  >
+                    {{disposition.name}}
+                  </td>
+                  <td
+                    ng-click="vm.createOrEditDisposition($event, disposition)"
+                    md-cell
+                    class="description"
+                  >
+                    {{disposition.description}}
+                  </td>
+                  <td
+                    md-cell
+                    class="actions"
+                    ng-if="!vm.crudPermissions.readOnly"
+                  >
+                    <md-menu>
+                      <md-button
+                        class="md-icon-button"
+                        aria-label="More"
+                        translate
+                        translate-attr-aria-label="TOOLS.MORE"
+                        ng-click="$mdOpenMenu($event)"
+                      >
+                        <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                      </md-button>
+                      <md-menu-content width="3">
+                        <!-- SUBACTIONS -->
+                        <!-- ACTIONS -->
+                        <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                          <md-button
+                            ng-click="vm.createOrEditDisposition($event, disposition)"
+                            translate="TOOLS.EDIT_DISPOSITION"
+                          >
+                            Edit Disposition
+                          </md-button>
+                        </md-menu-item>
+                        <!-- SUBACTIONS -->
+                        <!-- ACTIONS -->
+                        <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                          <md-button
+                            ng-click="vm.deleteconfirm(disposition, $event)"
+                            translate="TOOLS.DELETE_DISPOSITION"
+                          >
+                            Delete Disposition
+                          </md-button>
+                        </md-menu-item>
+                      </md-menu-content>
+                    </md-menu>
+                  </td>
+                </tr>
+              </tbody>
+            </table>
+          </md-table-container>
+          <md-table-pagination
+            md-label="{page: '{{'TOOLS.PAGE' | translate}}:', rowsPerPage: '{{'TOOLS.ROWSPERPAGE' | translate}}:', of: '{{'TOOLS.OF' | translate}}'}"
+            md-limit="vm.query.limit"
+            md-limit-options="[10, 15, 20, 50, 100, 250]"
+            md-page="vm.query.page"
+            md-total="{{vm.dispositions.count}}"
+            md-on-paginate="vm.getDispositions"
+            md-page-select
+          >
+          </md-table-pagination>
+        </md-card>
+        <!-- / DISPOSITION TABLE -->
+      </div>
+      <!-- NO RESULTS -->
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+  <!-- ADD DISPOSITION BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent"
+    id="add-disposition-button"
+    ng-click="vm.createOrEditDisposition($event)"
+    aria-label="add disposition"
+    translate
+    translate-attr-aria-label="TOOLS.ADD_DISPOSITION"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD DISPOSITION BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/tools/views/intervals/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/intervals/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index b3f559d..0000000
--- a/public/src/js/modules/main/apps/tools/views/intervals/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,152 +0,0 @@
-<md-dialog class="interval-dialog" aria-label="New Interval">
-  <form name="intervalForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.interval.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="intervalForm['name'].$error"
-          ng-show="intervalForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.interval.description"
-        />
-
-        <div
-          ng-messages="intervalForm['description'].$error"
-          ng-show="intervalForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newInterval"
-          ng-click="vm.saveInterval()"
-          class="send-button md-accent md-raised"
-          ng-disabled="intervalForm.$invalid || intervalForm.$pristine"
-          aria-label="SAVE"
-          translate="TOOLS.SAVE"
-          translate-attr-aria-label="TOOLS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newInterval"
-          ng-click="vm.addNewInterval()"
-          class="send-button md-accent md-raised"
-          ng-disabled="intervalForm.$invalid"
-          aria-label="ADD"
-          translate="TOOLS.ADD_INTERVAL"
-          translate-attr-aria-label="TOOLS.ADD_INTERVAL"
-        >
-          ADD INTERVAL
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newInterval"
-          ng-click="vm.deleteInterval($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="TOOLS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/intervals/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/tools/views/intervals/create/dialog.html/dialog.html
new file mode 100644
index 0000000..b3f559d
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/intervals/create/dialog.html/dialog.html
@@ -0,0 +1,152 @@
+<md-dialog class="interval-dialog" aria-label="New Interval">
+  <form name="intervalForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.interval.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="intervalForm['name'].$error"
+          ng-show="intervalForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.interval.description"
+        />
+
+        <div
+          ng-messages="intervalForm['description'].$error"
+          ng-show="intervalForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newInterval"
+          ng-click="vm.saveInterval()"
+          class="send-button md-accent md-raised"
+          ng-disabled="intervalForm.$invalid || intervalForm.$pristine"
+          aria-label="SAVE"
+          translate="TOOLS.SAVE"
+          translate-attr-aria-label="TOOLS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newInterval"
+          ng-click="vm.addNewInterval()"
+          class="send-button md-accent md-raised"
+          ng-disabled="intervalForm.$invalid"
+          aria-label="ADD"
+          translate="TOOLS.ADD_INTERVAL"
+          translate-attr-aria-label="TOOLS.ADD_INTERVAL"
+        >
+          ADD INTERVAL
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newInterval"
+          ng-click="vm.deleteInterval($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="TOOLS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/intervals/edit/apps/interval/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/intervals/edit/apps/interval/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index fa04e1f..0000000
--- a/public/src/js/modules/main/apps/tools/views/intervals/edit/apps/interval/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,337 +0,0 @@
-<md-dialog class="inboundroute-dialog" aria-label="New Interval">
-  <form name="intervalForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <md-input-container class="md-block">
-        <label translate="TOOLS.NAME">Name</label>
-        <input
-          ng-model="vm.interval.name"
-          type="text"
-          name="name"
-          placeholder="{{'TOOLS.NAME' | translate}}"
-          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          md-autofocus
-          required
-        />
-        <div
-          ng-messages="intervalForm.name.$error"
-          ng-show="intervalForm.name.$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <md-input-container class="md-block">
-        <label translate="TOOLS.TYPE">Type</label>
-        <md-select
-          ng-model="vm.type"
-          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="type" ng-repeat="type in vm.types"
-            >{{ type | ucfirst }}</md-option
-          >
-        </md-select>
-      </md-input-container>
-
-      <md-input-container class="md-block" ng-if="vm.type === 'list'">
-        <label translate="TOOLS.INTERVALS">Intervals</label>
-        <md-select
-          ng-model="vm.interval.IntervalId"
-          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="interval.id" ng-repeat="interval in vm.intervals"
-            >{{ interval.name }}</md-option
-          >
-        </md-select>
-      </md-input-container>
-
-      <!-- TIMERANGE START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.TIME_RANGE"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <div class="md-block" flex>
-          <mdp-time-picker
-            name="timeRangeFrom"
-            mdp-placeholder="FROM"
-            ng-model="vm.timeRangeFrom"
-            mdp-format="HH:mm"
-            mdp-auto-switch="true"
-            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <div
-              ng-messages="intervalForm.timeRangeFrom.$error"
-              ng-show="intervalForm.timeRangeFrom.$touched"
-              role="alert"
-            >
-              <div ng-message="format">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_FROM_INVALID"
-                  >Time Range From field is invalid</span
-                >
-              </div>
-            </div>
-          </mdp-time-picker>
-        </div>
-        <div class="md-block" flex ng-if="vm.timeRangeFrom">
-          <mdp-time-picker
-            name="timeRangeTo"
-            mdp-placeholder="TO*"
-            ng-model="vm.timeRangeTo"
-            mdp-format="HH:mm"
-            mdp-auto-switch="true"
-            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-            required
-          >
-            <div
-              ng-messages="intervalForm.timeRangeTo.$error"
-              ng-show="intervalForm.timeRangeTo.$invalid"
-              role="alert"
-            >
-              <div ng-message="format">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_INVALID"
-                  >Time Range To field is invalid</span
-                >
-              </div>
-              <div ng-message="required">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_REQUIRED"
-                  >Time Range To field is required</span
-                >
-              </div>
-            </div>
-          </mdp-time-picker>
-        </div>
-      </div>
-      <!-- TIMERANGE END -->
-
-      <!-- DAYSOFWEEK START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.WEEK_DAYS"
-        >Week Days</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.dayOfWeekFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
-              ><span translate="TOOLS.{{day.value | uppercase}}"
-                >{{ day.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container flex class="md-block" ng-if="vm.dayOfWeekFrom">
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="dayOfWeekTo"
-            ng-model="vm.dayOfWeekTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
-              ><span translate="TOOLS.{{day.value | uppercase}}"
-                >{{ day.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.dayOfWeekTo.$error"
-            ng-show="intervalForm.dayOfWeekTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- DAYSOFWEEK END -->
-
-      <!-- MONTHDAY START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTH_DAYS"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex layout="column" class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.monthDayFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
-              >{{ month }}</md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container
-          flex
-          layout="column"
-          class="md-block"
-          ng-if="vm.monthDayFrom"
-        >
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="monthDayTo"
-            ng-model="vm.monthDayTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
-              >{{ month }}</md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.monthDayTo.$error"
-            ng-show="intervalForm.monthDayTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- MONTHDAY END -->
-
-      <!-- MONTH START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTHS"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex layout="column" class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.monthFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
-              ><span translate="TOOLS.{{month.value | uppercase}}"
-                >{{ month.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container
-          flex
-          layout="column"
-          class="md-block"
-          ng-if="vm.monthFrom"
-        >
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="monthTo"
-            ng-model="vm.monthTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
-              ><span translate="TOOLS.{{month.value | uppercase}}"
-                >{{ month.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.monthTo.$error"
-            ng-show="intervalForm.monthTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- MONTH END -->
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="!vm.newInterval && vm.crudPermissions.canEdit"
-          ng-click="vm.saveInterval()"
-          class="send-button md-accent md-raised"
-          ng-disabled="intervalForm.$invalid || intervalForm.$pristine"
-          aria-label="SAVE"
-          translate="TOOLS.SAVE"
-          translate-attr-aria-label="TOOLS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.newInterval && vm.crudPermissions.canEdit"
-          ng-click="vm.addNewInterval()"
-          class="send-button md-accent md-raised"
-          ng-disabled="intervalForm.$invalid"
-          aria-label="ADD"
-          translate="TOOLS.ADD_INTERVAL"
-          translate-attr-aria-label="TOOLS.ADD_INTERVAL"
-        >
-          ADD INTERVAL
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/intervals/edit/apps/interval/dialog.html/dialog.html b/public/src/js/modules/main/apps/tools/views/intervals/edit/apps/interval/dialog.html/dialog.html
new file mode 100644
index 0000000..fa04e1f
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/intervals/edit/apps/interval/dialog.html/dialog.html
@@ -0,0 +1,337 @@
+<md-dialog class="inboundroute-dialog" aria-label="New Interval">
+  <form name="intervalForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <md-input-container class="md-block">
+        <label translate="TOOLS.NAME">Name</label>
+        <input
+          ng-model="vm.interval.name"
+          type="text"
+          name="name"
+          placeholder="{{'TOOLS.NAME' | translate}}"
+          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          md-autofocus
+          required
+        />
+        <div
+          ng-messages="intervalForm.name.$error"
+          ng-show="intervalForm.name.$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <md-input-container class="md-block">
+        <label translate="TOOLS.TYPE">Type</label>
+        <md-select
+          ng-model="vm.type"
+          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="type" ng-repeat="type in vm.types"
+            >{{ type | ucfirst }}</md-option
+          >
+        </md-select>
+      </md-input-container>
+
+      <md-input-container class="md-block" ng-if="vm.type === 'list'">
+        <label translate="TOOLS.INTERVALS">Intervals</label>
+        <md-select
+          ng-model="vm.interval.IntervalId"
+          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="interval.id" ng-repeat="interval in vm.intervals"
+            >{{ interval.name }}</md-option
+          >
+        </md-select>
+      </md-input-container>
+
+      <!-- TIMERANGE START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.TIME_RANGE"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <div class="md-block" flex>
+          <mdp-time-picker
+            name="timeRangeFrom"
+            mdp-placeholder="FROM"
+            ng-model="vm.timeRangeFrom"
+            mdp-format="HH:mm"
+            mdp-auto-switch="true"
+            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <div
+              ng-messages="intervalForm.timeRangeFrom.$error"
+              ng-show="intervalForm.timeRangeFrom.$touched"
+              role="alert"
+            >
+              <div ng-message="format">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_FROM_INVALID"
+                  >Time Range From field is invalid</span
+                >
+              </div>
+            </div>
+          </mdp-time-picker>
+        </div>
+        <div class="md-block" flex ng-if="vm.timeRangeFrom">
+          <mdp-time-picker
+            name="timeRangeTo"
+            mdp-placeholder="TO*"
+            ng-model="vm.timeRangeTo"
+            mdp-format="HH:mm"
+            mdp-auto-switch="true"
+            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+            required
+          >
+            <div
+              ng-messages="intervalForm.timeRangeTo.$error"
+              ng-show="intervalForm.timeRangeTo.$invalid"
+              role="alert"
+            >
+              <div ng-message="format">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_INVALID"
+                  >Time Range To field is invalid</span
+                >
+              </div>
+              <div ng-message="required">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_REQUIRED"
+                  >Time Range To field is required</span
+                >
+              </div>
+            </div>
+          </mdp-time-picker>
+        </div>
+      </div>
+      <!-- TIMERANGE END -->
+
+      <!-- DAYSOFWEEK START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.WEEK_DAYS"
+        >Week Days</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.dayOfWeekFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
+              ><span translate="TOOLS.{{day.value | uppercase}}"
+                >{{ day.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container flex class="md-block" ng-if="vm.dayOfWeekFrom">
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="dayOfWeekTo"
+            ng-model="vm.dayOfWeekTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
+              ><span translate="TOOLS.{{day.value | uppercase}}"
+                >{{ day.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.dayOfWeekTo.$error"
+            ng-show="intervalForm.dayOfWeekTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- DAYSOFWEEK END -->
+
+      <!-- MONTHDAY START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTH_DAYS"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex layout="column" class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.monthDayFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
+              >{{ month }}</md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container
+          flex
+          layout="column"
+          class="md-block"
+          ng-if="vm.monthDayFrom"
+        >
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="monthDayTo"
+            ng-model="vm.monthDayTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
+              >{{ month }}</md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.monthDayTo.$error"
+            ng-show="intervalForm.monthDayTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- MONTHDAY END -->
+
+      <!-- MONTH START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTHS"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex layout="column" class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.monthFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
+              ><span translate="TOOLS.{{month.value | uppercase}}"
+                >{{ month.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container
+          flex
+          layout="column"
+          class="md-block"
+          ng-if="vm.monthFrom"
+        >
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="monthTo"
+            ng-model="vm.monthTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
+              ><span translate="TOOLS.{{month.value | uppercase}}"
+                >{{ month.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.monthTo.$error"
+            ng-show="intervalForm.monthTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- MONTH END -->
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="!vm.newInterval && vm.crudPermissions.canEdit"
+          ng-click="vm.saveInterval()"
+          class="send-button md-accent md-raised"
+          ng-disabled="intervalForm.$invalid || intervalForm.$pristine"
+          aria-label="SAVE"
+          translate="TOOLS.SAVE"
+          translate-attr-aria-label="TOOLS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.newInterval && vm.crudPermissions.canEdit"
+          ng-click="vm.addNewInterval()"
+          class="send-button md-accent md-raised"
+          ng-disabled="intervalForm.$invalid"
+          aria-label="ADD"
+          translate="TOOLS.ADD_INTERVAL"
+          translate-attr-aria-label="TOOLS.ADD_INTERVAL"
+        >
+          ADD INTERVAL
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/intervals/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/intervals/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index f288dba..0000000
--- a/public/src/js/modules/main/apps/tools/views/intervals/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,318 +0,0 @@
-<div id="tools-interval" class="page-layout simple tabbed" layout="column">
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-intervals-button md-icon-button"
-        aria-label="Go to intervals"
-        ng-click="vm.gotoIntervals()"
-        translate
-        translate-attr-aria-label="TOOLS.GO_TO_INTERVALS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="interval-image" hide-xs>
-          <img ng-src="assets/images/business/intervals.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.interval.id}}
-            <span ng-if="vm.interval.name">{{vm.interval.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="TOOLS.CREATED_AT"></span>
-            <span>{{vm.interval.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveInterval()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (intervalsForm.$invalid)"
-        translate="TOOLS.SAVE"
-        translate-attr-aria-label="TOOLS.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="TOOLS.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="interval-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="TOOLS.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.interval.name"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.interval.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="TOOLS.INTERVALS">INTERVALS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="interval-detail-form-container intervals md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="IntervalIntervalsController as vm_dc"
-              ng-init="vm_dc.init(vm.interval, vm.crudPermissions)"
-            >
-              <md-toolbar
-                class="md-table-toolbar md-default"
-                ng-hide="vm_dc.selectedIntervalIntervals.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead" translate="TOOLS.INTERVALS"
-                    >Intervals</span
-                  >
-                  <ms-search-bar
-                    on-search="vm_dc.query.filter = query"
-                    on-collapse="vm_dc.query.filter = undefined"
-                    debounce="300"
-                    direction="down"
-                  ></ms-search-bar>
-                  <div flex></div>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canEdit"
-                    class="md-icon-button"
-                    ng-click="vm_dc.createOrEditIntervalInterval($event)"
-                    aria-label="add interval"
-                    translate
-                    translate-attr-label="TOOLS.ADD_INTERVAL"
-                  >
-                    <md-icon md-font-icon="icon-plus"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-toolbar
-                class="md-table-toolbar md-accent"
-                ng-show="vm_dc.selectedIntervalIntervals.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead"
-                    >{{vm_dc.selectedIntervalIntervals.length}}
-                    {{vm_dc.selectedIntervalIntervals.length > 1 ? 'items' :
-                    'item'}} selected</span
-                  >
-                  <div flex></div>
-                  <button
-                    class="md-icon-button"
-                    ng-csv="vm_dc.exportSelectedIntervalIntervals"
-                    csv-label="true"
-                    filename="intervals.csv"
-                  >
-                    <md-icon md-font-icon="icon-file-excel"></md-icon>
-                  </button>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canDelete"
-                    class="md-icon-button"
-                    ng-click="vm_dc.deleteSelectedIntervalIntervals($event)"
-                    aria-label="delete selected"
-                    translate
-                    translate-attr-label="TOOLS.DELETE_SELECTED"
-                  >
-                    <md-icon md-font-icon="icon-delete"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-table-container class="font-size-12">
-                <table
-                  md-table
-                  md-row-select
-                  multiple
-                  ng-model="vm_dc.selectedIntervalIntervals"
-                  md-progress="vm_dc.promise"
-                >
-                  <thead
-                    md-head
-                    md-order="vm_dc.query.sort"
-                    md-on-reorder="vm_dc.getIntervalIntervals"
-                  >
-                    <tr md-row>
-                      <th md-column width="10px"></th>
-                      <th md-column md-order-by="id">
-                        {{ 'TOOLS.ID' | translate }}
-                      </th>
-                      <th md-column md-order-by="name">
-                        {{ 'TOOLS.NAME' | translate }}
-                      </th>
-                      <th md-column md-order-by="interval">
-                        {{ 'TOOLS.INTERVAL' | translate }}
-                      </th>
-                      <th md-column md-order-by="createdAt">
-                        {{ 'TOOLS.CREATED_AT' | translate }}
-                      </th>
-                      <th md-column width="10px"></th>
-                    </tr>
-                  </thead>
-                  <tbody md-body ng-sortable="vm_dc.sortableTable">
-                    <tr
-                      md-row
-                      md-select="interval"
-                      md-select-id="id"
-                      ng-repeat="interval in vm_dc.intervalIntervals.rows"
-                    >
-                      <td md-cell>
-                        <md-icon
-                          md-font-icon="icon-drag-vertical"
-                          class="s16 handle"
-                        ></md-icon>
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditIntervalInterval($event, interval)"
-                        md-cell
-                      >
-                        {{interval.id}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditIntervalInterval($event, interval)"
-                        md-cell
-                      >
-                        {{interval.name}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditIntervalInterval($event, interval)"
-                        md-cell
-                      >
-                        {{interval.interval}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditIntervalInterval($event, interval)"
-                        md-cell
-                      >
-                        {{ interval.createdAt | formatdate }}
-                      </td>
-                      <td
-                        md-cell
-                        class="actions"
-                        ng-if="!vm_dc.crudPermissions.readOnly"
-                      >
-                        <md-menu>
-                          <md-button
-                            class="md-icon-button"
-                            aria-label="More"
-                            translate
-                            translate-attr-aria-label="TOOLS.MORE"
-                            ng-click="$mdOpenMenu($event)"
-                          >
-                            <md-icon
-                              md-font-icon="icon-dots-vertical"
-                            ></md-icon>
-                          </md-button>
-
-                          <md-menu-content width="3">
-                            <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
-                              <md-button
-                                ng-click="vm_dc.createOrEditIntervalInterval($event, interval)"
-                                translate="TOOLS.EDIT_INTERVAL"
-                              >
-                                Edit Interval
-                              </md-button>
-                            </md-menu-item>
-                            <md-menu-item
-                              ng-if="vm_dc.crudPermissions.canDelete"
-                            >
-                              <md-button
-                                ng-click="vm_dc.deleteConfirm(interval, $event)"
-                                translate="TOOLS.DELETE_INTERVAL"
-                              >
-                                Delete Interval
-                              </md-button>
-                            </md-menu-item>
-                          </md-menu-content>
-                        </md-menu>
-                      </td>
-                    </tr>
-                    <tr md-row ng-if="!vm_dc.intervalIntervals.rows.length">
-                      <td md-cell colspan="7">
-                        <div layout="row" layout-align="center center">
-                          <span
-                            class="text-boxed-light"
-                            translate="TOOLS.NO_INTERVALS_AVAILABLE"
-                            >No intervals available</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/tools/views/intervals/edit/view.html/view.html b/public/src/js/modules/main/apps/tools/views/intervals/edit/view.html/view.html
new file mode 100644
index 0000000..f288dba
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/intervals/edit/view.html/view.html
@@ -0,0 +1,318 @@
+<div id="tools-interval" class="page-layout simple tabbed" layout="column">
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-intervals-button md-icon-button"
+        aria-label="Go to intervals"
+        ng-click="vm.gotoIntervals()"
+        translate
+        translate-attr-aria-label="TOOLS.GO_TO_INTERVALS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="interval-image" hide-xs>
+          <img ng-src="assets/images/business/intervals.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.interval.id}}
+            <span ng-if="vm.interval.name">{{vm.interval.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="TOOLS.CREATED_AT"></span>
+            <span>{{vm.interval.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveInterval()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (intervalsForm.$invalid)"
+        translate="TOOLS.SAVE"
+        translate-attr-aria-label="TOOLS.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="TOOLS.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="interval-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="TOOLS.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.interval.name"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.interval.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="TOOLS.INTERVALS">INTERVALS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="interval-detail-form-container intervals md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="IntervalIntervalsController as vm_dc"
+              ng-init="vm_dc.init(vm.interval, vm.crudPermissions)"
+            >
+              <md-toolbar
+                class="md-table-toolbar md-default"
+                ng-hide="vm_dc.selectedIntervalIntervals.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead" translate="TOOLS.INTERVALS"
+                    >Intervals</span
+                  >
+                  <ms-search-bar
+                    on-search="vm_dc.query.filter = query"
+                    on-collapse="vm_dc.query.filter = undefined"
+                    debounce="300"
+                    direction="down"
+                  ></ms-search-bar>
+                  <div flex></div>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canEdit"
+                    class="md-icon-button"
+                    ng-click="vm_dc.createOrEditIntervalInterval($event)"
+                    aria-label="add interval"
+                    translate
+                    translate-attr-label="TOOLS.ADD_INTERVAL"
+                  >
+                    <md-icon md-font-icon="icon-plus"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-toolbar
+                class="md-table-toolbar md-accent"
+                ng-show="vm_dc.selectedIntervalIntervals.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead"
+                    >{{vm_dc.selectedIntervalIntervals.length}}
+                    {{vm_dc.selectedIntervalIntervals.length > 1 ? 'items' :
+                    'item'}} selected</span
+                  >
+                  <div flex></div>
+                  <button
+                    class="md-icon-button"
+                    ng-csv="vm_dc.exportSelectedIntervalIntervals"
+                    csv-label="true"
+                    filename="intervals.csv"
+                  >
+                    <md-icon md-font-icon="icon-file-excel"></md-icon>
+                  </button>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canDelete"
+                    class="md-icon-button"
+                    ng-click="vm_dc.deleteSelectedIntervalIntervals($event)"
+                    aria-label="delete selected"
+                    translate
+                    translate-attr-label="TOOLS.DELETE_SELECTED"
+                  >
+                    <md-icon md-font-icon="icon-delete"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-table-container class="font-size-12">
+                <table
+                  md-table
+                  md-row-select
+                  multiple
+                  ng-model="vm_dc.selectedIntervalIntervals"
+                  md-progress="vm_dc.promise"
+                >
+                  <thead
+                    md-head
+                    md-order="vm_dc.query.sort"
+                    md-on-reorder="vm_dc.getIntervalIntervals"
+                  >
+                    <tr md-row>
+                      <th md-column width="10px"></th>
+                      <th md-column md-order-by="id">
+                        {{ 'TOOLS.ID' | translate }}
+                      </th>
+                      <th md-column md-order-by="name">
+                        {{ 'TOOLS.NAME' | translate }}
+                      </th>
+                      <th md-column md-order-by="interval">
+                        {{ 'TOOLS.INTERVAL' | translate }}
+                      </th>
+                      <th md-column md-order-by="createdAt">
+                        {{ 'TOOLS.CREATED_AT' | translate }}
+                      </th>
+                      <th md-column width="10px"></th>
+                    </tr>
+                  </thead>
+                  <tbody md-body ng-sortable="vm_dc.sortableTable">
+                    <tr
+                      md-row
+                      md-select="interval"
+                      md-select-id="id"
+                      ng-repeat="interval in vm_dc.intervalIntervals.rows"
+                    >
+                      <td md-cell>
+                        <md-icon
+                          md-font-icon="icon-drag-vertical"
+                          class="s16 handle"
+                        ></md-icon>
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditIntervalInterval($event, interval)"
+                        md-cell
+                      >
+                        {{interval.id}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditIntervalInterval($event, interval)"
+                        md-cell
+                      >
+                        {{interval.name}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditIntervalInterval($event, interval)"
+                        md-cell
+                      >
+                        {{interval.interval}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditIntervalInterval($event, interval)"
+                        md-cell
+                      >
+                        {{ interval.createdAt | formatdate }}
+                      </td>
+                      <td
+                        md-cell
+                        class="actions"
+                        ng-if="!vm_dc.crudPermissions.readOnly"
+                      >
+                        <md-menu>
+                          <md-button
+                            class="md-icon-button"
+                            aria-label="More"
+                            translate
+                            translate-attr-aria-label="TOOLS.MORE"
+                            ng-click="$mdOpenMenu($event)"
+                          >
+                            <md-icon
+                              md-font-icon="icon-dots-vertical"
+                            ></md-icon>
+                          </md-button>
+
+                          <md-menu-content width="3">
+                            <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
+                              <md-button
+                                ng-click="vm_dc.createOrEditIntervalInterval($event, interval)"
+                                translate="TOOLS.EDIT_INTERVAL"
+                              >
+                                Edit Interval
+                              </md-button>
+                            </md-menu-item>
+                            <md-menu-item
+                              ng-if="vm_dc.crudPermissions.canDelete"
+                            >
+                              <md-button
+                                ng-click="vm_dc.deleteConfirm(interval, $event)"
+                                translate="TOOLS.DELETE_INTERVAL"
+                              >
+                                Delete Interval
+                              </md-button>
+                            </md-menu-item>
+                          </md-menu-content>
+                        </md-menu>
+                      </td>
+                    </tr>
+                    <tr md-row ng-if="!vm_dc.intervalIntervals.rows.length">
+                      <td md-cell colspan="7">
+                        <div layout="row" layout-align="center center">
+                          <span
+                            class="text-boxed-light"
+                            translate="TOOLS.NO_INTERVALS_AVAILABLE"
+                            >No intervals available</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/tools/views/intervals/intervals.html/intervals-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/intervals/intervals.html/intervals-[chunkhash].html
deleted file mode 100644
index 453ac96..0000000
--- a/public/src/js/modules/main/apps/tools/views/intervals/intervals.html/intervals-[chunkhash].html
+++ /dev/null
@@ -1,297 +0,0 @@
-<div
-  id="intervals"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-auto-fix" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="TOOLS.INTERVALS">Intervals</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="TOOLS.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedIntervals.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedIntervals =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="TOOLS.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-intervals-count">
-          <span>{{vm.selectedIntervals.length}}</span>
-          <span translate="TOOLS.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="TOOLS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllIntervals()"
-                translate="TOOLS.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectIntervals()"
-                translate="TOOLS.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedIntervals"
-          csv-label="true"
-          filename="intervals.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedIntervals($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="TOOLS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- INTERVAL TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedIntervals"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getIntervals"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'TOOLS.ID' | translate }}</th>
-                <th md-column md-order-by="name">
-                  {{ 'TOOLS.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'TOOLS.DESCRIPTION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.intervals.rows.length">
-                <td md-cell colspan="4">
-                  <div layout="row" layout-align="center center">
-                    <span translate="TOOLS.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="interval"
-                md-select-id="id"
-                ng-repeat="interval in vm.intervals.rows"
-              >
-                <td md-cell ng-if="interval.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{interval.name}}"
-                    ng-src="api/users/{{interval.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!interval.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{interval.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(interval, ev) : vm.createOrEditInterval($event, interval)"
-                  md-cell
-                  class="id"
-                >
-                  {{interval.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(interval, ev) : vm.createOrEditInterval($event, interval)"
-                  md-cell
-                  class="name"
-                >
-                  {{interval.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(interval, ev) : vm.createOrEditInterval($event, interval)"
-                  md-cell
-                  class="description"
-                >
-                  {{interval.description}}
-                </td>
-
-                <td
-                  md-cell
-                  class="actions"
-                  ng-if="!vm.crudPermissions.readOnly"
-                >
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="TOOLS.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(interval, $event    )"
-                          translate="TOOLS.EDIT_INTERVAL"
-                        >
-                          Edit Interval
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(interval, $event    )"
-                          translate="TOOLS.DELETE_INTERVAL"
-                        >
-                          Delete Interval
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'TOOLS.PAGE' | translate}}:', rowsPerPage: '{{'TOOLS.ROWSPERPAGE' | translate}}:', of: '{{'TOOLS.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.intervals.count}}"
-          md-on-paginate="vm.getIntervals"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / INTERVAL TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD INTERVAL BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-interval-button"
-    ng-click="vm.createOrEditInterval($event)"
-    aria-label="add interval"
-    translate
-    translate-attr-aria-label="TOOLS.ADD_INTERVAL"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD INTERVAL BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/tools/views/intervals/intervals.html/intervals.html b/public/src/js/modules/main/apps/tools/views/intervals/intervals.html/intervals.html
new file mode 100644
index 0000000..453ac96
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/intervals/intervals.html/intervals.html
@@ -0,0 +1,297 @@
+<div
+  id="intervals"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-auto-fix" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="TOOLS.INTERVALS">Intervals</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="TOOLS.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedIntervals.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedIntervals =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="TOOLS.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-intervals-count">
+          <span>{{vm.selectedIntervals.length}}</span>
+          <span translate="TOOLS.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="TOOLS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllIntervals()"
+                translate="TOOLS.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectIntervals()"
+                translate="TOOLS.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedIntervals"
+          csv-label="true"
+          filename="intervals.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedIntervals($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="TOOLS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- INTERVAL TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedIntervals"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getIntervals"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'TOOLS.ID' | translate }}</th>
+                <th md-column md-order-by="name">
+                  {{ 'TOOLS.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'TOOLS.DESCRIPTION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.intervals.rows.length">
+                <td md-cell colspan="4">
+                  <div layout="row" layout-align="center center">
+                    <span translate="TOOLS.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="interval"
+                md-select-id="id"
+                ng-repeat="interval in vm.intervals.rows"
+              >
+                <td md-cell ng-if="interval.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{interval.name}}"
+                    ng-src="api/users/{{interval.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!interval.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{interval.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(interval, ev) : vm.createOrEditInterval($event, interval)"
+                  md-cell
+                  class="id"
+                >
+                  {{interval.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(interval, ev) : vm.createOrEditInterval($event, interval)"
+                  md-cell
+                  class="name"
+                >
+                  {{interval.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(interval, ev) : vm.createOrEditInterval($event, interval)"
+                  md-cell
+                  class="description"
+                >
+                  {{interval.description}}
+                </td>
+
+                <td
+                  md-cell
+                  class="actions"
+                  ng-if="!vm.crudPermissions.readOnly"
+                >
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="TOOLS.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(interval, $event    )"
+                          translate="TOOLS.EDIT_INTERVAL"
+                        >
+                          Edit Interval
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(interval, $event    )"
+                          translate="TOOLS.DELETE_INTERVAL"
+                        >
+                          Delete Interval
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'TOOLS.PAGE' | translate}}:', rowsPerPage: '{{'TOOLS.ROWSPERPAGE' | translate}}:', of: '{{'TOOLS.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.intervals.count}}"
+          md-on-paginate="vm.getIntervals"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / INTERVAL TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD INTERVAL BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-interval-button"
+    ng-click="vm.createOrEditInterval($event)"
+    aria-label="add interval"
+    translate
+    translate-attr-aria-label="TOOLS.ADD_INTERVAL"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD INTERVAL BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/tools/views/pauses/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/pauses/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index e0321dd..0000000
--- a/public/src/js/modules/main/apps/tools/views/pauses/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,148 +0,0 @@
-<md-dialog class="pause-dialog" aria-label="New Pause">
-  <form name="pauseForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.pause.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="pauseForm['name'].$error"
-          ng-show="pauseForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.DESCRIPTION">Description</label>
-        <input type="text" name="description" ng-model="vm.pause.description" />
-
-        <div
-          ng-messages="pauseForm['description'].$error"
-          ng-show="pauseForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newPause"
-          ng-click="vm.savePause()"
-          class="send-button md-accent md-raised"
-          ng-disabled="pauseForm.$invalid || pauseForm.$pristine"
-          aria-label="SAVE"
-          translate="TOOLS.SAVE"
-          translate-attr-aria-label="TOOLS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newPause"
-          ng-click="vm.addNewPause()"
-          class="send-button md-accent md-raised"
-          ng-disabled="pauseForm.$invalid"
-          aria-label="ADD"
-          translate="TOOLS.ADD_PAUSE"
-          translate-attr-aria-label="TOOLS.ADD_PAUSE"
-        >
-          ADD PAUSE
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newPause"
-          ng-click="vm.deletePause($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="TOOLS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/pauses/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/tools/views/pauses/create/dialog.html/dialog.html
new file mode 100644
index 0000000..e0321dd
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/pauses/create/dialog.html/dialog.html
@@ -0,0 +1,148 @@
+<md-dialog class="pause-dialog" aria-label="New Pause">
+  <form name="pauseForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.pause.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="pauseForm['name'].$error"
+          ng-show="pauseForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.DESCRIPTION">Description</label>
+        <input type="text" name="description" ng-model="vm.pause.description" />
+
+        <div
+          ng-messages="pauseForm['description'].$error"
+          ng-show="pauseForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newPause"
+          ng-click="vm.savePause()"
+          class="send-button md-accent md-raised"
+          ng-disabled="pauseForm.$invalid || pauseForm.$pristine"
+          aria-label="SAVE"
+          translate="TOOLS.SAVE"
+          translate-attr-aria-label="TOOLS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newPause"
+          ng-click="vm.addNewPause()"
+          class="send-button md-accent md-raised"
+          ng-disabled="pauseForm.$invalid"
+          aria-label="ADD"
+          translate="TOOLS.ADD_PAUSE"
+          translate-attr-aria-label="TOOLS.ADD_PAUSE"
+        >
+          ADD PAUSE
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newPause"
+          ng-click="vm.deletePause($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="TOOLS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/pauses/pauses.html/pauses-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/pauses/pauses.html/pauses-[chunkhash].html
deleted file mode 100644
index a77369a..0000000
--- a/public/src/js/modules/main/apps/tools/views/pauses/pauses.html/pauses-[chunkhash].html
+++ /dev/null
@@ -1,297 +0,0 @@
-<div
-  id="pauses"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-auto-fix" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="TOOLS.PAUSES">Pauses</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="TOOLS.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedPauses.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedPauses =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="TOOLS.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-pauses-count">
-          <span>{{vm.selectedPauses.length}}</span>
-          <span translate="TOOLS.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="TOOLS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllPauses()"
-                translate="TOOLS.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectPauses()"
-                translate="TOOLS.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedPauses"
-          csv-label="true"
-          filename="pauses.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedPauses($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="TOOLS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- PAUSE TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedPauses"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getPauses"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'TOOLS.ID' | translate }}</th>
-                <th md-column md-order-by="name">
-                  {{ 'TOOLS.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'TOOLS.DESCRIPTION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.pauses.rows.length">
-                <td md-cell colspan="4">
-                  <div layout="row" layout-align="center center">
-                    <span translate="TOOLS.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="pause"
-                md-select-id="id"
-                ng-repeat="pause in vm.pauses.rows"
-              >
-                <td md-cell ng-if="pause.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{pause.name}}"
-                    ng-src="api/users/{{pause.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!pause.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{pause.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.createOrEditPause($event, pause)"
-                  md-cell
-                  class="id"
-                >
-                  {{pause.id}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditPause($event, pause)"
-                  md-cell
-                  class="name"
-                >
-                  {{pause.name}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditPause($event, pause)"
-                  md-cell
-                  class="description"
-                >
-                  {{pause.description}}
-                </td>
-
-                <td
-                  md-cell
-                  class="actions"
-                  ng-if="!vm.crudPermissions.readOnly"
-                >
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="TOOLS.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editdialog(pause, $event    )"
-                          translate="TOOLS.EDIT_PAUSE"
-                        >
-                          Edit Pause
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(pause, $event    )"
-                          translate="TOOLS.DELETE_PAUSE"
-                        >
-                          Delete Pause
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'TOOLS.PAGE' | translate}}:', rowsPerPage: '{{'TOOLS.ROWSPERPAGE' | translate}}:', of: '{{'TOOLS.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.pauses.count}}"
-          md-on-paginate="vm.getPauses"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / PAUSE TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD PAUSE BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-pause-button"
-    ng-click="vm.createOrEditPause($event)"
-    aria-label="add pause"
-    translate
-    translate-attr-aria-label="TOOLS.ADD_PAUSE"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD PAUSE BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/tools/views/pauses/pauses.html/pauses.html b/public/src/js/modules/main/apps/tools/views/pauses/pauses.html/pauses.html
new file mode 100644
index 0000000..a77369a
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/pauses/pauses.html/pauses.html
@@ -0,0 +1,297 @@
+<div
+  id="pauses"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-auto-fix" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="TOOLS.PAUSES">Pauses</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="TOOLS.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedPauses.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedPauses =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="TOOLS.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-pauses-count">
+          <span>{{vm.selectedPauses.length}}</span>
+          <span translate="TOOLS.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="TOOLS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllPauses()"
+                translate="TOOLS.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectPauses()"
+                translate="TOOLS.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedPauses"
+          csv-label="true"
+          filename="pauses.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedPauses($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="TOOLS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- PAUSE TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedPauses"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getPauses"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'TOOLS.ID' | translate }}</th>
+                <th md-column md-order-by="name">
+                  {{ 'TOOLS.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'TOOLS.DESCRIPTION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.pauses.rows.length">
+                <td md-cell colspan="4">
+                  <div layout="row" layout-align="center center">
+                    <span translate="TOOLS.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="pause"
+                md-select-id="id"
+                ng-repeat="pause in vm.pauses.rows"
+              >
+                <td md-cell ng-if="pause.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{pause.name}}"
+                    ng-src="api/users/{{pause.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!pause.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{pause.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.createOrEditPause($event, pause)"
+                  md-cell
+                  class="id"
+                >
+                  {{pause.id}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditPause($event, pause)"
+                  md-cell
+                  class="name"
+                >
+                  {{pause.name}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditPause($event, pause)"
+                  md-cell
+                  class="description"
+                >
+                  {{pause.description}}
+                </td>
+
+                <td
+                  md-cell
+                  class="actions"
+                  ng-if="!vm.crudPermissions.readOnly"
+                >
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="TOOLS.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editdialog(pause, $event    )"
+                          translate="TOOLS.EDIT_PAUSE"
+                        >
+                          Edit Pause
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(pause, $event    )"
+                          translate="TOOLS.DELETE_PAUSE"
+                        >
+                          Delete Pause
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'TOOLS.PAGE' | translate}}:', rowsPerPage: '{{'TOOLS.ROWSPERPAGE' | translate}}:', of: '{{'TOOLS.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.pauses.count}}"
+          md-on-paginate="vm.getPauses"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / PAUSE TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD PAUSE BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-pause-button"
+    ng-click="vm.createOrEditPause($event)"
+    aria-label="add pause"
+    translate
+    translate-attr-aria-label="TOOLS.ADD_PAUSE"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD PAUSE BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/tools/views/schedules/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/schedules/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 9ded2f0..0000000
--- a/public/src/js/modules/main/apps/tools/views/schedules/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,478 +0,0 @@
-<md-dialog class="schedule-dialog" aria-label="New Schedule">
-  <form name="scheduleForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.schedule.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="scheduleForm['name'].$error"
-          ng-show="scheduleForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.REPORT">Report</label>
-        <input
-          type="search"
-          name="report"
-          ng-model="vm.schedule.report"
-          ng-required="true"
-          autocomplete="off"
-          ng-click="vm.searchReport()"
-        />
-        <md-icon
-          md-font-icon="icon-magnify"
-          ng-click="vm.searchReport()"
-          aria-label="Search Report"
-        ></md-icon>
-        <div
-          ng-messages="scheduleForm['report'].$error"
-          ng-show="scheduleForm['report'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.REPORT_REQUIRED"
-              >Report field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.OUTPUT">Output</label>
-        <md-select name="output" ng-model="vm.schedule.output" required>
-          <md-option ng-value="'csv'">CSV</md-option>
-          <md-option ng-value="'pdf'">PDF</md-option>
-          <md-option ng-value="'xlsx'">Excel</md-option>
-        </md-select>
-        <div
-          ng-messages="scheduleForm['output'].$error"
-          ng-show="scheduleForm['output'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.OUTPUT_REQUIRED"
-              >Output field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <md-switch ng-model="vm.schedule.active" aria-label="Active"
-          ><span translate="TOOLS.ACTIVE">Active</span></md-switch
-        >
-      </md-input-container>
-      <div class="md-block">
-        <label translate="TOOLS.VALIDITYSTART">ValidityStart</label>
-        <md-content layout="row" class="md-padding">
-          <div flex class="md-block">
-            <mdp-date-picker
-              mdp-open-on-click
-              required
-              name="startAtDate"
-              mdp-placeholder="Date"
-              mdp-format="YYYY-MM-DD"
-              ng-model="vm.schedule.startAt"
-              ng-init="vm.schedule.startAt = vm.getDateFromString(vm.schedule.startAt)"
-            >
-              <div
-                ng-messages="scheduleForm.dateRangeFrom.$error"
-                ng-show="scheduleForm.dateRangeFrom.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="TOOLS.ERRORS.DATE_REQUIRED"
-                    >Date is required</span
-                  >
-                </div>
-                <div ng-message="format">
-                  <span translate="TOOLS.ERRORS.DATE_INVALID"
-                    >Date is invalid</span
-                  >
-                </div>
-              </div>
-            </mdp-date-picker>
-          </div>
-          <div flex class="md-block">
-            <mdp-time-picker
-              mdp-open-on-click
-              required
-              name="startAtTime"
-              mdp-placeholder="Time"
-              mdp-format="HH:mm:ss"
-              mdp-auto-switch="true"
-              ng-model="vm.schedule.startAt"
-              ng-init="vm.schedule.startAt = vm.getDateFromString(vm.schedule.startAt)"
-            >
-              <div
-                ng-messages="scheduleForm.timeRangeFrom.$error"
-                ng-show="scheduleForm.timeRangeFrom.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="TOOLS.ERRORS.TIME_REQUIRED"
-                    >Time is required</span
-                  >
-                </div>
-                <div ng-message="format">
-                  <span translate="TOOLS.ERRORS.TIME_INVALID"
-                    >Time is invalid</span
-                  >
-                </div>
-              </div>
-            </mdp-time-picker>
-          </div>
-        </md-content>
-      </div>
-      <div class="md-block">
-        <label translate="TOOLS.VALIDITYEND">ValidityEnd</label>
-        <md-content layout="row" class="md-padding">
-          <div flex class="md-block">
-            <mdp-date-picker
-              mdp-open-on-click
-              required
-              name="endAtDate"
-              mdp-placeholder="Date"
-              mdp-format="YYYY-MM-DD"
-              ng-model="vm.schedule.endAt"
-              ng-init="vm.schedule.endAt = vm.getDateFromString(vm.schedule.endAt)"
-            >
-              <div
-                ng-messages="scheduleForm.dateRangeFrom.$error"
-                ng-show="scheduleForm.dateRangeFrom.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="TOOLS.ERRORS.DATE_REQUIRED"
-                    >Date is required</span
-                  >
-                </div>
-                <div ng-message="format">
-                  <span translate="TOOLS.ERRORS.DATE_INVALID"
-                    >Date is invalid</span
-                  >
-                </div>
-              </div>
-            </mdp-date-picker>
-          </div>
-          <div flex class="md-block">
-            <mdp-time-picker
-              mdp-open-on-click
-              required
-              name="endAtTime"
-              mdp-placeholder="Time"
-              mdp-format="HH:mm:ss"
-              mdp-auto-switch="true"
-              ng-model="vm.schedule.endAt"
-              ng-init="vm.schedule.endAt = vm.getDateFromString(vm.schedule.endAt)"
-            >
-              <div
-                ng-messages="scheduleForm.timeRangeFrom.$error"
-                ng-show="scheduleForm.timeRangeFrom.$touched"
-                role="alert"
-              >
-                <div ng-message="required">
-                  <span translate="TOOLS.ERRORS.TIME_REQUIRED"
-                    >Time is required</span
-                  >
-                </div>
-                <div ng-message="format">
-                  <span translate="TOOLS.ERRORS.TIME_INVALID"
-                    >Time is invalid</span
-                  >
-                </div>
-              </div>
-            </mdp-time-picker>
-          </div>
-        </md-content>
-      </div>
-      <div flex class="md-block">
-        <label> {{ 'TOOLS.CRON' | translate }} ({{vm.schedule.cron}})</label>
-        <cron-selection
-          name="cron"
-          ng-model="vm.schedule.cron"
-          template="assets/angular-cron-jobs/template.html"
-          required
-        ></cron-selection>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.LAST">Last</label>
-        <input
-          type="number"
-          name="subtractNumber"
-          ng-model="vm.schedule.subtractNumber"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="scheduleForm['subtractNumber'].$error"
-          ng-show="scheduleForm['subtractNumber'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.LAST_REQUIRED"
-              >Last field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.LASTUNIT">LastUnit</label>
-        <md-select
-          name="subtractUnit"
-          ng-model="vm.schedule.subtractUnit"
-          required
-        >
-          <md-option ng-value="'minutes'">Minutes</md-option>
-          <md-option ng-value="'hours'">Hours</md-option>
-          <md-option ng-value="'days'">Days</md-option>
-          <md-option ng-value="'weeks'">Weeks</md-option>
-          <md-option ng-value="'months'">Months</md-option>
-          <md-option ng-value="'quarters'">Quarters</md-option>
-          <md-option ng-value="'years'">Years</md-option>
-        </md-select>
-        <div
-          ng-messages="scheduleForm['subtractUnit'].$error"
-          ng-show="scheduleForm['subtractUnit'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.LASTUNIT_REQUIRED"
-              >LastUnit field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <md-switch ng-model="vm.schedule.sendMail" aria-label="SendMail"
-          ><span translate="TOOLS.SENDMAIL">SendMail</span></md-switch
-        >
-      </md-input-container>
-      <md-input-container ng-if="vm.schedule.sendMail" class="md-block">
-        <label translate="TOOLS.MAILACCOUNT">MailAccount</label>
-        <md-select
-          name="MailAccountId"
-          ng-model="vm.schedule.MailAccountId"
-          required
-        >
-          <md-option
-            ng-value="MailAccountId.id"
-            ng-repeat="MailAccountId in vm.mailAccounts"
-            ng-disabled="MailAccountId.canSelect === false"
-            >{{ MailAccountId.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="scheduleForm['MailAccountId'].$error"
-          ng-show="scheduleForm['MailAccountId'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.MAILACCOUNT_REQUIRED"
-              >MailAccount field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container ng-if="vm.schedule.sendMail" class="md-block">
-        <label translate="TOOLS.EMAILADDRESS">EmailAddress</label>
-        <input
-          type="text"
-          name="email"
-          ng-model="vm.schedule.email"
-          ng-required="true"
-        />
-
-        <div class="hint">
-          <span translate="TOOLS.HELP.EMAILADDRESS"></span>
-        </div>
-        <div
-          ng-messages="scheduleForm['email'].$error"
-          ng-show="scheduleForm['email'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.EMAILADDRESS_REQUIRED"
-              >EmailAddress field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container ng-if="vm.schedule.sendMail" class="md-block">
-        <label translate="TOOLS.EMAILCCADDRESS">EmailCcAddress</label>
-        <input type="text" name="cc" ng-model="vm.schedule.cc" />
-
-        <div class="hint">
-          <span translate="TOOLS.HELP.EMAILCCADDRESS"></span>
-        </div>
-        <div
-          ng-messages="scheduleForm['cc'].$error"
-          ng-show="scheduleForm['cc'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.EMAILCCADDRESS_REQUIRED"
-              >EmailCcAddress field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container ng-if="vm.schedule.sendMail" class="md-block">
-        <label translate="TOOLS.EMAILBCCADDRESS">EmailBccAddress</label>
-        <input type="text" name="bcc" ng-model="vm.schedule.bcc" />
-
-        <div class="hint">
-          <span translate="TOOLS.HELP.EMAILBCCADDRESS"></span>
-        </div>
-        <div
-          ng-messages="scheduleForm['bcc'].$error"
-          ng-show="scheduleForm['bcc'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.EMAILBCCADDRESS_REQUIRED"
-              >EmailBccAddress field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container ng-if="vm.schedule.sendMail" class="md-block">
-        <md-switch ng-model="vm.schedule.sendIfEmpty" aria-label="SendIfEmpty"
-          ><span translate="TOOLS.SENDIFEMPTY">SendIfEmpty</span></md-switch
-        >
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.DESCRIPTION">Description</label>
-        <input type="" name="description" ng-model="vm.schedule.description" />
-
-        <div
-          ng-messages="scheduleForm['description'].$error"
-          ng-show="scheduleForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newSchedule"
-          ng-click="vm.saveSchedule()"
-          class="send-button md-accent md-raised"
-          ng-disabled="scheduleForm.$invalid || scheduleForm.$pristine"
-          aria-label="SAVE"
-          translate="TOOLS.SAVE"
-          translate-attr-aria-label="TOOLS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newSchedule"
-          ng-click="vm.addNewSchedule()"
-          class="send-button md-accent md-raised"
-          ng-disabled="scheduleForm.$invalid"
-          aria-label="ADD"
-          translate="TOOLS.ADD_SCHEDULE"
-          translate-attr-aria-label="TOOLS.ADD_SCHEDULE"
-        >
-          ADD SCHEDULE
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newSchedule"
-          ng-click="vm.deleteSchedule($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="TOOLS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/schedules/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/tools/views/schedules/create/dialog.html/dialog.html
new file mode 100644
index 0000000..9ded2f0
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/schedules/create/dialog.html/dialog.html
@@ -0,0 +1,478 @@
+<md-dialog class="schedule-dialog" aria-label="New Schedule">
+  <form name="scheduleForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.schedule.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="scheduleForm['name'].$error"
+          ng-show="scheduleForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.REPORT">Report</label>
+        <input
+          type="search"
+          name="report"
+          ng-model="vm.schedule.report"
+          ng-required="true"
+          autocomplete="off"
+          ng-click="vm.searchReport()"
+        />
+        <md-icon
+          md-font-icon="icon-magnify"
+          ng-click="vm.searchReport()"
+          aria-label="Search Report"
+        ></md-icon>
+        <div
+          ng-messages="scheduleForm['report'].$error"
+          ng-show="scheduleForm['report'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.REPORT_REQUIRED"
+              >Report field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.OUTPUT">Output</label>
+        <md-select name="output" ng-model="vm.schedule.output" required>
+          <md-option ng-value="'csv'">CSV</md-option>
+          <md-option ng-value="'pdf'">PDF</md-option>
+          <md-option ng-value="'xlsx'">Excel</md-option>
+        </md-select>
+        <div
+          ng-messages="scheduleForm['output'].$error"
+          ng-show="scheduleForm['output'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.OUTPUT_REQUIRED"
+              >Output field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <md-switch ng-model="vm.schedule.active" aria-label="Active"
+          ><span translate="TOOLS.ACTIVE">Active</span></md-switch
+        >
+      </md-input-container>
+      <div class="md-block">
+        <label translate="TOOLS.VALIDITYSTART">ValidityStart</label>
+        <md-content layout="row" class="md-padding">
+          <div flex class="md-block">
+            <mdp-date-picker
+              mdp-open-on-click
+              required
+              name="startAtDate"
+              mdp-placeholder="Date"
+              mdp-format="YYYY-MM-DD"
+              ng-model="vm.schedule.startAt"
+              ng-init="vm.schedule.startAt = vm.getDateFromString(vm.schedule.startAt)"
+            >
+              <div
+                ng-messages="scheduleForm.dateRangeFrom.$error"
+                ng-show="scheduleForm.dateRangeFrom.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="TOOLS.ERRORS.DATE_REQUIRED"
+                    >Date is required</span
+                  >
+                </div>
+                <div ng-message="format">
+                  <span translate="TOOLS.ERRORS.DATE_INVALID"
+                    >Date is invalid</span
+                  >
+                </div>
+              </div>
+            </mdp-date-picker>
+          </div>
+          <div flex class="md-block">
+            <mdp-time-picker
+              mdp-open-on-click
+              required
+              name="startAtTime"
+              mdp-placeholder="Time"
+              mdp-format="HH:mm:ss"
+              mdp-auto-switch="true"
+              ng-model="vm.schedule.startAt"
+              ng-init="vm.schedule.startAt = vm.getDateFromString(vm.schedule.startAt)"
+            >
+              <div
+                ng-messages="scheduleForm.timeRangeFrom.$error"
+                ng-show="scheduleForm.timeRangeFrom.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="TOOLS.ERRORS.TIME_REQUIRED"
+                    >Time is required</span
+                  >
+                </div>
+                <div ng-message="format">
+                  <span translate="TOOLS.ERRORS.TIME_INVALID"
+                    >Time is invalid</span
+                  >
+                </div>
+              </div>
+            </mdp-time-picker>
+          </div>
+        </md-content>
+      </div>
+      <div class="md-block">
+        <label translate="TOOLS.VALIDITYEND">ValidityEnd</label>
+        <md-content layout="row" class="md-padding">
+          <div flex class="md-block">
+            <mdp-date-picker
+              mdp-open-on-click
+              required
+              name="endAtDate"
+              mdp-placeholder="Date"
+              mdp-format="YYYY-MM-DD"
+              ng-model="vm.schedule.endAt"
+              ng-init="vm.schedule.endAt = vm.getDateFromString(vm.schedule.endAt)"
+            >
+              <div
+                ng-messages="scheduleForm.dateRangeFrom.$error"
+                ng-show="scheduleForm.dateRangeFrom.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="TOOLS.ERRORS.DATE_REQUIRED"
+                    >Date is required</span
+                  >
+                </div>
+                <div ng-message="format">
+                  <span translate="TOOLS.ERRORS.DATE_INVALID"
+                    >Date is invalid</span
+                  >
+                </div>
+              </div>
+            </mdp-date-picker>
+          </div>
+          <div flex class="md-block">
+            <mdp-time-picker
+              mdp-open-on-click
+              required
+              name="endAtTime"
+              mdp-placeholder="Time"
+              mdp-format="HH:mm:ss"
+              mdp-auto-switch="true"
+              ng-model="vm.schedule.endAt"
+              ng-init="vm.schedule.endAt = vm.getDateFromString(vm.schedule.endAt)"
+            >
+              <div
+                ng-messages="scheduleForm.timeRangeFrom.$error"
+                ng-show="scheduleForm.timeRangeFrom.$touched"
+                role="alert"
+              >
+                <div ng-message="required">
+                  <span translate="TOOLS.ERRORS.TIME_REQUIRED"
+                    >Time is required</span
+                  >
+                </div>
+                <div ng-message="format">
+                  <span translate="TOOLS.ERRORS.TIME_INVALID"
+                    >Time is invalid</span
+                  >
+                </div>
+              </div>
+            </mdp-time-picker>
+          </div>
+        </md-content>
+      </div>
+      <div flex class="md-block">
+        <label> {{ 'TOOLS.CRON' | translate }} ({{vm.schedule.cron}})</label>
+        <cron-selection
+          name="cron"
+          ng-model="vm.schedule.cron"
+          template="assets/angular-cron-jobs/template.html"
+          required
+        ></cron-selection>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.LAST">Last</label>
+        <input
+          type="number"
+          name="subtractNumber"
+          ng-model="vm.schedule.subtractNumber"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="scheduleForm['subtractNumber'].$error"
+          ng-show="scheduleForm['subtractNumber'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.LAST_REQUIRED"
+              >Last field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.LASTUNIT">LastUnit</label>
+        <md-select
+          name="subtractUnit"
+          ng-model="vm.schedule.subtractUnit"
+          required
+        >
+          <md-option ng-value="'minutes'">Minutes</md-option>
+          <md-option ng-value="'hours'">Hours</md-option>
+          <md-option ng-value="'days'">Days</md-option>
+          <md-option ng-value="'weeks'">Weeks</md-option>
+          <md-option ng-value="'months'">Months</md-option>
+          <md-option ng-value="'quarters'">Quarters</md-option>
+          <md-option ng-value="'years'">Years</md-option>
+        </md-select>
+        <div
+          ng-messages="scheduleForm['subtractUnit'].$error"
+          ng-show="scheduleForm['subtractUnit'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.LASTUNIT_REQUIRED"
+              >LastUnit field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <md-switch ng-model="vm.schedule.sendMail" aria-label="SendMail"
+          ><span translate="TOOLS.SENDMAIL">SendMail</span></md-switch
+        >
+      </md-input-container>
+      <md-input-container ng-if="vm.schedule.sendMail" class="md-block">
+        <label translate="TOOLS.MAILACCOUNT">MailAccount</label>
+        <md-select
+          name="MailAccountId"
+          ng-model="vm.schedule.MailAccountId"
+          required
+        >
+          <md-option
+            ng-value="MailAccountId.id"
+            ng-repeat="MailAccountId in vm.mailAccounts"
+            ng-disabled="MailAccountId.canSelect === false"
+            >{{ MailAccountId.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="scheduleForm['MailAccountId'].$error"
+          ng-show="scheduleForm['MailAccountId'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.MAILACCOUNT_REQUIRED"
+              >MailAccount field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container ng-if="vm.schedule.sendMail" class="md-block">
+        <label translate="TOOLS.EMAILADDRESS">EmailAddress</label>
+        <input
+          type="text"
+          name="email"
+          ng-model="vm.schedule.email"
+          ng-required="true"
+        />
+
+        <div class="hint">
+          <span translate="TOOLS.HELP.EMAILADDRESS"></span>
+        </div>
+        <div
+          ng-messages="scheduleForm['email'].$error"
+          ng-show="scheduleForm['email'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.EMAILADDRESS_REQUIRED"
+              >EmailAddress field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container ng-if="vm.schedule.sendMail" class="md-block">
+        <label translate="TOOLS.EMAILCCADDRESS">EmailCcAddress</label>
+        <input type="text" name="cc" ng-model="vm.schedule.cc" />
+
+        <div class="hint">
+          <span translate="TOOLS.HELP.EMAILCCADDRESS"></span>
+        </div>
+        <div
+          ng-messages="scheduleForm['cc'].$error"
+          ng-show="scheduleForm['cc'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.EMAILCCADDRESS_REQUIRED"
+              >EmailCcAddress field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container ng-if="vm.schedule.sendMail" class="md-block">
+        <label translate="TOOLS.EMAILBCCADDRESS">EmailBccAddress</label>
+        <input type="text" name="bcc" ng-model="vm.schedule.bcc" />
+
+        <div class="hint">
+          <span translate="TOOLS.HELP.EMAILBCCADDRESS"></span>
+        </div>
+        <div
+          ng-messages="scheduleForm['bcc'].$error"
+          ng-show="scheduleForm['bcc'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.EMAILBCCADDRESS_REQUIRED"
+              >EmailBccAddress field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container ng-if="vm.schedule.sendMail" class="md-block">
+        <md-switch ng-model="vm.schedule.sendIfEmpty" aria-label="SendIfEmpty"
+          ><span translate="TOOLS.SENDIFEMPTY">SendIfEmpty</span></md-switch
+        >
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.DESCRIPTION">Description</label>
+        <input type="" name="description" ng-model="vm.schedule.description" />
+
+        <div
+          ng-messages="scheduleForm['description'].$error"
+          ng-show="scheduleForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newSchedule"
+          ng-click="vm.saveSchedule()"
+          class="send-button md-accent md-raised"
+          ng-disabled="scheduleForm.$invalid || scheduleForm.$pristine"
+          aria-label="SAVE"
+          translate="TOOLS.SAVE"
+          translate-attr-aria-label="TOOLS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newSchedule"
+          ng-click="vm.addNewSchedule()"
+          class="send-button md-accent md-raised"
+          ng-disabled="scheduleForm.$invalid"
+          aria-label="ADD"
+          translate="TOOLS.ADD_SCHEDULE"
+          translate-attr-aria-label="TOOLS.ADD_SCHEDULE"
+        >
+          ADD SCHEDULE
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newSchedule"
+          ng-click="vm.deleteSchedule($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="TOOLS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/schedules/partialViews/reports/treeReports.html/treeReports-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/schedules/partialViews/reports/treeReports.html/treeReports-[chunkhash].html
deleted file mode 100644
index eaefc20..0000000
--- a/public/src/js/modules/main/apps/tools/views/schedules/partialViews/reports/treeReports.html/treeReports-[chunkhash].html
+++ /dev/null
@@ -1,125 +0,0 @@
-<md-dialog
-  class="report-selection-dialog"
-  aria-label="Report Selection"
-  flex="60"
->
-  <md-toolbar>
-    <div class="md-toolbar-tools">
-      <h2>Select Report</h2>
-      <span flex></span>
-      <md-button class="md-icon-button" ng-click="vm.closeReportDialog()">
-        <md-icon md-font-icon="icon-close" aria-label="Close dialog"></md-icon>
-      </md-button>
-    </div>
-  </md-toolbar>
-
-  <md-dialog-content>
-    <div
-      class="content"
-      md-background-bg
-      layout="row"
-      layout-align="start start"
-    >
-      <div layout="column" flex="30">
-        <md-card class="padding-10 scrollable" ms-scroll>
-          <div
-            js-tree="vm.treeConfig"
-            tree-events-obj="vm.treeDefaultEvents"
-            ng-model="vm.treeDefaultData"
-            tree="vm.treeDefaultInstance"
-          ></div>
-        </md-card>
-        <md-card class="padding-10 scrollable" ms-scroll>
-          <div
-            js-tree="vm.treeConfig"
-            tree-events-obj="vm.treeCustomEvents"
-            ng-model="vm.treeCustomData"
-            tree="vm.treeCustomInstance"
-          ></div>
-        </md-card>
-      </div>
-      <md-card flex="70">
-        <md-toolbar class="md-table-toolbar md-default">
-          <div class="md-toolbar-tools">
-            <span class="h2 secondary-text">{{vm.currentNode.text}}</span>
-            <p ng-if="vm.currentPath">
-              <span class="text-boxed">{{vm.currentPath}}</span>
-            </p>
-          </div>
-        </md-toolbar>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            ng-model="vm.selectedReport"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getReports"
-            >
-              <tr md-row>
-                <th md-column md-order-by="id" width="10px">
-                  {{ "ANALYTICS.ID" | translate }}
-                </th>
-                <th md-column md-order-by="name">
-                  {{ "ANALYTICS.NAME" | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ "ANALYTICS.DESCRIPTION" | translate }}
-                </th>
-                <th md-column md-order-by="createdAt">
-                  {{ "ANALYTICS.CREATED_AT" | translate }}
-                </th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.reports.rows.length">
-                <td md-cell colspan="5">
-                  <div layout="row" layout-align="center center">
-                    <span translate="ANALYTICS.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="report"
-                md-select-id="id"
-                ng-repeat="report in vm.reports.rows"
-              >
-                <td md-cell class="id">{{ report.id }}</td>
-                <td md-cell class="name">{{ report.name }}</td>
-                <td md-cell class="description">{{ report.description }}</td>
-                <td md-cell class="createdAt">
-                  {{ report.createdAt | date: "medium" }}
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{ 'ANALYTICS.PAGE' | translate }}:', rowsPerPage: '{{ 'ANALYTICS.ROWSPERPAGE' | translate }}:', of: '{{ 'ANALYTICS.OF' | translate }}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10]"
-          md-page="vm.query.page"
-          md-total="{{ vm.reports.count }}"
-          md-on-paginate="vm.getReports"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-    </div>
-  </md-dialog-content>
-  <md-dialog-actions layout="row">
-    <span flex></span>
-    <md-button class="md-raised" ng-click="vm.closeReportDialog()"
-      >CANCEL</md-button
-    >
-    <md-button class="md-accent md-raised" ng-click="vm.selectReport()"
-      >CONFIRM</md-button
-    >
-  </md-dialog-actions>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/schedules/partialViews/reports/treeReports.html/treeReports.html b/public/src/js/modules/main/apps/tools/views/schedules/partialViews/reports/treeReports.html/treeReports.html
new file mode 100644
index 0000000..eaefc20
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/schedules/partialViews/reports/treeReports.html/treeReports.html
@@ -0,0 +1,125 @@
+<md-dialog
+  class="report-selection-dialog"
+  aria-label="Report Selection"
+  flex="60"
+>
+  <md-toolbar>
+    <div class="md-toolbar-tools">
+      <h2>Select Report</h2>
+      <span flex></span>
+      <md-button class="md-icon-button" ng-click="vm.closeReportDialog()">
+        <md-icon md-font-icon="icon-close" aria-label="Close dialog"></md-icon>
+      </md-button>
+    </div>
+  </md-toolbar>
+
+  <md-dialog-content>
+    <div
+      class="content"
+      md-background-bg
+      layout="row"
+      layout-align="start start"
+    >
+      <div layout="column" flex="30">
+        <md-card class="padding-10 scrollable" ms-scroll>
+          <div
+            js-tree="vm.treeConfig"
+            tree-events-obj="vm.treeDefaultEvents"
+            ng-model="vm.treeDefaultData"
+            tree="vm.treeDefaultInstance"
+          ></div>
+        </md-card>
+        <md-card class="padding-10 scrollable" ms-scroll>
+          <div
+            js-tree="vm.treeConfig"
+            tree-events-obj="vm.treeCustomEvents"
+            ng-model="vm.treeCustomData"
+            tree="vm.treeCustomInstance"
+          ></div>
+        </md-card>
+      </div>
+      <md-card flex="70">
+        <md-toolbar class="md-table-toolbar md-default">
+          <div class="md-toolbar-tools">
+            <span class="h2 secondary-text">{{vm.currentNode.text}}</span>
+            <p ng-if="vm.currentPath">
+              <span class="text-boxed">{{vm.currentPath}}</span>
+            </p>
+          </div>
+        </md-toolbar>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            ng-model="vm.selectedReport"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getReports"
+            >
+              <tr md-row>
+                <th md-column md-order-by="id" width="10px">
+                  {{ "ANALYTICS.ID" | translate }}
+                </th>
+                <th md-column md-order-by="name">
+                  {{ "ANALYTICS.NAME" | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ "ANALYTICS.DESCRIPTION" | translate }}
+                </th>
+                <th md-column md-order-by="createdAt">
+                  {{ "ANALYTICS.CREATED_AT" | translate }}
+                </th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.reports.rows.length">
+                <td md-cell colspan="5">
+                  <div layout="row" layout-align="center center">
+                    <span translate="ANALYTICS.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="report"
+                md-select-id="id"
+                ng-repeat="report in vm.reports.rows"
+              >
+                <td md-cell class="id">{{ report.id }}</td>
+                <td md-cell class="name">{{ report.name }}</td>
+                <td md-cell class="description">{{ report.description }}</td>
+                <td md-cell class="createdAt">
+                  {{ report.createdAt | date: "medium" }}
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{ 'ANALYTICS.PAGE' | translate }}:', rowsPerPage: '{{ 'ANALYTICS.ROWSPERPAGE' | translate }}:', of: '{{ 'ANALYTICS.OF' | translate }}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10]"
+          md-page="vm.query.page"
+          md-total="{{ vm.reports.count }}"
+          md-on-paginate="vm.getReports"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+    </div>
+  </md-dialog-content>
+  <md-dialog-actions layout="row">
+    <span flex></span>
+    <md-button class="md-raised" ng-click="vm.closeReportDialog()"
+      >CANCEL</md-button
+    >
+    <md-button class="md-accent md-raised" ng-click="vm.selectReport()"
+      >CONFIRM</md-button
+    >
+  </md-dialog-actions>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/schedules/schedules.html/schedules-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/schedules/schedules.html/schedules-[chunkhash].html
deleted file mode 100644
index bd28c1e..0000000
--- a/public/src/js/modules/main/apps/tools/views/schedules/schedules.html/schedules-[chunkhash].html
+++ /dev/null
@@ -1,339 +0,0 @@
-<div
-  id="schedules"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-auto-fix" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="TOOLS.SCHEDULER">Scheduler</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="TOOLS.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedScheduler.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedScheduler =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="TOOLS.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-schedules-count">
-          <span>{{vm.selectedScheduler.length}}</span>
-          <span translate="TOOLS.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="TOOLS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllScheduler()"
-                translate="TOOLS.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectScheduler()"
-                translate="TOOLS.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedScheduler"
-          csv-label="true"
-          filename="schedules.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedScheduler($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="TOOLS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- SCHEDULE TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedScheduler"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getScheduler"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'TOOLS.ID' | translate }}</th>
-                <th md-column md-order-by="name">
-                  {{ 'TOOLS.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="active">
-                  {{ 'TOOLS.ACTIVE' | translate }}
-                </th>
-                <th md-column md-order-by="startAt">
-                  {{ 'TOOLS.VALIDITYSTART' | translate }}
-                </th>
-                <th md-column md-order-by="endAt">
-                  {{ 'TOOLS.VALIDITYEND' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'TOOLS.DESCRIPTION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.schedules.rows.length">
-                <td md-cell colspan="7">
-                  <div layout="row" layout-align="center center">
-                    <span translate="TOOLS.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="schedule"
-                md-select-id="id"
-                ng-repeat="schedule in vm.schedules.rows"
-              >
-                <td md-cell ng-if="schedule.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{schedule.name}}"
-                    ng-src="api/users/{{schedule.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!schedule.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{schedule.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.createOrEditSchedule($event, schedule)"
-                  md-cell
-                  class="id"
-                >
-                  {{schedule.id}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditSchedule($event, schedule)"
-                  md-cell
-                  class="name"
-                >
-                  {{schedule.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(schedule, ev) : vm.createOrEditSchedule($event, schedule)"
-                  md-cell
-                  class="active"
-                >
-                  <md-icon
-                    md-colors="{color: {{schedule.active ? '\'green\'' : '\'grey\''}}}"
-                    md-font-icon="{{schedule.active ? 'icon-check' : 'icon-close'}}"
-                  ></md-icon>
-                </td>
-                <td
-                  ng-click="vm.createOrEditSchedule($event, schedule)"
-                  md-cell
-                  class="startAt"
-                >
-                  {{schedule.startAt | date:'medium' }}
-                </td>
-                <td
-                  ng-click="vm.createOrEditSchedule($event, schedule)"
-                  md-cell
-                  class="endAt"
-                >
-                  {{schedule.endAt | date:'medium' }}
-                </td>
-                <td
-                  ng-click="vm.createOrEditSchedule($event, schedule)"
-                  md-cell
-                  class="description"
-                >
-                  {{schedule.description}}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="TOOLS.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editdialog(schedule, $event    )"
-                          translate="TOOLS.EDIT_SCHEDULE"
-                        >
-                          Edit Schedule
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.runconfirm(schedule, $event    )"
-                          translate="TOOLS.RUN_SCHEDULE"
-                        >
-                          Run Schedule
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(schedule, $event    )"
-                          translate="TOOLS.DELETE_SCHEDULE"
-                        >
-                          Delete Schedule
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'TOOLS.PAGE' | translate}}:', rowsPerPage: '{{'TOOLS.ROWSPERPAGE' | translate}}:', of: '{{'TOOLS.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.schedules.count}}"
-          md-on-paginate="vm.getScheduler"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / SCHEDULE TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD SCHEDULE BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-schedule-button"
-    ng-click="vm.createOrEditSchedule($event)"
-    aria-label="add schedule"
-    translate
-    translate-attr-aria-label="TOOLS.ADD_SCHEDULE"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD SCHEDULE BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/tools/views/schedules/schedules.html/schedules.html b/public/src/js/modules/main/apps/tools/views/schedules/schedules.html/schedules.html
new file mode 100644
index 0000000..bd28c1e
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/schedules/schedules.html/schedules.html
@@ -0,0 +1,339 @@
+<div
+  id="schedules"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-auto-fix" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="TOOLS.SCHEDULER">Scheduler</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="TOOLS.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedScheduler.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedScheduler =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="TOOLS.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-schedules-count">
+          <span>{{vm.selectedScheduler.length}}</span>
+          <span translate="TOOLS.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="TOOLS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllScheduler()"
+                translate="TOOLS.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectScheduler()"
+                translate="TOOLS.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedScheduler"
+          csv-label="true"
+          filename="schedules.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedScheduler($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="TOOLS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- SCHEDULE TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedScheduler"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getScheduler"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'TOOLS.ID' | translate }}</th>
+                <th md-column md-order-by="name">
+                  {{ 'TOOLS.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="active">
+                  {{ 'TOOLS.ACTIVE' | translate }}
+                </th>
+                <th md-column md-order-by="startAt">
+                  {{ 'TOOLS.VALIDITYSTART' | translate }}
+                </th>
+                <th md-column md-order-by="endAt">
+                  {{ 'TOOLS.VALIDITYEND' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'TOOLS.DESCRIPTION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.schedules.rows.length">
+                <td md-cell colspan="7">
+                  <div layout="row" layout-align="center center">
+                    <span translate="TOOLS.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="schedule"
+                md-select-id="id"
+                ng-repeat="schedule in vm.schedules.rows"
+              >
+                <td md-cell ng-if="schedule.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{schedule.name}}"
+                    ng-src="api/users/{{schedule.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!schedule.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{schedule.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.createOrEditSchedule($event, schedule)"
+                  md-cell
+                  class="id"
+                >
+                  {{schedule.id}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditSchedule($event, schedule)"
+                  md-cell
+                  class="name"
+                >
+                  {{schedule.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(schedule, ev) : vm.createOrEditSchedule($event, schedule)"
+                  md-cell
+                  class="active"
+                >
+                  <md-icon
+                    md-colors="{color: {{schedule.active ? '\'green\'' : '\'grey\''}}}"
+                    md-font-icon="{{schedule.active ? 'icon-check' : 'icon-close'}}"
+                  ></md-icon>
+                </td>
+                <td
+                  ng-click="vm.createOrEditSchedule($event, schedule)"
+                  md-cell
+                  class="startAt"
+                >
+                  {{schedule.startAt | date:'medium' }}
+                </td>
+                <td
+                  ng-click="vm.createOrEditSchedule($event, schedule)"
+                  md-cell
+                  class="endAt"
+                >
+                  {{schedule.endAt | date:'medium' }}
+                </td>
+                <td
+                  ng-click="vm.createOrEditSchedule($event, schedule)"
+                  md-cell
+                  class="description"
+                >
+                  {{schedule.description}}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="TOOLS.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editdialog(schedule, $event    )"
+                          translate="TOOLS.EDIT_SCHEDULE"
+                        >
+                          Edit Schedule
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.runconfirm(schedule, $event    )"
+                          translate="TOOLS.RUN_SCHEDULE"
+                        >
+                          Run Schedule
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(schedule, $event    )"
+                          translate="TOOLS.DELETE_SCHEDULE"
+                        >
+                          Delete Schedule
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'TOOLS.PAGE' | translate}}:', rowsPerPage: '{{'TOOLS.ROWSPERPAGE' | translate}}:', of: '{{'TOOLS.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.schedules.count}}"
+          md-on-paginate="vm.getScheduler"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / SCHEDULE TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD SCHEDULE BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-schedule-button"
+    ng-click="vm.createOrEditSchedule($event)"
+    aria-label="add schedule"
+    translate
+    translate-attr-aria-label="TOOLS.ADD_SCHEDULE"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD SCHEDULE BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/tools/views/sounds/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/sounds/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 091a358..0000000
--- a/public/src/js/modules/main/apps/tools/views/sounds/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,148 +0,0 @@
-<md-dialog class="sound-dialog" aria-label="New Sound">
-  <form name="soundForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.sound.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="soundForm['name'].$error"
-          ng-show="soundForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.DESCRIPTION">Description</label>
-        <input type="text" name="description" ng-model="vm.sound.description" />
-
-        <div
-          ng-messages="soundForm['description'].$error"
-          ng-show="soundForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newSound"
-          ng-click="vm.saveSound()"
-          class="send-button md-accent md-raised"
-          ng-disabled="soundForm.$invalid || soundForm.$pristine"
-          aria-label="SAVE"
-          translate="TOOLS.SAVE"
-          translate-attr-aria-label="TOOLS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newSound"
-          ng-click="vm.addNewSound()"
-          class="send-button md-accent md-raised"
-          ng-disabled="soundForm.$invalid"
-          aria-label="ADD"
-          translate="TOOLS.ADD_SOUND"
-          translate-attr-aria-label="TOOLS.ADD_SOUND"
-        >
-          ADD SOUND
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newSound"
-          ng-click="vm.deleteSound($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="TOOLS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/sounds/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/tools/views/sounds/create/dialog.html/dialog.html
new file mode 100644
index 0000000..091a358
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/sounds/create/dialog.html/dialog.html
@@ -0,0 +1,148 @@
+<md-dialog class="sound-dialog" aria-label="New Sound">
+  <form name="soundForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.sound.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="soundForm['name'].$error"
+          ng-show="soundForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.DESCRIPTION">Description</label>
+        <input type="text" name="description" ng-model="vm.sound.description" />
+
+        <div
+          ng-messages="soundForm['description'].$error"
+          ng-show="soundForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newSound"
+          ng-click="vm.saveSound()"
+          class="send-button md-accent md-raised"
+          ng-disabled="soundForm.$invalid || soundForm.$pristine"
+          aria-label="SAVE"
+          translate="TOOLS.SAVE"
+          translate-attr-aria-label="TOOLS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newSound"
+          ng-click="vm.addNewSound()"
+          class="send-button md-accent md-raised"
+          ng-disabled="soundForm.$invalid"
+          aria-label="ADD"
+          translate="TOOLS.ADD_SOUND"
+          translate-attr-aria-label="TOOLS.ADD_SOUND"
+        >
+          ADD SOUND
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newSound"
+          ng-click="vm.deleteSound($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="TOOLS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/sounds/sounds.html/sounds-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/sounds/sounds.html/sounds-[chunkhash].html
deleted file mode 100644
index 51eed07..0000000
--- a/public/src/js/modules/main/apps/tools/views/sounds/sounds.html/sounds-[chunkhash].html
+++ /dev/null
@@ -1,314 +0,0 @@
-<div
-  id="sounds"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-auto-fix" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="TOOLS.SOUNDS">Sounds</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="TOOLS.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedSounds.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedSounds =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="TOOLS.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-sounds-count">
-          <span>{{vm.selectedSounds.length}}</span>
-          <span translate="TOOLS.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="TOOLS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllSounds()"
-                translate="TOOLS.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectSounds()"
-                translate="TOOLS.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedSounds"
-          csv-label="true"
-          filename="sounds.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedSounds($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="TOOLS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- SOUND TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedSounds"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getSounds"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'TOOLS.ID' | translate }}</th>
-                <th md-column md-order-by="name">
-                  {{ 'TOOLS.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="audio">
-                  {{ 'TOOLS.AUDIO' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'TOOLS.DESCRIPTION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.sounds.rows.length">
-                <td md-cell colspan="5">
-                  <div layout="row" layout-align="center center">
-                    <span translate="TOOLS.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="sound"
-                md-select-id="id"
-                ng-repeat="sound in vm.sounds.rows"
-              >
-                <td md-cell ng-if="sound.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{sound.name}}"
-                    ng-src="api/users/{{sound.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!sound.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{sound.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.createOrEditSound($event, sound)"
-                  md-cell
-                  class="id"
-                >
-                  {{sound.id}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditSound($event, sound)"
-                  md-cell
-                  class="name"
-                >
-                  {{sound.name}}
-                </td>
-                <td md-cell class="audio">
-                  <!-- audio recording directive -->
-                  <ms-recording id="sound.id" model="'sound'"></ms-recording>
-                  <!-- / audio recording directive -->
-                </td>
-                <td
-                  ng-click="vm.createOrEditSound($event, sound)"
-                  md-cell
-                  class="description"
-                >
-                  {{sound.description}}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="TOOLS.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editdialog(sound, $event    )"
-                          translate="TOOLS.EDIT_SOUND"
-                        >
-                          Edit Sound
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.downloadfile2(sound, $event  , 'sounds'   )"
-                          translate="TOOLS.DOWNLOAD_SOUND"
-                        >
-                          Download Sound
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(sound, $event    )"
-                          translate="TOOLS.DELETE_SOUND"
-                        >
-                          Delete Sound
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'TOOLS.PAGE' | translate}}:', rowsPerPage: '{{'TOOLS.ROWSPERPAGE' | translate}}:', of: '{{'TOOLS.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.sounds.count}}"
-          md-on-paginate="vm.getSounds"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / SOUND TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- UPLOAD SOUND BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent upload-item-button"
-    id="upload-sound-button"
-    ng-click="vm.uploadSound($event)"
-    aria-label="upload sound"
-    translate
-    translate-attr-aria-label="TOOLS.UPLOAD_SOUND"
-  >
-    <md-icon md-font-icon="icon-upload"></md-icon>
-  </md-button>
-  <!-- / UPLOAD SOUND BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/tools/views/sounds/sounds.html/sounds.html b/public/src/js/modules/main/apps/tools/views/sounds/sounds.html/sounds.html
new file mode 100644
index 0000000..51eed07
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/sounds/sounds.html/sounds.html
@@ -0,0 +1,314 @@
+<div
+  id="sounds"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-auto-fix" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="TOOLS.SOUNDS">Sounds</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="TOOLS.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedSounds.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedSounds =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="TOOLS.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-sounds-count">
+          <span>{{vm.selectedSounds.length}}</span>
+          <span translate="TOOLS.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="TOOLS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllSounds()"
+                translate="TOOLS.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectSounds()"
+                translate="TOOLS.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedSounds"
+          csv-label="true"
+          filename="sounds.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedSounds($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="TOOLS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- SOUND TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedSounds"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getSounds"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'TOOLS.ID' | translate }}</th>
+                <th md-column md-order-by="name">
+                  {{ 'TOOLS.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="audio">
+                  {{ 'TOOLS.AUDIO' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'TOOLS.DESCRIPTION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.sounds.rows.length">
+                <td md-cell colspan="5">
+                  <div layout="row" layout-align="center center">
+                    <span translate="TOOLS.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="sound"
+                md-select-id="id"
+                ng-repeat="sound in vm.sounds.rows"
+              >
+                <td md-cell ng-if="sound.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{sound.name}}"
+                    ng-src="api/users/{{sound.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!sound.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{sound.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.createOrEditSound($event, sound)"
+                  md-cell
+                  class="id"
+                >
+                  {{sound.id}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditSound($event, sound)"
+                  md-cell
+                  class="name"
+                >
+                  {{sound.name}}
+                </td>
+                <td md-cell class="audio">
+                  <!-- audio recording directive -->
+                  <ms-recording id="sound.id" model="'sound'"></ms-recording>
+                  <!-- / audio recording directive -->
+                </td>
+                <td
+                  ng-click="vm.createOrEditSound($event, sound)"
+                  md-cell
+                  class="description"
+                >
+                  {{sound.description}}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="TOOLS.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editdialog(sound, $event    )"
+                          translate="TOOLS.EDIT_SOUND"
+                        >
+                          Edit Sound
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.downloadfile2(sound, $event  , 'sounds'   )"
+                          translate="TOOLS.DOWNLOAD_SOUND"
+                        >
+                          Download Sound
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(sound, $event    )"
+                          translate="TOOLS.DELETE_SOUND"
+                        >
+                          Delete Sound
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'TOOLS.PAGE' | translate}}:', rowsPerPage: '{{'TOOLS.ROWSPERPAGE' | translate}}:', of: '{{'TOOLS.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.sounds.count}}"
+          md-on-paginate="vm.getSounds"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / SOUND TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- UPLOAD SOUND BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent upload-item-button"
+    id="upload-sound-button"
+    ng-click="vm.uploadSound($event)"
+    aria-label="upload sound"
+    translate
+    translate-attr-aria-label="TOOLS.UPLOAD_SOUND"
+  >
+    <md-icon md-font-icon="icon-upload"></md-icon>
+  </md-button>
+  <!-- / UPLOAD SOUND BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/tools/views/sounds/upload/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/sounds/upload/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 539285b..0000000
--- a/public/src/js/modules/main/apps/tools/views/sounds/upload/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,102 +0,0 @@
-<md-dialog class="upload-dialog" aria-label="Upload ">
-  <form name="uploadForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <div
-        id="sound-uploader"
-        ng-hide="vm.uploadState == 'uploading'"
-        flow-init="vm.ngFlowOptions"
-        flow-name="vm.ngFlow.flow"
-        flow-files-submitted="vm.upload()"
-        flow-file-added="vm.fileAdded($file)"
-        flow-file-success="vm.fileSuccess($file, $message)"
-        flow-error="vm.uploadError($file, $message)"
-        flow-complete="vm.uploadComplete()"
-        flow-drop
-        flow-drag-enter="vm.dropping=true"
-        flow-drag-leave="vm.dropping=false"
-        ng-class="{'dropping':vm.dropping}"
-      >
-        <div
-          class="drop-text hint-text"
-          layout="row"
-          layout-align="center center"
-        >
-          <span translate="TOOLS.DROP_TO_UPLOAD">Drop to upload</span>
-        </div>
-
-        <div class="upload-button" layout="column" layout-align="center center">
-          <md-button class="md-accent md-raised" flow-btn> Upload </md-button>
-          <span
-            class="secondary-text mt-8"
-            translate="TOOLS.DROP_TO_UPLOAD_MESSAGE"
-            >You can also drop your file here to upload.</span
-          >
-        </div>
-      </div>
-
-      <div
-        layout="column"
-        layout-align="space-between center"
-        ng-show="vm.uploadState == 'uploading'"
-      >
-        <div>
-          <span translate="TOOLS.UPLOADING">Uploading</span>
-          <span>{{vm.sound.file.name}}</span>
-        </div>
-        <md-progress-linear md-mode="indeterminate"></md-progress-linear>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center"></div>
-      <div layout="row">
-        <md-button
-          ng-click="vm.closeDialog()"
-          ng-hide="vm.uploadState == 'uploading'"
-          class="md-accent md-raised"
-          aria-label="FINISH"
-          translate="TOOLS.FINISH"
-          translate-attr-aria-label="TOOLS.FINISH"
-        >
-          FINISH
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/sounds/upload/dialog.html/dialog.html b/public/src/js/modules/main/apps/tools/views/sounds/upload/dialog.html/dialog.html
new file mode 100644
index 0000000..539285b
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/sounds/upload/dialog.html/dialog.html
@@ -0,0 +1,102 @@
+<md-dialog class="upload-dialog" aria-label="Upload ">
+  <form name="uploadForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <div
+        id="sound-uploader"
+        ng-hide="vm.uploadState == 'uploading'"
+        flow-init="vm.ngFlowOptions"
+        flow-name="vm.ngFlow.flow"
+        flow-files-submitted="vm.upload()"
+        flow-file-added="vm.fileAdded($file)"
+        flow-file-success="vm.fileSuccess($file, $message)"
+        flow-error="vm.uploadError($file, $message)"
+        flow-complete="vm.uploadComplete()"
+        flow-drop
+        flow-drag-enter="vm.dropping=true"
+        flow-drag-leave="vm.dropping=false"
+        ng-class="{'dropping':vm.dropping}"
+      >
+        <div
+          class="drop-text hint-text"
+          layout="row"
+          layout-align="center center"
+        >
+          <span translate="TOOLS.DROP_TO_UPLOAD">Drop to upload</span>
+        </div>
+
+        <div class="upload-button" layout="column" layout-align="center center">
+          <md-button class="md-accent md-raised" flow-btn> Upload </md-button>
+          <span
+            class="secondary-text mt-8"
+            translate="TOOLS.DROP_TO_UPLOAD_MESSAGE"
+            >You can also drop your file here to upload.</span
+          >
+        </div>
+      </div>
+
+      <div
+        layout="column"
+        layout-align="space-between center"
+        ng-show="vm.uploadState == 'uploading'"
+      >
+        <div>
+          <span translate="TOOLS.UPLOADING">Uploading</span>
+          <span>{{vm.sound.file.name}}</span>
+        </div>
+        <md-progress-linear md-mode="indeterminate"></md-progress-linear>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center"></div>
+      <div layout="row">
+        <md-button
+          ng-click="vm.closeDialog()"
+          ng-hide="vm.uploadState == 'uploading'"
+          class="md-accent md-raised"
+          aria-label="FINISH"
+          translate="TOOLS.FINISH"
+          translate-attr-aria-label="TOOLS.FINISH"
+        >
+          FINISH
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/tags/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/tags/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 1da8012..0000000
--- a/public/src/js/modules/main/apps/tools/views/tags/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,161 +0,0 @@
-<md-dialog class="tag-dialog" aria-label="New Tag">
-  <form name="tagForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.tag.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="tagForm['name'].$error"
-          ng-show="tagForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.DESCRIPTION">Description</label>
-        <input type="text" name="description" ng-model="vm.tag.description" />
-
-        <div
-          ng-messages="tagForm['description'].$error"
-          ng-show="tagForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <div
-        flex
-        md-color-picker
-        ng-model="vm.tag.color"
-        label="{{'TOOLS.COLOR' | translate}}"
-        md-color-hex="true"
-        md-color-rgb="false"
-        md-color-hsl="false"
-        md-color-history="false"
-        md-color-material-palette="false"
-        md-color-alpha-channel="false"
-        open-on-input="true"
-      ></div>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newTag"
-          ng-click="vm.saveTag()"
-          class="send-button md-accent md-raised"
-          ng-disabled="tagForm.$invalid || tagForm.$pristine"
-          aria-label="SAVE"
-          translate="TOOLS.SAVE"
-          translate-attr-aria-label="TOOLS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newTag"
-          ng-click="vm.addNewTag()"
-          class="send-button md-accent md-raised"
-          ng-disabled="tagForm.$invalid"
-          aria-label="ADD"
-          translate="TOOLS.ADD_TAG"
-          translate-attr-aria-label="TOOLS.ADD_TAG"
-        >
-          ADD TAG
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newTag"
-          ng-click="vm.deleteTag($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="TOOLS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/tags/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/tools/views/tags/create/dialog.html/dialog.html
new file mode 100644
index 0000000..1da8012
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/tags/create/dialog.html/dialog.html
@@ -0,0 +1,161 @@
+<md-dialog class="tag-dialog" aria-label="New Tag">
+  <form name="tagForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.tag.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="tagForm['name'].$error"
+          ng-show="tagForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.DESCRIPTION">Description</label>
+        <input type="text" name="description" ng-model="vm.tag.description" />
+
+        <div
+          ng-messages="tagForm['description'].$error"
+          ng-show="tagForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <div
+        flex
+        md-color-picker
+        ng-model="vm.tag.color"
+        label="{{'TOOLS.COLOR' | translate}}"
+        md-color-hex="true"
+        md-color-rgb="false"
+        md-color-hsl="false"
+        md-color-history="false"
+        md-color-material-palette="false"
+        md-color-alpha-channel="false"
+        open-on-input="true"
+      ></div>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newTag"
+          ng-click="vm.saveTag()"
+          class="send-button md-accent md-raised"
+          ng-disabled="tagForm.$invalid || tagForm.$pristine"
+          aria-label="SAVE"
+          translate="TOOLS.SAVE"
+          translate-attr-aria-label="TOOLS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newTag"
+          ng-click="vm.addNewTag()"
+          class="send-button md-accent md-raised"
+          ng-disabled="tagForm.$invalid"
+          aria-label="ADD"
+          translate="TOOLS.ADD_TAG"
+          translate-attr-aria-label="TOOLS.ADD_TAG"
+        >
+          ADD TAG
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newTag"
+          ng-click="vm.deleteTag($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="TOOLS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/tags/tags.html/tags-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/tags/tags.html/tags-[chunkhash].html
deleted file mode 100644
index b4dc972..0000000
--- a/public/src/js/modules/main/apps/tools/views/tags/tags.html/tags-[chunkhash].html
+++ /dev/null
@@ -1,303 +0,0 @@
-<div
-  id="tags"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-auto-fix" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="TOOLS.TAGS">Tags</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="TOOLS.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedTags.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedTags =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="TOOLS.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-tags-count">
-          <span>{{vm.selectedTags.length}}</span>
-          <span translate="TOOLS.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="TOOLS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllTags()"
-                translate="TOOLS.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectTags()"
-                translate="TOOLS.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedTags"
-          csv-label="true"
-          filename="tags.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedTags($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="TOOLS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- TAG TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedTags"
-            md-progress="vm.promise"
-          >
-            <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getTags">
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'TOOLS.ID' | translate }}</th>
-                <th md-column md-order-by="name">
-                  {{ 'TOOLS.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'TOOLS.DESCRIPTION' | translate }}
-                </th>
-                <th md-column md-order-by="color">
-                  {{ 'TOOLS.COLOR' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.tags.rows.length">
-                <td md-cell colspan="5">
-                  <div layout="row" layout-align="center center">
-                    <span translate="TOOLS.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="tag"
-                md-select-id="id"
-                ng-repeat="tag in vm.tags.rows"
-              >
-                <td md-cell ng-if="tag.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{tag.name}}"
-                    ng-src="api/users/{{tag.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!tag.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{tag.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.createOrEditTag($event, tag)"
-                  md-cell
-                  class="id"
-                >
-                  {{tag.id}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditTag($event, tag)"
-                  md-cell
-                  class="name"
-                >
-                  {{tag.name}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditTag($event, tag)"
-                  md-cell
-                  class="description"
-                >
-                  {{tag.description}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditTag($event, tag)"
-                  md-cell
-                  class="color"
-                >
-                  {{tag.color}}
-                </td>
-
-                <td
-                  md-cell
-                  class="actions"
-                  ng-if="!vm.crudPermissions.readOnly"
-                >
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="TOOLS.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editdialog(tag, $event    )"
-                          translate="TOOLS.EDIT_TAG"
-                        >
-                          Edit Tag
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(tag, $event    )"
-                          translate="TOOLS.DELETE_TAG"
-                        >
-                          Delete Tag
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'TOOLS.PAGE' | translate}}:', rowsPerPage: '{{'TOOLS.ROWSPERPAGE' | translate}}:', of: '{{'TOOLS.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.tags.count}}"
-          md-on-paginate="vm.getTags"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / TAG TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD TAG BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-tag-button"
-    ng-click="vm.createOrEditTag($event)"
-    aria-label="add tag"
-    translate
-    translate-attr-aria-label="TOOLS.ADD_TAG"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD TAG BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/tools/views/tags/tags.html/tags.html b/public/src/js/modules/main/apps/tools/views/tags/tags.html/tags.html
new file mode 100644
index 0000000..b4dc972
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/tags/tags.html/tags.html
@@ -0,0 +1,303 @@
+<div
+  id="tags"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-auto-fix" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="TOOLS.TAGS">Tags</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="TOOLS.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedTags.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedTags =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="TOOLS.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-tags-count">
+          <span>{{vm.selectedTags.length}}</span>
+          <span translate="TOOLS.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="TOOLS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllTags()"
+                translate="TOOLS.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectTags()"
+                translate="TOOLS.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedTags"
+          csv-label="true"
+          filename="tags.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedTags($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="TOOLS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- TAG TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedTags"
+            md-progress="vm.promise"
+          >
+            <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getTags">
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'TOOLS.ID' | translate }}</th>
+                <th md-column md-order-by="name">
+                  {{ 'TOOLS.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'TOOLS.DESCRIPTION' | translate }}
+                </th>
+                <th md-column md-order-by="color">
+                  {{ 'TOOLS.COLOR' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.tags.rows.length">
+                <td md-cell colspan="5">
+                  <div layout="row" layout-align="center center">
+                    <span translate="TOOLS.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="tag"
+                md-select-id="id"
+                ng-repeat="tag in vm.tags.rows"
+              >
+                <td md-cell ng-if="tag.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{tag.name}}"
+                    ng-src="api/users/{{tag.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!tag.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{tag.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.createOrEditTag($event, tag)"
+                  md-cell
+                  class="id"
+                >
+                  {{tag.id}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditTag($event, tag)"
+                  md-cell
+                  class="name"
+                >
+                  {{tag.name}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditTag($event, tag)"
+                  md-cell
+                  class="description"
+                >
+                  {{tag.description}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditTag($event, tag)"
+                  md-cell
+                  class="color"
+                >
+                  {{tag.color}}
+                </td>
+
+                <td
+                  md-cell
+                  class="actions"
+                  ng-if="!vm.crudPermissions.readOnly"
+                >
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="TOOLS.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editdialog(tag, $event    )"
+                          translate="TOOLS.EDIT_TAG"
+                        >
+                          Edit Tag
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(tag, $event    )"
+                          translate="TOOLS.DELETE_TAG"
+                        >
+                          Delete Tag
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'TOOLS.PAGE' | translate}}:', rowsPerPage: '{{'TOOLS.ROWSPERPAGE' | translate}}:', of: '{{'TOOLS.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.tags.count}}"
+          md-on-paginate="vm.getTags"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / TAG TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD TAG BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-tag-button"
+    ng-click="vm.createOrEditTag($event)"
+    aria-label="add tag"
+    translate
+    translate-attr-aria-label="TOOLS.ADD_TAG"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD TAG BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/tools/views/templates/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/templates/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index e1d5c03..0000000
--- a/public/src/js/modules/main/apps/tools/views/templates/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,162 +0,0 @@
-<md-dialog class="template-dialog" aria-label="New Template">
-  <form name="templateForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.template.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="templateForm['name'].$error"
-          ng-show="templateForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <div class="md-block">
-        <label class="md-caption grey-fg" translate="TOOLS.CONTENT"
-          >Content</label
-        >
-        <textarea
-          aria-label="Content html"
-          ng-model="vm.template.html"
-        ></textarea>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.template.description"
-        />
-
-        <div
-          ng-messages="templateForm['description'].$error"
-          ng-show="templateForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newTemplate"
-          ng-click="vm.saveTemplate()"
-          class="send-button md-accent md-raised"
-          ng-disabled="templateForm.$invalid || templateForm.$pristine"
-          aria-label="SAVE"
-          translate="TOOLS.SAVE"
-          translate-attr-aria-label="TOOLS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newTemplate"
-          ng-click="vm.addNewTemplate()"
-          class="send-button md-accent md-raised"
-          ng-disabled="templateForm.$invalid"
-          aria-label="ADD"
-          translate="TOOLS.ADD_TEMPLATE"
-          translate-attr-aria-label="TOOLS.ADD_TEMPLATE"
-        >
-          ADD TEMPLATE
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newTemplate"
-          ng-click="vm.deleteTemplate($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="TOOLS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/templates/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/tools/views/templates/create/dialog.html/dialog.html
new file mode 100644
index 0000000..e1d5c03
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/templates/create/dialog.html/dialog.html
@@ -0,0 +1,162 @@
+<md-dialog class="template-dialog" aria-label="New Template">
+  <form name="templateForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.template.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="templateForm['name'].$error"
+          ng-show="templateForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <div class="md-block">
+        <label class="md-caption grey-fg" translate="TOOLS.CONTENT"
+          >Content</label
+        >
+        <textarea
+          aria-label="Content html"
+          ng-model="vm.template.html"
+        ></textarea>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.template.description"
+        />
+
+        <div
+          ng-messages="templateForm['description'].$error"
+          ng-show="templateForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newTemplate"
+          ng-click="vm.saveTemplate()"
+          class="send-button md-accent md-raised"
+          ng-disabled="templateForm.$invalid || templateForm.$pristine"
+          aria-label="SAVE"
+          translate="TOOLS.SAVE"
+          translate-attr-aria-label="TOOLS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newTemplate"
+          ng-click="vm.addNewTemplate()"
+          class="send-button md-accent md-raised"
+          ng-disabled="templateForm.$invalid"
+          aria-label="ADD"
+          translate="TOOLS.ADD_TEMPLATE"
+          translate-attr-aria-label="TOOLS.ADD_TEMPLATE"
+        >
+          ADD TEMPLATE
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newTemplate"
+          ng-click="vm.deleteTemplate($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="TOOLS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/templates/templates.html/templates-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/templates/templates.html/templates-[chunkhash].html
deleted file mode 100644
index 503f485..0000000
--- a/public/src/js/modules/main/apps/tools/views/templates/templates.html/templates-[chunkhash].html
+++ /dev/null
@@ -1,297 +0,0 @@
-<div
-  id="templates"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-auto-fix" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="TOOLS.TEMPLATES">Templates</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="TOOLS.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedTemplates.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedTemplates =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="TOOLS.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-templates-count">
-          <span>{{vm.selectedTemplates.length}}</span>
-          <span translate="TOOLS.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="TOOLS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllTemplates()"
-                translate="TOOLS.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectTemplates()"
-                translate="TOOLS.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedTemplates"
-          csv-label="true"
-          filename="templates.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedTemplates($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="TOOLS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- TEMPLATE TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedTemplates"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getTemplates"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'TOOLS.ID' | translate }}</th>
-                <th md-column md-order-by="name">
-                  {{ 'TOOLS.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'TOOLS.DESCRIPTION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.templates.rows.length">
-                <td md-cell colspan="4">
-                  <div layout="row" layout-align="center center">
-                    <span translate="TOOLS.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="template"
-                md-select-id="id"
-                ng-repeat="template in vm.templates.rows"
-              >
-                <td md-cell ng-if="template.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{template.name}}"
-                    ng-src="api/users/{{template.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!template.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{template.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.createOrEditTemplate($event, template)"
-                  md-cell
-                  class="id"
-                >
-                  {{template.id}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditTemplate($event, template)"
-                  md-cell
-                  class="name"
-                >
-                  {{template.name}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditTemplate($event, template)"
-                  md-cell
-                  class="description"
-                >
-                  {{template.description}}
-                </td>
-
-                <td
-                  md-cell
-                  class="actions"
-                  ng-if="!vm.crudPermissions.readOnly"
-                >
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="TOOLS.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editdialog(template, $event    )"
-                          translate="TOOLS.EDIT_TEMPLATE"
-                        >
-                          Edit Template
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(template, $event    )"
-                          translate="TOOLS.DELETE_TEMPLATE"
-                        >
-                          Delete Template
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'TOOLS.PAGE' | translate}}:', rowsPerPage: '{{'TOOLS.ROWSPERPAGE' | translate}}:', of: '{{'TOOLS.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.templates.count}}"
-          md-on-paginate="vm.getTemplates"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / TEMPLATE TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD TEMPLATE BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-template-button"
-    ng-click="vm.createOrEditTemplate($event)"
-    aria-label="add template"
-    translate
-    translate-attr-aria-label="TOOLS.ADD_TEMPLATE"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD TEMPLATE BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/tools/views/templates/templates.html/templates.html b/public/src/js/modules/main/apps/tools/views/templates/templates.html/templates.html
new file mode 100644
index 0000000..503f485
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/templates/templates.html/templates.html
@@ -0,0 +1,297 @@
+<div
+  id="templates"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-auto-fix" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="TOOLS.TEMPLATES">Templates</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="TOOLS.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedTemplates.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedTemplates =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="TOOLS.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-templates-count">
+          <span>{{vm.selectedTemplates.length}}</span>
+          <span translate="TOOLS.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="TOOLS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllTemplates()"
+                translate="TOOLS.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectTemplates()"
+                translate="TOOLS.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedTemplates"
+          csv-label="true"
+          filename="templates.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedTemplates($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="TOOLS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- TEMPLATE TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedTemplates"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getTemplates"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'TOOLS.ID' | translate }}</th>
+                <th md-column md-order-by="name">
+                  {{ 'TOOLS.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'TOOLS.DESCRIPTION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.templates.rows.length">
+                <td md-cell colspan="4">
+                  <div layout="row" layout-align="center center">
+                    <span translate="TOOLS.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="template"
+                md-select-id="id"
+                ng-repeat="template in vm.templates.rows"
+              >
+                <td md-cell ng-if="template.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{template.name}}"
+                    ng-src="api/users/{{template.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!template.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{template.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.createOrEditTemplate($event, template)"
+                  md-cell
+                  class="id"
+                >
+                  {{template.id}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditTemplate($event, template)"
+                  md-cell
+                  class="name"
+                >
+                  {{template.name}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditTemplate($event, template)"
+                  md-cell
+                  class="description"
+                >
+                  {{template.description}}
+                </td>
+
+                <td
+                  md-cell
+                  class="actions"
+                  ng-if="!vm.crudPermissions.readOnly"
+                >
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="TOOLS.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editdialog(template, $event    )"
+                          translate="TOOLS.EDIT_TEMPLATE"
+                        >
+                          Edit Template
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(template, $event    )"
+                          translate="TOOLS.DELETE_TEMPLATE"
+                        >
+                          Delete Template
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'TOOLS.PAGE' | translate}}:', rowsPerPage: '{{'TOOLS.ROWSPERPAGE' | translate}}:', of: '{{'TOOLS.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.templates.count}}"
+          md-on-paginate="vm.getTemplates"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / TEMPLATE TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD TEMPLATE BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-template-button"
+    ng-click="vm.createOrEditTemplate($event)"
+    aria-label="add template"
+    translate
+    translate-attr-aria-label="TOOLS.ADD_TEMPLATE"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD TEMPLATE BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/tools/views/triggers/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/triggers/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 54505aa..0000000
--- a/public/src/js/modules/main/apps/tools/views/triggers/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,165 +0,0 @@
-<md-dialog class="trigger-dialog" aria-label="New Trigger">
-  <form name="triggerForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title"
-          >{{ vm.newTrigger ? 'TOOLS.NEW_TRIGGER' : 'TOOLS.EDIT_TRIGGER' |
-          translate }}</span
-        >
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content ms-scroll>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.trigger.name"
-          required
-          md-autofocus
-        />
-        <div
-          ng-messages="triggerForm['name'].$error"
-          ng-show="triggerForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.CHANNEL">Channel</label>
-        <md-select
-          name="channel"
-          ng-model="vm.trigger.channel"
-          required
-          ng-disabled="!vm.newTrigger"
-        >
-          <md-option ng-value="'voice'">
-            {{ 'TOOLS.VOICE' | translate }}
-          </md-option>
-          <md-option ng-value="'openchannel'" ng-if="vm.license.openchannel">
-            {{ 'TOOLS.OPENCHANNEL' | translate }}
-          </md-option>
-          <md-option ng-value="'chat'" ng-if="vm.license.chat">
-            {{ 'TOOLS.CHAT' | translate }}
-          </md-option>
-          <md-option ng-value="'mail'" ng-if="vm.license.mail">
-            {{ 'TOOLS.MAIL' | translate }}
-          </md-option>
-          <md-option ng-value="'sms'" ng-if="vm.license.messaging">
-            {{ 'TOOLS.SMS' | translate }}
-          </md-option>
-          <md-option ng-value="'fax'" ng-if="vm.license.fax">
-            {{ 'TOOLS.FAX' | translate }}
-          </md-option>
-          <md-option ng-value="'whatsapp'" ng-if="vm.license.whatsapp">
-            {{ 'TOOLS.WHATSAPP' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="triggerForm['channel'].$error"
-          ng-show="triggerForm['channel'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.CHANNEL_REQUIRED"
-              >Channel field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <md-switch ng-model="vm.trigger.status" aria-label="Status"
-          ><span translate="TOOLS.STATUS">Status</span>
-        </md-switch>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.trigger.description"
-        />
-      </md-input-container>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{ error.message }}</span>
-            <span class="type">({{ error.type }})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newTrigger"
-          ng-click="vm.saveTrigger()"
-          class="send-button md-accent md-raised"
-          ng-disabled="triggerForm.$invalid || triggerForm.$pristine"
-          aria-label="SAVE"
-          translate="TOOLS.SAVE"
-          translate-attr-aria-label="TOOLS.SAVE"
-        >
-          SAVE
-        </md-button>
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newTrigger"
-          ng-click="vm.addNewTrigger()"
-          class="send-button md-accent md-raised"
-          ng-disabled="triggerForm.$invalid"
-          aria-label="ADD"
-          translate="TOOLS.ADD_TRIGGER"
-          translate-attr-aria-label="TOOLS.ADD_TRIGGER"
-        >
-          ADD TRIGGER
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newTrigger"
-          ng-click="vm.deleteTrigger($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="TOOLS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/triggers/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/tools/views/triggers/create/dialog.html/dialog.html
new file mode 100644
index 0000000..54505aa
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/triggers/create/dialog.html/dialog.html
@@ -0,0 +1,165 @@
+<md-dialog class="trigger-dialog" aria-label="New Trigger">
+  <form name="triggerForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title"
+          >{{ vm.newTrigger ? 'TOOLS.NEW_TRIGGER' : 'TOOLS.EDIT_TRIGGER' |
+          translate }}</span
+        >
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content ms-scroll>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.trigger.name"
+          required
+          md-autofocus
+        />
+        <div
+          ng-messages="triggerForm['name'].$error"
+          ng-show="triggerForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.CHANNEL">Channel</label>
+        <md-select
+          name="channel"
+          ng-model="vm.trigger.channel"
+          required
+          ng-disabled="!vm.newTrigger"
+        >
+          <md-option ng-value="'voice'">
+            {{ 'TOOLS.VOICE' | translate }}
+          </md-option>
+          <md-option ng-value="'openchannel'" ng-if="vm.license.openchannel">
+            {{ 'TOOLS.OPENCHANNEL' | translate }}
+          </md-option>
+          <md-option ng-value="'chat'" ng-if="vm.license.chat">
+            {{ 'TOOLS.CHAT' | translate }}
+          </md-option>
+          <md-option ng-value="'mail'" ng-if="vm.license.mail">
+            {{ 'TOOLS.MAIL' | translate }}
+          </md-option>
+          <md-option ng-value="'sms'" ng-if="vm.license.messaging">
+            {{ 'TOOLS.SMS' | translate }}
+          </md-option>
+          <md-option ng-value="'fax'" ng-if="vm.license.fax">
+            {{ 'TOOLS.FAX' | translate }}
+          </md-option>
+          <md-option ng-value="'whatsapp'" ng-if="vm.license.whatsapp">
+            {{ 'TOOLS.WHATSAPP' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="triggerForm['channel'].$error"
+          ng-show="triggerForm['channel'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.CHANNEL_REQUIRED"
+              >Channel field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <md-switch ng-model="vm.trigger.status" aria-label="Status"
+          ><span translate="TOOLS.STATUS">Status</span>
+        </md-switch>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.trigger.description"
+        />
+      </md-input-container>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{ error.message }}</span>
+            <span class="type">({{ error.type }})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newTrigger"
+          ng-click="vm.saveTrigger()"
+          class="send-button md-accent md-raised"
+          ng-disabled="triggerForm.$invalid || triggerForm.$pristine"
+          aria-label="SAVE"
+          translate="TOOLS.SAVE"
+          translate-attr-aria-label="TOOLS.SAVE"
+        >
+          SAVE
+        </md-button>
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newTrigger"
+          ng-click="vm.addNewTrigger()"
+          class="send-button md-accent md-raised"
+          ng-disabled="triggerForm.$invalid"
+          aria-label="ADD"
+          translate="TOOLS.ADD_TRIGGER"
+          translate-attr-aria-label="TOOLS.ADD_TRIGGER"
+        >
+          ADD TRIGGER
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newTrigger"
+          ng-click="vm.deleteTrigger($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="TOOLS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/triggers/edit/actions/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/triggers/edit/actions/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index a1006ed..0000000
--- a/public/src/js/modules/main/apps/tools/views/triggers/edit/actions/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,922 +0,0 @@
-<md-dialog class="action-dialog" aria-label="New Action">
-  <form name="actionForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title"
-          >{{ vm.newAction ? 'TOOLS.NEW_ACTION' : 'TOOLS.EDIT_ACTION' |
-          translate }}</span
-        >
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content ms-scroll>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.ACTION">Action</label>
-        <md-select
-          name="action"
-          ng-model="vm.action.action"
-          ng-init="vm.onActionInit()"
-          ng-change="vm.onActionSelection()"
-          md-autofocus
-          required
-          ng-disabled="!vm.newAction"
-        >
-          <md-option
-            ng-value="'contactManager'"
-            ng-if="vm.trigger.channel == 'voice'"
-          >
-            {{ 'TOOLS.CONTACT_MANAGER' | translate }}
-          </md-option>
-          <md-option
-            ng-value="'integration'"
-            ng-if="vm.trigger.channel == 'voice' && ((vm.newAction && vm.hasIntegrationsPermissions) || !vm.newAction)"
-          >
-            {{ 'TOOLS.INTEGRATIONS' | translate }}
-          </md-option>
-          <md-option ng-value="'motionbar'">
-            {{ 'TOOLS.MOTIONBAR' | translate }}
-          </md-option>
-          <md-option ng-value="'jscripty'">
-            {{ 'TOOLS.JSCRIPTY' | translate }}
-          </md-option>
-          <md-option ng-value="'urlForward'">
-            {{ 'TOOLS.URL_FORWARD' | translate }}
-          </md-option>
-          <md-option ng-value="'browser'">
-            {{ 'TOOLS.BROWSER' | translate }}
-          </md-option>
-          <md-option ng-value="'bot'" ng-if="vm.trigger.channel == 'voice'">
-            {{ 'TOOLS.BOT' | translate }}
-          </md-option>
-          <md-option ng-value="'script'">
-            {{ 'TOOLS.SCRIPT' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="actionForm['action'].$error"
-          ng-show="actionForm['action'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.ACTION_REQUIRED"
-              >Action field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.action.action == 'jscripty'"
-        class="md-block"
-      >
-        <label translate="TOOLS.PROJECT">Project</label>
-        <md-select name="data1" ng-model="vm.action.data1" required>
-          <md-option
-            ng-value="''+data1.id"
-            ng-repeat="data1 in vm.projects"
-            ng-disabled="data1.canSelect === false"
-          >
-            {{ data1.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="actionForm['data1'].$error"
-          ng-show="actionForm['data1'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.PROJECT_REQUIRED"
-              >Project field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.action.action == 'browser'"
-        class="md-block"
-      >
-        <label translate="TOOLS.TYPE">Type</label>
-        <md-select
-          name="data1"
-          ng-model="vm.action.data1"
-          ng-change="vm.onTypeSelection()"
-          required
-        >
-          <md-option ng-value="'0'">Popup</md-option>
-          <md-option ng-value="'1'">CTI URL</md-option>
-        </md-select>
-        <div
-          ng-messages="actionForm['data1'].$error"
-          ng-show="actionForm['data1'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.TYPE_REQUIRED"
-              >Type field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.action.action == 'contactManager'"
-        class="md-block"
-      >
-        <label translate="TOOLS.LIST">List</label>
-        <md-select
-          name="data1"
-          ng-model="vm.action.data1"
-          ng-change="vm.onListSelection()"
-          required
-        >
-          <md-option
-            ng-value="''+data1.id"
-            ng-repeat="data1 in vm.lists"
-            ng-disabled="data1.canSelect === false"
-          >
-            {{ data1.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="actionForm['data1'].$error"
-          ng-show="actionForm['data1'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.LIST_REQUIRED"
-              >List field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.action.action == 'contactManager'"
-        class="md-block"
-      >
-        <label translate="TOOLS.SEARCH_FIELDS">Search fields</label>
-        <md-select
-          name="fields"
-          ng-model="vm.action.data3"
-          ng-init="vm.onSearchFieldsInit()"
-          multiple
-          required
-        >
-          <md-optgroup label="{{ 'TOOLS.STANDARD' | translate }}">
-            <md-option
-              ng-value="field.columnName"
-              ng-repeat="field in vm.contactFields"
-            >
-              {{ field.displayName }}</md-option
-            >
-          </md-optgroup>
-          <md-optgroup
-            label="{{ 'TOOLS.LIST' | translate }}"
-            ng-if="vm.listFields.length > 0"
-          >
-            <md-option
-              ng-value="field.columnName"
-              ng-repeat="field in vm.listFields"
-            >
-              {{ field.name }}</md-option
-            >
-          </md-optgroup>
-          <md-optgroup
-            label="{{ 'TOOLS.GLOBALS' | translate }}"
-            ng-if="vm.customFields.length > 0"
-          >
-            <md-option
-              ng-value="field.columnName"
-              ng-repeat="field in vm.customFields"
-            >
-              {{ field.displayName }}</md-option
-            >
-          </md-optgroup>
-        </md-select>
-        <div
-          ng-messages="actionForm['data3'].$error"
-          ng-show="actionForm['data3'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.SEARCH_FIELDS_REQUIRED"
-              >Search fields field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.action.action == 'contactManager'"
-        class="md-block"
-      >
-        <label translate="TOOLS.AUTOCREATECONTACT"
-          >Create contact automatically</label
-        >
-        <md-select
-          name="data2"
-          ng-model="vm.action.data2"
-          ng-change="vm.onAutocreateSelection()"
-          required
-        >
-          <md-option ng-value="'1'"> {{ 'TOOLS.YES' | translate }} </md-option>
-          <md-option ng-value="'0'"> {{ 'TOOLS.NO' | translate }} </md-option>
-        </md-select>
-        <div
-          ng-messages="actionForm['data2'].$error"
-          ng-show="actionForm['data2'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.AUTOCREATECONTACT_REQUIRED"
-              >AutoCreateContact field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.action.action == 'contactManager' && vm.action.data2 === '1'"
-        class="md-block"
-      >
-        <label translate="TOOLS.AUTOCREATE_FIELD">Autocreate field</label>
-        <md-select
-          name="autocreateField"
-          ng-model="vm.action.data4"
-          ng-required="vm.action.data2 === '1'"
-        >
-          <md-optgroup label="{{ 'TOOLS.STANDARD' | translate }}">
-            <md-option
-              ng-value="field.columnName"
-              ng-repeat="field in vm.contactFields"
-            >
-              {{ field.displayName }}</md-option
-            >
-          </md-optgroup>
-          <md-optgroup
-            label="{{ 'TOOLS.LIST' | translate }}"
-            ng-if="vm.listFields.length > 0"
-          >
-            <md-option
-              ng-value="field.columnName"
-              ng-repeat="field in vm.listFields"
-            >
-              {{ field.name }}</md-option
-            >
-          </md-optgroup>
-          <md-optgroup
-            label="{{ 'TOOLS.GLOBALS' | translate }}"
-            ng-if="vm.customFields.length > 0"
-          >
-            <md-option
-              ng-value="field.columnName"
-              ng-repeat="field in vm.customFields"
-            >
-              {{ field.displayName }}</md-option
-            >
-          </md-optgroup>
-        </md-select>
-        <div
-          ng-messages="actionForm['data4'].$error"
-          ng-show="actionForm['data4'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.AUTOCREATE_FIELD_REQUIRED"
-              >Autocreate field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.action.action == 'urlForward'"
-        class="md-block"
-      >
-        <label translate="TOOLS.TYPE">Type</label>
-        <md-select name="data1" ng-model="vm.action.data1" required>
-          <md-option ng-value="'GET'">GET</md-option>
-          <md-option ng-value="'POST'">POST</md-option>
-          <md-option ng-value="'PUT'">PUT</md-option>
-          <md-option ng-value="'DELETE'">DELETE</md-option>
-        </md-select>
-        <div
-          ng-messages="actionForm['data1'].$error"
-          ng-show="actionForm['data1'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.TYPE_REQUIRED"
-              >Type field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.action.action == 'urlForward'"
-        class="md-block"
-      >
-        <label translate="TOOLS.URL">Url</label>
-        <input
-          type="url"
-          name="data2"
-          ng-model="vm.action.data2"
-          ng-required="true"
-        />
-        <div
-          ng-messages="actionForm['data2'].$error"
-          ng-show="actionForm['data2'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.URL_REQUIRED"
-              >Url field is required</span
-            >
-          </div>
-          <div ng-message="url">
-            <span translate="TOOLS.ERRORS.URL_MUST_VALID_URL"
-              >Url must be a valid url http://www.xcally.com</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.action.action == 'urlForward'"
-        class="md-block"
-      >
-        <label translate="TOOLS.TIMEOUT">Timeout</label>
-        <input
-          type="number"
-          name="data5"
-          ng-model="vm.action.data5"
-          min="1"
-          max="10"
-          ng-required="true"
-        />
-        <div class="hint"><span translate="TOOLS.HELP.TIMEOUT"></span></div>
-        <div
-          ng-messages="actionForm['data5'].$error"
-          ng-show="actionForm['data5'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.TIMEOUT_REQUIRED"
-              >Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="TOOLS.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>1</span>
-          </div>
-          <div ng-message="max">
-            <span translate="TOOLS.ERRORS.TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>10</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.action.action == 'urlForward'"
-        class="md-block"
-      >
-        <label translate="TOOLS.HEADERS">Headers</label>
-        <textarea name="data6" ng-model="vm.action.data6"></textarea>
-        <div class="hint"><span translate="TOOLS.HELP.HEADERS"></span></div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.action.action == 'urlForward' && (vm.action.data1 == 'POST' || vm.action.data1 == 'PUT')"
-        class="md-block"
-      >
-        <label translate="TOOLS.BODY">Body</label>
-        <textarea name="data7" ng-model="vm.action.data7"></textarea>
-        <div class="hint"><span translate="TOOLS.HELP.BODY"></span></div>
-      </md-input-container>
-      <md-input-container ng-if="vm.action.action == 'script'" class="md-block">
-        <label translate="TOOLS.SCRIPT_TYPE">Script_Type</label>
-        <input type="input" name="data2" ng-model="vm.action.data2" />
-        <div class="hint"><span translate="TOOLS.HELP.SCRIPT_TYPE"></span></div>
-        <div
-          ng-messages="actionForm['data2'].$error"
-          ng-show="actionForm['data2'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.SCRIPT_TYPE_REQUIRED"
-              >Script_Type field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container ng-if="vm.action.action == 'script'" class="md-block">
-        <label translate="TOOLS.SCRIPT_INFO">Script_Info</label>
-        <input type="input" name="data1" ng-model="vm.action.data1" />
-        <div class="hint"><span translate="TOOLS.HELP.SCRIPT_INFO"></span></div>
-        <div
-          ng-messages="actionForm['data1'].$error"
-          ng-show="actionForm['data1'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.SCRIPT_INFO_REQUIRED"
-              >Script_Info field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container ng-if="vm.action.action == 'script'" class="md-block">
-        <label translate="TOOLS.SCRIPT">Script</label>
-        <textarea name="data3" ng-model="vm.action.data3" required></textarea>
-        <div class="hint"><span translate="TOOLS.HELP.SCRIPT"></span></div>
-        <div
-          ng-messages="actionForm['data3'].$error"
-          ng-show="actionForm['data3'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.SCRIPT_REQUIRED"
-              >Script field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.action.action == 'integration'"
-        class="md-block"
-      >
-        <label translate="TOOLS.INTEGRATION">Integration</label>
-        <md-select
-          name="data1"
-          ng-model="vm.action.data1"
-          ng-init="vm.onIntegrationInit()"
-          ng-change="vm.onIntegrationSelection()"
-          required
-        >
-          <md-option
-            ng-value="'zendesk'"
-            ng-if="(vm.newAction && vm.hasSectionPermissions[1301]) || !vm.newAction"
-            ng-disabled="(!vm.newAction && !vm.hasSectionPermissions[1301])"
-            >Zendesk</md-option
-          >
-          <md-option
-            ng-value="'salesforce'"
-            ng-if="(vm.newAction && vm.hasSectionPermissions[1302]) || !vm.newAction"
-            ng-disabled="(!vm.newAction && !vm.hasSectionPermissions[1302])"
-            >Salesforce</md-option
-          >
-          <md-option
-            ng-value="'sugarcrm'"
-            ng-if="(vm.newAction && vm.hasSectionPermissions[1305]) || !vm.newAction"
-            ng-disabled="(!vm.newAction && !vm.hasSectionPermissions[1305])"
-            >SugarCRM</md-option
-          >
-          <md-option
-            ng-value="'freshdesk'"
-            ng-if="(vm.newAction && vm.hasSectionPermissions[1303]) || !vm.newAction"
-            ng-disabled="(!vm.newAction && !vm.hasSectionPermissions[1303])"
-            >Freshdesk</md-option
-          >
-          <md-option
-            ng-value="'desk'"
-            ng-if="(vm.newAction && vm.hasSectionPermissions[1306]) || !vm.newAction"
-            ng-disabled="(!vm.newAction && !vm.hasSectionPermissions[1306])"
-            >Desk</md-option
-          >
-          <md-option
-            ng-value="'zoho'"
-            ng-if="(vm.newAction && vm.hasSectionPermissions[1307]) || !vm.newAction"
-            ng-disabled="(!vm.newAction && !vm.hasSectionPermissions[1307])"
-            >Zoho</md-option
-          >
-          <md-option
-            ng-value="'vtiger'"
-            ng-if="(vm.newAction && vm.hasSectionPermissions[1308]) || !vm.newAction"
-            ng-disabled="(!vm.newAction && !vm.hasSectionPermissions[1308])"
-            >vTiger</md-option
-          >
-          <md-option
-            ng-value="'dynamics365'"
-            ng-if="(vm.newAction && vm.hasSectionPermissions[1309]) || !vm.newAction"
-            ng-disabled="(!vm.newAction && !vm.hasSectionPermissions[1309])"
-            >Dynamics365</md-option
-          >
-          <md-option
-            ng-value="'servicenow'"
-            ng-if="(vm.newAction && vm.hasSectionPermissions[1310]) || !vm.newAction"
-            ng-disabled="(!vm.newAction && !vm.hasSectionPermissions[1310])"
-            >ServiceNow</md-option
-          >
-          <md-option
-            ng-value="'freshsales'"
-            ng-if="(vm.newAction && vm.hasSectionPermissions[1311]) || !vm.newAction"
-            ng-disabled="(!vm.newAction && !vm.hasSectionPermissions[1311])"
-            >Freshsales</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="actionForm['data1'].$error"
-          ng-show="actionForm['data1'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.INTEGRATION_REQUIRED"
-              >Integration field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.action.action == 'integration' && vm.action.data1"
-        class="md-block"
-      >
-        <label translate="TOOLS.ACCOUNT">Account</label>
-        <md-select
-          name="data2"
-          ng-model="vm.action.data2"
-          ng-change="vm.onIntegrationAccountSelection()"
-          ng-disabled="vm.action.isIntegrationDisabled"
-          required
-        >
-          <md-option ng-value="''+data2.id" ng-repeat="data2 in vm.accounts"
-            >{{ data2.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="actionForm['data2'].$error"
-          ng-show="actionForm['data2'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.ACCOUNT_REQUIRED"
-              >Account field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.action.action == 'integration'  && vm.action.data1 && vm.action.data2"
-        class="md-block"
-      >
-        <label translate="TOOLS.CONFIGURATION">Configuration</label>
-        <md-select
-          name="data3"
-          ng-model="vm.action.data3"
-          required
-          ng-disabled="vm.action.isIntegrationDisabled"
-        >
-          <md-option
-            ng-value="''+data3.id"
-            ng-repeat="data3 in vm.configurations | filter:{ AccountId:vm.action.data2 }"
-            >{{ data3.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="actionForm['data3'].$error"
-          ng-show="actionForm['data3'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.CONFIGURATION_REQUIRED"
-              >Configuration field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.action.action == 'motionbar'"
-        class="md-block"
-      >
-        <label translate="TOOLS.TYPE">Type</label>
-        <md-select
-          name="data1"
-          ng-model="vm.action.data1"
-          ng-change="vm.onTypeSelection()"
-          required
-        >
-          <md-option ng-value="'0'">Popup</md-option>
-          <md-option ng-value="'1'">CTI URL</md-option>
-          <md-option ng-value="'2'">Windows App</md-option>
-        </md-select>
-        <div
-          ng-messages="actionForm['data1'].$error"
-          ng-show="actionForm['data1'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.TYPE_REQUIRED"
-              >Type field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.action.action == 'motionbar' && vm.action.data1 == '1'"
-        class="md-block"
-      >
-        <label translate="TOOLS.URL">Url</label>
-        <input
-          type="url"
-          name="data2"
-          ng-model="vm.action.data2"
-          ng-required="true"
-        />
-        <div
-          ng-messages="actionForm['data2'].$error"
-          ng-show="actionForm['data2'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.URL_REQUIRED"
-              >Url field is required</span
-            >
-          </div>
-          <div ng-message="url">
-            <span translate="TOOLS.ERRORS.URL_MUST_VALID_URL"
-              >Url must be a valid url http://www.xcally.com</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.action.action == 'motionbar' && vm.action.data1 == '2'"
-        class="md-block"
-      >
-        <label translate="TOOLS.APPLICATION">Application</label>
-        <input
-          type="text"
-          name="data2"
-          ng-model="vm.action.data2"
-          ng-required="true"
-        />
-        <div
-          ng-messages="actionForm['data2'].$error"
-          ng-show="actionForm['data2'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.APPLICATION_REQUIRED"
-              >Application field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.action.action == 'motionbar' && vm.action.data1 == '2'"
-        class="md-block"
-      >
-        <label translate="TOOLS.ARGUMENTS">Arguments</label>
-        <input type="text" name="data3" ng-model="vm.action.data3" />
-        <div
-          ng-messages="actionForm['data3'].$error"
-          ng-show="actionForm['data3'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.ARGUMENTS_REQUIRED"
-              >Arguments field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.action.action == 'motionbar' && vm.action.data1 == '0'"
-        class="md-block"
-      >
-        <label translate="TOOLS.TEMPLATE">Template</label>
-        <md-select name="data2" ng-model="vm.action.data2" required>
-          <md-option
-            ng-value="''+data2.id"
-            ng-repeat="data2 in vm.templates"
-            ng-disabled="data2.canSelect === false"
-          >
-            {{ data2.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="actionForm['data2'].$error"
-          ng-show="actionForm['data2'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.TEMPLATE_REQUIRED"
-              >Template field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.action.action == 'browser' && vm.action.data1 == '0'"
-        class="md-block"
-      >
-        <label translate="TOOLS.TEMPLATE">Template</label>
-        <md-select name="data2" ng-model="vm.action.data2" required>
-          <md-option
-            ng-value="''+data2.id"
-            ng-repeat="data2 in vm.templates"
-            ng-disabled="data2.canSelect === false"
-          >
-            {{ data2.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="actionForm['data2'].$error"
-          ng-show="actionForm['data2'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.TEMPLATE_REQUIRED"
-              >Template field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.action.action == 'browser' && vm.action.data1 == '1'"
-        class="md-block"
-      >
-        <label translate="TOOLS.URL">Url</label>
-        <input
-          type="url"
-          name="data2"
-          ng-model="vm.action.data2"
-          ng-required="true"
-        />
-        <div
-          ng-messages="actionForm['data2'].$error"
-          ng-show="actionForm['data2'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.URL_REQUIRED"
-              >Url field is required</span
-            >
-          </div>
-          <div ng-message="url">
-            <span translate="TOOLS.ERRORS.URL_MUST_VALID_URL"
-              >Url must be a valid url http://www.xcally.com</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="(vm.action.action == 'motionbar' || vm.action.action == 'browser') && vm.action.data1 == '1'"
-        class="md-block"
-      >
-        <label translate="TOOLS.EVENTVARIABLES">EventVariables</label>
-        <md-select name="data3" ng-model="vm.action.data3" required>
-          <md-option ng-value="'1'"> {{ 'TOOLS.YES' | translate }} </md-option>
-          <md-option ng-value="'0'"> {{ 'TOOLS.NO' | translate }} </md-option>
-        </md-select>
-        <div class="hint">
-          <span translate="TOOLS.HELP.EVENTVARIABLES"></span>
-        </div>
-        <div
-          ng-messages="actionForm['data3'].$error"
-          ng-show="actionForm['data3'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.EVENTVARIABLES_REQUIRED"
-              >EventVariables field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.action.action == 'browser' && vm.action.data1 == '1'"
-        class="md-block"
-      >
-        <label translate="TOOLS.LOCATION">Location</label>
-        <md-select name="data4" ng-model="vm.action.data4" required>
-          <md-option ng-value="'0'" ng-selected="true">
-            {{ 'TOOLS.NEW_TAB' | translate }}
-          </md-option>
-          <md-option ng-value="'1'">
-            {{ 'TOOLS.NEW_WINDOW' | translate }}
-          </md-option>
-          <md-option ng-value="'2'">
-            {{ 'TOOLS.MOTION_TAB' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="actionForm['data4'].$error"
-          ng-show="actionForm['data4'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.LOCATION_REQUIRED"
-              >Location field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.action.action == 'browser' && vm.action.data4 == '1'"
-        class="md-block"
-      >
-        <label translate="TOOLS.WINDOWWIDTH">WindowWidth</label>
-        <input type="text" name="data5" ng-model="vm.action.data5" />
-        <div
-          ng-messages="actionForm['data5'].$error"
-          ng-show="actionForm['data5'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.WINDOWWIDTH_REQUIRED"
-              >WindowWidth field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.action.action == 'browser' && vm.action.data4 == '1'"
-        class="md-block"
-      >
-        <label translate="TOOLS.WINDOWHEIGHT">WindowHeight</label>
-        <input type="text" name="data6" ng-model="vm.action.data6" />
-        <div
-          ng-messages="actionForm['data6'].$error"
-          ng-show="actionForm['data6'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.WINDOWHEIGHT_REQUIRED"
-              >WindowHeight field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newAction"
-          ng-click="vm.saveAction()"
-          class="send-button md-accent md-raised"
-          ng-disabled="actionForm.$invalid || actionForm.$pristine"
-          aria-label="SAVE"
-          translate="TOOLS.SAVE"
-          translate-attr-aria-label="TOOLS.SAVE"
-        >
-          SAVE
-        </md-button>
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newAction"
-          ng-click="vm.addNewAction()"
-          class="send-button md-accent md-raised"
-          ng-disabled="actionForm.$invalid"
-          aria-label="ADD"
-          translate="TOOLS.ADD_ACTION"
-          translate-attr-aria-label="TOOLS.ADD_ACTION"
-        >
-          ADD ACTION
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newAction"
-          ng-click="vm.deleteAction($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="TOOLS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/triggers/edit/actions/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/tools/views/triggers/edit/actions/create/dialog.html/dialog.html
new file mode 100644
index 0000000..a1006ed
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/triggers/edit/actions/create/dialog.html/dialog.html
@@ -0,0 +1,922 @@
+<md-dialog class="action-dialog" aria-label="New Action">
+  <form name="actionForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title"
+          >{{ vm.newAction ? 'TOOLS.NEW_ACTION' : 'TOOLS.EDIT_ACTION' |
+          translate }}</span
+        >
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content ms-scroll>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.ACTION">Action</label>
+        <md-select
+          name="action"
+          ng-model="vm.action.action"
+          ng-init="vm.onActionInit()"
+          ng-change="vm.onActionSelection()"
+          md-autofocus
+          required
+          ng-disabled="!vm.newAction"
+        >
+          <md-option
+            ng-value="'contactManager'"
+            ng-if="vm.trigger.channel == 'voice'"
+          >
+            {{ 'TOOLS.CONTACT_MANAGER' | translate }}
+          </md-option>
+          <md-option
+            ng-value="'integration'"
+            ng-if="vm.trigger.channel == 'voice' && ((vm.newAction && vm.hasIntegrationsPermissions) || !vm.newAction)"
+          >
+            {{ 'TOOLS.INTEGRATIONS' | translate }}
+          </md-option>
+          <md-option ng-value="'motionbar'">
+            {{ 'TOOLS.MOTIONBAR' | translate }}
+          </md-option>
+          <md-option ng-value="'jscripty'">
+            {{ 'TOOLS.JSCRIPTY' | translate }}
+          </md-option>
+          <md-option ng-value="'urlForward'">
+            {{ 'TOOLS.URL_FORWARD' | translate }}
+          </md-option>
+          <md-option ng-value="'browser'">
+            {{ 'TOOLS.BROWSER' | translate }}
+          </md-option>
+          <md-option ng-value="'bot'" ng-if="vm.trigger.channel == 'voice'">
+            {{ 'TOOLS.BOT' | translate }}
+          </md-option>
+          <md-option ng-value="'script'">
+            {{ 'TOOLS.SCRIPT' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="actionForm['action'].$error"
+          ng-show="actionForm['action'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.ACTION_REQUIRED"
+              >Action field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.action.action == 'jscripty'"
+        class="md-block"
+      >
+        <label translate="TOOLS.PROJECT">Project</label>
+        <md-select name="data1" ng-model="vm.action.data1" required>
+          <md-option
+            ng-value="''+data1.id"
+            ng-repeat="data1 in vm.projects"
+            ng-disabled="data1.canSelect === false"
+          >
+            {{ data1.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="actionForm['data1'].$error"
+          ng-show="actionForm['data1'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.PROJECT_REQUIRED"
+              >Project field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.action.action == 'browser'"
+        class="md-block"
+      >
+        <label translate="TOOLS.TYPE">Type</label>
+        <md-select
+          name="data1"
+          ng-model="vm.action.data1"
+          ng-change="vm.onTypeSelection()"
+          required
+        >
+          <md-option ng-value="'0'">Popup</md-option>
+          <md-option ng-value="'1'">CTI URL</md-option>
+        </md-select>
+        <div
+          ng-messages="actionForm['data1'].$error"
+          ng-show="actionForm['data1'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.TYPE_REQUIRED"
+              >Type field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.action.action == 'contactManager'"
+        class="md-block"
+      >
+        <label translate="TOOLS.LIST">List</label>
+        <md-select
+          name="data1"
+          ng-model="vm.action.data1"
+          ng-change="vm.onListSelection()"
+          required
+        >
+          <md-option
+            ng-value="''+data1.id"
+            ng-repeat="data1 in vm.lists"
+            ng-disabled="data1.canSelect === false"
+          >
+            {{ data1.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="actionForm['data1'].$error"
+          ng-show="actionForm['data1'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.LIST_REQUIRED"
+              >List field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.action.action == 'contactManager'"
+        class="md-block"
+      >
+        <label translate="TOOLS.SEARCH_FIELDS">Search fields</label>
+        <md-select
+          name="fields"
+          ng-model="vm.action.data3"
+          ng-init="vm.onSearchFieldsInit()"
+          multiple
+          required
+        >
+          <md-optgroup label="{{ 'TOOLS.STANDARD' | translate }}">
+            <md-option
+              ng-value="field.columnName"
+              ng-repeat="field in vm.contactFields"
+            >
+              {{ field.displayName }}</md-option
+            >
+          </md-optgroup>
+          <md-optgroup
+            label="{{ 'TOOLS.LIST' | translate }}"
+            ng-if="vm.listFields.length > 0"
+          >
+            <md-option
+              ng-value="field.columnName"
+              ng-repeat="field in vm.listFields"
+            >
+              {{ field.name }}</md-option
+            >
+          </md-optgroup>
+          <md-optgroup
+            label="{{ 'TOOLS.GLOBALS' | translate }}"
+            ng-if="vm.customFields.length > 0"
+          >
+            <md-option
+              ng-value="field.columnName"
+              ng-repeat="field in vm.customFields"
+            >
+              {{ field.displayName }}</md-option
+            >
+          </md-optgroup>
+        </md-select>
+        <div
+          ng-messages="actionForm['data3'].$error"
+          ng-show="actionForm['data3'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.SEARCH_FIELDS_REQUIRED"
+              >Search fields field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.action.action == 'contactManager'"
+        class="md-block"
+      >
+        <label translate="TOOLS.AUTOCREATECONTACT"
+          >Create contact automatically</label
+        >
+        <md-select
+          name="data2"
+          ng-model="vm.action.data2"
+          ng-change="vm.onAutocreateSelection()"
+          required
+        >
+          <md-option ng-value="'1'"> {{ 'TOOLS.YES' | translate }} </md-option>
+          <md-option ng-value="'0'"> {{ 'TOOLS.NO' | translate }} </md-option>
+        </md-select>
+        <div
+          ng-messages="actionForm['data2'].$error"
+          ng-show="actionForm['data2'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.AUTOCREATECONTACT_REQUIRED"
+              >AutoCreateContact field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.action.action == 'contactManager' && vm.action.data2 === '1'"
+        class="md-block"
+      >
+        <label translate="TOOLS.AUTOCREATE_FIELD">Autocreate field</label>
+        <md-select
+          name="autocreateField"
+          ng-model="vm.action.data4"
+          ng-required="vm.action.data2 === '1'"
+        >
+          <md-optgroup label="{{ 'TOOLS.STANDARD' | translate }}">
+            <md-option
+              ng-value="field.columnName"
+              ng-repeat="field in vm.contactFields"
+            >
+              {{ field.displayName }}</md-option
+            >
+          </md-optgroup>
+          <md-optgroup
+            label="{{ 'TOOLS.LIST' | translate }}"
+            ng-if="vm.listFields.length > 0"
+          >
+            <md-option
+              ng-value="field.columnName"
+              ng-repeat="field in vm.listFields"
+            >
+              {{ field.name }}</md-option
+            >
+          </md-optgroup>
+          <md-optgroup
+            label="{{ 'TOOLS.GLOBALS' | translate }}"
+            ng-if="vm.customFields.length > 0"
+          >
+            <md-option
+              ng-value="field.columnName"
+              ng-repeat="field in vm.customFields"
+            >
+              {{ field.displayName }}</md-option
+            >
+          </md-optgroup>
+        </md-select>
+        <div
+          ng-messages="actionForm['data4'].$error"
+          ng-show="actionForm['data4'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.AUTOCREATE_FIELD_REQUIRED"
+              >Autocreate field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.action.action == 'urlForward'"
+        class="md-block"
+      >
+        <label translate="TOOLS.TYPE">Type</label>
+        <md-select name="data1" ng-model="vm.action.data1" required>
+          <md-option ng-value="'GET'">GET</md-option>
+          <md-option ng-value="'POST'">POST</md-option>
+          <md-option ng-value="'PUT'">PUT</md-option>
+          <md-option ng-value="'DELETE'">DELETE</md-option>
+        </md-select>
+        <div
+          ng-messages="actionForm['data1'].$error"
+          ng-show="actionForm['data1'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.TYPE_REQUIRED"
+              >Type field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.action.action == 'urlForward'"
+        class="md-block"
+      >
+        <label translate="TOOLS.URL">Url</label>
+        <input
+          type="url"
+          name="data2"
+          ng-model="vm.action.data2"
+          ng-required="true"
+        />
+        <div
+          ng-messages="actionForm['data2'].$error"
+          ng-show="actionForm['data2'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.URL_REQUIRED"
+              >Url field is required</span
+            >
+          </div>
+          <div ng-message="url">
+            <span translate="TOOLS.ERRORS.URL_MUST_VALID_URL"
+              >Url must be a valid url http://www.xcally.com</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.action.action == 'urlForward'"
+        class="md-block"
+      >
+        <label translate="TOOLS.TIMEOUT">Timeout</label>
+        <input
+          type="number"
+          name="data5"
+          ng-model="vm.action.data5"
+          min="1"
+          max="10"
+          ng-required="true"
+        />
+        <div class="hint"><span translate="TOOLS.HELP.TIMEOUT"></span></div>
+        <div
+          ng-messages="actionForm['data5'].$error"
+          ng-show="actionForm['data5'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.TIMEOUT_REQUIRED"
+              >Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="TOOLS.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>1</span>
+          </div>
+          <div ng-message="max">
+            <span translate="TOOLS.ERRORS.TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>10</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.action.action == 'urlForward'"
+        class="md-block"
+      >
+        <label translate="TOOLS.HEADERS">Headers</label>
+        <textarea name="data6" ng-model="vm.action.data6"></textarea>
+        <div class="hint"><span translate="TOOLS.HELP.HEADERS"></span></div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.action.action == 'urlForward' && (vm.action.data1 == 'POST' || vm.action.data1 == 'PUT')"
+        class="md-block"
+      >
+        <label translate="TOOLS.BODY">Body</label>
+        <textarea name="data7" ng-model="vm.action.data7"></textarea>
+        <div class="hint"><span translate="TOOLS.HELP.BODY"></span></div>
+      </md-input-container>
+      <md-input-container ng-if="vm.action.action == 'script'" class="md-block">
+        <label translate="TOOLS.SCRIPT_TYPE">Script_Type</label>
+        <input type="input" name="data2" ng-model="vm.action.data2" />
+        <div class="hint"><span translate="TOOLS.HELP.SCRIPT_TYPE"></span></div>
+        <div
+          ng-messages="actionForm['data2'].$error"
+          ng-show="actionForm['data2'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.SCRIPT_TYPE_REQUIRED"
+              >Script_Type field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container ng-if="vm.action.action == 'script'" class="md-block">
+        <label translate="TOOLS.SCRIPT_INFO">Script_Info</label>
+        <input type="input" name="data1" ng-model="vm.action.data1" />
+        <div class="hint"><span translate="TOOLS.HELP.SCRIPT_INFO"></span></div>
+        <div
+          ng-messages="actionForm['data1'].$error"
+          ng-show="actionForm['data1'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.SCRIPT_INFO_REQUIRED"
+              >Script_Info field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container ng-if="vm.action.action == 'script'" class="md-block">
+        <label translate="TOOLS.SCRIPT">Script</label>
+        <textarea name="data3" ng-model="vm.action.data3" required></textarea>
+        <div class="hint"><span translate="TOOLS.HELP.SCRIPT"></span></div>
+        <div
+          ng-messages="actionForm['data3'].$error"
+          ng-show="actionForm['data3'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.SCRIPT_REQUIRED"
+              >Script field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.action.action == 'integration'"
+        class="md-block"
+      >
+        <label translate="TOOLS.INTEGRATION">Integration</label>
+        <md-select
+          name="data1"
+          ng-model="vm.action.data1"
+          ng-init="vm.onIntegrationInit()"
+          ng-change="vm.onIntegrationSelection()"
+          required
+        >
+          <md-option
+            ng-value="'zendesk'"
+            ng-if="(vm.newAction && vm.hasSectionPermissions[1301]) || !vm.newAction"
+            ng-disabled="(!vm.newAction && !vm.hasSectionPermissions[1301])"
+            >Zendesk</md-option
+          >
+          <md-option
+            ng-value="'salesforce'"
+            ng-if="(vm.newAction && vm.hasSectionPermissions[1302]) || !vm.newAction"
+            ng-disabled="(!vm.newAction && !vm.hasSectionPermissions[1302])"
+            >Salesforce</md-option
+          >
+          <md-option
+            ng-value="'sugarcrm'"
+            ng-if="(vm.newAction && vm.hasSectionPermissions[1305]) || !vm.newAction"
+            ng-disabled="(!vm.newAction && !vm.hasSectionPermissions[1305])"
+            >SugarCRM</md-option
+          >
+          <md-option
+            ng-value="'freshdesk'"
+            ng-if="(vm.newAction && vm.hasSectionPermissions[1303]) || !vm.newAction"
+            ng-disabled="(!vm.newAction && !vm.hasSectionPermissions[1303])"
+            >Freshdesk</md-option
+          >
+          <md-option
+            ng-value="'desk'"
+            ng-if="(vm.newAction && vm.hasSectionPermissions[1306]) || !vm.newAction"
+            ng-disabled="(!vm.newAction && !vm.hasSectionPermissions[1306])"
+            >Desk</md-option
+          >
+          <md-option
+            ng-value="'zoho'"
+            ng-if="(vm.newAction && vm.hasSectionPermissions[1307]) || !vm.newAction"
+            ng-disabled="(!vm.newAction && !vm.hasSectionPermissions[1307])"
+            >Zoho</md-option
+          >
+          <md-option
+            ng-value="'vtiger'"
+            ng-if="(vm.newAction && vm.hasSectionPermissions[1308]) || !vm.newAction"
+            ng-disabled="(!vm.newAction && !vm.hasSectionPermissions[1308])"
+            >vTiger</md-option
+          >
+          <md-option
+            ng-value="'dynamics365'"
+            ng-if="(vm.newAction && vm.hasSectionPermissions[1309]) || !vm.newAction"
+            ng-disabled="(!vm.newAction && !vm.hasSectionPermissions[1309])"
+            >Dynamics365</md-option
+          >
+          <md-option
+            ng-value="'servicenow'"
+            ng-if="(vm.newAction && vm.hasSectionPermissions[1310]) || !vm.newAction"
+            ng-disabled="(!vm.newAction && !vm.hasSectionPermissions[1310])"
+            >ServiceNow</md-option
+          >
+          <md-option
+            ng-value="'freshsales'"
+            ng-if="(vm.newAction && vm.hasSectionPermissions[1311]) || !vm.newAction"
+            ng-disabled="(!vm.newAction && !vm.hasSectionPermissions[1311])"
+            >Freshsales</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="actionForm['data1'].$error"
+          ng-show="actionForm['data1'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.INTEGRATION_REQUIRED"
+              >Integration field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.action.action == 'integration' && vm.action.data1"
+        class="md-block"
+      >
+        <label translate="TOOLS.ACCOUNT">Account</label>
+        <md-select
+          name="data2"
+          ng-model="vm.action.data2"
+          ng-change="vm.onIntegrationAccountSelection()"
+          ng-disabled="vm.action.isIntegrationDisabled"
+          required
+        >
+          <md-option ng-value="''+data2.id" ng-repeat="data2 in vm.accounts"
+            >{{ data2.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="actionForm['data2'].$error"
+          ng-show="actionForm['data2'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.ACCOUNT_REQUIRED"
+              >Account field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.action.action == 'integration'  && vm.action.data1 && vm.action.data2"
+        class="md-block"
+      >
+        <label translate="TOOLS.CONFIGURATION">Configuration</label>
+        <md-select
+          name="data3"
+          ng-model="vm.action.data3"
+          required
+          ng-disabled="vm.action.isIntegrationDisabled"
+        >
+          <md-option
+            ng-value="''+data3.id"
+            ng-repeat="data3 in vm.configurations | filter:{ AccountId:vm.action.data2 }"
+            >{{ data3.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="actionForm['data3'].$error"
+          ng-show="actionForm['data3'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.CONFIGURATION_REQUIRED"
+              >Configuration field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.action.action == 'motionbar'"
+        class="md-block"
+      >
+        <label translate="TOOLS.TYPE">Type</label>
+        <md-select
+          name="data1"
+          ng-model="vm.action.data1"
+          ng-change="vm.onTypeSelection()"
+          required
+        >
+          <md-option ng-value="'0'">Popup</md-option>
+          <md-option ng-value="'1'">CTI URL</md-option>
+          <md-option ng-value="'2'">Windows App</md-option>
+        </md-select>
+        <div
+          ng-messages="actionForm['data1'].$error"
+          ng-show="actionForm['data1'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.TYPE_REQUIRED"
+              >Type field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.action.action == 'motionbar' && vm.action.data1 == '1'"
+        class="md-block"
+      >
+        <label translate="TOOLS.URL">Url</label>
+        <input
+          type="url"
+          name="data2"
+          ng-model="vm.action.data2"
+          ng-required="true"
+        />
+        <div
+          ng-messages="actionForm['data2'].$error"
+          ng-show="actionForm['data2'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.URL_REQUIRED"
+              >Url field is required</span
+            >
+          </div>
+          <div ng-message="url">
+            <span translate="TOOLS.ERRORS.URL_MUST_VALID_URL"
+              >Url must be a valid url http://www.xcally.com</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.action.action == 'motionbar' && vm.action.data1 == '2'"
+        class="md-block"
+      >
+        <label translate="TOOLS.APPLICATION">Application</label>
+        <input
+          type="text"
+          name="data2"
+          ng-model="vm.action.data2"
+          ng-required="true"
+        />
+        <div
+          ng-messages="actionForm['data2'].$error"
+          ng-show="actionForm['data2'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.APPLICATION_REQUIRED"
+              >Application field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.action.action == 'motionbar' && vm.action.data1 == '2'"
+        class="md-block"
+      >
+        <label translate="TOOLS.ARGUMENTS">Arguments</label>
+        <input type="text" name="data3" ng-model="vm.action.data3" />
+        <div
+          ng-messages="actionForm['data3'].$error"
+          ng-show="actionForm['data3'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.ARGUMENTS_REQUIRED"
+              >Arguments field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.action.action == 'motionbar' && vm.action.data1 == '0'"
+        class="md-block"
+      >
+        <label translate="TOOLS.TEMPLATE">Template</label>
+        <md-select name="data2" ng-model="vm.action.data2" required>
+          <md-option
+            ng-value="''+data2.id"
+            ng-repeat="data2 in vm.templates"
+            ng-disabled="data2.canSelect === false"
+          >
+            {{ data2.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="actionForm['data2'].$error"
+          ng-show="actionForm['data2'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.TEMPLATE_REQUIRED"
+              >Template field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.action.action == 'browser' && vm.action.data1 == '0'"
+        class="md-block"
+      >
+        <label translate="TOOLS.TEMPLATE">Template</label>
+        <md-select name="data2" ng-model="vm.action.data2" required>
+          <md-option
+            ng-value="''+data2.id"
+            ng-repeat="data2 in vm.templates"
+            ng-disabled="data2.canSelect === false"
+          >
+            {{ data2.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="actionForm['data2'].$error"
+          ng-show="actionForm['data2'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.TEMPLATE_REQUIRED"
+              >Template field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.action.action == 'browser' && vm.action.data1 == '1'"
+        class="md-block"
+      >
+        <label translate="TOOLS.URL">Url</label>
+        <input
+          type="url"
+          name="data2"
+          ng-model="vm.action.data2"
+          ng-required="true"
+        />
+        <div
+          ng-messages="actionForm['data2'].$error"
+          ng-show="actionForm['data2'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.URL_REQUIRED"
+              >Url field is required</span
+            >
+          </div>
+          <div ng-message="url">
+            <span translate="TOOLS.ERRORS.URL_MUST_VALID_URL"
+              >Url must be a valid url http://www.xcally.com</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="(vm.action.action == 'motionbar' || vm.action.action == 'browser') && vm.action.data1 == '1'"
+        class="md-block"
+      >
+        <label translate="TOOLS.EVENTVARIABLES">EventVariables</label>
+        <md-select name="data3" ng-model="vm.action.data3" required>
+          <md-option ng-value="'1'"> {{ 'TOOLS.YES' | translate }} </md-option>
+          <md-option ng-value="'0'"> {{ 'TOOLS.NO' | translate }} </md-option>
+        </md-select>
+        <div class="hint">
+          <span translate="TOOLS.HELP.EVENTVARIABLES"></span>
+        </div>
+        <div
+          ng-messages="actionForm['data3'].$error"
+          ng-show="actionForm['data3'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.EVENTVARIABLES_REQUIRED"
+              >EventVariables field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.action.action == 'browser' && vm.action.data1 == '1'"
+        class="md-block"
+      >
+        <label translate="TOOLS.LOCATION">Location</label>
+        <md-select name="data4" ng-model="vm.action.data4" required>
+          <md-option ng-value="'0'" ng-selected="true">
+            {{ 'TOOLS.NEW_TAB' | translate }}
+          </md-option>
+          <md-option ng-value="'1'">
+            {{ 'TOOLS.NEW_WINDOW' | translate }}
+          </md-option>
+          <md-option ng-value="'2'">
+            {{ 'TOOLS.MOTION_TAB' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="actionForm['data4'].$error"
+          ng-show="actionForm['data4'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.LOCATION_REQUIRED"
+              >Location field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.action.action == 'browser' && vm.action.data4 == '1'"
+        class="md-block"
+      >
+        <label translate="TOOLS.WINDOWWIDTH">WindowWidth</label>
+        <input type="text" name="data5" ng-model="vm.action.data5" />
+        <div
+          ng-messages="actionForm['data5'].$error"
+          ng-show="actionForm['data5'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.WINDOWWIDTH_REQUIRED"
+              >WindowWidth field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.action.action == 'browser' && vm.action.data4 == '1'"
+        class="md-block"
+      >
+        <label translate="TOOLS.WINDOWHEIGHT">WindowHeight</label>
+        <input type="text" name="data6" ng-model="vm.action.data6" />
+        <div
+          ng-messages="actionForm['data6'].$error"
+          ng-show="actionForm['data6'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.WINDOWHEIGHT_REQUIRED"
+              >WindowHeight field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newAction"
+          ng-click="vm.saveAction()"
+          class="send-button md-accent md-raised"
+          ng-disabled="actionForm.$invalid || actionForm.$pristine"
+          aria-label="SAVE"
+          translate="TOOLS.SAVE"
+          translate-attr-aria-label="TOOLS.SAVE"
+        >
+          SAVE
+        </md-button>
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newAction"
+          ng-click="vm.addNewAction()"
+          class="send-button md-accent md-raised"
+          ng-disabled="actionForm.$invalid"
+          aria-label="ADD"
+          translate="TOOLS.ADD_ACTION"
+          translate-attr-aria-label="TOOLS.ADD_ACTION"
+        >
+          ADD ACTION
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newAction"
+          ng-click="vm.deleteAction($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="TOOLS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/triggers/edit/allconditions/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/triggers/edit/allconditions/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index f208570..0000000
--- a/public/src/js/modules/main/apps/tools/views/triggers/edit/allconditions/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,333 +0,0 @@
-<md-dialog class="allCondition-dialog" aria-label="New AllCondition">
-  <form name="allConditionForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title"
-          >{{ vm.newAllCondition ? 'TOOLS.NEW_ALLCONDITION' :
-          'TOOLS.EDIT_ALLCONDITION' | translate }}</span
-        >
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content ms-scroll>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.FIELD">Field</label>
-        <md-select
-          name="field"
-          ng-model="vm.allCondition.field"
-          ng-change="vm.onFieldSelection()"
-          md-autofocus
-          required
-        >
-          <md-option ng-value="'queue'" ng-if="vm.trigger.channel == 'voice'">
-            {{ 'TOOLS.QUEUE' | translate }}
-          </md-option>
-          <md-option
-            ng-value="'lastevent'"
-            ng-if="vm.trigger.channel == 'voice'"
-          >
-            {{ 'TOOLS.CALL_STATUS' | translate }}
-          </md-option>
-          <md-option ng-value="'routeId'" ng-if="vm.trigger.channel == 'voice'">
-            {{ 'TOOLS.OUTBOUNDROUTE' | translate }}
-          </md-option>
-          <md-option ng-value="'agent'" ng-if="vm.trigger.channel == 'voice'">
-            {{ 'TOOLS.AGENT' | translate }}
-          </md-option>
-          <md-option ng-value="'account'" ng-if="vm.trigger.channel != 'voice'">
-            {{ 'TOOLS.ACCOUNT' | translate }}
-          </md-option>
-          <md-option
-            ng-value="'interaction'"
-            ng-if="vm.trigger.channel != 'voice'"
-          >
-            {{ 'TOOLS.INTERACTION' | translate }}
-          </md-option>
-          <md-option ng-value="'message'" ng-if="vm.trigger.channel != 'voice'">
-            {{ 'TOOLS.MESSAGE' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="allConditionForm['field'].$error"
-          ng-show="allConditionForm['field'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.FIELD_REQUIRED"
-              >Field field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.OPERATOR">Operator</label>
-        <md-select name="operator" ng-model="vm.allCondition.operator" required>
-          <md-option ng-value="'equals'">
-            {{ 'TOOLS.EQUALS' | translate }}
-          </md-option>
-          <md-option ng-value="'not_equals'">
-            {{ 'TOOLS.NOT_EQUALS' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="allConditionForm['operator'].$error"
-          ng-show="allConditionForm['operator'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.OPERATOR_REQUIRED"
-              >Operator field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.allCondition.field == 'account'"
-        class="md-block"
-      >
-        <label translate="TOOLS.ACCOUNT">Account</label>
-        <md-select name="value" ng-model="vm.allCondition.value" required>
-          <md-option
-            ng-value="value.id"
-            ng-repeat="value in vm.accounts"
-            ng-disabled="value.canSelect === false"
-          >
-            {{ value.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="allConditionForm['value'].$error"
-          ng-show="allConditionForm['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.ACCOUNT_REQUIRED"
-              >Account field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.allCondition.field == 'queue' && vm.trigger.channel == 'voice'"
-        class="md-block"
-      >
-        <label translate="TOOLS.QUEUE">Queue</label>
-        <md-select name="value" ng-model="vm.allCondition.value" required>
-          <md-option
-            ng-value="value.name"
-            ng-repeat="value in vm.queues"
-            ng-disabled="value.canSelect === false"
-          >
-            {{ value.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="allConditionForm['value'].$error"
-          ng-show="allConditionForm['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.QUEUE_REQUIRED"
-              >Queue field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.allCondition.field == 'routeId' && vm.trigger.channel == 'voice'"
-        class="md-block"
-      >
-        <label translate="TOOLS.OUTBOUNDROUTE">OutboundRoute</label>
-        <md-select name="value" ng-model="vm.allCondition.value" required>
-          <md-option
-            ng-value="value.id"
-            ng-repeat="value in vm.outboundRoutes"
-            ng-disabled="value.canSelect === false"
-          >
-            {{ value.exten }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="allConditionForm['value'].$error"
-          ng-show="allConditionForm['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.OUTBOUNDROUTE_REQUIRED"
-              >OutboundRoute field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.allCondition.field == 'agent' && vm.trigger.channel == 'voice'"
-        class="md-block"
-      >
-        <label translate="TOOLS.AGENT">Agent</label>
-        <md-select name="value" ng-model="vm.allCondition.value" required>
-          <md-option
-            ng-value="value.name"
-            ng-repeat="value in vm.agents"
-            ng-disabled="value.canSelect === false"
-          >
-            {{ value.fullname }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="allConditionForm['value'].$error"
-          ng-show="allConditionForm['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.AGENT_REQUIRED"
-              >Agent field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.allCondition.field == 'lastevent'"
-        class="md-block"
-      >
-        <label translate="TOOLS.VALUE">Value</label>
-        <md-select name="value" ng-model="vm.allCondition.value" required>
-          <md-option
-            ng-value="status.value"
-            ng-repeat="status in vm.callStatuses"
-          >
-            {{ status.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="allConditionForm['value'].$error"
-          ng-show="allConditionForm['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.VALUE_REQUIRED"
-              >Value field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.allCondition.field == 'interaction' && vm.trigger.channel != 'voice'"
-        class="md-block"
-      >
-        <label translate="TOOLS.VALUE">Value</label>
-        <md-select name="value" ng-model="vm.allCondition.value" required>
-          <md-option ng-value="'opened'">Opened</md-option>
-          <md-option ng-value="'closed'">Closed</md-option>
-        </md-select>
-        <div
-          ng-messages="allConditionForm['value'].$error"
-          ng-show="allConditionForm['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.VALUE_REQUIRED"
-              >Value field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.allCondition.field == 'message' && vm.trigger.channel != 'voice'"
-        class="md-block"
-      >
-        <label translate="TOOLS.VALUE">Value</label>
-        <md-select name="value" ng-model="vm.allCondition.value" required>
-          <md-option ng-value="'in'">Incoming</md-option>
-          <md-option ng-value="'out'">Outgoing</md-option>
-          <md-option ng-value="'accept'">Accepted</md-option>
-          <md-option ng-value="'reject'">Rejected</md-option>
-        </md-select>
-        <div
-          ng-messages="allConditionForm['value'].$error"
-          ng-show="allConditionForm['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.VALUE_REQUIRED"
-              >Value field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newAllCondition"
-          ng-click="vm.saveAllCondition()"
-          class="send-button md-accent md-raised"
-          ng-disabled="allConditionForm.$invalid || allConditionForm.$pristine"
-          aria-label="SAVE"
-          translate="TOOLS.SAVE"
-          translate-attr-aria-label="TOOLS.SAVE"
-        >
-          SAVE
-        </md-button>
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newAllCondition"
-          ng-click="vm.addNewAllCondition()"
-          class="send-button md-accent md-raised"
-          ng-disabled="allConditionForm.$invalid"
-          aria-label="ADD"
-          translate="TOOLS.ADD_ALLCONDITION"
-          translate-attr-aria-label="TOOLS.ADD_ALLCONDITION"
-        >
-          ADD ALLCONDITION
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newAllCondition"
-          ng-click="vm.deleteAllCondition($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="TOOLS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/triggers/edit/allconditions/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/tools/views/triggers/edit/allconditions/create/dialog.html/dialog.html
new file mode 100644
index 0000000..f208570
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/triggers/edit/allconditions/create/dialog.html/dialog.html
@@ -0,0 +1,333 @@
+<md-dialog class="allCondition-dialog" aria-label="New AllCondition">
+  <form name="allConditionForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title"
+          >{{ vm.newAllCondition ? 'TOOLS.NEW_ALLCONDITION' :
+          'TOOLS.EDIT_ALLCONDITION' | translate }}</span
+        >
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content ms-scroll>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.FIELD">Field</label>
+        <md-select
+          name="field"
+          ng-model="vm.allCondition.field"
+          ng-change="vm.onFieldSelection()"
+          md-autofocus
+          required
+        >
+          <md-option ng-value="'queue'" ng-if="vm.trigger.channel == 'voice'">
+            {{ 'TOOLS.QUEUE' | translate }}
+          </md-option>
+          <md-option
+            ng-value="'lastevent'"
+            ng-if="vm.trigger.channel == 'voice'"
+          >
+            {{ 'TOOLS.CALL_STATUS' | translate }}
+          </md-option>
+          <md-option ng-value="'routeId'" ng-if="vm.trigger.channel == 'voice'">
+            {{ 'TOOLS.OUTBOUNDROUTE' | translate }}
+          </md-option>
+          <md-option ng-value="'agent'" ng-if="vm.trigger.channel == 'voice'">
+            {{ 'TOOLS.AGENT' | translate }}
+          </md-option>
+          <md-option ng-value="'account'" ng-if="vm.trigger.channel != 'voice'">
+            {{ 'TOOLS.ACCOUNT' | translate }}
+          </md-option>
+          <md-option
+            ng-value="'interaction'"
+            ng-if="vm.trigger.channel != 'voice'"
+          >
+            {{ 'TOOLS.INTERACTION' | translate }}
+          </md-option>
+          <md-option ng-value="'message'" ng-if="vm.trigger.channel != 'voice'">
+            {{ 'TOOLS.MESSAGE' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="allConditionForm['field'].$error"
+          ng-show="allConditionForm['field'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.FIELD_REQUIRED"
+              >Field field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.OPERATOR">Operator</label>
+        <md-select name="operator" ng-model="vm.allCondition.operator" required>
+          <md-option ng-value="'equals'">
+            {{ 'TOOLS.EQUALS' | translate }}
+          </md-option>
+          <md-option ng-value="'not_equals'">
+            {{ 'TOOLS.NOT_EQUALS' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="allConditionForm['operator'].$error"
+          ng-show="allConditionForm['operator'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.OPERATOR_REQUIRED"
+              >Operator field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.allCondition.field == 'account'"
+        class="md-block"
+      >
+        <label translate="TOOLS.ACCOUNT">Account</label>
+        <md-select name="value" ng-model="vm.allCondition.value" required>
+          <md-option
+            ng-value="value.id"
+            ng-repeat="value in vm.accounts"
+            ng-disabled="value.canSelect === false"
+          >
+            {{ value.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="allConditionForm['value'].$error"
+          ng-show="allConditionForm['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.ACCOUNT_REQUIRED"
+              >Account field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.allCondition.field == 'queue' && vm.trigger.channel == 'voice'"
+        class="md-block"
+      >
+        <label translate="TOOLS.QUEUE">Queue</label>
+        <md-select name="value" ng-model="vm.allCondition.value" required>
+          <md-option
+            ng-value="value.name"
+            ng-repeat="value in vm.queues"
+            ng-disabled="value.canSelect === false"
+          >
+            {{ value.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="allConditionForm['value'].$error"
+          ng-show="allConditionForm['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.QUEUE_REQUIRED"
+              >Queue field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.allCondition.field == 'routeId' && vm.trigger.channel == 'voice'"
+        class="md-block"
+      >
+        <label translate="TOOLS.OUTBOUNDROUTE">OutboundRoute</label>
+        <md-select name="value" ng-model="vm.allCondition.value" required>
+          <md-option
+            ng-value="value.id"
+            ng-repeat="value in vm.outboundRoutes"
+            ng-disabled="value.canSelect === false"
+          >
+            {{ value.exten }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="allConditionForm['value'].$error"
+          ng-show="allConditionForm['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.OUTBOUNDROUTE_REQUIRED"
+              >OutboundRoute field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.allCondition.field == 'agent' && vm.trigger.channel == 'voice'"
+        class="md-block"
+      >
+        <label translate="TOOLS.AGENT">Agent</label>
+        <md-select name="value" ng-model="vm.allCondition.value" required>
+          <md-option
+            ng-value="value.name"
+            ng-repeat="value in vm.agents"
+            ng-disabled="value.canSelect === false"
+          >
+            {{ value.fullname }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="allConditionForm['value'].$error"
+          ng-show="allConditionForm['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.AGENT_REQUIRED"
+              >Agent field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.allCondition.field == 'lastevent'"
+        class="md-block"
+      >
+        <label translate="TOOLS.VALUE">Value</label>
+        <md-select name="value" ng-model="vm.allCondition.value" required>
+          <md-option
+            ng-value="status.value"
+            ng-repeat="status in vm.callStatuses"
+          >
+            {{ status.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="allConditionForm['value'].$error"
+          ng-show="allConditionForm['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.VALUE_REQUIRED"
+              >Value field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.allCondition.field == 'interaction' && vm.trigger.channel != 'voice'"
+        class="md-block"
+      >
+        <label translate="TOOLS.VALUE">Value</label>
+        <md-select name="value" ng-model="vm.allCondition.value" required>
+          <md-option ng-value="'opened'">Opened</md-option>
+          <md-option ng-value="'closed'">Closed</md-option>
+        </md-select>
+        <div
+          ng-messages="allConditionForm['value'].$error"
+          ng-show="allConditionForm['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.VALUE_REQUIRED"
+              >Value field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.allCondition.field == 'message' && vm.trigger.channel != 'voice'"
+        class="md-block"
+      >
+        <label translate="TOOLS.VALUE">Value</label>
+        <md-select name="value" ng-model="vm.allCondition.value" required>
+          <md-option ng-value="'in'">Incoming</md-option>
+          <md-option ng-value="'out'">Outgoing</md-option>
+          <md-option ng-value="'accept'">Accepted</md-option>
+          <md-option ng-value="'reject'">Rejected</md-option>
+        </md-select>
+        <div
+          ng-messages="allConditionForm['value'].$error"
+          ng-show="allConditionForm['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.VALUE_REQUIRED"
+              >Value field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newAllCondition"
+          ng-click="vm.saveAllCondition()"
+          class="send-button md-accent md-raised"
+          ng-disabled="allConditionForm.$invalid || allConditionForm.$pristine"
+          aria-label="SAVE"
+          translate="TOOLS.SAVE"
+          translate-attr-aria-label="TOOLS.SAVE"
+        >
+          SAVE
+        </md-button>
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newAllCondition"
+          ng-click="vm.addNewAllCondition()"
+          class="send-button md-accent md-raised"
+          ng-disabled="allConditionForm.$invalid"
+          aria-label="ADD"
+          translate="TOOLS.ADD_ALLCONDITION"
+          translate-attr-aria-label="TOOLS.ADD_ALLCONDITION"
+        >
+          ADD ALLCONDITION
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newAllCondition"
+          ng-click="vm.deleteAllCondition($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="TOOLS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/triggers/edit/anyconditions/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/triggers/edit/anyconditions/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 851a325..0000000
--- a/public/src/js/modules/main/apps/tools/views/triggers/edit/anyconditions/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,461 +0,0 @@
-<md-dialog class="anyCondition-dialog" aria-label="New AnyCondition">
-  <form name="anyConditionForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.FIELD">Field</label>
-        <md-select
-          name="field"
-          ng-model="vm.anyCondition.field"
-          autofocus
-          required
-        >
-          <md-option ng-value="'queue'" ng-if="vm.trigger.channel == 'voice'">
-            {{ 'TOOLS.QUEUE' | translate }}
-          </md-option>
-
-          <md-option
-            ng-value="'lastevent'"
-            ng-if="vm.trigger.channel == 'voice'"
-          >
-            {{ 'TOOLS.CALL_STATUS' | translate }}
-          </md-option>
-
-          <md-option ng-value="'routeId'" ng-if="vm.trigger.channel == 'voice'">
-            {{ 'TOOLS.OUTBOUNDROUTE' | translate }}
-          </md-option>
-
-          <md-option ng-value="'agent'" ng-if="vm.trigger.channel == 'voice'">
-            {{ 'TOOLS.AGENT' | translate }}
-          </md-option>
-
-          <md-option ng-value="'account'" ng-if="vm.trigger.channel != 'voice'">
-            {{ 'TOOLS.ACCOUNT' | translate }}
-          </md-option>
-
-          <md-option
-            ng-value="'interaction'"
-            ng-if="vm.trigger.channel != 'voice'"
-          >
-            {{ 'TOOLS.INTERACTION' | translate }}
-          </md-option>
-
-          <md-option ng-value="'message'" ng-if="vm.trigger.channel != 'voice'">
-            {{ 'TOOLS.MESSAGE' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="anyConditionForm['field'].$error"
-          ng-show="anyConditionForm['field'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.FIELD_REQUIRED"
-              >Field field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.OPERATOR">Operator</label>
-        <md-select name="operator" ng-model="vm.anyCondition.operator" required>
-          <md-option ng-value="'equals'">
-            {{ 'TOOLS.EQUALS' | translate }}
-          </md-option>
-
-          <md-option ng-value="'not_equals'">
-            {{ 'TOOLS.NOT_EQUALS' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="anyConditionForm['operator'].$error"
-          ng-show="anyConditionForm['operator'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.OPERATOR_REQUIRED"
-              >Operator field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.anyCondition.field == 'account' && vm.trigger.channel == 'chat'"
-        class="md-block"
-      >
-        <label translate="TOOLS.ACCOUNT">Account</label>
-        <md-select name="value" ng-model="vm.anyCondition.value" required>
-          <md-option
-            ng-value="value.id"
-            ng-repeat="value in vm.chatAccounts"
-            ng-disabled="value.canSelect === false"
-            >{{ value.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="anyConditionForm['value'].$error"
-          ng-show="anyConditionForm['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.ACCOUNT_REQUIRED"
-              >Account field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.anyCondition.field == 'account' && vm.trigger.channel == 'mail'"
-        class="md-block"
-      >
-        <label translate="TOOLS.ACCOUNT">Account</label>
-        <md-select name="value" ng-model="vm.anyCondition.value" required>
-          <md-option
-            ng-value="value.id"
-            ng-repeat="value in vm.mailAccounts"
-            ng-disabled="value.canSelect === false"
-            >{{ value.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="anyConditionForm['value'].$error"
-          ng-show="anyConditionForm['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.ACCOUNT_REQUIRED"
-              >Account field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.anyCondition.field == 'account' && vm.trigger.channel == 'sms'"
-        class="md-block"
-      >
-        <label translate="TOOLS.ACCOUNT">Account</label>
-        <md-select name="value" ng-model="vm.anyCondition.value" required>
-          <md-option
-            ng-value="value.id"
-            ng-repeat="value in vm.smsAccounts"
-            ng-disabled="value.canSelect === false"
-            >{{ value.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="anyConditionForm['value'].$error"
-          ng-show="anyConditionForm['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.ACCOUNT_REQUIRED"
-              >Account field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.anyCondition.field == 'account' && vm.trigger.channel == 'fax'"
-        class="md-block"
-      >
-        <label translate="TOOLS.ACCOUNT">Account</label>
-        <md-select name="value" ng-model="vm.anyCondition.value" required>
-          <md-option
-            ng-value="value.id"
-            ng-repeat="value in vm.faxAccounts"
-            ng-disabled="value.canSelect === false"
-            >{{ value.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="anyConditionForm['value'].$error"
-          ng-show="anyConditionForm['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.ACCOUNT_REQUIRED"
-              >Account field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.anyCondition.field == 'account' && vm.trigger.channel == 'openchannel'"
-        class="md-block"
-      >
-        <label translate="TOOLS.ACCOUNT">Account</label>
-        <md-select name="value" ng-model="vm.anyCondition.value" required>
-          <md-option
-            ng-value="value.id"
-            ng-repeat="value in vm.openchannelAccounts"
-            ng-disabled="value.canSelect === false"
-            >{{ value.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="anyConditionForm['value'].$error"
-          ng-show="anyConditionForm['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.ACCOUNT_REQUIRED"
-              >Account field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.anyCondition.field == 'queue' && vm.trigger.channel == 'voice'"
-        class="md-block"
-      >
-        <label translate="TOOLS.QUEUE">Queue</label>
-        <md-select name="value" ng-model="vm.anyCondition.value" required>
-          <md-option
-            ng-value="value.name"
-            ng-repeat="value in vm.queues"
-            ng-disabled="value.canSelect === false"
-            >{{ value.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="anyConditionForm['value'].$error"
-          ng-show="anyConditionForm['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.QUEUE_REQUIRED"
-              >Queue field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.anyCondition.field == 'routeId' && vm.trigger.channel == 'voice'"
-        class="md-block"
-      >
-        <label translate="TOOLS.OUTBOUNDROUTE">OutboundRoute</label>
-        <md-select name="value" ng-model="vm.anyCondition.value" required>
-          <md-option
-            ng-value="value.id"
-            ng-repeat="value in vm.outboundRoutes"
-            ng-disabled="value.canSelect === false"
-            >{{ value.exten }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="anyConditionForm['value'].$error"
-          ng-show="anyConditionForm['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.OUTBOUNDROUTE_REQUIRED"
-              >OutboundRoute field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.anyCondition.field == 'agent' && vm.trigger.channel == 'voice'"
-        class="md-block"
-      >
-        <label translate="TOOLS.AGENT">Agent</label>
-        <md-select name="value" ng-model="vm.anyCondition.value" required>
-          <md-option
-            ng-value="value.name"
-            ng-repeat="value in vm.agents"
-            ng-disabled="value.canSelect === false"
-            >{{ value.fullname }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="anyConditionForm['value'].$error"
-          ng-show="anyConditionForm['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.AGENT_REQUIRED"
-              >Agent field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.anyCondition.field == 'lastevent'"
-        class="md-block"
-      >
-        <label translate="TOOLS.VALUE">Value</label>
-        <md-select name="value" ng-model="vm.anyCondition.value" required>
-          <md-option ng-value="'abandoned'">Abandon</md-option>
-          <md-option ng-value="'timeout'">Timeout</md-option>
-          <md-option ng-value="'complete'">Hangup</md-option>
-          <md-option ng-value="'rejected'">Reject</md-option>
-          <md-option ng-value="'called'">Ring</md-option>
-          <md-option ng-value="'connect'">Answer</md-option>
-          <md-option ng-value="'nosuchnumber'">NoSuchNumber</md-option>
-          <md-option ng-value="'busy'">Busy</md-option>
-          <md-option ng-value="'noanswer'">NoAnswer</md-option>
-          <md-option ng-value="'congestion'">Congestion</md-option>
-          <md-option ng-value="'agentreject'">AgentReject</md-option>
-        </md-select>
-        <div
-          ng-messages="anyConditionForm['value'].$error"
-          ng-show="anyConditionForm['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.VALUE_REQUIRED"
-              >Value field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.anyCondition.field == 'interaction' && vm.trigger.channel != 'voice'"
-        class="md-block"
-      >
-        <label translate="TOOLS.VALUE">Value</label>
-        <md-select name="value" ng-model="vm.anyCondition.value" required>
-          <md-option ng-value="'opened'">Opened</md-option>
-          <md-option ng-value="'closed'">Closed</md-option>
-        </md-select>
-        <div
-          ng-messages="anyConditionForm['value'].$error"
-          ng-show="anyConditionForm['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.VALUE_REQUIRED"
-              >Value field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.anyCondition.field == 'message' && vm.trigger.channel != 'voice'"
-        class="md-block"
-      >
-        <label translate="TOOLS.VALUE">Value</label>
-        <md-select name="value" ng-model="vm.anyCondition.value" required>
-          <md-option ng-value="'in'">Incoming</md-option>
-          <md-option ng-value="'out'">Outgoing</md-option>
-          <md-option ng-value="'accept'">Accepted</md-option>
-          <md-option ng-value="'reject'">Rejected</md-option>
-        </md-select>
-        <div
-          ng-messages="anyConditionForm['value'].$error"
-          ng-show="anyConditionForm['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.VALUE_REQUIRED"
-              >Value field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newAnyCondition"
-          ng-click="vm.saveAnyCondition()"
-          class="send-button md-accent md-raised"
-          ng-disabled="anyConditionForm.$invalid || anyConditionForm.$pristine"
-          aria-label="SAVE"
-          translate="TOOLS.SAVE"
-          translate-attr-aria-label="TOOLS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newAnyCondition"
-          ng-click="vm.addNewAnyCondition()"
-          class="send-button md-accent md-raised"
-          ng-disabled="anyConditionForm.$invalid"
-          aria-label="ADD"
-          translate="TOOLS.ADD_ANYCONDITION"
-          translate-attr-aria-label="TOOLS.ADD_ANYCONDITION"
-        >
-          ADD ANYCONDITION
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newAnyCondition"
-          ng-click="vm.deleteAnyCondition($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="TOOLS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/triggers/edit/anyconditions/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/tools/views/triggers/edit/anyconditions/create/dialog.html/dialog.html
new file mode 100644
index 0000000..851a325
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/triggers/edit/anyconditions/create/dialog.html/dialog.html
@@ -0,0 +1,461 @@
+<md-dialog class="anyCondition-dialog" aria-label="New AnyCondition">
+  <form name="anyConditionForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.FIELD">Field</label>
+        <md-select
+          name="field"
+          ng-model="vm.anyCondition.field"
+          autofocus
+          required
+        >
+          <md-option ng-value="'queue'" ng-if="vm.trigger.channel == 'voice'">
+            {{ 'TOOLS.QUEUE' | translate }}
+          </md-option>
+
+          <md-option
+            ng-value="'lastevent'"
+            ng-if="vm.trigger.channel == 'voice'"
+          >
+            {{ 'TOOLS.CALL_STATUS' | translate }}
+          </md-option>
+
+          <md-option ng-value="'routeId'" ng-if="vm.trigger.channel == 'voice'">
+            {{ 'TOOLS.OUTBOUNDROUTE' | translate }}
+          </md-option>
+
+          <md-option ng-value="'agent'" ng-if="vm.trigger.channel == 'voice'">
+            {{ 'TOOLS.AGENT' | translate }}
+          </md-option>
+
+          <md-option ng-value="'account'" ng-if="vm.trigger.channel != 'voice'">
+            {{ 'TOOLS.ACCOUNT' | translate }}
+          </md-option>
+
+          <md-option
+            ng-value="'interaction'"
+            ng-if="vm.trigger.channel != 'voice'"
+          >
+            {{ 'TOOLS.INTERACTION' | translate }}
+          </md-option>
+
+          <md-option ng-value="'message'" ng-if="vm.trigger.channel != 'voice'">
+            {{ 'TOOLS.MESSAGE' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="anyConditionForm['field'].$error"
+          ng-show="anyConditionForm['field'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.FIELD_REQUIRED"
+              >Field field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.OPERATOR">Operator</label>
+        <md-select name="operator" ng-model="vm.anyCondition.operator" required>
+          <md-option ng-value="'equals'">
+            {{ 'TOOLS.EQUALS' | translate }}
+          </md-option>
+
+          <md-option ng-value="'not_equals'">
+            {{ 'TOOLS.NOT_EQUALS' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="anyConditionForm['operator'].$error"
+          ng-show="anyConditionForm['operator'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.OPERATOR_REQUIRED"
+              >Operator field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.anyCondition.field == 'account' && vm.trigger.channel == 'chat'"
+        class="md-block"
+      >
+        <label translate="TOOLS.ACCOUNT">Account</label>
+        <md-select name="value" ng-model="vm.anyCondition.value" required>
+          <md-option
+            ng-value="value.id"
+            ng-repeat="value in vm.chatAccounts"
+            ng-disabled="value.canSelect === false"
+            >{{ value.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="anyConditionForm['value'].$error"
+          ng-show="anyConditionForm['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.ACCOUNT_REQUIRED"
+              >Account field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.anyCondition.field == 'account' && vm.trigger.channel == 'mail'"
+        class="md-block"
+      >
+        <label translate="TOOLS.ACCOUNT">Account</label>
+        <md-select name="value" ng-model="vm.anyCondition.value" required>
+          <md-option
+            ng-value="value.id"
+            ng-repeat="value in vm.mailAccounts"
+            ng-disabled="value.canSelect === false"
+            >{{ value.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="anyConditionForm['value'].$error"
+          ng-show="anyConditionForm['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.ACCOUNT_REQUIRED"
+              >Account field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.anyCondition.field == 'account' && vm.trigger.channel == 'sms'"
+        class="md-block"
+      >
+        <label translate="TOOLS.ACCOUNT">Account</label>
+        <md-select name="value" ng-model="vm.anyCondition.value" required>
+          <md-option
+            ng-value="value.id"
+            ng-repeat="value in vm.smsAccounts"
+            ng-disabled="value.canSelect === false"
+            >{{ value.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="anyConditionForm['value'].$error"
+          ng-show="anyConditionForm['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.ACCOUNT_REQUIRED"
+              >Account field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.anyCondition.field == 'account' && vm.trigger.channel == 'fax'"
+        class="md-block"
+      >
+        <label translate="TOOLS.ACCOUNT">Account</label>
+        <md-select name="value" ng-model="vm.anyCondition.value" required>
+          <md-option
+            ng-value="value.id"
+            ng-repeat="value in vm.faxAccounts"
+            ng-disabled="value.canSelect === false"
+            >{{ value.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="anyConditionForm['value'].$error"
+          ng-show="anyConditionForm['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.ACCOUNT_REQUIRED"
+              >Account field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.anyCondition.field == 'account' && vm.trigger.channel == 'openchannel'"
+        class="md-block"
+      >
+        <label translate="TOOLS.ACCOUNT">Account</label>
+        <md-select name="value" ng-model="vm.anyCondition.value" required>
+          <md-option
+            ng-value="value.id"
+            ng-repeat="value in vm.openchannelAccounts"
+            ng-disabled="value.canSelect === false"
+            >{{ value.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="anyConditionForm['value'].$error"
+          ng-show="anyConditionForm['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.ACCOUNT_REQUIRED"
+              >Account field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.anyCondition.field == 'queue' && vm.trigger.channel == 'voice'"
+        class="md-block"
+      >
+        <label translate="TOOLS.QUEUE">Queue</label>
+        <md-select name="value" ng-model="vm.anyCondition.value" required>
+          <md-option
+            ng-value="value.name"
+            ng-repeat="value in vm.queues"
+            ng-disabled="value.canSelect === false"
+            >{{ value.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="anyConditionForm['value'].$error"
+          ng-show="anyConditionForm['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.QUEUE_REQUIRED"
+              >Queue field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.anyCondition.field == 'routeId' && vm.trigger.channel == 'voice'"
+        class="md-block"
+      >
+        <label translate="TOOLS.OUTBOUNDROUTE">OutboundRoute</label>
+        <md-select name="value" ng-model="vm.anyCondition.value" required>
+          <md-option
+            ng-value="value.id"
+            ng-repeat="value in vm.outboundRoutes"
+            ng-disabled="value.canSelect === false"
+            >{{ value.exten }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="anyConditionForm['value'].$error"
+          ng-show="anyConditionForm['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.OUTBOUNDROUTE_REQUIRED"
+              >OutboundRoute field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.anyCondition.field == 'agent' && vm.trigger.channel == 'voice'"
+        class="md-block"
+      >
+        <label translate="TOOLS.AGENT">Agent</label>
+        <md-select name="value" ng-model="vm.anyCondition.value" required>
+          <md-option
+            ng-value="value.name"
+            ng-repeat="value in vm.agents"
+            ng-disabled="value.canSelect === false"
+            >{{ value.fullname }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="anyConditionForm['value'].$error"
+          ng-show="anyConditionForm['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.AGENT_REQUIRED"
+              >Agent field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.anyCondition.field == 'lastevent'"
+        class="md-block"
+      >
+        <label translate="TOOLS.VALUE">Value</label>
+        <md-select name="value" ng-model="vm.anyCondition.value" required>
+          <md-option ng-value="'abandoned'">Abandon</md-option>
+          <md-option ng-value="'timeout'">Timeout</md-option>
+          <md-option ng-value="'complete'">Hangup</md-option>
+          <md-option ng-value="'rejected'">Reject</md-option>
+          <md-option ng-value="'called'">Ring</md-option>
+          <md-option ng-value="'connect'">Answer</md-option>
+          <md-option ng-value="'nosuchnumber'">NoSuchNumber</md-option>
+          <md-option ng-value="'busy'">Busy</md-option>
+          <md-option ng-value="'noanswer'">NoAnswer</md-option>
+          <md-option ng-value="'congestion'">Congestion</md-option>
+          <md-option ng-value="'agentreject'">AgentReject</md-option>
+        </md-select>
+        <div
+          ng-messages="anyConditionForm['value'].$error"
+          ng-show="anyConditionForm['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.VALUE_REQUIRED"
+              >Value field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.anyCondition.field == 'interaction' && vm.trigger.channel != 'voice'"
+        class="md-block"
+      >
+        <label translate="TOOLS.VALUE">Value</label>
+        <md-select name="value" ng-model="vm.anyCondition.value" required>
+          <md-option ng-value="'opened'">Opened</md-option>
+          <md-option ng-value="'closed'">Closed</md-option>
+        </md-select>
+        <div
+          ng-messages="anyConditionForm['value'].$error"
+          ng-show="anyConditionForm['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.VALUE_REQUIRED"
+              >Value field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.anyCondition.field == 'message' && vm.trigger.channel != 'voice'"
+        class="md-block"
+      >
+        <label translate="TOOLS.VALUE">Value</label>
+        <md-select name="value" ng-model="vm.anyCondition.value" required>
+          <md-option ng-value="'in'">Incoming</md-option>
+          <md-option ng-value="'out'">Outgoing</md-option>
+          <md-option ng-value="'accept'">Accepted</md-option>
+          <md-option ng-value="'reject'">Rejected</md-option>
+        </md-select>
+        <div
+          ng-messages="anyConditionForm['value'].$error"
+          ng-show="anyConditionForm['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.VALUE_REQUIRED"
+              >Value field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newAnyCondition"
+          ng-click="vm.saveAnyCondition()"
+          class="send-button md-accent md-raised"
+          ng-disabled="anyConditionForm.$invalid || anyConditionForm.$pristine"
+          aria-label="SAVE"
+          translate="TOOLS.SAVE"
+          translate-attr-aria-label="TOOLS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newAnyCondition"
+          ng-click="vm.addNewAnyCondition()"
+          class="send-button md-accent md-raised"
+          ng-disabled="anyConditionForm.$invalid"
+          aria-label="ADD"
+          translate="TOOLS.ADD_ANYCONDITION"
+          translate-attr-aria-label="TOOLS.ADD_ANYCONDITION"
+        >
+          ADD ANYCONDITION
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newAnyCondition"
+          ng-click="vm.deleteAnyCondition($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="TOOLS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/triggers/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/triggers/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index 4793f04..0000000
--- a/public/src/js/modules/main/apps/tools/views/triggers/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,179 +0,0 @@
-<div id="tools-trigger" class="page-layout simple tabbed" layout="column">
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-triggers-button md-icon-button"
-        aria-label="Go to triggers"
-        ng-click="vm.gotoTriggers()"
-        translate
-        translate-attr-aria-label="TOOLS.GO_TO_TRIGGERS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-      <div layout="row" layout-align="start center">
-        <div class="trigger-image" hide-xs>
-          <img ng-src="assets/images/business/triggers.jpg" />
-        </div>
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{ vm.trigger.id }}
-            <span ng-if="vm.trigger.name">{{ vm.trigger.name }}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="TOOLS.CREATED_AT"></span>
-            <span>{{ vm.trigger.createdAt | date:'medium' }}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveTrigger()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (allconditionsForm.$invalid) || (anyconditionsForm.$invalid) || (actionsForm.$invalid)"
-        translate="TOOLS.SAVE"
-        translate-attr-aria-label="TOOLS.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="TOOLS.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="trigger-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="TOOLS.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.trigger.name"
-                  required
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.CHANNEL">Channel</label>
-                <md-select
-                  name="channel"
-                  ng-model="vm.trigger.channel"
-                  required
-                  disabled
-                >
-                  <md-option ng-value="'voice'">
-                    {{ 'TOOLS.VOICE' | translate }}
-                  </md-option>
-                  <md-option
-                    ng-value="'openchannel'"
-                    ng-if="vm.license.openchannel"
-                  >
-                    {{ 'TOOLS.OPENCHANNEL' | translate }}
-                  </md-option>
-                  <md-option ng-value="'chat'" ng-if="vm.license.chat">
-                    {{ 'TOOLS.CHAT' | translate }}
-                  </md-option>
-                  <md-option ng-value="'mail'" ng-if="vm.license.mail">
-                    {{ 'TOOLS.MAIL' | translate }}
-                  </md-option>
-                  <md-option ng-value="'sms'" ng-if="vm.license.messaging">
-                    {{ 'TOOLS.SMS' | translate }}
-                  </md-option>
-                  <md-option ng-value="'fax'" ng-if="vm.license.fax">
-                    {{ 'TOOLS.FAX' | translate }}
-                  </md-option>
-                  <md-option ng-value="'whatsapp'" ng-if="vm.license.whatsapp">
-                    {{ 'TOOLS.WHATSAPP' | translate }}
-                  </md-option>
-                </md-select>
-                <div
-                  ng-messages="generalForm['channel'].$error"
-                  ng-show="generalForm['channel'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.CHANNEL_REQUIRED"
-                      >Channel field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.trigger.status"
-                  aria-label="Status"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <span translate="TOOLS.STATUS">Status</span></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.trigger.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="TOOLS.CONDITIONS&ACTIONS">CONDITIONS&ACTIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="trigger-detail-form-container allconditions md-background-bg md-whiteframe-1dp"
-            ng-include="'app/main/apps/tools/views/triggers/edit/allconditions/allconditions.html'"
-          ></div>
-          <div
-            class="trigger-detail-form-container anyconditions md-background-bg md-whiteframe-1dp"
-            ng-include="'app/main/apps/tools/views/triggers/edit/anyconditions/anyconditions.html'"
-          ></div>
-          <div
-            class="trigger-detail-form-container actions md-background-bg md-whiteframe-1dp"
-            ng-include="'app/main/apps/tools/views/triggers/edit/actions/actions.html'"
-          ></div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/tools/views/triggers/edit/view.html/view.html b/public/src/js/modules/main/apps/tools/views/triggers/edit/view.html/view.html
new file mode 100644
index 0000000..4793f04
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/triggers/edit/view.html/view.html
@@ -0,0 +1,179 @@
+<div id="tools-trigger" class="page-layout simple tabbed" layout="column">
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-triggers-button md-icon-button"
+        aria-label="Go to triggers"
+        ng-click="vm.gotoTriggers()"
+        translate
+        translate-attr-aria-label="TOOLS.GO_TO_TRIGGERS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+      <div layout="row" layout-align="start center">
+        <div class="trigger-image" hide-xs>
+          <img ng-src="assets/images/business/triggers.jpg" />
+        </div>
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{ vm.trigger.id }}
+            <span ng-if="vm.trigger.name">{{ vm.trigger.name }}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="TOOLS.CREATED_AT"></span>
+            <span>{{ vm.trigger.createdAt | date:'medium' }}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveTrigger()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (allconditionsForm.$invalid) || (anyconditionsForm.$invalid) || (actionsForm.$invalid)"
+        translate="TOOLS.SAVE"
+        translate-attr-aria-label="TOOLS.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="TOOLS.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="trigger-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="TOOLS.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.trigger.name"
+                  required
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.CHANNEL">Channel</label>
+                <md-select
+                  name="channel"
+                  ng-model="vm.trigger.channel"
+                  required
+                  disabled
+                >
+                  <md-option ng-value="'voice'">
+                    {{ 'TOOLS.VOICE' | translate }}
+                  </md-option>
+                  <md-option
+                    ng-value="'openchannel'"
+                    ng-if="vm.license.openchannel"
+                  >
+                    {{ 'TOOLS.OPENCHANNEL' | translate }}
+                  </md-option>
+                  <md-option ng-value="'chat'" ng-if="vm.license.chat">
+                    {{ 'TOOLS.CHAT' | translate }}
+                  </md-option>
+                  <md-option ng-value="'mail'" ng-if="vm.license.mail">
+                    {{ 'TOOLS.MAIL' | translate }}
+                  </md-option>
+                  <md-option ng-value="'sms'" ng-if="vm.license.messaging">
+                    {{ 'TOOLS.SMS' | translate }}
+                  </md-option>
+                  <md-option ng-value="'fax'" ng-if="vm.license.fax">
+                    {{ 'TOOLS.FAX' | translate }}
+                  </md-option>
+                  <md-option ng-value="'whatsapp'" ng-if="vm.license.whatsapp">
+                    {{ 'TOOLS.WHATSAPP' | translate }}
+                  </md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['channel'].$error"
+                  ng-show="generalForm['channel'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.CHANNEL_REQUIRED"
+                      >Channel field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.trigger.status"
+                  aria-label="Status"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <span translate="TOOLS.STATUS">Status</span></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.trigger.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="TOOLS.CONDITIONS&ACTIONS">CONDITIONS&ACTIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="trigger-detail-form-container allconditions md-background-bg md-whiteframe-1dp"
+            ng-include="'app/main/apps/tools/views/triggers/edit/allconditions/allconditions.html'"
+          ></div>
+          <div
+            class="trigger-detail-form-container anyconditions md-background-bg md-whiteframe-1dp"
+            ng-include="'app/main/apps/tools/views/triggers/edit/anyconditions/anyconditions.html'"
+          ></div>
+          <div
+            class="trigger-detail-form-container actions md-background-bg md-whiteframe-1dp"
+            ng-include="'app/main/apps/tools/views/triggers/edit/actions/actions.html'"
+          ></div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/tools/views/triggers/triggers.html/triggers-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/triggers/triggers.html/triggers-[chunkhash].html
deleted file mode 100644
index 11ffc6e..0000000
--- a/public/src/js/modules/main/apps/tools/views/triggers/triggers.html/triggers-[chunkhash].html
+++ /dev/null
@@ -1,279 +0,0 @@
-<div id="triggers" class="page-layout simple left-sidenav inner-sidenav">
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-auto-fix" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="TOOLS.TRIGGERS">Triggers</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="TOOLS.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedTriggers.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedTriggers =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="TOOLS.BACK">Back</span>
-      </md-button>
-    </div>
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-triggers-count">
-          <span>{{ vm.selectedTriggers.length }}</span>
-          <span translate="TOOLS.SELECTED">Selected</span>
-        </span>
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdOpenMenu($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="TOOLS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllTriggers()"
-                translate="TOOLS.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectTriggers()"
-                translate="TOOLS.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedTriggers"
-          csv-label="true"
-          filename="triggers.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedTriggers($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="TOOLS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- TRIGGER TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedTriggers"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getTriggers"
-            >
-              <tr md-row>
-                <th md-column md-order-by="id">{{ 'TOOLS.ID' | translate }}</th>
-                <th md-column md-order-by="name">
-                  {{ 'TOOLS.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="channel">
-                  {{ 'TOOLS.CHANNEL' | translate }}
-                </th>
-                <th md-column md-order-by="status">
-                  {{ 'TOOLS.STATUS' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'TOOLS.DESCRIPTION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.triggers.rows.length">
-                <td md-cell colspan="6">
-                  <div layout="row" layout-align="center center">
-                    <span translate="TOOLS.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="trigger"
-                md-select-id="id"
-                ng-repeat="trigger in vm.triggers.rows"
-              >
-                <td
-                  ng-click="vm.createOrEditTrigger($event, trigger)"
-                  md-cell
-                  class="id"
-                >
-                  {{ trigger.id }}
-                </td>
-                <td
-                  ng-click="vm.createOrEditTrigger($event, trigger)"
-                  md-cell
-                  class="name"
-                >
-                  {{ trigger.name }}
-                </td>
-                <td
-                  ng-click="vm.createOrEditTrigger($event, trigger)"
-                  md-cell
-                  class="channel"
-                >
-                  {{ 'TOOLS.' + trigger.channel | uppercase | translate }}
-                </td>
-                <td
-                  ng-click="vm.createOrEditTrigger($event, trigger)"
-                  md-cell
-                  class="status"
-                >
-                  <md-icon
-                    md-colors="{color: {{ trigger.status ? '\'green\'' : '\'grey\'' }}}"
-                    md-font-icon="{{ trigger.status ? 'icon-check' : 'icon-close' }}"
-                  ></md-icon>
-                </td>
-                <td
-                  ng-click="vm.createOrEditTrigger($event, trigger)"
-                  md-cell
-                  class="description"
-                >
-                  {{ trigger.description }}
-                </td>
-                <td
-                  md-cell
-                  class="actions"
-                  ng-if="!vm.crudPermissions.readOnly"
-                >
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="TOOLS.MORE"
-                      ng-click="$mdOpenMenu($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-                      <!-- ACTIONS -->
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.goToEditState(trigger)"
-                          translate="TOOLS.EDIT_TRIGGER"
-                        >
-                          Edit Trigger
-                        </md-button>
-                      </md-menu-item>
-                      <!-- SUBACTIONS -->
-                      <!-- ACTIONS -->
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(trigger, $event)"
-                          translate="TOOLS.DELETE_TRIGGER"
-                        >
-                          Delete Trigger
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-        <md-table-pagination
-          md-label="{page: '{{ 'TOOLS.PAGE' | translate }}:', rowsPerPage: '{{ 'TOOLS.ROWSPERPAGE' | translate }}:', of: '{{ 'TOOLS.OF' | translate }}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{ vm.triggers.count }}"
-          md-on-paginate="vm.getTriggers"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / TRIGGER TABLE -->
-      <!-- NO RESULTS -->
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-  <!-- ADD TRIGGER BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent"
-    id="add-trigger-button"
-    ng-click="vm.createOrEditTrigger($event)"
-    aria-label="add trigger"
-    translate
-    translate-attr-aria-label="TOOLS.ADD_TRIGGER"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD TRIGGER BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/tools/views/triggers/triggers.html/triggers.html b/public/src/js/modules/main/apps/tools/views/triggers/triggers.html/triggers.html
new file mode 100644
index 0000000..11ffc6e
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/triggers/triggers.html/triggers.html
@@ -0,0 +1,279 @@
+<div id="triggers" class="page-layout simple left-sidenav inner-sidenav">
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-auto-fix" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="TOOLS.TRIGGERS">Triggers</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="TOOLS.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedTriggers.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedTriggers =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="TOOLS.BACK">Back</span>
+      </md-button>
+    </div>
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-triggers-count">
+          <span>{{ vm.selectedTriggers.length }}</span>
+          <span translate="TOOLS.SELECTED">Selected</span>
+        </span>
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdOpenMenu($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="TOOLS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllTriggers()"
+                translate="TOOLS.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectTriggers()"
+                translate="TOOLS.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedTriggers"
+          csv-label="true"
+          filename="triggers.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedTriggers($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="TOOLS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- TRIGGER TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedTriggers"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getTriggers"
+            >
+              <tr md-row>
+                <th md-column md-order-by="id">{{ 'TOOLS.ID' | translate }}</th>
+                <th md-column md-order-by="name">
+                  {{ 'TOOLS.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="channel">
+                  {{ 'TOOLS.CHANNEL' | translate }}
+                </th>
+                <th md-column md-order-by="status">
+                  {{ 'TOOLS.STATUS' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'TOOLS.DESCRIPTION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.triggers.rows.length">
+                <td md-cell colspan="6">
+                  <div layout="row" layout-align="center center">
+                    <span translate="TOOLS.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="trigger"
+                md-select-id="id"
+                ng-repeat="trigger in vm.triggers.rows"
+              >
+                <td
+                  ng-click="vm.createOrEditTrigger($event, trigger)"
+                  md-cell
+                  class="id"
+                >
+                  {{ trigger.id }}
+                </td>
+                <td
+                  ng-click="vm.createOrEditTrigger($event, trigger)"
+                  md-cell
+                  class="name"
+                >
+                  {{ trigger.name }}
+                </td>
+                <td
+                  ng-click="vm.createOrEditTrigger($event, trigger)"
+                  md-cell
+                  class="channel"
+                >
+                  {{ 'TOOLS.' + trigger.channel | uppercase | translate }}
+                </td>
+                <td
+                  ng-click="vm.createOrEditTrigger($event, trigger)"
+                  md-cell
+                  class="status"
+                >
+                  <md-icon
+                    md-colors="{color: {{ trigger.status ? '\'green\'' : '\'grey\'' }}}"
+                    md-font-icon="{{ trigger.status ? 'icon-check' : 'icon-close' }}"
+                  ></md-icon>
+                </td>
+                <td
+                  ng-click="vm.createOrEditTrigger($event, trigger)"
+                  md-cell
+                  class="description"
+                >
+                  {{ trigger.description }}
+                </td>
+                <td
+                  md-cell
+                  class="actions"
+                  ng-if="!vm.crudPermissions.readOnly"
+                >
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="TOOLS.MORE"
+                      ng-click="$mdOpenMenu($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+                      <!-- ACTIONS -->
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.goToEditState(trigger)"
+                          translate="TOOLS.EDIT_TRIGGER"
+                        >
+                          Edit Trigger
+                        </md-button>
+                      </md-menu-item>
+                      <!-- SUBACTIONS -->
+                      <!-- ACTIONS -->
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(trigger, $event)"
+                          translate="TOOLS.DELETE_TRIGGER"
+                        >
+                          Delete Trigger
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+        <md-table-pagination
+          md-label="{page: '{{ 'TOOLS.PAGE' | translate }}:', rowsPerPage: '{{ 'TOOLS.ROWSPERPAGE' | translate }}:', of: '{{ 'TOOLS.OF' | translate }}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{ vm.triggers.count }}"
+          md-on-paginate="vm.getTriggers"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / TRIGGER TABLE -->
+      <!-- NO RESULTS -->
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+  <!-- ADD TRIGGER BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent"
+    id="add-trigger-button"
+    ng-click="vm.createOrEditTrigger($event)"
+    aria-label="add trigger"
+    translate
+    translate-attr-aria-label="TOOLS.ADD_TRIGGER"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD TRIGGER BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/tools/views/trunks/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/trunks/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 0b1efc5..0000000
--- a/public/src/js/modules/main/apps/tools/views/trunks/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,246 +0,0 @@
-<md-dialog class="trunk-dialog" aria-label="New Trunk">
-  <form name="trunkForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.trunk.name"
-          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.newTrunk"
-        />
-
-        <div class="hint"><span translate="TOOLS.HELP.NAME"></span></div>
-        <div
-          ng-messages="trunkForm['name'].$error"
-          ng-show="trunkForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span
-              translate="TOOLS.ERRORS.NAME_MUST_VALID_PATTERN"
-              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-              >Name must be valid pattern
-            </span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <md-switch ng-model="vm.trunk.active" aria-label="active"
-          ><span translate="TOOLS.ACTIVE">active</span></md-switch
-        >
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.HOST">host</label>
-        <input
-          type="text"
-          name="host"
-          ng-model="vm.trunk.host"
-          ng-required="true"
-        />
-
-        <div class="hint"><span translate="TOOLS.HELP.HOST"></span></div>
-        <div
-          ng-messages="trunkForm['host'].$error"
-          ng-show="trunkForm['host'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.HOST_REQUIRED"
-              >host field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.SECRET">secret</label>
-        <input
-          type="password"
-          name="secret"
-          ng-model="vm.trunk.secret"
-          placeholder="Password"
-          translate
-          translate-attr-placeholder="TOOLS.PASSWORD"
-        />
-        <div class="hint"><span translate="TOOLS.HELP.SECRET"></span></div>
-        <div ng-messages="trunkForm['secret'].$error" role="alert">
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.PASSWORD_REQUIRED"
-              >Password field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span translate="TOOLS.ERRORS.SECURE_PASSWORD_PATTERN"
-              >Must contain at least 8 characters, with a minimum of 1 lowercase
-              letter, 1 uppercase letter, 1 numeric character and 1 special
-              character ~!?*@#$%^&-_=+[{]}.</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <md-input-container class="md-block">
-        <label translate="TOOLS.DEFAULTUSER">defaultuser</label>
-        <input type="text" name="defaultuser" ng-model="vm.trunk.defaultuser" />
-
-        <div class="hint"><span translate="TOOLS.HELP.DEFAULTUSER"></span></div>
-        <div
-          ng-messages="trunkForm['defaultuser'].$error"
-          ng-show="trunkForm['defaultuser'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.DEFAULTUSER_REQUIRED"
-              >defaultuser field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.REGISTRY">registry</label>
-        <input type="text" name="registry" ng-model="vm.trunk.registry" />
-
-        <div class="hint"><span translate="TOOLS.HELP.REGISTRY"></span></div>
-        <div
-          ng-messages="trunkForm['registry'].$error"
-          ng-show="trunkForm['registry'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.REGISTRY_REQUIRED"
-              >registry field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.DESCRIPTION">Description</label>
-        <input type="text" name="description" ng-model="vm.trunk.description" />
-
-        <div
-          ng-messages="trunkForm['description'].$error"
-          ng-show="trunkForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newTrunk"
-          ng-click="vm.saveTrunk()"
-          class="send-button md-accent md-raised"
-          ng-disabled="trunkForm.$invalid || trunkForm.$pristine"
-          aria-label="SAVE"
-          translate="TOOLS.SAVE"
-          translate-attr-aria-label="TOOLS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newTrunk"
-          ng-click="vm.addNewTrunk()"
-          class="send-button md-accent md-raised"
-          ng-disabled="trunkForm.$invalid"
-          aria-label="ADD"
-          translate="TOOLS.ADD_TRUNK"
-          translate-attr-aria-label="TOOLS.ADD_TRUNK"
-        >
-          ADD TRUNK
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newTrunk"
-          ng-click="vm.deleteTrunk($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="TOOLS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/trunks/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/tools/views/trunks/create/dialog.html/dialog.html
new file mode 100644
index 0000000..0b1efc5
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/trunks/create/dialog.html/dialog.html
@@ -0,0 +1,246 @@
+<md-dialog class="trunk-dialog" aria-label="New Trunk">
+  <form name="trunkForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.trunk.name"
+          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.newTrunk"
+        />
+
+        <div class="hint"><span translate="TOOLS.HELP.NAME"></span></div>
+        <div
+          ng-messages="trunkForm['name'].$error"
+          ng-show="trunkForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span
+              translate="TOOLS.ERRORS.NAME_MUST_VALID_PATTERN"
+              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+              >Name must be valid pattern
+            </span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <md-switch ng-model="vm.trunk.active" aria-label="active"
+          ><span translate="TOOLS.ACTIVE">active</span></md-switch
+        >
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.HOST">host</label>
+        <input
+          type="text"
+          name="host"
+          ng-model="vm.trunk.host"
+          ng-required="true"
+        />
+
+        <div class="hint"><span translate="TOOLS.HELP.HOST"></span></div>
+        <div
+          ng-messages="trunkForm['host'].$error"
+          ng-show="trunkForm['host'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.HOST_REQUIRED"
+              >host field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.SECRET">secret</label>
+        <input
+          type="password"
+          name="secret"
+          ng-model="vm.trunk.secret"
+          placeholder="Password"
+          translate
+          translate-attr-placeholder="TOOLS.PASSWORD"
+        />
+        <div class="hint"><span translate="TOOLS.HELP.SECRET"></span></div>
+        <div ng-messages="trunkForm['secret'].$error" role="alert">
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.PASSWORD_REQUIRED"
+              >Password field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span translate="TOOLS.ERRORS.SECURE_PASSWORD_PATTERN"
+              >Must contain at least 8 characters, with a minimum of 1 lowercase
+              letter, 1 uppercase letter, 1 numeric character and 1 special
+              character ~!?*@#$%^&-_=+[{]}.</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <md-input-container class="md-block">
+        <label translate="TOOLS.DEFAULTUSER">defaultuser</label>
+        <input type="text" name="defaultuser" ng-model="vm.trunk.defaultuser" />
+
+        <div class="hint"><span translate="TOOLS.HELP.DEFAULTUSER"></span></div>
+        <div
+          ng-messages="trunkForm['defaultuser'].$error"
+          ng-show="trunkForm['defaultuser'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.DEFAULTUSER_REQUIRED"
+              >defaultuser field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.REGISTRY">registry</label>
+        <input type="text" name="registry" ng-model="vm.trunk.registry" />
+
+        <div class="hint"><span translate="TOOLS.HELP.REGISTRY"></span></div>
+        <div
+          ng-messages="trunkForm['registry'].$error"
+          ng-show="trunkForm['registry'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.REGISTRY_REQUIRED"
+              >registry field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.DESCRIPTION">Description</label>
+        <input type="text" name="description" ng-model="vm.trunk.description" />
+
+        <div
+          ng-messages="trunkForm['description'].$error"
+          ng-show="trunkForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newTrunk"
+          ng-click="vm.saveTrunk()"
+          class="send-button md-accent md-raised"
+          ng-disabled="trunkForm.$invalid || trunkForm.$pristine"
+          aria-label="SAVE"
+          translate="TOOLS.SAVE"
+          translate-attr-aria-label="TOOLS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newTrunk"
+          ng-click="vm.addNewTrunk()"
+          class="send-button md-accent md-raised"
+          ng-disabled="trunkForm.$invalid"
+          aria-label="ADD"
+          translate="TOOLS.ADD_TRUNK"
+          translate-attr-aria-label="TOOLS.ADD_TRUNK"
+        >
+          ADD TRUNK
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newTrunk"
+          ng-click="vm.deleteTrunk($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="TOOLS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/trunks/edit/clone/clone.html/clone-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/trunks/edit/clone/clone.html/clone-[chunkhash].html
deleted file mode 100644
index 136bb10..0000000
--- a/public/src/js/modules/main/apps/tools/views/trunks/edit/clone/clone.html/clone-[chunkhash].html
+++ /dev/null
@@ -1,114 +0,0 @@
-<md-dialog class="trunk-dialog" aria-label="Clone Trunk">
-  <form name="trunkForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.trunk.name"
-          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.newTrunk"
-        />
-
-        <div class="hint"><span translate="TOOLS.HELP.NAME"></span></div>
-        <div
-          ng-messages="trunkForm['name'].$error"
-          ng-show="trunkForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span
-              translate="TOOLS.ERRORS.NAME_MUST_VALID_PATTERN"
-              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-              >Name must be valid pattern
-            </span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <md-switch ng-model="vm.trunk.active" aria-label="active"
-          ><span translate="TOOLS.ACTIVE">active</span></md-switch
-        >
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <md-button
-        type="submit"
-        ng-click="vm.cloneTrunk()"
-        class="send-button md-accent md-raised"
-        ng-disabled="trunkForm.$invalid"
-        aria-label="CLONE"
-        translate="TOOLS.CLONE_TRUNK"
-        translate-attr-aria-label="TOOLS.CLONE_TRUNK"
-      >
-        CLONE TRUNK
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/trunks/edit/clone/clone.html/clone.html b/public/src/js/modules/main/apps/tools/views/trunks/edit/clone/clone.html/clone.html
new file mode 100644
index 0000000..136bb10
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/trunks/edit/clone/clone.html/clone.html
@@ -0,0 +1,114 @@
+<md-dialog class="trunk-dialog" aria-label="Clone Trunk">
+  <form name="trunkForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.trunk.name"
+          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.newTrunk"
+        />
+
+        <div class="hint"><span translate="TOOLS.HELP.NAME"></span></div>
+        <div
+          ng-messages="trunkForm['name'].$error"
+          ng-show="trunkForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span
+              translate="TOOLS.ERRORS.NAME_MUST_VALID_PATTERN"
+              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+              >Name must be valid pattern
+            </span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <md-switch ng-model="vm.trunk.active" aria-label="active"
+          ><span translate="TOOLS.ACTIVE">active</span></md-switch
+        >
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <md-button
+        type="submit"
+        ng-click="vm.cloneTrunk()"
+        class="send-button md-accent md-raised"
+        ng-disabled="trunkForm.$invalid"
+        aria-label="CLONE"
+        translate="TOOLS.CLONE_TRUNK"
+        translate-attr-aria-label="TOOLS.CLONE_TRUNK"
+      >
+        CLONE TRUNK
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/trunks/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/trunks/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index 286c122..0000000
--- a/public/src/js/modules/main/apps/tools/views/trunks/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,942 +0,0 @@
-<div id="tools-trunk" class="page-layout simple tabbed" layout="column">
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-trunks-button md-icon-button"
-        aria-label="Go to trunks"
-        ng-click="vm.gotoTrunks()"
-        translate
-        translate-attr-aria-label="TOOLS.GO_TO_TRUNKS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="trunk-image" hide-xs>
-          <img ng-src="assets/images/business/trunks.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.trunk.id}}
-            <span ng-if="vm.trunk.name">{{vm.trunk.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="TOOLS.CREATED_AT"></span>
-            <span>{{vm.trunk.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.gotogoto(vm.trunk, $event)"
-        class="md-fab md-warn md-icon-button"
-        aria-label="goto"
-      >
-        <md-tooltip><span translate="TOOLS.GOTO_TRUNK"></span></md-tooltip>
-        <md-icon md-font-icon="icon-cast"></md-icon>
-      </md-button>
-    </div>
-
-    <div ng-cloak ng-if="vm.crudPermissions.canEdit">
-      <md-button
-        ng-click="vm.clonedialog(vm.trunk, $event)"
-        class="md-fab md-green-500-bg md-icon-button"
-        aria-label="clone"
-      >
-        <md-tooltip><span translate="TOOLS.CLONE_TRUNK"></span></md-tooltip>
-        <md-icon md-font-icon="icon-content-duplicate"></md-icon>
-      </md-button>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveTrunk()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (advancedForm.$invalid) || (otherFieldsForm.$invalid)"
-        translate="TOOLS.SAVE"
-        translate-attr-aria-label="TOOLS.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="TOOLS.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="trunk-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="TOOLS.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.trunk.name"
-                  ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-                  ng-required="true"
-                  autofocus
-                  disabled
-                />
-
-                <div class="hint">
-                  <span translate="TOOLS.HELP.NAME"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                  <div ng-message="pattern">
-                    <span
-                      translate="TOOLS.ERRORS.NAME_MUST_VALID_PATTERN"
-                      translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-                      >Name must be valid pattern
-                    </span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.trunk.active"
-                  aria-label="active"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="TOOLS.ACTIVE">active</span></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.HOST">host</label>
-                <input
-                  type="text"
-                  name="host"
-                  ng-model="vm.trunk.host"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="TOOLS.HELP.HOST"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['host'].$error"
-                  ng-show="generalForm['host'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.HOST_REQUIRED"
-                      >host field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.SECRET">secret</label>
-                <input
-                  type="password"
-                  name="secret"
-                  ng-model="vm.trunk.secret"
-                  placeholder="Password"
-                  translate
-                  translate-attr-placeholder="TOOLS.PASSWORD"
-                />
-                <div class="hint">
-                  <span translate="TOOLS.HELP.SECRET"></span>
-                </div>
-                <div ng-messages="generalForm['secret'].$error" role="alert">
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.PASSWORD_REQUIRED"
-                      >Password field is required</span
-                    >
-                  </div>
-                  <div ng-message="pattern">
-                    <span translate="TOOLS.ERRORS.SECURE_PASSWORD_PATTERN"
-                      >Must contain at least 8 characters, with a minimum of 1
-                      lowercase letter, 1 uppercase letter, 1 numeric character
-                      and 1 special character ~!?*@#$%^&-_=+[{]}.</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-
-              <md-input-container class="md-block">
-                <label translate="TOOLS.DEFAULTUSER">defaultuser</label>
-                <input
-                  type="text"
-                  name="defaultuser"
-                  ng-model="vm.trunk.defaultuser"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="TOOLS.HELP.DEFAULTUSER"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['defaultuser'].$error"
-                  ng-show="generalForm['defaultuser'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.DEFAULTUSER_REQUIRED"
-                      >defaultuser field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.CONTEXT">context</label>
-                <md-select
-                  name="context"
-                  ng-model="vm.trunk.context"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="context.name"
-                    ng-repeat="context in vm.contexts"
-                    ng-disabled="context.canSelect === false"
-                    >{{ context.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span translate="TOOLS.HELP.CONTEXT"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['context'].$error"
-                  ng-show="generalForm['context'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.CONTEXT_REQUIRED"
-                      >context field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.CALLERID">callerid</label>
-                <input
-                  type="text"
-                  name="callerid"
-                  ng-model="vm.trunk.callerid"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="TOOLS.HELP.CALLERID"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['callerid'].$error"
-                  ng-show="generalForm['callerid'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.CALLERID_REQUIRED"
-                      >callerid field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.TYPE">Type</label>
-                <md-select
-                  name="type"
-                  ng-model="vm.trunk.type"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'friend'">Friend</md-option>
-                  <md-option ng-value="'user'">User</md-option>
-                  <md-option ng-value="'peer'">Peer</md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="TOOLS.HELP.TYPE"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['type'].$error"
-                  ng-show="generalForm['type'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.TYPE_REQUIRED"
-                      >Type field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.DTMFMODE">dtmfmode</label>
-                <md-select
-                  name="dtmfmode"
-                  ng-model="vm.trunk.dtmfmode"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'rfc2833'">rfc2833</md-option>
-                  <md-option ng-value="'info'">info</md-option>
-                  <md-option ng-value="'shortinfo'">shortinfo</md-option>
-                  <md-option ng-value="'inband'">inband</md-option>
-                  <md-option ng-value="'auto'">auto</md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="TOOLS.HELP.DTMFMODE"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['dtmfmode'].$error"
-                  ng-show="generalForm['dtmfmode'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.DTMFMODE_REQUIRED"
-                      >dtmfmode field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.NAT">nat</label>
-                <md-select
-                  name="nat"
-                  ng-model="vm.trunk.nat"
-                  multiple
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'force_rport'">force_rport</md-option>
-                  <md-option ng-value="'comedia'">comedia</md-option>
-                  <md-option ng-value="'yes'">yes</md-option>
-                  <md-option ng-value="'no'">no</md-option>
-                  <md-option ng-value="'never'">never</md-option>
-                  <md-option ng-value="'route'">route</md-option>
-                </md-select>
-                <div class="hint"><span translate="TOOLS.HELP.NAT"></span></div>
-                <div
-                  ng-messages="generalForm['nat'].$error"
-                  ng-show="generalForm['nat'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.NAT_REQUIRED"
-                      >nat field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.QUALIFY">qualify</label>
-                <md-select
-                  name="qualify"
-                  ng-model="vm.trunk.qualify"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">
-                    {{ 'TOOLS.YES' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'no'">
-                    {{ 'TOOLS.NO' | translate }}
-                  </md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="TOOLS.HELP.QUALIFY"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['qualify'].$error"
-                  ng-show="generalForm['qualify'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.QUALIFY_REQUIRED"
-                      >qualify field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.ALLOWCODECS">AllowCodecs</label>
-                <md-select
-                  name="allow"
-                  ng-model="vm.trunk.allow"
-                  multiple
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'ulaw'">ulaw</md-option>
-                  <md-option ng-value="'alaw'">alaw</md-option>
-                  <md-option ng-value="'gsm'">gsm</md-option>
-                  <md-option ng-value="'g723'">g723</md-option>
-                  <md-option ng-value="'g726'">g726</md-option>
-                  <md-option ng-value="'g722'">g722</md-option>
-                  <md-option ng-value="'g729'">g729</md-option>
-                  <md-option ng-value="'ilbc'">ilbc</md-option>
-                  <md-option ng-value="'opus'">opus</md-option>
-                  <md-option ng-value="'h264'">h264</md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="TOOLS.HELP.ALLOWCODECS"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['allow'].$error"
-                  ng-show="generalForm['allow'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.ALLOWCODECS_REQUIRED"
-                      >AllowCodecs field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.INSECURE">insecure</label>
-                <md-select
-                  name="insecure"
-                  ng-model="vm.trunk.insecure"
-                  multiple
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'port'">port</md-option>
-                  <md-option ng-value="'invite'">invite</md-option>
-                  <md-option ng-value="'very'">very</md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="TOOLS.HELP.INSECURE"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['insecure'].$error"
-                  ng-show="generalForm['insecure'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.INSECURE_REQUIRED"
-                      >insecure field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.CALL_LIMIT">call_limit</label>
-                <input
-                  type="number"
-                  name="call_limit"
-                  ng-model="vm.trunk.call_limit"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="TOOLS.HELP.CALL_LIMIT"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['call_limit'].$error"
-                  ng-show="generalForm['call_limit'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.CALL_LIMIT_REQUIRED"
-                      >call_limit field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.trunk.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="TOOLS.ADVANCED">ADVANCED</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="trunk-detail-form-container advanced md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="TOOLS.ADVANCED">
-                ADVANCED
-              </div>
-            </div>
-            <form name="advancedForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.REGISTRY">registry</label>
-                <input
-                  type="text"
-                  name="registry"
-                  ng-model="vm.trunk.registry"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="TOOLS.HELP.REGISTRY"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['registry'].$error"
-                  ng-show="advancedForm['registry'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.REGISTRY_REQUIRED"
-                      >registry field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.DIRECTMEDIA">directmedia</label>
-                <md-select
-                  name="directmedia"
-                  ng-model="vm.trunk.directmedia"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">yes</md-option>
-                  <md-option ng-value="'no'">no</md-option>
-                  <md-option ng-value="'nonat'">nonat</md-option>
-                  <md-option ng-value="'update'">update</md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="TOOLS.HELP.DIRECTMEDIA"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['directmedia'].$error"
-                  ng-show="advancedForm['directmedia'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.DIRECTMEDIA_REQUIRED"
-                      >directmedia field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.CALLCOUNTER">callcounter</label>
-                <md-select
-                  name="callcounter"
-                  ng-model="vm.trunk.callcounter"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">
-                    {{ 'TOOLS.YES' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'no'">
-                    {{ 'TOOLS.NO' | translate }}
-                  </md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="TOOLS.HELP.CALLCOUNTER"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['callcounter'].$error"
-                  ng-show="advancedForm['callcounter'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.CALLCOUNTER_REQUIRED"
-                      >callcounter field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.FROMDOMAIN">fromdomain</label>
-                <input
-                  type="text"
-                  name="fromdomain"
-                  ng-model="vm.trunk.fromdomain"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="TOOLS.HELP.FROMDOMAIN"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['fromdomain'].$error"
-                  ng-show="advancedForm['fromdomain'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.FROMDOMAIN_REQUIRED"
-                      >fromdomain field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.FROMUSER">fromuser</label>
-                <input
-                  type="text"
-                  name="fromuser"
-                  ng-model="vm.trunk.fromuser"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="TOOLS.HELP.FROMUSER"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['fromuser'].$error"
-                  ng-show="advancedForm['fromuser'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.FROMUSER_REQUIRED"
-                      >fromuser field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.OUTBOUNDPROXY">outboundproxy</label>
-                <input
-                  type="text"
-                  name="outboundproxy"
-                  ng-model="vm.trunk.outboundproxy"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="TOOLS.HELP.OUTBOUNDPROXY"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['outboundproxy'].$error"
-                  ng-show="advancedForm['outboundproxy'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.OUTBOUNDPROXY_REQUIRED"
-                      >outboundproxy field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.ADD_PHONE_TO_URI"
-                  >Add_phone_to_URI</label
-                >
-                <md-select
-                  name="usereqphone"
-                  ng-model="vm.trunk.usereqphone"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">
-                    {{ 'TOOLS.YES' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'no'">
-                    {{ 'TOOLS.NO' | translate }}
-                  </md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="TOOLS.HELP.ADD_PHONE_TO_URI"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['usereqphone'].$error"
-                  ng-show="advancedForm['usereqphone'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.ADD_PHONE_TO_URI_REQUIRED"
-                      >Add_phone_to_URI field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.TRUST_REMOTE_PARTY_ID"
-                  >Trust_Remote_Party_ID</label
-                >
-                <md-select
-                  name="trustrpid"
-                  ng-model="vm.trunk.trustrpid"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">
-                    {{ 'TOOLS.YES' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'no'">
-                    {{ 'TOOLS.NO' | translate }}
-                  </md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="TOOLS.HELP.TRUST_REMOTE_PARTY_ID"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['trustrpid'].$error"
-                  ng-show="advancedForm['trustrpid'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="TOOLS.ERRORS.TRUST_REMOTE_PARTY_ID_REQUIRED"
-                      >Trust_Remote_Party_ID field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.SEND_REMOTE_PARTY_ID_HEADER"
-                  >Send_Remote_Party_ID_header</label
-                >
-                <md-select
-                  name="sendrpid"
-                  ng-model="vm.trunk.sendrpid"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">
-                    {{ 'TOOLS.YES' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'no'">
-                    {{ 'TOOLS.NO' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'pai'">
-                    {{ 'TOOLS.PAI' | translate }}
-                  </md-option>
-                </md-select>
-                <div class="hint">
-                  <span
-                    translate="TOOLS.HELP.SEND_REMOTE_PARTY_ID_HEADER"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['sendrpid'].$error"
-                  ng-show="advancedForm['sendrpid'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="TOOLS.ERRORS.SEND_REMOTE_PARTY_ID_HEADER_REQUIRED"
-                      >Send_Remote_Party_ID_header field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.ENCRYPTION">encryption</label>
-                <md-select
-                  name="encryption"
-                  ng-model="vm.trunk.encryption"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">
-                    {{ 'TOOLS.YES' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'no'">
-                    {{ 'TOOLS.NO' | translate }}
-                  </md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="TOOLS.HELP.ENCRYPTION"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['encryption'].$error"
-                  ng-show="advancedForm['encryption'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.ENCRYPTION_REQUIRED"
-                      >encryption field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.PORT">port</label>
-                <input
-                  type="number"
-                  name="port"
-                  ng-model="vm.trunk.port"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="TOOLS.HELP.PORT"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['port'].$error"
-                  ng-show="advancedForm['port'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.PORT_REQUIRED"
-                      >port field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.TRANSPORT">Transport</label>
-                <md-select
-                  name="transport"
-                  ng-model="vm.trunk.transport"
-                  multiple
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'udp'">udp</md-option>
-                  <md-option ng-value="'tcp'">tcp</md-option>
-                  <md-option ng-value="'ws'">ws</md-option>
-                  <md-option ng-value="'wss'">wss</md-option>
-                  <md-option ng-value="'tls'">tls</md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="TOOLS.HELP.TRANSPORT"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['transport'].$error"
-                  ng-show="advancedForm['transport'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.TRANSPORT_REQUIRED"
-                      >Transport field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.T38PT_UDPTL">t38pt_udptl</label>
-                <input
-                  type="string"
-                  name="t38pt_udptl"
-                  ng-model="vm.trunk.t38pt_udptl"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="TOOLS.HELP.T38PT_UDPTL"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['t38pt_udptl'].$error"
-                  ng-show="advancedForm['t38pt_udptl'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.T38PT_UDPTL_REQUIRED"
-                      >t38pt_udptl field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.VIDEOSUPPORT">Videosupport</label>
-                <md-select
-                  name="videosupport"
-                  ng-model="vm.trunk.videosupport"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">Yes</md-option>
-                  <md-option ng-value="'no'">No</md-option>
-                  <md-option ng-value="'always'">Always</md-option>
-                </md-select>
-                <div
-                  ng-messages="advancedForm['videosupport'].$error"
-                  ng-show="advancedForm['videosupport'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="TOOLS.ERRORS.VIDEOSUPPORT_REQUIRED"
-                      >Videosupport field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="TOOLS.OTHERFIELDS">OTHERFIELDS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="trunk-detail-form-container otherfields md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="TOOLS.OTHERFIELDS">
-                OTHERFIELDS
-              </div>
-            </div>
-            <form name="otherFieldsForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="TOOLS.OTHERFIELDS">otherFields</label>
-                <textarea
-                  name="otherFields"
-                  ng-model="vm.trunk.otherFields"
-                  autofocus
-                ></textarea>
-                <div class="hint">
-                  <span translate="TOOLS.HELP.OTHERFIELDS"></span>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/tools/views/trunks/edit/view.html/view.html b/public/src/js/modules/main/apps/tools/views/trunks/edit/view.html/view.html
new file mode 100644
index 0000000..286c122
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/trunks/edit/view.html/view.html
@@ -0,0 +1,942 @@
+<div id="tools-trunk" class="page-layout simple tabbed" layout="column">
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-trunks-button md-icon-button"
+        aria-label="Go to trunks"
+        ng-click="vm.gotoTrunks()"
+        translate
+        translate-attr-aria-label="TOOLS.GO_TO_TRUNKS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="trunk-image" hide-xs>
+          <img ng-src="assets/images/business/trunks.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.trunk.id}}
+            <span ng-if="vm.trunk.name">{{vm.trunk.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="TOOLS.CREATED_AT"></span>
+            <span>{{vm.trunk.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.gotogoto(vm.trunk, $event)"
+        class="md-fab md-warn md-icon-button"
+        aria-label="goto"
+      >
+        <md-tooltip><span translate="TOOLS.GOTO_TRUNK"></span></md-tooltip>
+        <md-icon md-font-icon="icon-cast"></md-icon>
+      </md-button>
+    </div>
+
+    <div ng-cloak ng-if="vm.crudPermissions.canEdit">
+      <md-button
+        ng-click="vm.clonedialog(vm.trunk, $event)"
+        class="md-fab md-green-500-bg md-icon-button"
+        aria-label="clone"
+      >
+        <md-tooltip><span translate="TOOLS.CLONE_TRUNK"></span></md-tooltip>
+        <md-icon md-font-icon="icon-content-duplicate"></md-icon>
+      </md-button>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveTrunk()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (advancedForm.$invalid) || (otherFieldsForm.$invalid)"
+        translate="TOOLS.SAVE"
+        translate-attr-aria-label="TOOLS.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="TOOLS.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="trunk-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="TOOLS.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.trunk.name"
+                  ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+                  ng-required="true"
+                  autofocus
+                  disabled
+                />
+
+                <div class="hint">
+                  <span translate="TOOLS.HELP.NAME"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                  <div ng-message="pattern">
+                    <span
+                      translate="TOOLS.ERRORS.NAME_MUST_VALID_PATTERN"
+                      translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+                      >Name must be valid pattern
+                    </span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.trunk.active"
+                  aria-label="active"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="TOOLS.ACTIVE">active</span></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.HOST">host</label>
+                <input
+                  type="text"
+                  name="host"
+                  ng-model="vm.trunk.host"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="TOOLS.HELP.HOST"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['host'].$error"
+                  ng-show="generalForm['host'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.HOST_REQUIRED"
+                      >host field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.SECRET">secret</label>
+                <input
+                  type="password"
+                  name="secret"
+                  ng-model="vm.trunk.secret"
+                  placeholder="Password"
+                  translate
+                  translate-attr-placeholder="TOOLS.PASSWORD"
+                />
+                <div class="hint">
+                  <span translate="TOOLS.HELP.SECRET"></span>
+                </div>
+                <div ng-messages="generalForm['secret'].$error" role="alert">
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.PASSWORD_REQUIRED"
+                      >Password field is required</span
+                    >
+                  </div>
+                  <div ng-message="pattern">
+                    <span translate="TOOLS.ERRORS.SECURE_PASSWORD_PATTERN"
+                      >Must contain at least 8 characters, with a minimum of 1
+                      lowercase letter, 1 uppercase letter, 1 numeric character
+                      and 1 special character ~!?*@#$%^&-_=+[{]}.</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+
+              <md-input-container class="md-block">
+                <label translate="TOOLS.DEFAULTUSER">defaultuser</label>
+                <input
+                  type="text"
+                  name="defaultuser"
+                  ng-model="vm.trunk.defaultuser"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="TOOLS.HELP.DEFAULTUSER"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['defaultuser'].$error"
+                  ng-show="generalForm['defaultuser'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.DEFAULTUSER_REQUIRED"
+                      >defaultuser field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.CONTEXT">context</label>
+                <md-select
+                  name="context"
+                  ng-model="vm.trunk.context"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="context.name"
+                    ng-repeat="context in vm.contexts"
+                    ng-disabled="context.canSelect === false"
+                    >{{ context.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span translate="TOOLS.HELP.CONTEXT"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['context'].$error"
+                  ng-show="generalForm['context'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.CONTEXT_REQUIRED"
+                      >context field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.CALLERID">callerid</label>
+                <input
+                  type="text"
+                  name="callerid"
+                  ng-model="vm.trunk.callerid"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="TOOLS.HELP.CALLERID"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['callerid'].$error"
+                  ng-show="generalForm['callerid'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.CALLERID_REQUIRED"
+                      >callerid field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.TYPE">Type</label>
+                <md-select
+                  name="type"
+                  ng-model="vm.trunk.type"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'friend'">Friend</md-option>
+                  <md-option ng-value="'user'">User</md-option>
+                  <md-option ng-value="'peer'">Peer</md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="TOOLS.HELP.TYPE"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['type'].$error"
+                  ng-show="generalForm['type'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.TYPE_REQUIRED"
+                      >Type field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.DTMFMODE">dtmfmode</label>
+                <md-select
+                  name="dtmfmode"
+                  ng-model="vm.trunk.dtmfmode"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'rfc2833'">rfc2833</md-option>
+                  <md-option ng-value="'info'">info</md-option>
+                  <md-option ng-value="'shortinfo'">shortinfo</md-option>
+                  <md-option ng-value="'inband'">inband</md-option>
+                  <md-option ng-value="'auto'">auto</md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="TOOLS.HELP.DTMFMODE"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['dtmfmode'].$error"
+                  ng-show="generalForm['dtmfmode'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.DTMFMODE_REQUIRED"
+                      >dtmfmode field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.NAT">nat</label>
+                <md-select
+                  name="nat"
+                  ng-model="vm.trunk.nat"
+                  multiple
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'force_rport'">force_rport</md-option>
+                  <md-option ng-value="'comedia'">comedia</md-option>
+                  <md-option ng-value="'yes'">yes</md-option>
+                  <md-option ng-value="'no'">no</md-option>
+                  <md-option ng-value="'never'">never</md-option>
+                  <md-option ng-value="'route'">route</md-option>
+                </md-select>
+                <div class="hint"><span translate="TOOLS.HELP.NAT"></span></div>
+                <div
+                  ng-messages="generalForm['nat'].$error"
+                  ng-show="generalForm['nat'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.NAT_REQUIRED"
+                      >nat field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.QUALIFY">qualify</label>
+                <md-select
+                  name="qualify"
+                  ng-model="vm.trunk.qualify"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">
+                    {{ 'TOOLS.YES' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'no'">
+                    {{ 'TOOLS.NO' | translate }}
+                  </md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="TOOLS.HELP.QUALIFY"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['qualify'].$error"
+                  ng-show="generalForm['qualify'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.QUALIFY_REQUIRED"
+                      >qualify field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.ALLOWCODECS">AllowCodecs</label>
+                <md-select
+                  name="allow"
+                  ng-model="vm.trunk.allow"
+                  multiple
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'ulaw'">ulaw</md-option>
+                  <md-option ng-value="'alaw'">alaw</md-option>
+                  <md-option ng-value="'gsm'">gsm</md-option>
+                  <md-option ng-value="'g723'">g723</md-option>
+                  <md-option ng-value="'g726'">g726</md-option>
+                  <md-option ng-value="'g722'">g722</md-option>
+                  <md-option ng-value="'g729'">g729</md-option>
+                  <md-option ng-value="'ilbc'">ilbc</md-option>
+                  <md-option ng-value="'opus'">opus</md-option>
+                  <md-option ng-value="'h264'">h264</md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="TOOLS.HELP.ALLOWCODECS"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['allow'].$error"
+                  ng-show="generalForm['allow'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.ALLOWCODECS_REQUIRED"
+                      >AllowCodecs field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.INSECURE">insecure</label>
+                <md-select
+                  name="insecure"
+                  ng-model="vm.trunk.insecure"
+                  multiple
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'port'">port</md-option>
+                  <md-option ng-value="'invite'">invite</md-option>
+                  <md-option ng-value="'very'">very</md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="TOOLS.HELP.INSECURE"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['insecure'].$error"
+                  ng-show="generalForm['insecure'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.INSECURE_REQUIRED"
+                      >insecure field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.CALL_LIMIT">call_limit</label>
+                <input
+                  type="number"
+                  name="call_limit"
+                  ng-model="vm.trunk.call_limit"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="TOOLS.HELP.CALL_LIMIT"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['call_limit'].$error"
+                  ng-show="generalForm['call_limit'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.CALL_LIMIT_REQUIRED"
+                      >call_limit field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.trunk.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="TOOLS.ADVANCED">ADVANCED</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="trunk-detail-form-container advanced md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="TOOLS.ADVANCED">
+                ADVANCED
+              </div>
+            </div>
+            <form name="advancedForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.REGISTRY">registry</label>
+                <input
+                  type="text"
+                  name="registry"
+                  ng-model="vm.trunk.registry"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="TOOLS.HELP.REGISTRY"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['registry'].$error"
+                  ng-show="advancedForm['registry'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.REGISTRY_REQUIRED"
+                      >registry field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.DIRECTMEDIA">directmedia</label>
+                <md-select
+                  name="directmedia"
+                  ng-model="vm.trunk.directmedia"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">yes</md-option>
+                  <md-option ng-value="'no'">no</md-option>
+                  <md-option ng-value="'nonat'">nonat</md-option>
+                  <md-option ng-value="'update'">update</md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="TOOLS.HELP.DIRECTMEDIA"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['directmedia'].$error"
+                  ng-show="advancedForm['directmedia'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.DIRECTMEDIA_REQUIRED"
+                      >directmedia field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.CALLCOUNTER">callcounter</label>
+                <md-select
+                  name="callcounter"
+                  ng-model="vm.trunk.callcounter"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">
+                    {{ 'TOOLS.YES' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'no'">
+                    {{ 'TOOLS.NO' | translate }}
+                  </md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="TOOLS.HELP.CALLCOUNTER"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['callcounter'].$error"
+                  ng-show="advancedForm['callcounter'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.CALLCOUNTER_REQUIRED"
+                      >callcounter field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.FROMDOMAIN">fromdomain</label>
+                <input
+                  type="text"
+                  name="fromdomain"
+                  ng-model="vm.trunk.fromdomain"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="TOOLS.HELP.FROMDOMAIN"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['fromdomain'].$error"
+                  ng-show="advancedForm['fromdomain'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.FROMDOMAIN_REQUIRED"
+                      >fromdomain field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.FROMUSER">fromuser</label>
+                <input
+                  type="text"
+                  name="fromuser"
+                  ng-model="vm.trunk.fromuser"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="TOOLS.HELP.FROMUSER"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['fromuser'].$error"
+                  ng-show="advancedForm['fromuser'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.FROMUSER_REQUIRED"
+                      >fromuser field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.OUTBOUNDPROXY">outboundproxy</label>
+                <input
+                  type="text"
+                  name="outboundproxy"
+                  ng-model="vm.trunk.outboundproxy"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="TOOLS.HELP.OUTBOUNDPROXY"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['outboundproxy'].$error"
+                  ng-show="advancedForm['outboundproxy'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.OUTBOUNDPROXY_REQUIRED"
+                      >outboundproxy field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.ADD_PHONE_TO_URI"
+                  >Add_phone_to_URI</label
+                >
+                <md-select
+                  name="usereqphone"
+                  ng-model="vm.trunk.usereqphone"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">
+                    {{ 'TOOLS.YES' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'no'">
+                    {{ 'TOOLS.NO' | translate }}
+                  </md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="TOOLS.HELP.ADD_PHONE_TO_URI"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['usereqphone'].$error"
+                  ng-show="advancedForm['usereqphone'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.ADD_PHONE_TO_URI_REQUIRED"
+                      >Add_phone_to_URI field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.TRUST_REMOTE_PARTY_ID"
+                  >Trust_Remote_Party_ID</label
+                >
+                <md-select
+                  name="trustrpid"
+                  ng-model="vm.trunk.trustrpid"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">
+                    {{ 'TOOLS.YES' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'no'">
+                    {{ 'TOOLS.NO' | translate }}
+                  </md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="TOOLS.HELP.TRUST_REMOTE_PARTY_ID"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['trustrpid'].$error"
+                  ng-show="advancedForm['trustrpid'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="TOOLS.ERRORS.TRUST_REMOTE_PARTY_ID_REQUIRED"
+                      >Trust_Remote_Party_ID field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.SEND_REMOTE_PARTY_ID_HEADER"
+                  >Send_Remote_Party_ID_header</label
+                >
+                <md-select
+                  name="sendrpid"
+                  ng-model="vm.trunk.sendrpid"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">
+                    {{ 'TOOLS.YES' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'no'">
+                    {{ 'TOOLS.NO' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'pai'">
+                    {{ 'TOOLS.PAI' | translate }}
+                  </md-option>
+                </md-select>
+                <div class="hint">
+                  <span
+                    translate="TOOLS.HELP.SEND_REMOTE_PARTY_ID_HEADER"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['sendrpid'].$error"
+                  ng-show="advancedForm['sendrpid'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="TOOLS.ERRORS.SEND_REMOTE_PARTY_ID_HEADER_REQUIRED"
+                      >Send_Remote_Party_ID_header field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.ENCRYPTION">encryption</label>
+                <md-select
+                  name="encryption"
+                  ng-model="vm.trunk.encryption"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">
+                    {{ 'TOOLS.YES' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'no'">
+                    {{ 'TOOLS.NO' | translate }}
+                  </md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="TOOLS.HELP.ENCRYPTION"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['encryption'].$error"
+                  ng-show="advancedForm['encryption'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.ENCRYPTION_REQUIRED"
+                      >encryption field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.PORT">port</label>
+                <input
+                  type="number"
+                  name="port"
+                  ng-model="vm.trunk.port"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="TOOLS.HELP.PORT"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['port'].$error"
+                  ng-show="advancedForm['port'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.PORT_REQUIRED"
+                      >port field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.TRANSPORT">Transport</label>
+                <md-select
+                  name="transport"
+                  ng-model="vm.trunk.transport"
+                  multiple
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'udp'">udp</md-option>
+                  <md-option ng-value="'tcp'">tcp</md-option>
+                  <md-option ng-value="'ws'">ws</md-option>
+                  <md-option ng-value="'wss'">wss</md-option>
+                  <md-option ng-value="'tls'">tls</md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="TOOLS.HELP.TRANSPORT"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['transport'].$error"
+                  ng-show="advancedForm['transport'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.TRANSPORT_REQUIRED"
+                      >Transport field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.T38PT_UDPTL">t38pt_udptl</label>
+                <input
+                  type="string"
+                  name="t38pt_udptl"
+                  ng-model="vm.trunk.t38pt_udptl"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="TOOLS.HELP.T38PT_UDPTL"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['t38pt_udptl'].$error"
+                  ng-show="advancedForm['t38pt_udptl'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.T38PT_UDPTL_REQUIRED"
+                      >t38pt_udptl field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.VIDEOSUPPORT">Videosupport</label>
+                <md-select
+                  name="videosupport"
+                  ng-model="vm.trunk.videosupport"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">Yes</md-option>
+                  <md-option ng-value="'no'">No</md-option>
+                  <md-option ng-value="'always'">Always</md-option>
+                </md-select>
+                <div
+                  ng-messages="advancedForm['videosupport'].$error"
+                  ng-show="advancedForm['videosupport'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="TOOLS.ERRORS.VIDEOSUPPORT_REQUIRED"
+                      >Videosupport field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="TOOLS.OTHERFIELDS">OTHERFIELDS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="trunk-detail-form-container otherfields md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="TOOLS.OTHERFIELDS">
+                OTHERFIELDS
+              </div>
+            </div>
+            <form name="otherFieldsForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="TOOLS.OTHERFIELDS">otherFields</label>
+                <textarea
+                  name="otherFields"
+                  ng-model="vm.trunk.otherFields"
+                  autofocus
+                ></textarea>
+                <div class="hint">
+                  <span translate="TOOLS.HELP.OTHERFIELDS"></span>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/tools/views/trunks/trunks.html/trunks-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/trunks/trunks.html/trunks-[chunkhash].html
deleted file mode 100644
index 0573782..0000000
--- a/public/src/js/modules/main/apps/tools/views/trunks/trunks.html/trunks-[chunkhash].html
+++ /dev/null
@@ -1,352 +0,0 @@
-<div
-  id="trunks"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-auto-fix" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="TOOLS.TRUNKS">Trunks</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="TOOLS.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedTrunks.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedTrunks =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="TOOLS.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-trunks-count">
-          <span>{{vm.selectedTrunks.length}}</span>
-          <span translate="TOOLS.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="TOOLS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllTrunks()"
-                translate="TOOLS.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectTrunks()"
-                translate="TOOLS.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedTrunks"
-          csv-label="true"
-          filename="trunks.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedTrunks($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="TOOLS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- TRUNK TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedTrunks"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getTrunks"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'TOOLS.ID' | translate }}</th>
-                <th md-column md-order-by="name">
-                  {{ 'TOOLS.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="active">
-                  {{ 'TOOLS.ACTIVE' | translate }}
-                </th>
-                <th md-column md-order-by="host">
-                  {{ 'TOOLS.HOST' | translate }}
-                </th>
-                <th md-column md-order-by="registry">
-                  {{ 'TOOLS.REGISTRY' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'TOOLS.DESCRIPTION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.trunks.rows.length">
-                <td md-cell colspan="7">
-                  <div layout="row" layout-align="center center">
-                    <span translate="TOOLS.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="trunk"
-                md-select-id="id"
-                ng-repeat="trunk in vm.trunks.rows"
-              >
-                <td md-cell ng-if="trunk.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{trunk.name}}"
-                    ng-src="api/users/{{trunk.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!trunk.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{trunk.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(trunk, ev) : vm.createOrEditTrunk($event, trunk)"
-                  md-cell
-                  class="id"
-                >
-                  {{trunk.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(trunk, ev) : vm.createOrEditTrunk($event, trunk)"
-                  md-cell
-                  class="name"
-                >
-                  {{trunk.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(trunk, ev) : vm.createOrEditTrunk($event, trunk)"
-                  md-cell
-                  class="active"
-                >
-                  <md-icon
-                    md-colors="{color: {{trunk.active ? '\'green\'' : '\'grey\''}}}"
-                    md-font-icon="{{trunk.active ? 'icon-check' : 'icon-close'}}"
-                  ></md-icon>
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(trunk, ev) : vm.createOrEditTrunk($event, trunk)"
-                  md-cell
-                  class="host"
-                >
-                  {{trunk.host}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(trunk, ev) : vm.createOrEditTrunk($event, trunk)"
-                  md-cell
-                  class="registry"
-                >
-                  {{trunk.registry}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(trunk, ev) : vm.createOrEditTrunk($event, trunk)"
-                  md-cell
-                  class="description"
-                >
-                  {{trunk.description}}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="TOOLS.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(trunk, $event    )"
-                          translate="TOOLS.EDIT_TRUNK"
-                        >
-                          Edit Trunk
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.clonedialog(trunk, $event    )"
-                          translate="TOOLS.CLONE_TRUNK"
-                        >
-                          clone Trunk
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.gotorealtimegoto(trunk, $event    )"
-                          translate="TOOLS.GOTOREALTIME_TRUNK"
-                        >
-                          goToRealtime Trunk
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(trunk, $event    )"
-                          translate="TOOLS.DELETE_TRUNK"
-                        >
-                          Delete Trunk
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'TOOLS.PAGE' | translate}}:', rowsPerPage: '{{'TOOLS.ROWSPERPAGE' | translate}}:', of: '{{'TOOLS.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.trunks.count}}"
-          md-on-paginate="vm.getTrunks"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / TRUNK TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD TRUNK BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-trunk-button"
-    ng-click="vm.createOrEditTrunk($event)"
-    aria-label="add trunk"
-    translate
-    translate-attr-aria-label="TOOLS.ADD_TRUNK"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD TRUNK BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/tools/views/trunks/trunks.html/trunks.html b/public/src/js/modules/main/apps/tools/views/trunks/trunks.html/trunks.html
new file mode 100644
index 0000000..0573782
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/trunks/trunks.html/trunks.html
@@ -0,0 +1,352 @@
+<div
+  id="trunks"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-auto-fix" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="TOOLS.TRUNKS">Trunks</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="TOOLS.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedTrunks.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedTrunks =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="TOOLS.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-trunks-count">
+          <span>{{vm.selectedTrunks.length}}</span>
+          <span translate="TOOLS.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="TOOLS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllTrunks()"
+                translate="TOOLS.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectTrunks()"
+                translate="TOOLS.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedTrunks"
+          csv-label="true"
+          filename="trunks.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedTrunks($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="TOOLS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- TRUNK TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedTrunks"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getTrunks"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'TOOLS.ID' | translate }}</th>
+                <th md-column md-order-by="name">
+                  {{ 'TOOLS.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="active">
+                  {{ 'TOOLS.ACTIVE' | translate }}
+                </th>
+                <th md-column md-order-by="host">
+                  {{ 'TOOLS.HOST' | translate }}
+                </th>
+                <th md-column md-order-by="registry">
+                  {{ 'TOOLS.REGISTRY' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'TOOLS.DESCRIPTION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.trunks.rows.length">
+                <td md-cell colspan="7">
+                  <div layout="row" layout-align="center center">
+                    <span translate="TOOLS.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="trunk"
+                md-select-id="id"
+                ng-repeat="trunk in vm.trunks.rows"
+              >
+                <td md-cell ng-if="trunk.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{trunk.name}}"
+                    ng-src="api/users/{{trunk.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!trunk.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{trunk.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(trunk, ev) : vm.createOrEditTrunk($event, trunk)"
+                  md-cell
+                  class="id"
+                >
+                  {{trunk.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(trunk, ev) : vm.createOrEditTrunk($event, trunk)"
+                  md-cell
+                  class="name"
+                >
+                  {{trunk.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(trunk, ev) : vm.createOrEditTrunk($event, trunk)"
+                  md-cell
+                  class="active"
+                >
+                  <md-icon
+                    md-colors="{color: {{trunk.active ? '\'green\'' : '\'grey\''}}}"
+                    md-font-icon="{{trunk.active ? 'icon-check' : 'icon-close'}}"
+                  ></md-icon>
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(trunk, ev) : vm.createOrEditTrunk($event, trunk)"
+                  md-cell
+                  class="host"
+                >
+                  {{trunk.host}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(trunk, ev) : vm.createOrEditTrunk($event, trunk)"
+                  md-cell
+                  class="registry"
+                >
+                  {{trunk.registry}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(trunk, ev) : vm.createOrEditTrunk($event, trunk)"
+                  md-cell
+                  class="description"
+                >
+                  {{trunk.description}}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="TOOLS.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(trunk, $event    )"
+                          translate="TOOLS.EDIT_TRUNK"
+                        >
+                          Edit Trunk
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.clonedialog(trunk, $event    )"
+                          translate="TOOLS.CLONE_TRUNK"
+                        >
+                          clone Trunk
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.gotorealtimegoto(trunk, $event    )"
+                          translate="TOOLS.GOTOREALTIME_TRUNK"
+                        >
+                          goToRealtime Trunk
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(trunk, $event    )"
+                          translate="TOOLS.DELETE_TRUNK"
+                        >
+                          Delete Trunk
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'TOOLS.PAGE' | translate}}:', rowsPerPage: '{{'TOOLS.ROWSPERPAGE' | translate}}:', of: '{{'TOOLS.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.trunks.count}}"
+          md-on-paginate="vm.getTrunks"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / TRUNK TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD TRUNK BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-trunk-button"
+    ng-click="vm.createOrEditTrunk($event)"
+    aria-label="add trunk"
+    translate
+    translate-attr-aria-label="TOOLS.ADD_TRUNK"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD TRUNK BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/tools/views/variables/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/variables/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index be51e70..0000000
--- a/public/src/js/modules/main/apps/tools/views/variables/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,152 +0,0 @@
-<md-dialog class="variable-dialog" aria-label="New Variable">
-  <form name="variableForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.variable.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="variableForm['name'].$error"
-          ng-show="variableForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="TOOLS.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.variable.description"
-        />
-
-        <div
-          ng-messages="variableForm['description'].$error"
-          ng-show="variableForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="TOOLS.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newVariable"
-          ng-click="vm.saveVariable()"
-          class="send-button md-accent md-raised"
-          ng-disabled="variableForm.$invalid || variableForm.$pristine"
-          aria-label="SAVE"
-          translate="TOOLS.SAVE"
-          translate-attr-aria-label="TOOLS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newVariable"
-          ng-click="vm.addNewVariable()"
-          class="send-button md-accent md-raised"
-          ng-disabled="variableForm.$invalid"
-          aria-label="ADD"
-          translate="TOOLS.ADD_VARIABLE"
-          translate-attr-aria-label="TOOLS.ADD_VARIABLE"
-        >
-          ADD VARIABLE
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newVariable"
-          ng-click="vm.deleteVariable($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="TOOLS.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/variables/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/tools/views/variables/create/dialog.html/dialog.html
new file mode 100644
index 0000000..be51e70
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/variables/create/dialog.html/dialog.html
@@ -0,0 +1,152 @@
+<md-dialog class="variable-dialog" aria-label="New Variable">
+  <form name="variableForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.variable.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="variableForm['name'].$error"
+          ng-show="variableForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="TOOLS.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.variable.description"
+        />
+
+        <div
+          ng-messages="variableForm['description'].$error"
+          ng-show="variableForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="TOOLS.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newVariable"
+          ng-click="vm.saveVariable()"
+          class="send-button md-accent md-raised"
+          ng-disabled="variableForm.$invalid || variableForm.$pristine"
+          aria-label="SAVE"
+          translate="TOOLS.SAVE"
+          translate-attr-aria-label="TOOLS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newVariable"
+          ng-click="vm.addNewVariable()"
+          class="send-button md-accent md-raised"
+          ng-disabled="variableForm.$invalid"
+          aria-label="ADD"
+          translate="TOOLS.ADD_VARIABLE"
+          translate-attr-aria-label="TOOLS.ADD_VARIABLE"
+        >
+          ADD VARIABLE
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newVariable"
+          ng-click="vm.deleteVariable($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="TOOLS.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="TOOLS.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/tools/views/variables/variables.html/variables-[chunkhash].html b/public/src/js/modules/main/apps/tools/views/variables/variables.html/variables-[chunkhash].html
deleted file mode 100644
index 24915a4..0000000
--- a/public/src/js/modules/main/apps/tools/views/variables/variables.html/variables-[chunkhash].html
+++ /dev/null
@@ -1,297 +0,0 @@
-<div
-  id="variables"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-auto-fix" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="TOOLS.VARIABLES">Variables</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="TOOLS.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedVariables.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedVariables =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="TOOLS.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-variables-count">
-          <span>{{vm.selectedVariables.length}}</span>
-          <span translate="TOOLS.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="TOOLS.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllVariables()"
-                translate="TOOLS.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectVariables()"
-                translate="TOOLS.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedVariables"
-          csv-label="true"
-          filename="variables.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedVariables($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="TOOLS.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- VARIABLE TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedVariables"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getVariables"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'TOOLS.ID' | translate }}</th>
-                <th md-column md-order-by="name">
-                  {{ 'TOOLS.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'TOOLS.DESCRIPTION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.variables.rows.length">
-                <td md-cell colspan="4">
-                  <div layout="row" layout-align="center center">
-                    <span translate="TOOLS.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="variable"
-                md-select-id="id"
-                ng-repeat="variable in vm.variables.rows"
-              >
-                <td md-cell ng-if="variable.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{variable.name}}"
-                    ng-src="api/users/{{variable.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!variable.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{variable.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.createOrEditVariable($event, variable)"
-                  md-cell
-                  class="id"
-                >
-                  {{variable.id}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditVariable($event, variable)"
-                  md-cell
-                  class="name"
-                >
-                  {{variable.name}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditVariable($event, variable)"
-                  md-cell
-                  class="description"
-                >
-                  {{variable.description}}
-                </td>
-
-                <td
-                  md-cell
-                  class="actions"
-                  ng-if="!vm.crudPermissions.readOnly"
-                >
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="TOOLS.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editdialog(variable, $event    )"
-                          translate="TOOLS.EDIT_VARIABLE"
-                        >
-                          Edit Variable
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(variable, $event    )"
-                          translate="TOOLS.DELETE_VARIABLE"
-                        >
-                          Delete Variable
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'TOOLS.PAGE' | translate}}:', rowsPerPage: '{{'TOOLS.ROWSPERPAGE' | translate}}:', of: '{{'TOOLS.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.variables.count}}"
-          md-on-paginate="vm.getVariables"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / VARIABLE TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD VARIABLE BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-variable-button"
-    ng-click="vm.createOrEditVariable($event)"
-    aria-label="add variable"
-    translate
-    translate-attr-aria-label="TOOLS.ADD_VARIABLE"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD VARIABLE BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/tools/views/variables/variables.html/variables.html b/public/src/js/modules/main/apps/tools/views/variables/variables.html/variables.html
new file mode 100644
index 0000000..24915a4
--- /dev/null
+++ b/public/src/js/modules/main/apps/tools/views/variables/variables.html/variables.html
@@ -0,0 +1,297 @@
+<div
+  id="variables"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-auto-fix" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="TOOLS.VARIABLES">Variables</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="TOOLS.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedVariables.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedVariables =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="TOOLS.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-variables-count">
+          <span>{{vm.selectedVariables.length}}</span>
+          <span translate="TOOLS.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="TOOLS.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllVariables()"
+                translate="TOOLS.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectVariables()"
+                translate="TOOLS.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedVariables"
+          csv-label="true"
+          filename="variables.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedVariables($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="TOOLS.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- VARIABLE TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedVariables"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getVariables"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'TOOLS.ID' | translate }}</th>
+                <th md-column md-order-by="name">
+                  {{ 'TOOLS.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'TOOLS.DESCRIPTION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.variables.rows.length">
+                <td md-cell colspan="4">
+                  <div layout="row" layout-align="center center">
+                    <span translate="TOOLS.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="variable"
+                md-select-id="id"
+                ng-repeat="variable in vm.variables.rows"
+              >
+                <td md-cell ng-if="variable.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{variable.name}}"
+                    ng-src="api/users/{{variable.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!variable.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{variable.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.createOrEditVariable($event, variable)"
+                  md-cell
+                  class="id"
+                >
+                  {{variable.id}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditVariable($event, variable)"
+                  md-cell
+                  class="name"
+                >
+                  {{variable.name}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditVariable($event, variable)"
+                  md-cell
+                  class="description"
+                >
+                  {{variable.description}}
+                </td>
+
+                <td
+                  md-cell
+                  class="actions"
+                  ng-if="!vm.crudPermissions.readOnly"
+                >
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="TOOLS.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editdialog(variable, $event    )"
+                          translate="TOOLS.EDIT_VARIABLE"
+                        >
+                          Edit Variable
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(variable, $event    )"
+                          translate="TOOLS.DELETE_VARIABLE"
+                        >
+                          Delete Variable
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'TOOLS.PAGE' | translate}}:', rowsPerPage: '{{'TOOLS.ROWSPERPAGE' | translate}}:', of: '{{'TOOLS.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.variables.count}}"
+          md-on-paginate="vm.getVariables"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / VARIABLE TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD VARIABLE BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-variable-button"
+    ng-click="vm.createOrEditVariable($event)"
+    aria-label="add variable"
+    translate
+    translate-attr-aria-label="TOOLS.ADD_VARIABLE"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD VARIABLE BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/video/views/screenRecordings/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/video/views/screenRecordings/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 4840a0c..0000000
--- a/public/src/js/modules/main/apps/video/views/screenRecordings/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,169 +0,0 @@
-<md-dialog class="screenRecording-dialog" aria-label="New screenRecording">
-  <form name="screenRecordingForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VIDEO.RATING">Rating</label>
-        <md-select
-          name="rating"
-          ng-model="vm.screenRecording.rating"
-          autofocus
-          ng-disabled="!vm.newscreenRecording && !vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="null"
-            >{{'VIDEO.NO_RATING' | translate}}</md-option
-          >
-          <md-option value="1"
-            ><md-icon
-              md-font-icon="icon-star"
-              style="color: red"
-              ng-repeat="icon in [1]"
-            ></md-icon
-          ></md-option>
-          <md-option value="2"
-            ><md-icon
-              md-font-icon="icon-star"
-              style="color: red"
-              ng-repeat="icon in [1,2]"
-            ></md-icon
-          ></md-option>
-          <md-option value="3"
-            ><md-icon
-              md-font-icon="icon-star"
-              style="color: red"
-              ng-repeat="icon in [1,2,3]"
-            ></md-icon
-          ></md-option>
-          <md-option value="4"
-            ><md-icon
-              md-font-icon="icon-star"
-              style="color: red"
-              ng-repeat="icon in [1,2,3,4]"
-            ></md-icon
-          ></md-option>
-          <md-option value="5"
-            ><md-icon
-              md-font-icon="icon-star"
-              style="color: red"
-              ng-repeat="icon in [1,2,3,4,5]"
-            ></md-icon
-          ></md-option>
-        </md-select>
-        <div
-          ng-messages="screenRecordingForm['rating'].$error"
-          ng-show="screenRecordingForm[rating].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VIDEO.ERRORS.RATING_REQUIRED"
-              >Rating field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newscreenRecording"
-          ng-click="vm.savescreenRecording()"
-          class="send-button md-accent md-raised"
-          ng-disabled="screenRecordingForm.$invalid || screenRecordingForm.$pristine"
-          aria-label="SAVE"
-          translate="VIDEO.SAVE"
-          translate-attr-aria-label="VIDEO.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newscreenRecording"
-          ng-click="vm.addNewscreenRecording()"
-          class="send-button md-accent md-raised"
-          ng-disabled="screenRecordingForm.$invalid"
-          aria-label="ADD"
-          translate="VIDEO.ADD_SCREENRECORDING"
-          translate-attr-aria-label="VIDEO.ADD_SCREENRECORDING"
-        >
-          ADD SCREENRECORDING
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newscreenRecording"
-          ng-click="vm.deletescreenRecording($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="VIDEO.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="VIDEO.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/video/views/screenRecordings/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/video/views/screenRecordings/create/dialog.html/dialog.html
new file mode 100644
index 0000000..4840a0c
--- /dev/null
+++ b/public/src/js/modules/main/apps/video/views/screenRecordings/create/dialog.html/dialog.html
@@ -0,0 +1,169 @@
+<md-dialog class="screenRecording-dialog" aria-label="New screenRecording">
+  <form name="screenRecordingForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VIDEO.RATING">Rating</label>
+        <md-select
+          name="rating"
+          ng-model="vm.screenRecording.rating"
+          autofocus
+          ng-disabled="!vm.newscreenRecording && !vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="null"
+            >{{'VIDEO.NO_RATING' | translate}}</md-option
+          >
+          <md-option value="1"
+            ><md-icon
+              md-font-icon="icon-star"
+              style="color: red"
+              ng-repeat="icon in [1]"
+            ></md-icon
+          ></md-option>
+          <md-option value="2"
+            ><md-icon
+              md-font-icon="icon-star"
+              style="color: red"
+              ng-repeat="icon in [1,2]"
+            ></md-icon
+          ></md-option>
+          <md-option value="3"
+            ><md-icon
+              md-font-icon="icon-star"
+              style="color: red"
+              ng-repeat="icon in [1,2,3]"
+            ></md-icon
+          ></md-option>
+          <md-option value="4"
+            ><md-icon
+              md-font-icon="icon-star"
+              style="color: red"
+              ng-repeat="icon in [1,2,3,4]"
+            ></md-icon
+          ></md-option>
+          <md-option value="5"
+            ><md-icon
+              md-font-icon="icon-star"
+              style="color: red"
+              ng-repeat="icon in [1,2,3,4,5]"
+            ></md-icon
+          ></md-option>
+        </md-select>
+        <div
+          ng-messages="screenRecordingForm['rating'].$error"
+          ng-show="screenRecordingForm[rating].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VIDEO.ERRORS.RATING_REQUIRED"
+              >Rating field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newscreenRecording"
+          ng-click="vm.savescreenRecording()"
+          class="send-button md-accent md-raised"
+          ng-disabled="screenRecordingForm.$invalid || screenRecordingForm.$pristine"
+          aria-label="SAVE"
+          translate="VIDEO.SAVE"
+          translate-attr-aria-label="VIDEO.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newscreenRecording"
+          ng-click="vm.addNewscreenRecording()"
+          class="send-button md-accent md-raised"
+          ng-disabled="screenRecordingForm.$invalid"
+          aria-label="ADD"
+          translate="VIDEO.ADD_SCREENRECORDING"
+          translate-attr-aria-label="VIDEO.ADD_SCREENRECORDING"
+        >
+          ADD SCREENRECORDING
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newscreenRecording"
+          ng-click="vm.deletescreenRecording($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="VIDEO.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="VIDEO.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/video/views/screenRecordings/partialViews/play.html/play-[chunkhash].html b/public/src/js/modules/main/apps/video/views/screenRecordings/partialViews/play.html/play-[chunkhash].html
deleted file mode 100644
index 2e04f3c..0000000
--- a/public/src/js/modules/main/apps/video/views/screenRecordings/partialViews/play.html/play-[chunkhash].html
+++ /dev/null
@@ -1,120 +0,0 @@
-<md-dialog class="play-dialog" aria-label="play">
-  <form name="playForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2
-          translate="{{ vm.app.toUpperCase() }}.{{  vm.label.toUpperCase() }}"
-        >
-          Play Recording
-        </h2>
-        <span flex></span>
-        <md-button
-          class="md-icon-button"
-          ng-disabled="vm.loading"
-          ng-click="vm.closeDialog()"
-        >
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content ng-hide="vm.loading">
-      <div layout="row" layout-sm flex>
-        <!-- VIRTUAL field -->
-        <md-card>
-          <md-card-title ng-if="vm.actionOptions.upperTitle">
-            <md-card-title-text>
-              <span class="md-headline">{{ vm.filename }}</span>
-              <span class="md-subhead"
-                ><span translate="{{ vm.app.toUpperCase() }}.UPDATEDAT"></span>:
-                {{ vm.recording.updatedAt}}</span
-              >
-            </md-card-title-text>
-          </md-card-title>
-
-          <!-- video recording directive -->
-          <ms-dialog-recording
-            ng-if="vm.format"
-            id="vm.recording.id"
-            title="vm.filename"
-            element="vm.element"
-            model="vm.route"
-            path="vm.path"
-            class="md-card-image"
-          ></ms-dialog-recording>
-          <!-- / video recording directive -->
-
-          <span ng-if="!vm.format">
-            <em ng-if="vm.found"
-              >{{ vm.app.toUpperCase() + '.CANT_PLAY_THIS_FILE' | translate
-              }}</em
-            >
-            <em ng-if="!vm.found"
-              >{{ vm.app.toUpperCase() + '.FILE_NOT_FOUND' | translate }}</em
-            >
-          </span>
-
-          <md-card-title ng-if="vm.actionOptions.lowerTitle">
-            <md-card-title-text>
-              <span class="md-headline">{{ vm.filename }}</span>
-              <span class="md-subhead"
-                ><span translate="{{ vm.app.toUpperCase() }}.UPDATEDAT"></span>:
-                {{ vm.recording.updatedAt}}</span
-              >
-
-              <span ng-if="vm.actionOptions.properties" class="md-subhead"
-                ><span translate="{{ vm.app.toUpperCase() }}.PROPERTIES"></span
-                >:</span
-              >
-            </md-card-title-text>
-          </md-card-title>
-
-          <md-card-content ng-if="vm.actionOptions.properties">
-            <md-list>
-              <md-list-item
-                class="md-2-line"
-                ng-repeat="(key,value) in vm.properties"
-                ng-click="null"
-                ng-if="key != 'value' && key != 'updatedAt' && key != 'queue'"
-              >
-                <md-icon
-                  ng-if="vm.icon"
-                  class="md-avatar-icon"
-                  md-font-icon="vm.actionOptions.propertiesIcon"
-                  class="s24"
-                ></md-icon>
-
-                <div class="md-list-item-text" layout="column">
-                  <p>
-                    <b
-                      ><span
-                        translate="{{ vm.app.toUpperCase() }}.{{ key.toUpperCase() }}"
-                      ></span
-                    ></b>
-                  </p>
-                  <p>{{ value }}</p>
-                  <p></p>
-                </div>
-              </md-list-item>
-            </md-list>
-          </md-card-content>
-        </md-card>
-      </div>
-    </md-dialog-content>
-    <div
-      ng-hide="!vm.loading"
-      layout-fill
-      style="min-height: 397px"
-      layout="row"
-      layout-sm="column"
-      layout-align="center center"
-    >
-      <md-progress-circular
-        class="md-primary md-hue-1"
-        md-diameter="96"
-      ></md-progress-circular>
-    </div>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/video/views/screenRecordings/partialViews/play.html/play.html b/public/src/js/modules/main/apps/video/views/screenRecordings/partialViews/play.html/play.html
new file mode 100644
index 0000000..2e04f3c
--- /dev/null
+++ b/public/src/js/modules/main/apps/video/views/screenRecordings/partialViews/play.html/play.html
@@ -0,0 +1,120 @@
+<md-dialog class="play-dialog" aria-label="play">
+  <form name="playForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2
+          translate="{{ vm.app.toUpperCase() }}.{{  vm.label.toUpperCase() }}"
+        >
+          Play Recording
+        </h2>
+        <span flex></span>
+        <md-button
+          class="md-icon-button"
+          ng-disabled="vm.loading"
+          ng-click="vm.closeDialog()"
+        >
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content ng-hide="vm.loading">
+      <div layout="row" layout-sm flex>
+        <!-- VIRTUAL field -->
+        <md-card>
+          <md-card-title ng-if="vm.actionOptions.upperTitle">
+            <md-card-title-text>
+              <span class="md-headline">{{ vm.filename }}</span>
+              <span class="md-subhead"
+                ><span translate="{{ vm.app.toUpperCase() }}.UPDATEDAT"></span>:
+                {{ vm.recording.updatedAt}}</span
+              >
+            </md-card-title-text>
+          </md-card-title>
+
+          <!-- video recording directive -->
+          <ms-dialog-recording
+            ng-if="vm.format"
+            id="vm.recording.id"
+            title="vm.filename"
+            element="vm.element"
+            model="vm.route"
+            path="vm.path"
+            class="md-card-image"
+          ></ms-dialog-recording>
+          <!-- / video recording directive -->
+
+          <span ng-if="!vm.format">
+            <em ng-if="vm.found"
+              >{{ vm.app.toUpperCase() + '.CANT_PLAY_THIS_FILE' | translate
+              }}</em
+            >
+            <em ng-if="!vm.found"
+              >{{ vm.app.toUpperCase() + '.FILE_NOT_FOUND' | translate }}</em
+            >
+          </span>
+
+          <md-card-title ng-if="vm.actionOptions.lowerTitle">
+            <md-card-title-text>
+              <span class="md-headline">{{ vm.filename }}</span>
+              <span class="md-subhead"
+                ><span translate="{{ vm.app.toUpperCase() }}.UPDATEDAT"></span>:
+                {{ vm.recording.updatedAt}}</span
+              >
+
+              <span ng-if="vm.actionOptions.properties" class="md-subhead"
+                ><span translate="{{ vm.app.toUpperCase() }}.PROPERTIES"></span
+                >:</span
+              >
+            </md-card-title-text>
+          </md-card-title>
+
+          <md-card-content ng-if="vm.actionOptions.properties">
+            <md-list>
+              <md-list-item
+                class="md-2-line"
+                ng-repeat="(key,value) in vm.properties"
+                ng-click="null"
+                ng-if="key != 'value' && key != 'updatedAt' && key != 'queue'"
+              >
+                <md-icon
+                  ng-if="vm.icon"
+                  class="md-avatar-icon"
+                  md-font-icon="vm.actionOptions.propertiesIcon"
+                  class="s24"
+                ></md-icon>
+
+                <div class="md-list-item-text" layout="column">
+                  <p>
+                    <b
+                      ><span
+                        translate="{{ vm.app.toUpperCase() }}.{{ key.toUpperCase() }}"
+                      ></span
+                    ></b>
+                  </p>
+                  <p>{{ value }}</p>
+                  <p></p>
+                </div>
+              </md-list-item>
+            </md-list>
+          </md-card-content>
+        </md-card>
+      </div>
+    </md-dialog-content>
+    <div
+      ng-hide="!vm.loading"
+      layout-fill
+      style="min-height: 397px"
+      layout="row"
+      layout-sm="column"
+      layout-align="center center"
+    >
+      <md-progress-circular
+        class="md-primary md-hue-1"
+        md-diameter="96"
+      ></md-progress-circular>
+    </div>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/video/views/screenRecordings/screenRecordings.html/screenRecordings-[chunkhash].html b/public/src/js/modules/main/apps/video/views/screenRecordings/screenRecordings.html/screenRecordings-[chunkhash].html
deleted file mode 100644
index 3d1747b..0000000
--- a/public/src/js/modules/main/apps/video/views/screenRecordings/screenRecordings.html/screenRecordings-[chunkhash].html
+++ /dev/null
@@ -1,343 +0,0 @@
-<div
-  id="screenRecordings"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-video" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="VIDEO.SCREENRECORDINGS"
-          >ScreenRecordings</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="VIDEO.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-      <ms-quick-filter
-        filters="vm.quickFilters"
-        query="vm.query"
-        search="vm.getScreenRecordings()"
-      ></ms-quick-filter>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedScreenRecordings.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div
-      class="close-button-wrapper"
-      ng-click="vm.selectedScreenRecordings =[]"
-    >
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="VIDEO.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-screenRecordings-count">
-          <span>{{vm.selectedScreenRecordings.length}}</span>
-          <span translate="VIDEO.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="VIDEO.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllScreenRecordings()"
-                translate="VIDEO.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectScreenRecordings()"
-                translate="VIDEO.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedScreenRecordings"
-          csv-label="true"
-          filename="screenRecordings.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedScreenRecordings($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="VIDEO.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- SCREENRECORDING TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedScreenRecordings"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getScreenRecordings"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'VIDEO.ID' | translate }}</th>
-                <th md-column md-order-by="rating">
-                  {{ 'VIDEO.RATING' | translate }}
-                </th>
-                <th md-column md-order-by="UserId">
-                  {{ 'VIDEO.AGENT' | translate }}
-                </th>
-                <th md-column md-order-by="duration">
-                  {{ 'VIDEO.DURATION' | translate }}
-                </th>
-                <th md-column md-order-by="startedAt">
-                  {{ 'VIDEO.RECORDSTARTTIME' | translate }}
-                </th>
-                <th md-column md-order-by="closedAt">
-                  {{ 'VIDEO.RECORDENDTIME' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.screenRecordings.rows.length">
-                <td md-cell colspan="7">
-                  <div layout="row" layout-align="center center">
-                    <span translate="VIDEO.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="screenRecording"
-                md-select-id="id"
-                ng-repeat="screenRecording in vm.screenRecordings.rows"
-              >
-                <td md-cell ng-if="screenRecording.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{screenRecording.name}}"
-                    ng-src="api/users/{{screenRecording.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!screenRecording.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{screenRecording.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.createOrEditscreenRecording($event, screenRecording)"
-                  md-cell
-                  class="id"
-                >
-                  {{screenRecording.id}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditscreenRecording($event, screenRecording)"
-                  md-cell
-                  class="rating"
-                >
-                  <md-icon
-                    md-font-icon="icon-star"
-                    style="color: red"
-                    ng-show="screenRecording.rating"
-                    ng-repeat="rating in [1,2,3,4,5] | limitTo:screenRecording.rating"
-                  ></md-icon
-                  ><span
-                    ng-hide="screenRecording.rating"
-                    translate="VIDEO.NO_RATING"
-                    >No rating</span
-                  >
-                </td>
-                <td
-                  ng-click="vm.createOrEditscreenRecording($event, screenRecording)"
-                  md-cell
-                  class="UserId"
-                >
-                  {{ (vm.users | filter : {'id':screenRecording.UserId} :
-                  true)[0].fullname }}
-                </td>
-                <td md-cell>
-                  <span
-                    ng-bind="vm.convertDuration(screenRecording.duration)"
-                  ></span>
-                </td>
-                <td
-                  ng-click="vm.createOrEditscreenRecording($event, screenRecording)"
-                  md-cell
-                  class="startedAt"
-                >
-                  {{screenRecording.startedAt | date:'medium' }}
-                </td>
-                <td
-                  ng-click="vm.createOrEditscreenRecording($event, screenRecording)"
-                  md-cell
-                  class="closedAt"
-                >
-                  {{screenRecording.closedAt | date:'medium' }}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="VIDEO.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.playrecording(screenRecording, $event  , 'value'  , 'play_screenrecording'  , 'video' )"
-                          translate="VIDEO.PLAY_SCREENRECORDING"
-                        >
-                          play screenRecording
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.downloadfile2(screenRecording, $event  , 'screen/recordings'   )"
-                          translate="VIDEO.DOWNLOAD_SCREENRECORDING"
-                        >
-                          Download screenRecording
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(screenRecording, $event    )"
-                          translate="VIDEO.DELETE_SCREENRECORDING"
-                        >
-                          Delete screenRecording
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'VIDEO.PAGE' | translate}}:', rowsPerPage: '{{'VIDEO.ROWSPERPAGE' | translate}}:', of: '{{'VIDEO.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.screenRecordings.count}}"
-          md-on-paginate="vm.getScreenRecordings"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / SCREENRECORDING TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- NO ADD BUTTON BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/video/views/screenRecordings/screenRecordings.html/screenRecordings.html b/public/src/js/modules/main/apps/video/views/screenRecordings/screenRecordings.html/screenRecordings.html
new file mode 100644
index 0000000..3d1747b
--- /dev/null
+++ b/public/src/js/modules/main/apps/video/views/screenRecordings/screenRecordings.html/screenRecordings.html
@@ -0,0 +1,343 @@
+<div
+  id="screenRecordings"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-video" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="VIDEO.SCREENRECORDINGS"
+          >ScreenRecordings</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="VIDEO.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+      <ms-quick-filter
+        filters="vm.quickFilters"
+        query="vm.query"
+        search="vm.getScreenRecordings()"
+      ></ms-quick-filter>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedScreenRecordings.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div
+      class="close-button-wrapper"
+      ng-click="vm.selectedScreenRecordings =[]"
+    >
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="VIDEO.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-screenRecordings-count">
+          <span>{{vm.selectedScreenRecordings.length}}</span>
+          <span translate="VIDEO.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="VIDEO.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllScreenRecordings()"
+                translate="VIDEO.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectScreenRecordings()"
+                translate="VIDEO.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedScreenRecordings"
+          csv-label="true"
+          filename="screenRecordings.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedScreenRecordings($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="VIDEO.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- SCREENRECORDING TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedScreenRecordings"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getScreenRecordings"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'VIDEO.ID' | translate }}</th>
+                <th md-column md-order-by="rating">
+                  {{ 'VIDEO.RATING' | translate }}
+                </th>
+                <th md-column md-order-by="UserId">
+                  {{ 'VIDEO.AGENT' | translate }}
+                </th>
+                <th md-column md-order-by="duration">
+                  {{ 'VIDEO.DURATION' | translate }}
+                </th>
+                <th md-column md-order-by="startedAt">
+                  {{ 'VIDEO.RECORDSTARTTIME' | translate }}
+                </th>
+                <th md-column md-order-by="closedAt">
+                  {{ 'VIDEO.RECORDENDTIME' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.screenRecordings.rows.length">
+                <td md-cell colspan="7">
+                  <div layout="row" layout-align="center center">
+                    <span translate="VIDEO.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="screenRecording"
+                md-select-id="id"
+                ng-repeat="screenRecording in vm.screenRecordings.rows"
+              >
+                <td md-cell ng-if="screenRecording.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{screenRecording.name}}"
+                    ng-src="api/users/{{screenRecording.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!screenRecording.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{screenRecording.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.createOrEditscreenRecording($event, screenRecording)"
+                  md-cell
+                  class="id"
+                >
+                  {{screenRecording.id}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditscreenRecording($event, screenRecording)"
+                  md-cell
+                  class="rating"
+                >
+                  <md-icon
+                    md-font-icon="icon-star"
+                    style="color: red"
+                    ng-show="screenRecording.rating"
+                    ng-repeat="rating in [1,2,3,4,5] | limitTo:screenRecording.rating"
+                  ></md-icon
+                  ><span
+                    ng-hide="screenRecording.rating"
+                    translate="VIDEO.NO_RATING"
+                    >No rating</span
+                  >
+                </td>
+                <td
+                  ng-click="vm.createOrEditscreenRecording($event, screenRecording)"
+                  md-cell
+                  class="UserId"
+                >
+                  {{ (vm.users | filter : {'id':screenRecording.UserId} :
+                  true)[0].fullname }}
+                </td>
+                <td md-cell>
+                  <span
+                    ng-bind="vm.convertDuration(screenRecording.duration)"
+                  ></span>
+                </td>
+                <td
+                  ng-click="vm.createOrEditscreenRecording($event, screenRecording)"
+                  md-cell
+                  class="startedAt"
+                >
+                  {{screenRecording.startedAt | date:'medium' }}
+                </td>
+                <td
+                  ng-click="vm.createOrEditscreenRecording($event, screenRecording)"
+                  md-cell
+                  class="closedAt"
+                >
+                  {{screenRecording.closedAt | date:'medium' }}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="VIDEO.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.playrecording(screenRecording, $event  , 'value'  , 'play_screenrecording'  , 'video' )"
+                          translate="VIDEO.PLAY_SCREENRECORDING"
+                        >
+                          play screenRecording
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.downloadfile2(screenRecording, $event  , 'screen/recordings'   )"
+                          translate="VIDEO.DOWNLOAD_SCREENRECORDING"
+                        >
+                          Download screenRecording
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(screenRecording, $event    )"
+                          translate="VIDEO.DELETE_SCREENRECORDING"
+                        >
+                          Delete screenRecording
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'VIDEO.PAGE' | translate}}:', rowsPerPage: '{{'VIDEO.ROWSPERPAGE' | translate}}:', of: '{{'VIDEO.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.screenRecordings.count}}"
+          md-on-paginate="vm.getScreenRecordings"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / SCREENRECORDING TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- NO ADD BUTTON BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/voice/views/chanSpies/chanSpies.html/chanSpies-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/chanSpies/chanSpies.html/chanSpies-[chunkhash].html
deleted file mode 100644
index 8cd063e..0000000
--- a/public/src/js/modules/main/apps/voice/views/chanSpies/chanSpies.html/chanSpies-[chunkhash].html
+++ /dev/null
@@ -1,333 +0,0 @@
-<div
-  id="chanSpies"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-phone" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="VOICE.CHANSPIES">ChanSpies</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="VOICE.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedChanSpies.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedChanSpies =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="VOICE.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-chanSpies-count">
-          <span>{{vm.selectedChanSpies.length}}</span>
-          <span translate="VOICE.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="VOICE.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllChanSpies()"
-                translate="VOICE.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectChanSpies()"
-                translate="VOICE.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedChanSpies"
-          csv-label="true"
-          filename="chanSpies.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedChanSpies($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="VOICE.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- CHANSPY TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedChanSpies"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getChanSpies"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'VOICE.ID' | translate }}</th>
-                <th md-column md-order-by="name">
-                  {{ 'VOICE.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="prefix">
-                  {{ 'VOICE.PREFIX' | translate }}
-                </th>
-                <th md-column md-order-by="auth">
-                  {{ 'VOICE.AUTH' | translate }}
-                </th>
-                <th md-column md-order-by="record">
-                  {{ 'VOICE.RECORD' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'VOICE.DESCRIPTION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.chanSpies.rows.length">
-                <td md-cell colspan="7">
-                  <div layout="row" layout-align="center center">
-                    <span translate="VOICE.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="chanSpy"
-                md-select-id="id"
-                ng-repeat="chanSpy in vm.chanSpies.rows"
-              >
-                <td md-cell ng-if="chanSpy.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{chanSpy.name}}"
-                    ng-src="api/users/{{chanSpy.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!chanSpy.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{chanSpy.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.createOrEditchanSpy($event, chanSpy)"
-                  md-cell
-                  class="id"
-                >
-                  {{chanSpy.id}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditchanSpy($event, chanSpy)"
-                  md-cell
-                  class="name"
-                >
-                  {{chanSpy.name}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditchanSpy($event, chanSpy)"
-                  md-cell
-                  class="prefix"
-                >
-                  {{chanSpy.prefix}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(chanSpy, ev) : vm.createOrEditchanSpy($event, chanSpy)"
-                  md-cell
-                  class="auth"
-                >
-                  <md-icon
-                    md-colors="{color: {{chanSpy.auth ? '\'green\'' : '\'grey\''}}}"
-                    md-font-icon="{{chanSpy.auth ? 'icon-check' : 'icon-close'}}"
-                  ></md-icon>
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(chanSpy, ev) : vm.createOrEditchanSpy($event, chanSpy)"
-                  md-cell
-                  class="record"
-                >
-                  <md-icon
-                    md-colors="{color: {{chanSpy.record ? '\'green\'' : '\'grey\''}}}"
-                    md-font-icon="{{chanSpy.record ? 'icon-check' : 'icon-close'}}"
-                  ></md-icon>
-                </td>
-                <td
-                  ng-click="vm.createOrEditchanSpy($event, chanSpy)"
-                  md-cell
-                  class="description"
-                >
-                  {{chanSpy.description}}
-                </td>
-
-                <td
-                  md-cell
-                  class="actions"
-                  ng-if="!vm.crudPermissions.readOnly"
-                >
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="VOICE.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editdialog(chanSpy, $event    )"
-                          translate="VOICE.EDIT_CHANSPY"
-                        >
-                          Edit chanSpy
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(chanSpy, $event    )"
-                          translate="VOICE.DELETE_CHANSPY"
-                        >
-                          Delete chanSpy
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.chanSpies.count}}"
-          md-on-paginate="vm.getChanSpies"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / CHANSPY TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD CHANSPY BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-chanSpy-button"
-    ng-click="vm.createOrEditchanSpy($event)"
-    aria-label="add chanSpy"
-    translate
-    translate-attr-aria-label="VOICE.ADD_CHANSPY"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD CHANSPY BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/voice/views/chanSpies/chanSpies.html/chanSpies.html b/public/src/js/modules/main/apps/voice/views/chanSpies/chanSpies.html/chanSpies.html
new file mode 100644
index 0000000..8cd063e
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/chanSpies/chanSpies.html/chanSpies.html
@@ -0,0 +1,333 @@
+<div
+  id="chanSpies"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-phone" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="VOICE.CHANSPIES">ChanSpies</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="VOICE.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedChanSpies.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedChanSpies =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="VOICE.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-chanSpies-count">
+          <span>{{vm.selectedChanSpies.length}}</span>
+          <span translate="VOICE.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="VOICE.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllChanSpies()"
+                translate="VOICE.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectChanSpies()"
+                translate="VOICE.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedChanSpies"
+          csv-label="true"
+          filename="chanSpies.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedChanSpies($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="VOICE.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- CHANSPY TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedChanSpies"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getChanSpies"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'VOICE.ID' | translate }}</th>
+                <th md-column md-order-by="name">
+                  {{ 'VOICE.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="prefix">
+                  {{ 'VOICE.PREFIX' | translate }}
+                </th>
+                <th md-column md-order-by="auth">
+                  {{ 'VOICE.AUTH' | translate }}
+                </th>
+                <th md-column md-order-by="record">
+                  {{ 'VOICE.RECORD' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'VOICE.DESCRIPTION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.chanSpies.rows.length">
+                <td md-cell colspan="7">
+                  <div layout="row" layout-align="center center">
+                    <span translate="VOICE.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="chanSpy"
+                md-select-id="id"
+                ng-repeat="chanSpy in vm.chanSpies.rows"
+              >
+                <td md-cell ng-if="chanSpy.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{chanSpy.name}}"
+                    ng-src="api/users/{{chanSpy.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!chanSpy.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{chanSpy.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.createOrEditchanSpy($event, chanSpy)"
+                  md-cell
+                  class="id"
+                >
+                  {{chanSpy.id}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditchanSpy($event, chanSpy)"
+                  md-cell
+                  class="name"
+                >
+                  {{chanSpy.name}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditchanSpy($event, chanSpy)"
+                  md-cell
+                  class="prefix"
+                >
+                  {{chanSpy.prefix}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(chanSpy, ev) : vm.createOrEditchanSpy($event, chanSpy)"
+                  md-cell
+                  class="auth"
+                >
+                  <md-icon
+                    md-colors="{color: {{chanSpy.auth ? '\'green\'' : '\'grey\''}}}"
+                    md-font-icon="{{chanSpy.auth ? 'icon-check' : 'icon-close'}}"
+                  ></md-icon>
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(chanSpy, ev) : vm.createOrEditchanSpy($event, chanSpy)"
+                  md-cell
+                  class="record"
+                >
+                  <md-icon
+                    md-colors="{color: {{chanSpy.record ? '\'green\'' : '\'grey\''}}}"
+                    md-font-icon="{{chanSpy.record ? 'icon-check' : 'icon-close'}}"
+                  ></md-icon>
+                </td>
+                <td
+                  ng-click="vm.createOrEditchanSpy($event, chanSpy)"
+                  md-cell
+                  class="description"
+                >
+                  {{chanSpy.description}}
+                </td>
+
+                <td
+                  md-cell
+                  class="actions"
+                  ng-if="!vm.crudPermissions.readOnly"
+                >
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="VOICE.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editdialog(chanSpy, $event    )"
+                          translate="VOICE.EDIT_CHANSPY"
+                        >
+                          Edit chanSpy
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(chanSpy, $event    )"
+                          translate="VOICE.DELETE_CHANSPY"
+                        >
+                          Delete chanSpy
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.chanSpies.count}}"
+          md-on-paginate="vm.getChanSpies"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / CHANSPY TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD CHANSPY BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-chanSpy-button"
+    ng-click="vm.createOrEditchanSpy($event)"
+    aria-label="add chanSpy"
+    translate
+    translate-attr-aria-label="VOICE.ADD_CHANSPY"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD CHANSPY BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/voice/views/chanSpies/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/chanSpies/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index af37aa2..0000000
--- a/public/src/js/modules/main/apps/voice/views/chanSpies/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,286 +0,0 @@
-<md-dialog class="chanSpy-dialog" aria-label="New chanSpy">
-  <form name="chanSpyForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.chanSpy.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="chanSpyForm['name'].$error"
-          ng-show="chanSpyForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.PREFIX">Prefix</label>
-        <input
-          type="text"
-          name="prefix"
-          ng-model="vm.chanSpy.prefix"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="chanSpyForm['prefix'].$error"
-          ng-show="chanSpyForm['prefix'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.PREFIX_REQUIRED"
-              >Prefix field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.OPTIONS">Options</label>
-        <md-select
-          name="options"
-          ng-model="vm.chanSpy.options"
-          multiple
-          required
-        >
-          <md-option ng-value="'b'"
-            >b: Only spy on channels involved in a bridged call.</md-option
-          >
-          <md-option ng-value="'B'"
-            >B: Instead of whispering on a single channel barge in on both
-            channels involved in the call.</md-option
-          >
-          <md-option ng-value="'E'"
-            >E: Exit when the spied-on channel hangs up.</md-option
-          >
-          <md-option ng-value="'o'"
-            >o: Only listen to audio coming from this channel.</md-option
-          >
-          <md-option ng-value="'q'"
-            >q: Don't play a beep when beginning to spy on a channel, or speak
-            the selected channel name.</md-option
-          >
-          <md-option ng-value="'s'"
-            >s: Skip the playback of the channel type (i.e. SIP, IAX, etc) when
-            speaking the selected channel name.</md-option
-          >
-          <md-option ng-value="'S'"
-            >S: Stop when no more channels are left to spy on.</md-option
-          >
-          <md-option ng-value="'w'"
-            >w: Enable whisper mode, so the spying channel can talk to the
-            spied-on channel.</md-option
-          >
-          <md-option ng-value="'W'"
-            >W: Enable private whisper mode, so the spying channel can talk to
-            the spied-on channel but cannot listen to that channel.</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="chanSpyForm['options'].$error"
-          ng-show="chanSpyForm['options'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
-              >Options field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <md-switch ng-model="vm.chanSpy.auth" aria-label="Auth"
-          ><span translate="VOICE.AUTH">Auth</span></md-switch
-        >
-      </md-input-container>
-      <md-input-container class="md-block" ng-if="vm.chanSpy.auth">
-        <label translate="VOICE.PASSWORD">Password</label>
-        <input
-          type="password"
-          name="password"
-          ng-model="vm.chanSpy.password"
-          placeholder="Password"
-          translate
-          translate-attr-placeholder="VOICE.PASSWORD"
-          required
-        />
-        <div ng-messages="chanSpyForm['password'].$error" role="alert">
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.PASSWORD_REQUIRED"
-              >Password field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span translate="VOICE.ERRORS.SECURE_PASSWORD_PATTERN"
-              >Must contain at least 8 characters, with a minimum of 1 lowercase
-              letter, 1 uppercase letter, 1 numeric character and 1 special
-              character ~!?*@#$%^&-_=+[{]}.</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <md-input-container class="md-block">
-        <md-switch ng-model="vm.chanSpy.record" aria-label="Record"
-          ><span translate="VOICE.RECORD">Record</span></md-switch
-        >
-      </md-input-container>
-      <md-input-container ng-if="vm.chanSpy.record" class="md-block">
-        <label translate="VOICE.RECORDINGFORMAT">recordingFormat</label>
-        <md-select
-          name="recordingFormat"
-          ng-model="vm.chanSpy.recordingFormat"
-          required
-        >
-          <md-option ng-value="'wav'">wav</md-option>
-          <md-option ng-value="'gsm'">gsm</md-option>
-          <md-option ng-value="'WAV'">wav49</md-option>
-        </md-select>
-        <div
-          ng-messages="chanSpyForm['recordingFormat'].$error"
-          ng-show="chanSpyForm['recordingFormat'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.RECORDINGFORMAT_REQUIRED"
-              >recordingFormat field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.chanSpy.description"
-        />
-
-        <div
-          ng-messages="chanSpyForm['description'].$error"
-          ng-show="chanSpyForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newchanSpy"
-          ng-click="vm.savechanSpy()"
-          class="send-button md-accent md-raised"
-          ng-disabled="chanSpyForm.$invalid || chanSpyForm.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newchanSpy"
-          ng-click="vm.addNewchanSpy()"
-          class="send-button md-accent md-raised"
-          ng-disabled="chanSpyForm.$invalid"
-          aria-label="ADD"
-          translate="VOICE.ADD_CHANSPY"
-          translate-attr-aria-label="VOICE.ADD_CHANSPY"
-        >
-          ADD CHANSPY
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newchanSpy"
-          ng-click="vm.deletechanSpy($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="VOICE.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="VOICE.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/chanSpies/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/chanSpies/create/dialog.html/dialog.html
new file mode 100644
index 0000000..af37aa2
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/chanSpies/create/dialog.html/dialog.html
@@ -0,0 +1,286 @@
+<md-dialog class="chanSpy-dialog" aria-label="New chanSpy">
+  <form name="chanSpyForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.chanSpy.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="chanSpyForm['name'].$error"
+          ng-show="chanSpyForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.PREFIX">Prefix</label>
+        <input
+          type="text"
+          name="prefix"
+          ng-model="vm.chanSpy.prefix"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="chanSpyForm['prefix'].$error"
+          ng-show="chanSpyForm['prefix'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.PREFIX_REQUIRED"
+              >Prefix field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.OPTIONS">Options</label>
+        <md-select
+          name="options"
+          ng-model="vm.chanSpy.options"
+          multiple
+          required
+        >
+          <md-option ng-value="'b'"
+            >b: Only spy on channels involved in a bridged call.</md-option
+          >
+          <md-option ng-value="'B'"
+            >B: Instead of whispering on a single channel barge in on both
+            channels involved in the call.</md-option
+          >
+          <md-option ng-value="'E'"
+            >E: Exit when the spied-on channel hangs up.</md-option
+          >
+          <md-option ng-value="'o'"
+            >o: Only listen to audio coming from this channel.</md-option
+          >
+          <md-option ng-value="'q'"
+            >q: Don't play a beep when beginning to spy on a channel, or speak
+            the selected channel name.</md-option
+          >
+          <md-option ng-value="'s'"
+            >s: Skip the playback of the channel type (i.e. SIP, IAX, etc) when
+            speaking the selected channel name.</md-option
+          >
+          <md-option ng-value="'S'"
+            >S: Stop when no more channels are left to spy on.</md-option
+          >
+          <md-option ng-value="'w'"
+            >w: Enable whisper mode, so the spying channel can talk to the
+            spied-on channel.</md-option
+          >
+          <md-option ng-value="'W'"
+            >W: Enable private whisper mode, so the spying channel can talk to
+            the spied-on channel but cannot listen to that channel.</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="chanSpyForm['options'].$error"
+          ng-show="chanSpyForm['options'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
+              >Options field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <md-switch ng-model="vm.chanSpy.auth" aria-label="Auth"
+          ><span translate="VOICE.AUTH">Auth</span></md-switch
+        >
+      </md-input-container>
+      <md-input-container class="md-block" ng-if="vm.chanSpy.auth">
+        <label translate="VOICE.PASSWORD">Password</label>
+        <input
+          type="password"
+          name="password"
+          ng-model="vm.chanSpy.password"
+          placeholder="Password"
+          translate
+          translate-attr-placeholder="VOICE.PASSWORD"
+          required
+        />
+        <div ng-messages="chanSpyForm['password'].$error" role="alert">
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.PASSWORD_REQUIRED"
+              >Password field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span translate="VOICE.ERRORS.SECURE_PASSWORD_PATTERN"
+              >Must contain at least 8 characters, with a minimum of 1 lowercase
+              letter, 1 uppercase letter, 1 numeric character and 1 special
+              character ~!?*@#$%^&-_=+[{]}.</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <md-input-container class="md-block">
+        <md-switch ng-model="vm.chanSpy.record" aria-label="Record"
+          ><span translate="VOICE.RECORD">Record</span></md-switch
+        >
+      </md-input-container>
+      <md-input-container ng-if="vm.chanSpy.record" class="md-block">
+        <label translate="VOICE.RECORDINGFORMAT">recordingFormat</label>
+        <md-select
+          name="recordingFormat"
+          ng-model="vm.chanSpy.recordingFormat"
+          required
+        >
+          <md-option ng-value="'wav'">wav</md-option>
+          <md-option ng-value="'gsm'">gsm</md-option>
+          <md-option ng-value="'WAV'">wav49</md-option>
+        </md-select>
+        <div
+          ng-messages="chanSpyForm['recordingFormat'].$error"
+          ng-show="chanSpyForm['recordingFormat'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.RECORDINGFORMAT_REQUIRED"
+              >recordingFormat field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.chanSpy.description"
+        />
+
+        <div
+          ng-messages="chanSpyForm['description'].$error"
+          ng-show="chanSpyForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newchanSpy"
+          ng-click="vm.savechanSpy()"
+          class="send-button md-accent md-raised"
+          ng-disabled="chanSpyForm.$invalid || chanSpyForm.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newchanSpy"
+          ng-click="vm.addNewchanSpy()"
+          class="send-button md-accent md-raised"
+          ng-disabled="chanSpyForm.$invalid"
+          aria-label="ADD"
+          translate="VOICE.ADD_CHANSPY"
+          translate-attr-aria-label="VOICE.ADD_CHANSPY"
+        >
+          ADD CHANSPY
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newchanSpy"
+          ng-click="vm.deletechanSpy($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="VOICE.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="VOICE.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/contexts/contexts.html/contexts-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/contexts/contexts.html/contexts-[chunkhash].html
deleted file mode 100644
index 7165040..0000000
--- a/public/src/js/modules/main/apps/voice/views/contexts/contexts.html/contexts-[chunkhash].html
+++ /dev/null
@@ -1,297 +0,0 @@
-<div
-  id="contexts"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-phone" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="VOICE.CONTEXTS">Contexts</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="VOICE.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedContexts.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedContexts =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="VOICE.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-contexts-count">
-          <span>{{vm.selectedContexts.length}}</span>
-          <span translate="VOICE.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="VOICE.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllContexts()"
-                translate="VOICE.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectContexts()"
-                translate="VOICE.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedContexts"
-          csv-label="true"
-          filename="contexts.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedContexts($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="VOICE.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- CONTEXT TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedContexts"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getContexts"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'VOICE.ID' | translate }}</th>
-                <th md-column md-order-by="name">
-                  {{ 'VOICE.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'VOICE.DESCRIPTION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.contexts.rows.length">
-                <td md-cell colspan="4">
-                  <div layout="row" layout-align="center center">
-                    <span translate="VOICE.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="context"
-                md-select-id="id"
-                ng-repeat="context in vm.contexts.rows"
-              >
-                <td md-cell ng-if="context.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{context.name}}"
-                    ng-src="api/users/{{context.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!context.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{context.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.createOrEditContext($event, context)"
-                  md-cell
-                  class="id"
-                >
-                  {{context.id}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditContext($event, context)"
-                  md-cell
-                  class="name"
-                >
-                  {{context.name}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditContext($event, context)"
-                  md-cell
-                  class="description"
-                >
-                  {{context.description}}
-                </td>
-
-                <td
-                  md-cell
-                  class="actions"
-                  ng-if="!vm.crudPermissions.readOnly"
-                >
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="VOICE.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editdialog(context, $event    )"
-                          translate="VOICE.EDIT_CONTEXT"
-                        >
-                          Edit Context
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(context, $event    )"
-                          translate="VOICE.DELETE_CONTEXT"
-                        >
-                          Delete Context
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.contexts.count}}"
-          md-on-paginate="vm.getContexts"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / CONTEXT TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD CONTEXT BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-context-button"
-    ng-click="vm.createOrEditContext($event)"
-    aria-label="add context"
-    translate
-    translate-attr-aria-label="VOICE.ADD_CONTEXT"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD CONTEXT BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/voice/views/contexts/contexts.html/contexts.html b/public/src/js/modules/main/apps/voice/views/contexts/contexts.html/contexts.html
new file mode 100644
index 0000000..7165040
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/contexts/contexts.html/contexts.html
@@ -0,0 +1,297 @@
+<div
+  id="contexts"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-phone" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="VOICE.CONTEXTS">Contexts</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="VOICE.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedContexts.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedContexts =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="VOICE.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-contexts-count">
+          <span>{{vm.selectedContexts.length}}</span>
+          <span translate="VOICE.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="VOICE.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllContexts()"
+                translate="VOICE.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectContexts()"
+                translate="VOICE.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedContexts"
+          csv-label="true"
+          filename="contexts.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedContexts($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="VOICE.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- CONTEXT TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedContexts"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getContexts"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'VOICE.ID' | translate }}</th>
+                <th md-column md-order-by="name">
+                  {{ 'VOICE.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'VOICE.DESCRIPTION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.contexts.rows.length">
+                <td md-cell colspan="4">
+                  <div layout="row" layout-align="center center">
+                    <span translate="VOICE.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="context"
+                md-select-id="id"
+                ng-repeat="context in vm.contexts.rows"
+              >
+                <td md-cell ng-if="context.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{context.name}}"
+                    ng-src="api/users/{{context.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!context.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{context.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.createOrEditContext($event, context)"
+                  md-cell
+                  class="id"
+                >
+                  {{context.id}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditContext($event, context)"
+                  md-cell
+                  class="name"
+                >
+                  {{context.name}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditContext($event, context)"
+                  md-cell
+                  class="description"
+                >
+                  {{context.description}}
+                </td>
+
+                <td
+                  md-cell
+                  class="actions"
+                  ng-if="!vm.crudPermissions.readOnly"
+                >
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="VOICE.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editdialog(context, $event    )"
+                          translate="VOICE.EDIT_CONTEXT"
+                        >
+                          Edit Context
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(context, $event    )"
+                          translate="VOICE.DELETE_CONTEXT"
+                        >
+                          Delete Context
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.contexts.count}}"
+          md-on-paginate="vm.getContexts"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / CONTEXT TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD CONTEXT BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-context-button"
+    ng-click="vm.createOrEditContext($event)"
+    aria-label="add context"
+    translate
+    translate-attr-aria-label="VOICE.ADD_CONTEXT"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD CONTEXT BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/voice/views/contexts/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/contexts/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 57c6c38..0000000
--- a/public/src/js/modules/main/apps/voice/views/contexts/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,152 +0,0 @@
-<md-dialog class="context-dialog" aria-label="New Context">
-  <form name="contextForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.context.name"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="contextForm['name'].$error"
-          ng-show="contextForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.context.description"
-        />
-
-        <div
-          ng-messages="contextForm['description'].$error"
-          ng-show="contextForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newContext"
-          ng-click="vm.saveContext()"
-          class="send-button md-accent md-raised"
-          ng-disabled="contextForm.$invalid || contextForm.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newContext"
-          ng-click="vm.addNewContext()"
-          class="send-button md-accent md-raised"
-          ng-disabled="contextForm.$invalid"
-          aria-label="ADD"
-          translate="VOICE.ADD_CONTEXT"
-          translate-attr-aria-label="VOICE.ADD_CONTEXT"
-        >
-          ADD CONTEXT
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newContext"
-          ng-click="vm.deleteContext($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="VOICE.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="VOICE.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/contexts/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/contexts/create/dialog.html/dialog.html
new file mode 100644
index 0000000..57c6c38
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/contexts/create/dialog.html/dialog.html
@@ -0,0 +1,152 @@
+<md-dialog class="context-dialog" aria-label="New Context">
+  <form name="contextForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.context.name"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="contextForm['name'].$error"
+          ng-show="contextForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.context.description"
+        />
+
+        <div
+          ng-messages="contextForm['description'].$error"
+          ng-show="contextForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newContext"
+          ng-click="vm.saveContext()"
+          class="send-button md-accent md-raised"
+          ng-disabled="contextForm.$invalid || contextForm.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newContext"
+          ng-click="vm.addNewContext()"
+          class="send-button md-accent md-raised"
+          ng-disabled="contextForm.$invalid"
+          aria-label="ADD"
+          translate="VOICE.ADD_CONTEXT"
+          translate-attr-aria-label="VOICE.ADD_CONTEXT"
+        >
+          ADD CONTEXT
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newContext"
+          ng-click="vm.deleteContext($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="VOICE.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="VOICE.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/inboundroutes/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index b1cf76e..0000000
--- a/public/src/js/modules/main/apps/voice/views/inboundroutes/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,174 +0,0 @@
-<md-dialog class="inboundroute-dialog" aria-label="New InboundRoute">
-  <form name="inboundrouteForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.PHONENUMBER">PhoneNumber</label>
-        <input
-          type="text"
-          name="exten"
-          ng-model="vm.inboundroute.exten"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="inboundrouteForm['exten'].$error"
-          ng-show="inboundrouteForm['exten'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.PHONENUMBER_REQUIRED"
-              >PhoneNumber field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.CONTEXT">Context</label>
-        <md-select name="context" ng-model="vm.inboundroute.context" required>
-          <md-option
-            ng-value="context.name"
-            ng-repeat="context in vm.contexts"
-            ng-disabled="context.canSelect === false"
-            >{{ context.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="inboundrouteForm['context'].$error"
-          ng-show="inboundrouteForm['context'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.CONTEXT_REQUIRED"
-              >Context field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.inboundroute.description"
-        />
-
-        <div
-          ng-messages="inboundrouteForm['description'].$error"
-          ng-show="inboundrouteForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newInboundRoute"
-          ng-click="vm.saveInboundRoute()"
-          class="send-button md-accent md-raised"
-          ng-disabled="inboundrouteForm.$invalid || inboundrouteForm.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newInboundRoute"
-          ng-click="vm.addNewInboundRoute()"
-          class="send-button md-accent md-raised"
-          ng-disabled="inboundrouteForm.$invalid"
-          aria-label="ADD"
-          translate="VOICE.ADD_INBOUNDROUTE"
-          translate-attr-aria-label="VOICE.ADD_INBOUNDROUTE"
-        >
-          ADD INBOUNDROUTE
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newInboundRoute"
-          ng-click="vm.deleteInboundRoute($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="VOICE.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="VOICE.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/inboundroutes/create/dialog.html/dialog.html
new file mode 100644
index 0000000..b1cf76e
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/inboundroutes/create/dialog.html/dialog.html
@@ -0,0 +1,174 @@
+<md-dialog class="inboundroute-dialog" aria-label="New InboundRoute">
+  <form name="inboundrouteForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.PHONENUMBER">PhoneNumber</label>
+        <input
+          type="text"
+          name="exten"
+          ng-model="vm.inboundroute.exten"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="inboundrouteForm['exten'].$error"
+          ng-show="inboundrouteForm['exten'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.PHONENUMBER_REQUIRED"
+              >PhoneNumber field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.CONTEXT">Context</label>
+        <md-select name="context" ng-model="vm.inboundroute.context" required>
+          <md-option
+            ng-value="context.name"
+            ng-repeat="context in vm.contexts"
+            ng-disabled="context.canSelect === false"
+            >{{ context.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="inboundrouteForm['context'].$error"
+          ng-show="inboundrouteForm['context'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.CONTEXT_REQUIRED"
+              >Context field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.inboundroute.description"
+        />
+
+        <div
+          ng-messages="inboundrouteForm['description'].$error"
+          ng-show="inboundrouteForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newInboundRoute"
+          ng-click="vm.saveInboundRoute()"
+          class="send-button md-accent md-raised"
+          ng-disabled="inboundrouteForm.$invalid || inboundrouteForm.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newInboundRoute"
+          ng-click="vm.addNewInboundRoute()"
+          class="send-button md-accent md-raised"
+          ng-disabled="inboundrouteForm.$invalid"
+          aria-label="ADD"
+          translate="VOICE.ADD_INBOUNDROUTE"
+          translate-attr-aria-label="VOICE.ADD_INBOUNDROUTE"
+        >
+          ADD INBOUNDROUTE
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newInboundRoute"
+          ng-click="vm.deleteInboundRoute($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="VOICE.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="VOICE.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/agi/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/agi/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index d027731..0000000
--- a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/agi/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,111 +0,0 @@
-<md-dialog class="inboundroute-dialog" aria-label="New InboundRoute">
-  <form name="inboundrouteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.PROJECT">Project</label>
-        <md-select
-          name="project"
-          ng-model="vm.agi.project"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="'agi://127.0.0.1/square,{{project.name}}'"
-            ng-repeat="project in vm.projects"
-            ng-disabled="project.canSelect === false"
-            >{{ project.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="inboundrouteFormApp['project'].$error"
-          ng-show="inboundrouteFormApp['project'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.PROJECT_REQUIRED"
-              >Project field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveInboundRouteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="inboundrouteFormApp.$invalid || inboundrouteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/agi/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/agi/dialog.html/dialog.html
new file mode 100644
index 0000000..d027731
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/agi/dialog.html/dialog.html
@@ -0,0 +1,111 @@
+<md-dialog class="inboundroute-dialog" aria-label="New InboundRoute">
+  <form name="inboundrouteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.PROJECT">Project</label>
+        <md-select
+          name="project"
+          ng-model="vm.agi.project"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="'agi://127.0.0.1/square,{{project.name}}'"
+            ng-repeat="project in vm.projects"
+            ng-disabled="project.canSelect === false"
+            >{{ project.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="inboundrouteFormApp['project'].$error"
+          ng-show="inboundrouteFormApp['project'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.PROJECT_REQUIRED"
+              >Project field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveInboundRouteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="inboundrouteFormApp.$invalid || inboundrouteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/custom/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/custom/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 3368e92..0000000
--- a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/custom/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,127 +0,0 @@
-<md-dialog class="inboundroute-dialog" aria-label="New InboundRoute">
-  <form name="inboundrouteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.APPLICATION_NAME">Application_Name</label>
-        <input
-          type="text"
-          name="app"
-          ng-model="vm.custom.app"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="inboundrouteFormApp['app'].$error"
-          ng-show="inboundrouteFormApp['app'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.APPLICATION_NAME_REQUIRED"
-              >Application_Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.ARGUMENTS">Arguments</label>
-        <input
-          type="text"
-          name="appdata"
-          ng-model="vm.custom.appdata"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="inboundrouteFormApp['appdata'].$error"
-          ng-show="inboundrouteFormApp['appdata'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.ARGUMENTS_REQUIRED"
-              >Arguments field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveInboundRouteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="inboundrouteFormApp.$invalid || inboundrouteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/custom/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/custom/dialog.html/dialog.html
new file mode 100644
index 0000000..3368e92
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/custom/dialog.html/dialog.html
@@ -0,0 +1,127 @@
+<md-dialog class="inboundroute-dialog" aria-label="New InboundRoute">
+  <form name="inboundrouteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.APPLICATION_NAME">Application_Name</label>
+        <input
+          type="text"
+          name="app"
+          ng-model="vm.custom.app"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="inboundrouteFormApp['app'].$error"
+          ng-show="inboundrouteFormApp['app'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.APPLICATION_NAME_REQUIRED"
+              >Application_Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.ARGUMENTS">Arguments</label>
+        <input
+          type="text"
+          name="appdata"
+          ng-model="vm.custom.appdata"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="inboundrouteFormApp['appdata'].$error"
+          ng-show="inboundrouteFormApp['appdata'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.ARGUMENTS_REQUIRED"
+              >Arguments field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveInboundRouteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="inboundrouteFormApp.$invalid || inboundrouteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/dial/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/dial/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index b1e8ae4..0000000
--- a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/dial/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,177 +0,0 @@
-<md-dialog class="inboundroute-dialog" aria-label="New InboundRoute">
-  <form name="inboundrouteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.TECHNOLOGY/RESOURCE">Technology/Resource</label>
-        <input
-          type="text"
-          name="tech"
-          ng-model="vm.dial.tech"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="inboundrouteFormApp['tech'].$error"
-          ng-show="inboundrouteFormApp['tech'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.TECHNOLOGY/RESOURCE_REQUIRED"
-              >Technology/Resource field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.TIMEOUT">Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.dial.timeout"
-          min="0"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="inboundrouteFormApp['timeout'].$error"
-          ng-show="inboundrouteFormApp['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.TIMEOUT_REQUIRED"
-              >Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="VOICE.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.OPTIONS">Options</label>
-        <input
-          type="text"
-          name="options"
-          ng-model="vm.dial.options"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="inboundrouteFormApp['options'].$error"
-          ng-show="inboundrouteFormApp['options'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
-              >Options field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.URL">Url</label>
-        <input
-          type="text"
-          name="url"
-          ng-model="vm.dial.url"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="inboundrouteFormApp['url'].$error"
-          ng-show="inboundrouteFormApp['url'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.URL_REQUIRED"
-              >Url field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveInboundRouteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="inboundrouteFormApp.$invalid || inboundrouteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/dial/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/dial/dialog.html/dialog.html
new file mode 100644
index 0000000..b1e8ae4
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/dial/dialog.html/dialog.html
@@ -0,0 +1,177 @@
+<md-dialog class="inboundroute-dialog" aria-label="New InboundRoute">
+  <form name="inboundrouteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.TECHNOLOGY/RESOURCE">Technology/Resource</label>
+        <input
+          type="text"
+          name="tech"
+          ng-model="vm.dial.tech"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="inboundrouteFormApp['tech'].$error"
+          ng-show="inboundrouteFormApp['tech'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.TECHNOLOGY/RESOURCE_REQUIRED"
+              >Technology/Resource field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.TIMEOUT">Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.dial.timeout"
+          min="0"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="inboundrouteFormApp['timeout'].$error"
+          ng-show="inboundrouteFormApp['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.TIMEOUT_REQUIRED"
+              >Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="VOICE.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.OPTIONS">Options</label>
+        <input
+          type="text"
+          name="options"
+          ng-model="vm.dial.options"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="inboundrouteFormApp['options'].$error"
+          ng-show="inboundrouteFormApp['options'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
+              >Options field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.URL">Url</label>
+        <input
+          type="text"
+          name="url"
+          ng-model="vm.dial.url"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="inboundrouteFormApp['url'].$error"
+          ng-show="inboundrouteFormApp['url'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.URL_REQUIRED"
+              >Url field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveInboundRouteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="inboundrouteFormApp.$invalid || inboundrouteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/externaldial/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/externaldial/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 8ac8794..0000000
--- a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/externaldial/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,204 +0,0 @@
-<md-dialog class="inboundroute-dialog" aria-label="New InboundRoute">
-  <form name="inboundrouteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.TRUNK">Trunk</label>
-        <md-select
-          name="trunk"
-          ng-model="vm.externaldial.trunk"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="trunk.name"
-            ng-repeat="trunk in vm.trunks"
-            ng-disabled="trunk.canSelect === false"
-            >{{ trunk.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="inboundrouteFormApp['trunk'].$error"
-          ng-show="inboundrouteFormApp['trunk'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.TRUNK_REQUIRED"
-              >Trunk field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.PHONE">Phone</label>
-        <input
-          type="text"
-          name="phone"
-          ng-model="vm.externaldial.phone"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="inboundrouteFormApp['phone'].$error"
-          ng-show="inboundrouteFormApp['phone'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.PHONE_REQUIRED"
-              >Phone field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.TIMEOUT">Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.externaldial.timeout"
-          min="0"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="inboundrouteFormApp['timeout'].$error"
-          ng-show="inboundrouteFormApp['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.TIMEOUT_REQUIRED"
-              >Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="VOICE.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.OPTIONS">Options</label>
-        <input
-          type="text"
-          name="options"
-          ng-model="vm.externaldial.options"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="inboundrouteFormApp['options'].$error"
-          ng-show="inboundrouteFormApp['options'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
-              >Options field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.URL">Url</label>
-        <input
-          type="text"
-          name="url"
-          ng-model="vm.externaldial.url"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="inboundrouteFormApp['url'].$error"
-          ng-show="inboundrouteFormApp['url'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.URL_REQUIRED"
-              >Url field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveInboundRouteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="inboundrouteFormApp.$invalid || inboundrouteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/externaldial/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/externaldial/dialog.html/dialog.html
new file mode 100644
index 0000000..8ac8794
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/externaldial/dialog.html/dialog.html
@@ -0,0 +1,204 @@
+<md-dialog class="inboundroute-dialog" aria-label="New InboundRoute">
+  <form name="inboundrouteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.TRUNK">Trunk</label>
+        <md-select
+          name="trunk"
+          ng-model="vm.externaldial.trunk"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="trunk.name"
+            ng-repeat="trunk in vm.trunks"
+            ng-disabled="trunk.canSelect === false"
+            >{{ trunk.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="inboundrouteFormApp['trunk'].$error"
+          ng-show="inboundrouteFormApp['trunk'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.TRUNK_REQUIRED"
+              >Trunk field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.PHONE">Phone</label>
+        <input
+          type="text"
+          name="phone"
+          ng-model="vm.externaldial.phone"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="inboundrouteFormApp['phone'].$error"
+          ng-show="inboundrouteFormApp['phone'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.PHONE_REQUIRED"
+              >Phone field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.TIMEOUT">Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.externaldial.timeout"
+          min="0"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="inboundrouteFormApp['timeout'].$error"
+          ng-show="inboundrouteFormApp['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.TIMEOUT_REQUIRED"
+              >Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="VOICE.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.OPTIONS">Options</label>
+        <input
+          type="text"
+          name="options"
+          ng-model="vm.externaldial.options"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="inboundrouteFormApp['options'].$error"
+          ng-show="inboundrouteFormApp['options'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
+              >Options field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.URL">Url</label>
+        <input
+          type="text"
+          name="url"
+          ng-model="vm.externaldial.url"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="inboundrouteFormApp['url'].$error"
+          ng-show="inboundrouteFormApp['url'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.URL_REQUIRED"
+              >Url field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveInboundRouteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="inboundrouteFormApp.$invalid || inboundrouteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/goto/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/goto/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index e3c9d03..0000000
--- a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/goto/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,155 +0,0 @@
-<md-dialog class="inboundroute-dialog" aria-label="New InboundRoute">
-  <form name="inboundrouteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.CONTEXT">Context</label>
-        <md-select
-          name="context"
-          ng-model="vm.goto.context"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="context.name"
-            ng-repeat="context in vm.contexts"
-            ng-disabled="context.canSelect === false"
-            >{{ context.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="inboundrouteFormApp['context'].$error"
-          ng-show="inboundrouteFormApp['context'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.CONTEXT_REQUIRED"
-              >Context field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.EXTENSION">Extension</label>
-        <input
-          type="text"
-          name="extension"
-          ng-model="vm.goto.extension"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="inboundrouteFormApp['extension'].$error"
-          ng-show="inboundrouteFormApp['extension'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.EXTENSION_REQUIRED"
-              >Extension field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.PRIORITY">Priority</label>
-        <input
-          type="text"
-          name="priority"
-          ng-model="vm.goto.priority"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="inboundrouteFormApp['priority'].$error"
-          ng-show="inboundrouteFormApp['priority'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.PRIORITY_REQUIRED"
-              >Priority field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveInboundRouteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="inboundrouteFormApp.$invalid || inboundrouteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/goto/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/goto/dialog.html/dialog.html
new file mode 100644
index 0000000..e3c9d03
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/goto/dialog.html/dialog.html
@@ -0,0 +1,155 @@
+<md-dialog class="inboundroute-dialog" aria-label="New InboundRoute">
+  <form name="inboundrouteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.CONTEXT">Context</label>
+        <md-select
+          name="context"
+          ng-model="vm.goto.context"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="context.name"
+            ng-repeat="context in vm.contexts"
+            ng-disabled="context.canSelect === false"
+            >{{ context.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="inboundrouteFormApp['context'].$error"
+          ng-show="inboundrouteFormApp['context'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.CONTEXT_REQUIRED"
+              >Context field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.EXTENSION">Extension</label>
+        <input
+          type="text"
+          name="extension"
+          ng-model="vm.goto.extension"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="inboundrouteFormApp['extension'].$error"
+          ng-show="inboundrouteFormApp['extension'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.EXTENSION_REQUIRED"
+              >Extension field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.PRIORITY">Priority</label>
+        <input
+          type="text"
+          name="priority"
+          ng-model="vm.goto.priority"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="inboundrouteFormApp['priority'].$error"
+          ng-show="inboundrouteFormApp['priority'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.PRIORITY_REQUIRED"
+              >Priority field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveInboundRouteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="inboundrouteFormApp.$invalid || inboundrouteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/hangup/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/hangup/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 2432e07..0000000
--- a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/hangup/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,140 +0,0 @@
-<md-dialog class="inboundroute-dialog" aria-label="New InboundRoute">
-  <form name="inboundrouteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.HANGUP_CAUSE">Hangup_Cause</label>
-        <md-select
-          name="appdata"
-          ng-model="vm.hangup.appdata"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="'1'">
-            {{ 'VOICE.HANGUPCAUSE_1' | translate }}
-          </md-option>
-
-          <md-option ng-value="'16'">
-            {{ 'VOICE.HANGUPCAUSE_16' | translate }}
-          </md-option>
-
-          <md-option ng-value="'17'">
-            {{ 'VOICE.HANGUPCAUSE_17' | translate }}
-          </md-option>
-
-          <md-option ng-value="'18'">
-            {{ 'VOICE.HANGUPCAUSE_18' | translate }}
-          </md-option>
-
-          <md-option ng-value="'21'">
-            {{ 'VOICE.HANGUPCAUSE_21' | translate }}
-          </md-option>
-
-          <md-option ng-value="'22'">
-            {{ 'VOICE.HANGUPCAUSE_22' | translate }}
-          </md-option>
-
-          <md-option ng-value="'27'">
-            {{ 'VOICE.HANGUPCAUSE_27' | translate }}
-          </md-option>
-
-          <md-option ng-value="'38'">
-            {{ 'VOICE.HANGUPCAUSE_38' | translate }}
-          </md-option>
-
-          <md-option ng-value="'41'">
-            {{ 'VOICE.HANGUPCAUSE_41' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="inboundrouteFormApp['appdata'].$error"
-          ng-show="inboundrouteFormApp['appdata'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.HANGUP_CAUSE_REQUIRED"
-              >Hangup_Cause field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveInboundRouteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="inboundrouteFormApp.$invalid || inboundrouteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/hangup/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/hangup/dialog.html/dialog.html
new file mode 100644
index 0000000..2432e07
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/hangup/dialog.html/dialog.html
@@ -0,0 +1,140 @@
+<md-dialog class="inboundroute-dialog" aria-label="New InboundRoute">
+  <form name="inboundrouteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.HANGUP_CAUSE">Hangup_Cause</label>
+        <md-select
+          name="appdata"
+          ng-model="vm.hangup.appdata"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="'1'">
+            {{ 'VOICE.HANGUPCAUSE_1' | translate }}
+          </md-option>
+
+          <md-option ng-value="'16'">
+            {{ 'VOICE.HANGUPCAUSE_16' | translate }}
+          </md-option>
+
+          <md-option ng-value="'17'">
+            {{ 'VOICE.HANGUPCAUSE_17' | translate }}
+          </md-option>
+
+          <md-option ng-value="'18'">
+            {{ 'VOICE.HANGUPCAUSE_18' | translate }}
+          </md-option>
+
+          <md-option ng-value="'21'">
+            {{ 'VOICE.HANGUPCAUSE_21' | translate }}
+          </md-option>
+
+          <md-option ng-value="'22'">
+            {{ 'VOICE.HANGUPCAUSE_22' | translate }}
+          </md-option>
+
+          <md-option ng-value="'27'">
+            {{ 'VOICE.HANGUPCAUSE_27' | translate }}
+          </md-option>
+
+          <md-option ng-value="'38'">
+            {{ 'VOICE.HANGUPCAUSE_38' | translate }}
+          </md-option>
+
+          <md-option ng-value="'41'">
+            {{ 'VOICE.HANGUPCAUSE_41' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="inboundrouteFormApp['appdata'].$error"
+          ng-show="inboundrouteFormApp['appdata'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.HANGUP_CAUSE_REQUIRED"
+              >Hangup_Cause field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveInboundRouteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="inboundrouteFormApp.$invalid || inboundrouteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/internaldial/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/internaldial/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index cdf7c27..0000000
--- a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/internaldial/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,182 +0,0 @@
-<md-dialog class="inboundroute-dialog" aria-label="New InboundRoute">
-  <form name="inboundrouteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.USER">User</label>
-        <md-select
-          name="user"
-          ng-model="vm.internaldial.user"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="'SIP/{{user.name}}'"
-            ng-repeat="user in vm.users"
-            ng-disabled="user.canSelect === false"
-            >{{ user.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="inboundrouteFormApp['user'].$error"
-          ng-show="inboundrouteFormApp['user'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.USER_REQUIRED"
-              >User field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.TIMEOUT">Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.internaldial.timeout"
-          min="0"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="inboundrouteFormApp['timeout'].$error"
-          ng-show="inboundrouteFormApp['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.TIMEOUT_REQUIRED"
-              >Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="VOICE.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.OPTIONS">Options</label>
-        <input
-          type="text"
-          name="options"
-          ng-model="vm.internaldial.options"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="inboundrouteFormApp['options'].$error"
-          ng-show="inboundrouteFormApp['options'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
-              >Options field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.URL">Url</label>
-        <input
-          type="text"
-          name="url"
-          ng-model="vm.internaldial.url"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="inboundrouteFormApp['url'].$error"
-          ng-show="inboundrouteFormApp['url'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.URL_REQUIRED"
-              >Url field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveInboundRouteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="inboundrouteFormApp.$invalid || inboundrouteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/internaldial/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/internaldial/dialog.html/dialog.html
new file mode 100644
index 0000000..cdf7c27
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/internaldial/dialog.html/dialog.html
@@ -0,0 +1,182 @@
+<md-dialog class="inboundroute-dialog" aria-label="New InboundRoute">
+  <form name="inboundrouteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.USER">User</label>
+        <md-select
+          name="user"
+          ng-model="vm.internaldial.user"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="'SIP/{{user.name}}'"
+            ng-repeat="user in vm.users"
+            ng-disabled="user.canSelect === false"
+            >{{ user.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="inboundrouteFormApp['user'].$error"
+          ng-show="inboundrouteFormApp['user'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.USER_REQUIRED"
+              >User field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.TIMEOUT">Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.internaldial.timeout"
+          min="0"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="inboundrouteFormApp['timeout'].$error"
+          ng-show="inboundrouteFormApp['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.TIMEOUT_REQUIRED"
+              >Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="VOICE.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.OPTIONS">Options</label>
+        <input
+          type="text"
+          name="options"
+          ng-model="vm.internaldial.options"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="inboundrouteFormApp['options'].$error"
+          ng-show="inboundrouteFormApp['options'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
+              >Options field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.URL">Url</label>
+        <input
+          type="text"
+          name="url"
+          ng-model="vm.internaldial.url"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="inboundrouteFormApp['url'].$error"
+          ng-show="inboundrouteFormApp['url'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.URL_REQUIRED"
+              >Url field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveInboundRouteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="inboundrouteFormApp.$invalid || inboundrouteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/interval/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/interval/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index ca0ed91..0000000
--- a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/interval/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,313 +0,0 @@
-<md-dialog class="inboundroute-dialog" aria-label="New Interval">
-  <form name="intervalForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <md-input-container class="md-block">
-        <label translate="TOOLS.TYPE">Type</label>
-        <md-select
-          ng-model="vm.type"
-          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="type" ng-repeat="type in vm.types"
-            >{{ type | ucfirst }}</md-option
-          >
-        </md-select>
-      </md-input-container>
-
-      <md-input-container class="md-block" ng-if="vm.type === 'list'">
-        <label translate="TOOLS.INTERVALS">Intervals</label>
-        <md-select
-          ng-model="vm.interval.IntervalId"
-          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="interval.id" ng-repeat="interval in vm.intervals"
-            >{{ interval.name }}</md-option
-          >
-        </md-select>
-      </md-input-container>
-
-      <!-- TIMERANGE START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.TIME_RANGE"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <div class="md-block" flex>
-          <mdp-time-picker
-            name="timeRangeFrom"
-            mdp-placeholder="FROM"
-            ng-model="vm.timeRangeFrom"
-            mdp-format="HH:mm"
-            mdp-auto-switch="true"
-            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <div
-              ng-messages="intervalForm.timeRangeFrom.$error"
-              ng-show="intervalForm.timeRangeFrom.$touched"
-              role="alert"
-            >
-              <div ng-message="format">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_FROM_INVALID"
-                  >Time Range From field is invalid</span
-                >
-              </div>
-            </div>
-          </mdp-time-picker>
-        </div>
-        <div class="md-block" flex ng-if="vm.timeRangeFrom">
-          <mdp-time-picker
-            name="timeRangeTo"
-            mdp-placeholder="TO*"
-            ng-model="vm.timeRangeTo"
-            mdp-format="HH:mm"
-            mdp-auto-switch="true"
-            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-            required
-          >
-            <div
-              ng-messages="intervalForm.timeRangeTo.$error"
-              ng-show="intervalForm.timeRangeTo.$invalid"
-              role="alert"
-            >
-              <div ng-message="format">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_INVALID"
-                  >Time Range To field is invalid</span
-                >
-              </div>
-              <div ng-message="required">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_REQUIRED"
-                  >Time Range To field is required</span
-                >
-              </div>
-            </div>
-          </mdp-time-picker>
-        </div>
-      </div>
-      <!-- TIMERANGE END -->
-
-      <!-- DAYSOFWEEK START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.WEEK_DAYS"
-        >Week Days</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.dayOfWeekFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
-              ><span translate="TOOLS.{{day.value | uppercase}}"
-                >{{ day.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container flex class="md-block" ng-if="vm.dayOfWeekFrom">
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="dayOfWeekTo"
-            ng-model="vm.dayOfWeekTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
-              ><span translate="TOOLS.{{day.value | uppercase}}"
-                >{{ day.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.dayOfWeekTo.$error"
-            ng-show="intervalForm.dayOfWeekTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- DAYSOFWEEK END -->
-
-      <!-- MONTHDAY START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTH_DAYS"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex layout="column" class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.monthDayFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
-              >{{ month }}</md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container
-          flex
-          layout="column"
-          class="md-block"
-          ng-if="vm.monthDayFrom"
-        >
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="monthDayTo"
-            ng-model="vm.monthDayTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
-              >{{ month }}</md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.monthDayTo.$error"
-            ng-show="intervalForm.monthDayTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- MONTHDAY END -->
-
-      <!-- MONTH START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTHS"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex layout="column" class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.monthFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
-              ><span translate="TOOLS.{{month.value | uppercase}}"
-                >{{ month.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container
-          flex
-          layout="column"
-          class="md-block"
-          ng-if="vm.monthFrom"
-        >
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="monthTo"
-            ng-model="vm.monthTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
-              ><span translate="TOOLS.{{month.value | uppercase}}"
-                >{{ month.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.monthTo.$error"
-            ng-show="intervalForm.monthTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- MONTH END -->
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="!vm.newInterval && vm.crudPermissions.canEdit"
-          ng-click="vm.saveInterval()"
-          class="send-button md-accent md-raised"
-          ng-disabled="intervalForm.$invalid || intervalForm.$pristine"
-          aria-label="SAVE"
-          translate="TOOLS.SAVE"
-          translate-attr-aria-label="TOOLS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.newInterval && vm.crudPermissions.canEdit"
-          ng-click="vm.addNewInterval()"
-          class="send-button md-accent md-raised"
-          ng-disabled="intervalForm.$invalid"
-          aria-label="ADD"
-          translate="TOOLS.ADD_INTERVAL"
-          translate-attr-aria-label="TOOLS.ADD_INTERVAL"
-        >
-          ADD INTERVAL
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/interval/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/interval/dialog.html/dialog.html
new file mode 100644
index 0000000..ca0ed91
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/interval/dialog.html/dialog.html
@@ -0,0 +1,313 @@
+<md-dialog class="inboundroute-dialog" aria-label="New Interval">
+  <form name="intervalForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <md-input-container class="md-block">
+        <label translate="TOOLS.TYPE">Type</label>
+        <md-select
+          ng-model="vm.type"
+          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="type" ng-repeat="type in vm.types"
+            >{{ type | ucfirst }}</md-option
+          >
+        </md-select>
+      </md-input-container>
+
+      <md-input-container class="md-block" ng-if="vm.type === 'list'">
+        <label translate="TOOLS.INTERVALS">Intervals</label>
+        <md-select
+          ng-model="vm.interval.IntervalId"
+          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="interval.id" ng-repeat="interval in vm.intervals"
+            >{{ interval.name }}</md-option
+          >
+        </md-select>
+      </md-input-container>
+
+      <!-- TIMERANGE START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.TIME_RANGE"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <div class="md-block" flex>
+          <mdp-time-picker
+            name="timeRangeFrom"
+            mdp-placeholder="FROM"
+            ng-model="vm.timeRangeFrom"
+            mdp-format="HH:mm"
+            mdp-auto-switch="true"
+            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <div
+              ng-messages="intervalForm.timeRangeFrom.$error"
+              ng-show="intervalForm.timeRangeFrom.$touched"
+              role="alert"
+            >
+              <div ng-message="format">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_FROM_INVALID"
+                  >Time Range From field is invalid</span
+                >
+              </div>
+            </div>
+          </mdp-time-picker>
+        </div>
+        <div class="md-block" flex ng-if="vm.timeRangeFrom">
+          <mdp-time-picker
+            name="timeRangeTo"
+            mdp-placeholder="TO*"
+            ng-model="vm.timeRangeTo"
+            mdp-format="HH:mm"
+            mdp-auto-switch="true"
+            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+            required
+          >
+            <div
+              ng-messages="intervalForm.timeRangeTo.$error"
+              ng-show="intervalForm.timeRangeTo.$invalid"
+              role="alert"
+            >
+              <div ng-message="format">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_INVALID"
+                  >Time Range To field is invalid</span
+                >
+              </div>
+              <div ng-message="required">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_REQUIRED"
+                  >Time Range To field is required</span
+                >
+              </div>
+            </div>
+          </mdp-time-picker>
+        </div>
+      </div>
+      <!-- TIMERANGE END -->
+
+      <!-- DAYSOFWEEK START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.WEEK_DAYS"
+        >Week Days</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.dayOfWeekFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
+              ><span translate="TOOLS.{{day.value | uppercase}}"
+                >{{ day.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container flex class="md-block" ng-if="vm.dayOfWeekFrom">
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="dayOfWeekTo"
+            ng-model="vm.dayOfWeekTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
+              ><span translate="TOOLS.{{day.value | uppercase}}"
+                >{{ day.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.dayOfWeekTo.$error"
+            ng-show="intervalForm.dayOfWeekTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- DAYSOFWEEK END -->
+
+      <!-- MONTHDAY START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTH_DAYS"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex layout="column" class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.monthDayFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
+              >{{ month }}</md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container
+          flex
+          layout="column"
+          class="md-block"
+          ng-if="vm.monthDayFrom"
+        >
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="monthDayTo"
+            ng-model="vm.monthDayTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
+              >{{ month }}</md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.monthDayTo.$error"
+            ng-show="intervalForm.monthDayTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- MONTHDAY END -->
+
+      <!-- MONTH START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTHS"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex layout="column" class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.monthFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
+              ><span translate="TOOLS.{{month.value | uppercase}}"
+                >{{ month.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container
+          flex
+          layout="column"
+          class="md-block"
+          ng-if="vm.monthFrom"
+        >
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="monthTo"
+            ng-model="vm.monthTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
+              ><span translate="TOOLS.{{month.value | uppercase}}"
+                >{{ month.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.monthTo.$error"
+            ng-show="intervalForm.monthTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- MONTH END -->
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="!vm.newInterval && vm.crudPermissions.canEdit"
+          ng-click="vm.saveInterval()"
+          class="send-button md-accent md-raised"
+          ng-disabled="intervalForm.$invalid || intervalForm.$pristine"
+          aria-label="SAVE"
+          translate="TOOLS.SAVE"
+          translate-attr-aria-label="TOOLS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.newInterval && vm.crudPermissions.canEdit"
+          ng-click="vm.addNewInterval()"
+          class="send-button md-accent md-raised"
+          ng-disabled="intervalForm.$invalid"
+          aria-label="ADD"
+          translate="TOOLS.ADD_INTERVAL"
+          translate-attr-aria-label="TOOLS.ADD_INTERVAL"
+        >
+          ADD INTERVAL
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/playback/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/playback/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 0658a87..0000000
--- a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/playback/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,140 +0,0 @@
-<md-dialog class="inboundroute-dialog" aria-label="New InboundRoute">
-  <form name="inboundrouteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.AUDIO_FILES">Audio_Files</label>
-        <md-select
-          name="appdata"
-          ng-model="vm.playback.appdata"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="'/var/opt/motion2/server/files/sounds/converted/{{appdata.save_name}}'"
-            ng-repeat="appdata in vm.sounds"
-            ng-disabled="appdata.canSelect === false"
-            >{{ appdata.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="inboundrouteFormApp['appdata'].$error"
-          ng-show="inboundrouteFormApp['appdata'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.AUDIO_FILES_REQUIRED"
-              >Audio_Files field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.OPTIONS">Options</label>
-        <input
-          type="text"
-          name="options"
-          ng-model="vm.playback.options"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="inboundrouteFormApp['options'].$error"
-          ng-show="inboundrouteFormApp['options'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
-              >Options field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <md-switch
-          ng-model="vm.playback.answer"
-          aria-label="Answer"
-          ng-disabled="!vm.crudPermissions.canEdit"
-          ><span translate="VOICE.ANSWER">Answer</span></md-switch
-        >
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveInboundRouteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="inboundrouteFormApp.$invalid || inboundrouteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/playback/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/playback/dialog.html/dialog.html
new file mode 100644
index 0000000..0658a87
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/playback/dialog.html/dialog.html
@@ -0,0 +1,140 @@
+<md-dialog class="inboundroute-dialog" aria-label="New InboundRoute">
+  <form name="inboundrouteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.AUDIO_FILES">Audio_Files</label>
+        <md-select
+          name="appdata"
+          ng-model="vm.playback.appdata"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="'/var/opt/motion2/server/files/sounds/converted/{{appdata.save_name}}'"
+            ng-repeat="appdata in vm.sounds"
+            ng-disabled="appdata.canSelect === false"
+            >{{ appdata.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="inboundrouteFormApp['appdata'].$error"
+          ng-show="inboundrouteFormApp['appdata'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.AUDIO_FILES_REQUIRED"
+              >Audio_Files field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.OPTIONS">Options</label>
+        <input
+          type="text"
+          name="options"
+          ng-model="vm.playback.options"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="inboundrouteFormApp['options'].$error"
+          ng-show="inboundrouteFormApp['options'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
+              >Options field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <md-switch
+          ng-model="vm.playback.answer"
+          aria-label="Answer"
+          ng-disabled="!vm.crudPermissions.canEdit"
+          ><span translate="VOICE.ANSWER">Answer</span></md-switch
+        >
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveInboundRouteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="inboundrouteFormApp.$invalid || inboundrouteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/queue/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/queue/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 902a4c4..0000000
--- a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/queue/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,330 +0,0 @@
-<md-dialog class="inboundroute-dialog" aria-label="New InboundRoute">
-  <form name="inboundrouteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.QUEUE">Queue</label>
-        <md-select
-          name="queue"
-          ng-model="vm.queue.queue"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="queue.name"
-            ng-repeat="queue in vm.queues"
-            ng-disabled="queue.canSelect === false"
-            >{{ queue.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="inboundrouteFormApp['queue'].$error"
-          ng-show="inboundrouteFormApp['queue'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.QUEUE_REQUIRED"
-              >Queue field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.OPTIONS">Options</label>
-        <input
-          type="text"
-          name="options"
-          ng-model="vm.queue.options"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="inboundrouteFormApp['options'].$error"
-          ng-show="inboundrouteFormApp['options'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
-              >Options field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.URL">Url</label>
-        <input
-          type="text"
-          name="URL"
-          ng-model="vm.queue.URL"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="inboundrouteFormApp['URL'].$error"
-          ng-show="inboundrouteFormApp['URL'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.URL_REQUIRED"
-              >Url field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.ANNOUNCE_OVERRIDES">Announce_Overrides</label>
-        <md-select
-          name="sound"
-          ng-model="vm.queue.sound"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="''">None</md-option>
-          <md-option
-            ng-value="'/var/opt/motion2/server/files/sounds/converted/{{sound.save_name}}'"
-            ng-repeat="sound in vm.sounds"
-            ng-disabled="sound.canSelect === false"
-            >{{ sound.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="inboundrouteFormApp['sound'].$error"
-          ng-show="inboundrouteFormApp['sound'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.ANNOUNCE_OVERRIDES_REQUIRED"
-              >Announce_Overrides field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.TIMEOUT">Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.queue.timeout"
-          min="0"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="inboundrouteFormApp['timeout'].$error"
-          ng-show="inboundrouteFormApp['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.TIMEOUT_REQUIRED"
-              >Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="VOICE.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.AGI">Agi</label>
-        <input
-          type="text"
-          name="agi"
-          ng-model="vm.queue.agi"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="inboundrouteFormApp['agi'].$error"
-          ng-show="inboundrouteFormApp['agi'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.AGI_REQUIRED"
-              >Agi field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.MACRO">Macro</label>
-        <input
-          type="text"
-          name="macro"
-          ng-model="vm.queue.macro"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="inboundrouteFormApp['macro'].$error"
-          ng-show="inboundrouteFormApp['macro'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.MACRO_REQUIRED"
-              >Macro field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.GOSUB">GoSub</label>
-        <input
-          type="text"
-          name="gosub"
-          ng-model="vm.queue.gosub"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="inboundrouteFormApp['gosub'].$error"
-          ng-show="inboundrouteFormApp['gosub'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.GOSUB_REQUIRED"
-              >GoSub field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.RULE">Rule</label>
-        <input
-          type="text"
-          name="rule"
-          ng-model="vm.queue.rule"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="inboundrouteFormApp['rule'].$error"
-          ng-show="inboundrouteFormApp['rule'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.RULE_REQUIRED"
-              >Rule field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.POSITION">Position</label>
-        <input
-          type="number"
-          name="position"
-          ng-model="vm.queue.position"
-          min="0"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="inboundrouteFormApp['position'].$error"
-          ng-show="inboundrouteFormApp['position'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.POSITION_REQUIRED"
-              >Position field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="VOICE.ERRORS.POSITION_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Position must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <md-switch
-          ng-model="vm.queue.answer"
-          aria-label="Answer"
-          ng-disabled="!vm.crudPermissions.canEdit"
-          ><span translate="VOICE.ANSWER">Answer</span></md-switch
-        >
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveInboundRouteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="inboundrouteFormApp.$invalid || inboundrouteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/queue/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/queue/dialog.html/dialog.html
new file mode 100644
index 0000000..902a4c4
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/queue/dialog.html/dialog.html
@@ -0,0 +1,330 @@
+<md-dialog class="inboundroute-dialog" aria-label="New InboundRoute">
+  <form name="inboundrouteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.QUEUE">Queue</label>
+        <md-select
+          name="queue"
+          ng-model="vm.queue.queue"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="queue.name"
+            ng-repeat="queue in vm.queues"
+            ng-disabled="queue.canSelect === false"
+            >{{ queue.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="inboundrouteFormApp['queue'].$error"
+          ng-show="inboundrouteFormApp['queue'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.QUEUE_REQUIRED"
+              >Queue field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.OPTIONS">Options</label>
+        <input
+          type="text"
+          name="options"
+          ng-model="vm.queue.options"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="inboundrouteFormApp['options'].$error"
+          ng-show="inboundrouteFormApp['options'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
+              >Options field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.URL">Url</label>
+        <input
+          type="text"
+          name="URL"
+          ng-model="vm.queue.URL"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="inboundrouteFormApp['URL'].$error"
+          ng-show="inboundrouteFormApp['URL'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.URL_REQUIRED"
+              >Url field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.ANNOUNCE_OVERRIDES">Announce_Overrides</label>
+        <md-select
+          name="sound"
+          ng-model="vm.queue.sound"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="''">None</md-option>
+          <md-option
+            ng-value="'/var/opt/motion2/server/files/sounds/converted/{{sound.save_name}}'"
+            ng-repeat="sound in vm.sounds"
+            ng-disabled="sound.canSelect === false"
+            >{{ sound.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="inboundrouteFormApp['sound'].$error"
+          ng-show="inboundrouteFormApp['sound'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.ANNOUNCE_OVERRIDES_REQUIRED"
+              >Announce_Overrides field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.TIMEOUT">Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.queue.timeout"
+          min="0"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="inboundrouteFormApp['timeout'].$error"
+          ng-show="inboundrouteFormApp['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.TIMEOUT_REQUIRED"
+              >Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="VOICE.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.AGI">Agi</label>
+        <input
+          type="text"
+          name="agi"
+          ng-model="vm.queue.agi"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="inboundrouteFormApp['agi'].$error"
+          ng-show="inboundrouteFormApp['agi'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.AGI_REQUIRED"
+              >Agi field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.MACRO">Macro</label>
+        <input
+          type="text"
+          name="macro"
+          ng-model="vm.queue.macro"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="inboundrouteFormApp['macro'].$error"
+          ng-show="inboundrouteFormApp['macro'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.MACRO_REQUIRED"
+              >Macro field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.GOSUB">GoSub</label>
+        <input
+          type="text"
+          name="gosub"
+          ng-model="vm.queue.gosub"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="inboundrouteFormApp['gosub'].$error"
+          ng-show="inboundrouteFormApp['gosub'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.GOSUB_REQUIRED"
+              >GoSub field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.RULE">Rule</label>
+        <input
+          type="text"
+          name="rule"
+          ng-model="vm.queue.rule"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="inboundrouteFormApp['rule'].$error"
+          ng-show="inboundrouteFormApp['rule'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.RULE_REQUIRED"
+              >Rule field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.POSITION">Position</label>
+        <input
+          type="number"
+          name="position"
+          ng-model="vm.queue.position"
+          min="0"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="inboundrouteFormApp['position'].$error"
+          ng-show="inboundrouteFormApp['position'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.POSITION_REQUIRED"
+              >Position field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="VOICE.ERRORS.POSITION_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Position must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <md-switch
+          ng-model="vm.queue.answer"
+          aria-label="Answer"
+          ng-disabled="!vm.crudPermissions.canEdit"
+          ><span translate="VOICE.ANSWER">Answer</span></md-switch
+        >
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveInboundRouteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="inboundrouteFormApp.$invalid || inboundrouteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/ringgroup/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/ringgroup/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index af05e93..0000000
--- a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/ringgroup/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,183 +0,0 @@
-<md-dialog class="inboundroute-dialog" aria-label="New InboundRoute">
-  <form name="inboundrouteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.USER">User</label>
-        <md-select
-          name="multipleUsers"
-          ng-model="vm.ringgroup.multipleUsers"
-          autofocus
-          multiple
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="'SIP/{{multipleUsers.name}}'"
-            ng-repeat="multipleUsers in vm.users"
-            ng-disabled="multipleUsers.canSelect === false"
-            >{{ multipleUsers.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="inboundrouteFormApp['multipleUsers'].$error"
-          ng-show="inboundrouteFormApp['multipleUsers'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.USER_REQUIRED"
-              >User field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.TIMEOUT">Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.ringgroup.timeout"
-          min="0"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="inboundrouteFormApp['timeout'].$error"
-          ng-show="inboundrouteFormApp['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.TIMEOUT_REQUIRED"
-              >Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="VOICE.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.OPTIONS">Options</label>
-        <input
-          type="text"
-          name="options"
-          ng-model="vm.ringgroup.options"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="inboundrouteFormApp['options'].$error"
-          ng-show="inboundrouteFormApp['options'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
-              >Options field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.URL">Url</label>
-        <input
-          type="text"
-          name="url"
-          ng-model="vm.ringgroup.url"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="inboundrouteFormApp['url'].$error"
-          ng-show="inboundrouteFormApp['url'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.URL_REQUIRED"
-              >Url field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveInboundRouteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="inboundrouteFormApp.$invalid || inboundrouteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/ringgroup/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/ringgroup/dialog.html/dialog.html
new file mode 100644
index 0000000..af05e93
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/ringgroup/dialog.html/dialog.html
@@ -0,0 +1,183 @@
+<md-dialog class="inboundroute-dialog" aria-label="New InboundRoute">
+  <form name="inboundrouteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.USER">User</label>
+        <md-select
+          name="multipleUsers"
+          ng-model="vm.ringgroup.multipleUsers"
+          autofocus
+          multiple
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="'SIP/{{multipleUsers.name}}'"
+            ng-repeat="multipleUsers in vm.users"
+            ng-disabled="multipleUsers.canSelect === false"
+            >{{ multipleUsers.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="inboundrouteFormApp['multipleUsers'].$error"
+          ng-show="inboundrouteFormApp['multipleUsers'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.USER_REQUIRED"
+              >User field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.TIMEOUT">Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.ringgroup.timeout"
+          min="0"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="inboundrouteFormApp['timeout'].$error"
+          ng-show="inboundrouteFormApp['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.TIMEOUT_REQUIRED"
+              >Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="VOICE.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.OPTIONS">Options</label>
+        <input
+          type="text"
+          name="options"
+          ng-model="vm.ringgroup.options"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="inboundrouteFormApp['options'].$error"
+          ng-show="inboundrouteFormApp['options'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
+              >Options field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.URL">Url</label>
+        <input
+          type="text"
+          name="url"
+          ng-model="vm.ringgroup.url"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="inboundrouteFormApp['url'].$error"
+          ng-show="inboundrouteFormApp['url'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.URL_REQUIRED"
+              >Url field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveInboundRouteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="inboundrouteFormApp.$invalid || inboundrouteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/set/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/set/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index b0fb773..0000000
--- a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/set/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,133 +0,0 @@
-<md-dialog class="inboundroute-dialog" aria-label="New InboundRoute">
-  <form name="inboundrouteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.VARIABLE">Variable</label>
-        <md-select
-          name="name"
-          ng-model="vm.set.name"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="name.name"
-            ng-repeat="name in vm.variables"
-            ng-disabled="name.canSelect === false"
-            >{{ name.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="inboundrouteFormApp['name'].$error"
-          ng-show="inboundrouteFormApp['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.VARIABLE_REQUIRED"
-              >Variable field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.VALUE">Value</label>
-        <input
-          type="text"
-          name="value"
-          ng-model="vm.set.value"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="inboundrouteFormApp['value'].$error"
-          ng-show="inboundrouteFormApp['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.VALUE_REQUIRED"
-              >Value field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveInboundRouteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="inboundrouteFormApp.$invalid || inboundrouteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/set/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/set/dialog.html/dialog.html
new file mode 100644
index 0000000..b0fb773
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/set/dialog.html/dialog.html
@@ -0,0 +1,133 @@
+<md-dialog class="inboundroute-dialog" aria-label="New InboundRoute">
+  <form name="inboundrouteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.VARIABLE">Variable</label>
+        <md-select
+          name="name"
+          ng-model="vm.set.name"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="name.name"
+            ng-repeat="name in vm.variables"
+            ng-disabled="name.canSelect === false"
+            >{{ name.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="inboundrouteFormApp['name'].$error"
+          ng-show="inboundrouteFormApp['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.VARIABLE_REQUIRED"
+              >Variable field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.VALUE">Value</label>
+        <input
+          type="text"
+          name="value"
+          ng-model="vm.set.value"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="inboundrouteFormApp['value'].$error"
+          ng-show="inboundrouteFormApp['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.VALUE_REQUIRED"
+              >Value field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveInboundRouteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="inboundrouteFormApp.$invalid || inboundrouteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/voicemail/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/voicemail/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 15c0954..0000000
--- a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/voicemail/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,132 +0,0 @@
-<md-dialog class="inboundroute-dialog" aria-label="New InboundRoute">
-  <form name="inboundrouteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.MAILBOX@CONTEXT">Mailbox@Context</label>
-        <md-select
-          name="voiceMail"
-          ng-model="vm.voicemail.voiceMail"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="'{{voiceMail.mailbox}}@from-voicemail'"
-            ng-repeat="voiceMail in vm.voiceMails"
-            ng-disabled="voiceMail.canSelect === false"
-            >{{ voiceMail.mailbox }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="inboundrouteFormApp['voiceMail'].$error"
-          ng-show="inboundrouteFormApp['voiceMail'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.MAILBOX@CONTEXT_REQUIRED"
-              >Mailbox@Context field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.OPTIONS">Options</label>
-        <input
-          type="text"
-          name="options"
-          ng-model="vm.voicemail.options"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="inboundrouteFormApp['options'].$error"
-          ng-show="inboundrouteFormApp['options'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
-              >Options field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveInboundRouteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="inboundrouteFormApp.$invalid || inboundrouteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/voicemail/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/voicemail/dialog.html/dialog.html
new file mode 100644
index 0000000..15c0954
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/apps/voicemail/dialog.html/dialog.html
@@ -0,0 +1,132 @@
+<md-dialog class="inboundroute-dialog" aria-label="New InboundRoute">
+  <form name="inboundrouteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.MAILBOX@CONTEXT">Mailbox@Context</label>
+        <md-select
+          name="voiceMail"
+          ng-model="vm.voicemail.voiceMail"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="'{{voiceMail.mailbox}}@from-voicemail'"
+            ng-repeat="voiceMail in vm.voiceMails"
+            ng-disabled="voiceMail.canSelect === false"
+            >{{ voiceMail.mailbox }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="inboundrouteFormApp['voiceMail'].$error"
+          ng-show="inboundrouteFormApp['voiceMail'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.MAILBOX@CONTEXT_REQUIRED"
+              >Mailbox@Context field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.OPTIONS">Options</label>
+        <input
+          type="text"
+          name="options"
+          ng-model="vm.voicemail.options"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="inboundrouteFormApp['options'].$error"
+          ng-show="inboundrouteFormApp['options'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
+              >Options field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveInboundRouteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="inboundrouteFormApp.$invalid || inboundrouteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index 7f022ca..0000000
--- a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,403 +0,0 @@
-<div id="voice-inboundroute" class="page-layout simple tabbed" layout="column">
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-inboundroutes-button md-icon-button"
-        aria-label="Go to inboundroutes"
-        ng-click="vm.gotoInboundRoutes()"
-        translate
-        translate-attr-aria-label="VOICE.GO_TO_INBOUNDROUTES"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="inboundroute-image" hide-xs>
-          <img ng-src="assets/images/business/inboundroutes.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.inboundroute.id}}
-            <span ng-if="vm.inboundroute.name">{{vm.inboundroute.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="VOICE.CREATED_AT"></span>
-            <span>{{vm.inboundroute.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveInboundRoute()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (actionsForm.$invalid)"
-        translate="VOICE.SAVE"
-        translate-attr-aria-label="VOICE.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="VOICE.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="inboundroute-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="VOICE.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="VOICE.PHONENUMBER">PhoneNumber</label>
-                <input
-                  type="text"
-                  name="exten"
-                  ng-model="vm.inboundroute.exten"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['exten'].$error"
-                  ng-show="generalForm['exten'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.PHONENUMBER_REQUIRED"
-                      >PhoneNumber field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.CONTEXT">Context</label>
-                <md-select
-                  name="context"
-                  ng-model="vm.inboundroute.context"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="context.name"
-                    ng-repeat="context in vm.contexts"
-                    ng-disabled="context.canSelect === false"
-                    >{{ context.name }}</md-option
-                  >
-                </md-select>
-                <div
-                  ng-messages="generalForm['context'].$error"
-                  ng-show="generalForm['context'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.CONTEXT_REQUIRED"
-                      >Context field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.inboundroute.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="VOICE.ACTIONS">ACTIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="inboundroute-detail-form-container actions md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="InboundRouteActionsController as vm_ac"
-              ng-init="vm_ac.init(vm.inboundroute, vm.crudPermissions)"
-              class="content"
-              md-background-bg
-              layout="row"
-              layout-align="start start"
-            >
-              <!-- SIDENAV -->
-              <div
-                class="navigation-simple sidenav main-sidenav md-background-bg md-whiteframe-1dp"
-                ms-scroll
-                layout="column"
-                flex="20"
-                ng-if="vm_ac.crudPermissions.canEdit"
-              >
-                <!-- SIDENAV CONTENT -->
-                <md-list class="no-padding">
-                  <md-subheader class="md-no-sticky">
-                    <span translate="VOICE.APPLICATIONS_LIST">
-                      Applications List
-                    </span>
-                  </md-subheader>
-                </md-list>
-                <md-divider></md-divider>
-                <md-list ng-sortable="vm_ac.list">
-                  <md-list-item class="handle" ng-repeat="a in vm_ac.apps">
-                    <md-icon md-font-icon="{{a.icon}}" class="s16"></md-icon>
-                    <p
-                      class="text-truncate"
-                      translate="VOICE.{{(a.alias || a.appType) | uppercase}}"
-                    >
-                      {{a.alias || a.appType}}
-                    </p>
-                  </md-list-item>
-                </md-list>
-                <!-- / SIDENAV CONTENT -->
-              </div>
-              <!-- / SIDENAV -->
-              <div flex></div>
-              <!-- MAIN -->
-              <div
-                class="main scrollable md-background-bg md-whiteframe-1dp"
-                ms-scroll
-                layout="column"
-                flex="{{vm_ac.crudPermissions.canEdit ? 75 : 100}}"
-              >
-                <md-toolbar
-                  class="md-table-toolbar md-default"
-                  ng-hide="vm_ac.selectedInboundRouteApps.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead">Drag & Drop Routing</span>
-                    <div flex></div>
-                    <ms-search-bar
-                      on-search="vm_ac.query.filter = query"
-                      on-collapse="vm_ac.query.filter = undefined"
-                      debounce="300"
-                    ></ms-search-bar>
-                  </div>
-                </md-toolbar>
-                <md-toolbar
-                  class="md-table-toolbar md-accent"
-                  ng-show="vm_ac.selectedInboundRouteApps.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead"
-                      >{{vm_ac.selectedInboundRouteApps.length}}
-                      {{vm_ac.selectedInboundRouteApps.length > 1 ? 'items' :
-                      'item'}} selected</span
-                    >
-                    <div flex></div>
-                    <md-button
-                      ng-if="vm_ac.crudPermissions.canDelete"
-                      class="md-icon-button"
-                      ng-click="vm_ac.deleteSelectedInboundRouteApps($event)"
-                      aria-label="delete selected"
-                      translate
-                      translate-attr-label="VOICE.DELETE_SELECTED"
-                    >
-                      <md-icon md-font-icon="icon-delete"></md-icon>
-                    </md-button>
-                  </div>
-                </md-toolbar>
-
-                <!-- QUEUES TABLE -->
-                <md-table-container>
-                  <table
-                    md-table
-                    md-row-select
-                    multiple
-                    ng-model="vm_ac.selectedInboundRouteApps"
-                  >
-                    <thead md-head>
-                      <tr md-row>
-                        <th md-column width="10px"></th>
-                        <th md-column>
-                          <span>Type</span>
-                        </th>
-                        <th md-column>
-                          <span>Appdata</span>
-                        </th>
-                        <th md-column>
-                          <span>Interval</span>
-                        </th>
-                        <th md-column width="10px"></th>
-                        <th md-column width="10px"></th>
-                      </tr>
-                    </thead>
-                    <tbody md-body ng-sortable="vm_ac.applications">
-                      <tr
-                        md-row
-                        md-select="app"
-                        md-select-id="id"
-                        ng-repeat="app in vm_ac.inboundrouteApps.rows | filter: vm_ac.query.filter"
-                      >
-                        <td md-cell>
-                          <md-icon
-                            md-font-icon="icon-drag-vertical"
-                            class="s16 handle"
-                          ></md-icon>
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editInboundRouteApp($event, $index)"
-                        >
-                          {{app.app.toLowerCase() === 'agi' ? 'Cally-Square' :
-                          app.app | ucfirst}}<span
-                            ng-if="app.appType.toLowerCase() === 'custom'"
-                            >*</span
-                          >
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editInboundRouteApp($event, $index)"
-                        >
-                          <span class="text-truncate" style="width: 200px"
-                            >{{app.appdata}}</span
-                          >
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editInterval($event, $index)"
-                        >
-                          {{app.IntervalId ? 'From List' : app.interval}}
-                        </td>
-                        <td md-cell>
-                          <md-button
-                            ng-click="vm_ac.editInterval($event, $index)"
-                            class="md-icon-button"
-                            aria-label="Interval"
-                          >
-                            <md-icon md-font-icon="icon-timer"></md-icon>
-                            <md-tooltip>
-                              {{app.IntervalId ? 'From List' : (app.interval ===
-                              '*,*,*,*' ? 'Always' : 'Custom')}}
-                            </md-tooltip>
-                          </md-button>
-                        </td>
-                        <td
-                          md-cell
-                          class="actions"
-                          ng-if="!vm_ac.crudPermissions.readOnly"
-                        >
-                          <md-menu>
-                            <md-button
-                              class="md-icon-button"
-                              aria-label="More"
-                              translate
-                              translate-attr-aria-label="VOICE.MORE"
-                              ng-click="$mdOpenMenu($event)"
-                            >
-                              <md-icon
-                                md-font-icon="icon-dots-vertical"
-                              ></md-icon>
-                            </md-button>
-
-                            <md-menu-content width="3">
-                              <md-menu-item
-                                ng-if="vm_ac.crudPermissions.canEdit"
-                              >
-                                <md-button
-                                  ng-click="vm_ac.editInboundRouteApp($event, $index)"
-                                  translate="VOICE.EDIT_APP"
-                                >
-                                  Edit App
-                                </md-button>
-                              </md-menu-item>
-                              <md-menu-item
-                                ng-if="vm_ac.crudPermissions.canEdit"
-                              >
-                                <md-button
-                                  ng-click="vm_ac.editInterval($event, $index)"
-                                  translate="VOICE.EDIT_INTERVAL"
-                                >
-                                  Edit Interval
-                                </md-button>
-                              </md-menu-item>
-                              <md-menu-item
-                                ng-if="vm_ac.crudPermissions.canDelete"
-                              >
-                                <md-button
-                                  ng-click="vm_ac.deleteConfirm(app, $index, $event)"
-                                  translate="VOICE.DELETE_APP"
-                                >
-                                  Delete App
-                                </md-button>
-                              </md-menu-item>
-                            </md-menu-content>
-                          </md-menu>
-                        </td>
-                      </tr>
-                      <tr md-row ng-hide="vm_ac.inboundrouteApps.rows.length">
-                        <td md-cell colspan="6">
-                          <span
-                            class="text-boxed-light"
-                            translate="VOICE.NO_APPS_AVAILABLE"
-                            >No apps available</span
-                          >
-                        </td>
-                      </tr>
-                    </tbody>
-                    <tfoot md-foot>
-                      <tr md-row>
-                        <td md-cell colspan="7">
-                          <span
-                            ><em translate="VOICE.LEGEND.CUSTOM_APPLICATION"
-                              >(*) - Custom application.</em
-                            ></span
-                          >
-                        </td>
-                      </tr>
-                    </tfoot>
-                  </table>
-                </md-table-container>
-                <!-- / QUEUES TABLE -->
-
-                <!-- NO RESULTS -->
-
-                <!-- / NO RESULTS -->
-              </div>
-              <!-- / MAIN -->
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/view.html/view.html b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/view.html/view.html
new file mode 100644
index 0000000..7f022ca
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/inboundroutes/edit/view.html/view.html
@@ -0,0 +1,403 @@
+<div id="voice-inboundroute" class="page-layout simple tabbed" layout="column">
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-inboundroutes-button md-icon-button"
+        aria-label="Go to inboundroutes"
+        ng-click="vm.gotoInboundRoutes()"
+        translate
+        translate-attr-aria-label="VOICE.GO_TO_INBOUNDROUTES"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="inboundroute-image" hide-xs>
+          <img ng-src="assets/images/business/inboundroutes.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.inboundroute.id}}
+            <span ng-if="vm.inboundroute.name">{{vm.inboundroute.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="VOICE.CREATED_AT"></span>
+            <span>{{vm.inboundroute.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveInboundRoute()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (actionsForm.$invalid)"
+        translate="VOICE.SAVE"
+        translate-attr-aria-label="VOICE.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="VOICE.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="inboundroute-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="VOICE.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="VOICE.PHONENUMBER">PhoneNumber</label>
+                <input
+                  type="text"
+                  name="exten"
+                  ng-model="vm.inboundroute.exten"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['exten'].$error"
+                  ng-show="generalForm['exten'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.PHONENUMBER_REQUIRED"
+                      >PhoneNumber field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.CONTEXT">Context</label>
+                <md-select
+                  name="context"
+                  ng-model="vm.inboundroute.context"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="context.name"
+                    ng-repeat="context in vm.contexts"
+                    ng-disabled="context.canSelect === false"
+                    >{{ context.name }}</md-option
+                  >
+                </md-select>
+                <div
+                  ng-messages="generalForm['context'].$error"
+                  ng-show="generalForm['context'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.CONTEXT_REQUIRED"
+                      >Context field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.inboundroute.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="VOICE.ACTIONS">ACTIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="inboundroute-detail-form-container actions md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="InboundRouteActionsController as vm_ac"
+              ng-init="vm_ac.init(vm.inboundroute, vm.crudPermissions)"
+              class="content"
+              md-background-bg
+              layout="row"
+              layout-align="start start"
+            >
+              <!-- SIDENAV -->
+              <div
+                class="navigation-simple sidenav main-sidenav md-background-bg md-whiteframe-1dp"
+                ms-scroll
+                layout="column"
+                flex="20"
+                ng-if="vm_ac.crudPermissions.canEdit"
+              >
+                <!-- SIDENAV CONTENT -->
+                <md-list class="no-padding">
+                  <md-subheader class="md-no-sticky">
+                    <span translate="VOICE.APPLICATIONS_LIST">
+                      Applications List
+                    </span>
+                  </md-subheader>
+                </md-list>
+                <md-divider></md-divider>
+                <md-list ng-sortable="vm_ac.list">
+                  <md-list-item class="handle" ng-repeat="a in vm_ac.apps">
+                    <md-icon md-font-icon="{{a.icon}}" class="s16"></md-icon>
+                    <p
+                      class="text-truncate"
+                      translate="VOICE.{{(a.alias || a.appType) | uppercase}}"
+                    >
+                      {{a.alias || a.appType}}
+                    </p>
+                  </md-list-item>
+                </md-list>
+                <!-- / SIDENAV CONTENT -->
+              </div>
+              <!-- / SIDENAV -->
+              <div flex></div>
+              <!-- MAIN -->
+              <div
+                class="main scrollable md-background-bg md-whiteframe-1dp"
+                ms-scroll
+                layout="column"
+                flex="{{vm_ac.crudPermissions.canEdit ? 75 : 100}}"
+              >
+                <md-toolbar
+                  class="md-table-toolbar md-default"
+                  ng-hide="vm_ac.selectedInboundRouteApps.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead">Drag & Drop Routing</span>
+                    <div flex></div>
+                    <ms-search-bar
+                      on-search="vm_ac.query.filter = query"
+                      on-collapse="vm_ac.query.filter = undefined"
+                      debounce="300"
+                    ></ms-search-bar>
+                  </div>
+                </md-toolbar>
+                <md-toolbar
+                  class="md-table-toolbar md-accent"
+                  ng-show="vm_ac.selectedInboundRouteApps.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead"
+                      >{{vm_ac.selectedInboundRouteApps.length}}
+                      {{vm_ac.selectedInboundRouteApps.length > 1 ? 'items' :
+                      'item'}} selected</span
+                    >
+                    <div flex></div>
+                    <md-button
+                      ng-if="vm_ac.crudPermissions.canDelete"
+                      class="md-icon-button"
+                      ng-click="vm_ac.deleteSelectedInboundRouteApps($event)"
+                      aria-label="delete selected"
+                      translate
+                      translate-attr-label="VOICE.DELETE_SELECTED"
+                    >
+                      <md-icon md-font-icon="icon-delete"></md-icon>
+                    </md-button>
+                  </div>
+                </md-toolbar>
+
+                <!-- QUEUES TABLE -->
+                <md-table-container>
+                  <table
+                    md-table
+                    md-row-select
+                    multiple
+                    ng-model="vm_ac.selectedInboundRouteApps"
+                  >
+                    <thead md-head>
+                      <tr md-row>
+                        <th md-column width="10px"></th>
+                        <th md-column>
+                          <span>Type</span>
+                        </th>
+                        <th md-column>
+                          <span>Appdata</span>
+                        </th>
+                        <th md-column>
+                          <span>Interval</span>
+                        </th>
+                        <th md-column width="10px"></th>
+                        <th md-column width="10px"></th>
+                      </tr>
+                    </thead>
+                    <tbody md-body ng-sortable="vm_ac.applications">
+                      <tr
+                        md-row
+                        md-select="app"
+                        md-select-id="id"
+                        ng-repeat="app in vm_ac.inboundrouteApps.rows | filter: vm_ac.query.filter"
+                      >
+                        <td md-cell>
+                          <md-icon
+                            md-font-icon="icon-drag-vertical"
+                            class="s16 handle"
+                          ></md-icon>
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editInboundRouteApp($event, $index)"
+                        >
+                          {{app.app.toLowerCase() === 'agi' ? 'Cally-Square' :
+                          app.app | ucfirst}}<span
+                            ng-if="app.appType.toLowerCase() === 'custom'"
+                            >*</span
+                          >
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editInboundRouteApp($event, $index)"
+                        >
+                          <span class="text-truncate" style="width: 200px"
+                            >{{app.appdata}}</span
+                          >
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editInterval($event, $index)"
+                        >
+                          {{app.IntervalId ? 'From List' : app.interval}}
+                        </td>
+                        <td md-cell>
+                          <md-button
+                            ng-click="vm_ac.editInterval($event, $index)"
+                            class="md-icon-button"
+                            aria-label="Interval"
+                          >
+                            <md-icon md-font-icon="icon-timer"></md-icon>
+                            <md-tooltip>
+                              {{app.IntervalId ? 'From List' : (app.interval ===
+                              '*,*,*,*' ? 'Always' : 'Custom')}}
+                            </md-tooltip>
+                          </md-button>
+                        </td>
+                        <td
+                          md-cell
+                          class="actions"
+                          ng-if="!vm_ac.crudPermissions.readOnly"
+                        >
+                          <md-menu>
+                            <md-button
+                              class="md-icon-button"
+                              aria-label="More"
+                              translate
+                              translate-attr-aria-label="VOICE.MORE"
+                              ng-click="$mdOpenMenu($event)"
+                            >
+                              <md-icon
+                                md-font-icon="icon-dots-vertical"
+                              ></md-icon>
+                            </md-button>
+
+                            <md-menu-content width="3">
+                              <md-menu-item
+                                ng-if="vm_ac.crudPermissions.canEdit"
+                              >
+                                <md-button
+                                  ng-click="vm_ac.editInboundRouteApp($event, $index)"
+                                  translate="VOICE.EDIT_APP"
+                                >
+                                  Edit App
+                                </md-button>
+                              </md-menu-item>
+                              <md-menu-item
+                                ng-if="vm_ac.crudPermissions.canEdit"
+                              >
+                                <md-button
+                                  ng-click="vm_ac.editInterval($event, $index)"
+                                  translate="VOICE.EDIT_INTERVAL"
+                                >
+                                  Edit Interval
+                                </md-button>
+                              </md-menu-item>
+                              <md-menu-item
+                                ng-if="vm_ac.crudPermissions.canDelete"
+                              >
+                                <md-button
+                                  ng-click="vm_ac.deleteConfirm(app, $index, $event)"
+                                  translate="VOICE.DELETE_APP"
+                                >
+                                  Delete App
+                                </md-button>
+                              </md-menu-item>
+                            </md-menu-content>
+                          </md-menu>
+                        </td>
+                      </tr>
+                      <tr md-row ng-hide="vm_ac.inboundrouteApps.rows.length">
+                        <td md-cell colspan="6">
+                          <span
+                            class="text-boxed-light"
+                            translate="VOICE.NO_APPS_AVAILABLE"
+                            >No apps available</span
+                          >
+                        </td>
+                      </tr>
+                    </tbody>
+                    <tfoot md-foot>
+                      <tr md-row>
+                        <td md-cell colspan="7">
+                          <span
+                            ><em translate="VOICE.LEGEND.CUSTOM_APPLICATION"
+                              >(*) - Custom application.</em
+                            ></span
+                          >
+                        </td>
+                      </tr>
+                    </tfoot>
+                  </table>
+                </md-table-container>
+                <!-- / QUEUES TABLE -->
+
+                <!-- NO RESULTS -->
+
+                <!-- / NO RESULTS -->
+              </div>
+              <!-- / MAIN -->
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/inboundroutes.html/inboundroutes-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/inboundroutes/inboundroutes.html/inboundroutes-[chunkhash].html
deleted file mode 100644
index a8a9c79..0000000
--- a/public/src/js/modules/main/apps/voice/views/inboundroutes/inboundroutes.html/inboundroutes-[chunkhash].html
+++ /dev/null
@@ -1,299 +0,0 @@
-<div
-  id="inboundroutes"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-phone" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="VOICE.INBOUNDROUTES"
-          >InboundRoutes</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="VOICE.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedInboundRoutes.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedInboundRoutes =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="VOICE.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-inboundroutes-count">
-          <span>{{vm.selectedInboundRoutes.length}}</span>
-          <span translate="VOICE.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="VOICE.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllInboundRoutes()"
-                translate="VOICE.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectInboundRoutes()"
-                translate="VOICE.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedInboundRoutes"
-          csv-label="true"
-          filename="inboundroutes.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedInboundRoutes($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="VOICE.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- INBOUNDROUTE TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedInboundRoutes"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getInboundRoutes"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'VOICE.ID' | translate }}</th>
-                <th md-column md-order-by="exten">
-                  {{ 'VOICE.PHONENUMBER' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'VOICE.DESCRIPTION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.inboundroutes.rows.length">
-                <td md-cell colspan="4">
-                  <div layout="row" layout-align="center center">
-                    <span translate="VOICE.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="inboundroute"
-                md-select-id="id"
-                ng-repeat="inboundroute in vm.inboundroutes.rows"
-              >
-                <td md-cell ng-if="inboundroute.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{inboundroute.name}}"
-                    ng-src="api/users/{{inboundroute.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!inboundroute.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{inboundroute.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(inboundroute, ev) : vm.createOrEditInboundRoute($event, inboundroute)"
-                  md-cell
-                  class="id"
-                >
-                  {{inboundroute.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(inboundroute, ev) : vm.createOrEditInboundRoute($event, inboundroute)"
-                  md-cell
-                  class="exten"
-                >
-                  {{inboundroute.exten}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(inboundroute, ev) : vm.createOrEditInboundRoute($event, inboundroute)"
-                  md-cell
-                  class="description"
-                >
-                  {{inboundroute.description}}
-                </td>
-
-                <td
-                  md-cell
-                  class="actions"
-                  ng-if="!vm.crudPermissions.readOnly"
-                >
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="VOICE.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(inboundroute, $event    )"
-                          translate="VOICE.EDIT_INBOUNDROUTE"
-                        >
-                          Edit InboundRoute
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(inboundroute, $event    )"
-                          translate="VOICE.DELETE_INBOUNDROUTE"
-                        >
-                          Delete InboundRoute
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.inboundroutes.count}}"
-          md-on-paginate="vm.getInboundRoutes"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / INBOUNDROUTE TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD INBOUNDROUTE BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-inboundroute-button"
-    ng-click="vm.createOrEditInboundRoute($event)"
-    aria-label="add inboundroute"
-    translate
-    translate-attr-aria-label="VOICE.ADD_INBOUNDROUTE"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD INBOUNDROUTE BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/voice/views/inboundroutes/inboundroutes.html/inboundroutes.html b/public/src/js/modules/main/apps/voice/views/inboundroutes/inboundroutes.html/inboundroutes.html
new file mode 100644
index 0000000..a8a9c79
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/inboundroutes/inboundroutes.html/inboundroutes.html
@@ -0,0 +1,299 @@
+<div
+  id="inboundroutes"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-phone" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="VOICE.INBOUNDROUTES"
+          >InboundRoutes</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="VOICE.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedInboundRoutes.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedInboundRoutes =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="VOICE.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-inboundroutes-count">
+          <span>{{vm.selectedInboundRoutes.length}}</span>
+          <span translate="VOICE.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="VOICE.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllInboundRoutes()"
+                translate="VOICE.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectInboundRoutes()"
+                translate="VOICE.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedInboundRoutes"
+          csv-label="true"
+          filename="inboundroutes.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedInboundRoutes($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="VOICE.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- INBOUNDROUTE TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedInboundRoutes"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getInboundRoutes"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'VOICE.ID' | translate }}</th>
+                <th md-column md-order-by="exten">
+                  {{ 'VOICE.PHONENUMBER' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'VOICE.DESCRIPTION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.inboundroutes.rows.length">
+                <td md-cell colspan="4">
+                  <div layout="row" layout-align="center center">
+                    <span translate="VOICE.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="inboundroute"
+                md-select-id="id"
+                ng-repeat="inboundroute in vm.inboundroutes.rows"
+              >
+                <td md-cell ng-if="inboundroute.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{inboundroute.name}}"
+                    ng-src="api/users/{{inboundroute.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!inboundroute.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{inboundroute.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(inboundroute, ev) : vm.createOrEditInboundRoute($event, inboundroute)"
+                  md-cell
+                  class="id"
+                >
+                  {{inboundroute.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(inboundroute, ev) : vm.createOrEditInboundRoute($event, inboundroute)"
+                  md-cell
+                  class="exten"
+                >
+                  {{inboundroute.exten}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(inboundroute, ev) : vm.createOrEditInboundRoute($event, inboundroute)"
+                  md-cell
+                  class="description"
+                >
+                  {{inboundroute.description}}
+                </td>
+
+                <td
+                  md-cell
+                  class="actions"
+                  ng-if="!vm.crudPermissions.readOnly"
+                >
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="VOICE.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(inboundroute, $event    )"
+                          translate="VOICE.EDIT_INBOUNDROUTE"
+                        >
+                          Edit InboundRoute
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(inboundroute, $event    )"
+                          translate="VOICE.DELETE_INBOUNDROUTE"
+                        >
+                          Delete InboundRoute
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.inboundroutes.count}}"
+          md-on-paginate="vm.getInboundRoutes"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / INBOUNDROUTE TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD INBOUNDROUTE BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-inboundroute-button"
+    ng-click="vm.createOrEditInboundRoute($event)"
+    aria-label="add inboundroute"
+    translate
+    translate-attr-aria-label="VOICE.ADD_INBOUNDROUTE"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD INBOUNDROUTE BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/internalroutes/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 932a7a5..0000000
--- a/public/src/js/modules/main/apps/voice/views/internalroutes/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,174 +0,0 @@
-<md-dialog class="internalroute-dialog" aria-label="New InternalRoute">
-  <form name="internalrouteForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.PHONENUMBER">PhoneNumber</label>
-        <input
-          type="text"
-          name="exten"
-          ng-model="vm.internalroute.exten"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="internalrouteForm['exten'].$error"
-          ng-show="internalrouteForm['exten'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.PHONENUMBER_REQUIRED"
-              >PhoneNumber field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.CONTEXT">Context</label>
-        <md-select name="context" ng-model="vm.internalroute.context" required>
-          <md-option
-            ng-value="context.name"
-            ng-repeat="context in vm.contexts"
-            ng-disabled="context.canSelect === false"
-            >{{ context.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="internalrouteForm['context'].$error"
-          ng-show="internalrouteForm['context'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.CONTEXT_REQUIRED"
-              >Context field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.internalroute.description"
-        />
-
-        <div
-          ng-messages="internalrouteForm['description'].$error"
-          ng-show="internalrouteForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newInternalRoute"
-          ng-click="vm.saveInternalRoute()"
-          class="send-button md-accent md-raised"
-          ng-disabled="internalrouteForm.$invalid || internalrouteForm.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newInternalRoute"
-          ng-click="vm.addNewInternalRoute()"
-          class="send-button md-accent md-raised"
-          ng-disabled="internalrouteForm.$invalid"
-          aria-label="ADD"
-          translate="VOICE.ADD_INTERNALROUTE"
-          translate-attr-aria-label="VOICE.ADD_INTERNALROUTE"
-        >
-          ADD INTERNALROUTE
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newInternalRoute"
-          ng-click="vm.deleteInternalRoute($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="VOICE.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="VOICE.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/internalroutes/create/dialog.html/dialog.html
new file mode 100644
index 0000000..932a7a5
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/internalroutes/create/dialog.html/dialog.html
@@ -0,0 +1,174 @@
+<md-dialog class="internalroute-dialog" aria-label="New InternalRoute">
+  <form name="internalrouteForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.PHONENUMBER">PhoneNumber</label>
+        <input
+          type="text"
+          name="exten"
+          ng-model="vm.internalroute.exten"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="internalrouteForm['exten'].$error"
+          ng-show="internalrouteForm['exten'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.PHONENUMBER_REQUIRED"
+              >PhoneNumber field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.CONTEXT">Context</label>
+        <md-select name="context" ng-model="vm.internalroute.context" required>
+          <md-option
+            ng-value="context.name"
+            ng-repeat="context in vm.contexts"
+            ng-disabled="context.canSelect === false"
+            >{{ context.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="internalrouteForm['context'].$error"
+          ng-show="internalrouteForm['context'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.CONTEXT_REQUIRED"
+              >Context field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.internalroute.description"
+        />
+
+        <div
+          ng-messages="internalrouteForm['description'].$error"
+          ng-show="internalrouteForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newInternalRoute"
+          ng-click="vm.saveInternalRoute()"
+          class="send-button md-accent md-raised"
+          ng-disabled="internalrouteForm.$invalid || internalrouteForm.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newInternalRoute"
+          ng-click="vm.addNewInternalRoute()"
+          class="send-button md-accent md-raised"
+          ng-disabled="internalrouteForm.$invalid"
+          aria-label="ADD"
+          translate="VOICE.ADD_INTERNALROUTE"
+          translate-attr-aria-label="VOICE.ADD_INTERNALROUTE"
+        >
+          ADD INTERNALROUTE
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newInternalRoute"
+          ng-click="vm.deleteInternalRoute($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="VOICE.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="VOICE.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/agi/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/agi/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index d5960e9..0000000
--- a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/agi/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,111 +0,0 @@
-<md-dialog class="internalroute-dialog" aria-label="New InternalRoute">
-  <form name="internalrouteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.PROJECT">Project</label>
-        <md-select
-          name="project"
-          ng-model="vm.agi.project"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="'agi://127.0.0.1/square,{{project.name}}'"
-            ng-repeat="project in vm.projects"
-            ng-disabled="project.canSelect === false"
-            >{{ project.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="internalrouteFormApp['project'].$error"
-          ng-show="internalrouteFormApp['project'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.PROJECT_REQUIRED"
-              >Project field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveInternalRouteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="internalrouteFormApp.$invalid || internalrouteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/agi/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/agi/dialog.html/dialog.html
new file mode 100644
index 0000000..d5960e9
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/agi/dialog.html/dialog.html
@@ -0,0 +1,111 @@
+<md-dialog class="internalroute-dialog" aria-label="New InternalRoute">
+  <form name="internalrouteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.PROJECT">Project</label>
+        <md-select
+          name="project"
+          ng-model="vm.agi.project"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="'agi://127.0.0.1/square,{{project.name}}'"
+            ng-repeat="project in vm.projects"
+            ng-disabled="project.canSelect === false"
+            >{{ project.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="internalrouteFormApp['project'].$error"
+          ng-show="internalrouteFormApp['project'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.PROJECT_REQUIRED"
+              >Project field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveInternalRouteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="internalrouteFormApp.$invalid || internalrouteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/custom/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/custom/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 310ec34..0000000
--- a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/custom/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,127 +0,0 @@
-<md-dialog class="internalroute-dialog" aria-label="New InternalRoute">
-  <form name="internalrouteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.APPLICATION_NAME">Application_Name</label>
-        <input
-          type="text"
-          name="app"
-          ng-model="vm.custom.app"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="internalrouteFormApp['app'].$error"
-          ng-show="internalrouteFormApp['app'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.APPLICATION_NAME_REQUIRED"
-              >Application_Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.ARGUMENTS">Arguments</label>
-        <input
-          type="text"
-          name="appdata"
-          ng-model="vm.custom.appdata"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="internalrouteFormApp['appdata'].$error"
-          ng-show="internalrouteFormApp['appdata'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.ARGUMENTS_REQUIRED"
-              >Arguments field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveInternalRouteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="internalrouteFormApp.$invalid || internalrouteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/custom/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/custom/dialog.html/dialog.html
new file mode 100644
index 0000000..310ec34
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/custom/dialog.html/dialog.html
@@ -0,0 +1,127 @@
+<md-dialog class="internalroute-dialog" aria-label="New InternalRoute">
+  <form name="internalrouteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.APPLICATION_NAME">Application_Name</label>
+        <input
+          type="text"
+          name="app"
+          ng-model="vm.custom.app"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="internalrouteFormApp['app'].$error"
+          ng-show="internalrouteFormApp['app'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.APPLICATION_NAME_REQUIRED"
+              >Application_Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.ARGUMENTS">Arguments</label>
+        <input
+          type="text"
+          name="appdata"
+          ng-model="vm.custom.appdata"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="internalrouteFormApp['appdata'].$error"
+          ng-show="internalrouteFormApp['appdata'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.ARGUMENTS_REQUIRED"
+              >Arguments field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveInternalRouteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="internalrouteFormApp.$invalid || internalrouteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/dial/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/dial/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 48ae455..0000000
--- a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/dial/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,177 +0,0 @@
-<md-dialog class="internalroute-dialog" aria-label="New InternalRoute">
-  <form name="internalrouteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.TECHNOLOGY/RESOURCE">Technology/Resource</label>
-        <input
-          type="text"
-          name="tech"
-          ng-model="vm.dial.tech"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="internalrouteFormApp['tech'].$error"
-          ng-show="internalrouteFormApp['tech'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.TECHNOLOGY/RESOURCE_REQUIRED"
-              >Technology/Resource field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.TIMEOUT">Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.dial.timeout"
-          min="0"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="internalrouteFormApp['timeout'].$error"
-          ng-show="internalrouteFormApp['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.TIMEOUT_REQUIRED"
-              >Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="VOICE.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.OPTIONS">Options</label>
-        <input
-          type="text"
-          name="options"
-          ng-model="vm.dial.options"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="internalrouteFormApp['options'].$error"
-          ng-show="internalrouteFormApp['options'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
-              >Options field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.URL">Url</label>
-        <input
-          type="text"
-          name="url"
-          ng-model="vm.dial.url"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="internalrouteFormApp['url'].$error"
-          ng-show="internalrouteFormApp['url'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.URL_REQUIRED"
-              >Url field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveInternalRouteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="internalrouteFormApp.$invalid || internalrouteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/dial/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/dial/dialog.html/dialog.html
new file mode 100644
index 0000000..48ae455
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/dial/dialog.html/dialog.html
@@ -0,0 +1,177 @@
+<md-dialog class="internalroute-dialog" aria-label="New InternalRoute">
+  <form name="internalrouteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.TECHNOLOGY/RESOURCE">Technology/Resource</label>
+        <input
+          type="text"
+          name="tech"
+          ng-model="vm.dial.tech"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="internalrouteFormApp['tech'].$error"
+          ng-show="internalrouteFormApp['tech'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.TECHNOLOGY/RESOURCE_REQUIRED"
+              >Technology/Resource field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.TIMEOUT">Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.dial.timeout"
+          min="0"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="internalrouteFormApp['timeout'].$error"
+          ng-show="internalrouteFormApp['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.TIMEOUT_REQUIRED"
+              >Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="VOICE.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.OPTIONS">Options</label>
+        <input
+          type="text"
+          name="options"
+          ng-model="vm.dial.options"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="internalrouteFormApp['options'].$error"
+          ng-show="internalrouteFormApp['options'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
+              >Options field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.URL">Url</label>
+        <input
+          type="text"
+          name="url"
+          ng-model="vm.dial.url"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="internalrouteFormApp['url'].$error"
+          ng-show="internalrouteFormApp['url'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.URL_REQUIRED"
+              >Url field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveInternalRouteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="internalrouteFormApp.$invalid || internalrouteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/externaldial/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/externaldial/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 1d2e13e..0000000
--- a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/externaldial/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,203 +0,0 @@
-<md-dialog class="internalroute-dialog" aria-label="New InternalRoute">
-  <form name="internalrouteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.TRUNK">Trunk</label>
-        <md-select
-          name="trunk"
-          ng-model="vm.externaldial.trunk"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="trunk.name"
-            ng-repeat="trunk in vm.trunks"
-            ng-disabled="trunk.canSelect === false"
-            >{{ trunk.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="internalrouteFormApp['trunk'].$error"
-          ng-show="internalrouteFormApp['trunk'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.TRUNK_REQUIRED"
-              >Trunk field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.PHONE">Phone</label>
-        <input
-          type="text"
-          name="phone"
-          ng-model="vm.externaldial.phone"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="internalrouteFormApp['phone'].$error"
-          ng-show="internalrouteFormApp['phone'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.PHONE_REQUIRED"
-              >Phone field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.TIMEOUT">Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.externaldial.timeout"
-          min="0"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="internalrouteFormApp['timeout'].$error"
-          ng-show="internalrouteFormApp['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.TIMEOUT_REQUIRED"
-              >Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="VOICE.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.OPTIONS">Options</label>
-        <input
-          type="text"
-          name="options"
-          ng-model="vm.externaldial.options"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="internalrouteFormApp['options'].$error"
-          ng-show="internalrouteFormApp['options'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
-              >Options field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.URL">Url</label>
-        <input
-          type="text"
-          name="url"
-          ng-model="vm.externaldial.url"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="internalrouteFormApp['url'].$error"
-          ng-show="internalrouteFormApp['url'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.URL_REQUIRED"
-              >Url field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveInternalRouteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="internalrouteFormApp.$invalid || internalrouteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/externaldial/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/externaldial/dialog.html/dialog.html
new file mode 100644
index 0000000..1d2e13e
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/externaldial/dialog.html/dialog.html
@@ -0,0 +1,203 @@
+<md-dialog class="internalroute-dialog" aria-label="New InternalRoute">
+  <form name="internalrouteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.TRUNK">Trunk</label>
+        <md-select
+          name="trunk"
+          ng-model="vm.externaldial.trunk"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="trunk.name"
+            ng-repeat="trunk in vm.trunks"
+            ng-disabled="trunk.canSelect === false"
+            >{{ trunk.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="internalrouteFormApp['trunk'].$error"
+          ng-show="internalrouteFormApp['trunk'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.TRUNK_REQUIRED"
+              >Trunk field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.PHONE">Phone</label>
+        <input
+          type="text"
+          name="phone"
+          ng-model="vm.externaldial.phone"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="internalrouteFormApp['phone'].$error"
+          ng-show="internalrouteFormApp['phone'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.PHONE_REQUIRED"
+              >Phone field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.TIMEOUT">Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.externaldial.timeout"
+          min="0"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="internalrouteFormApp['timeout'].$error"
+          ng-show="internalrouteFormApp['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.TIMEOUT_REQUIRED"
+              >Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="VOICE.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.OPTIONS">Options</label>
+        <input
+          type="text"
+          name="options"
+          ng-model="vm.externaldial.options"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="internalrouteFormApp['options'].$error"
+          ng-show="internalrouteFormApp['options'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
+              >Options field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.URL">Url</label>
+        <input
+          type="text"
+          name="url"
+          ng-model="vm.externaldial.url"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="internalrouteFormApp['url'].$error"
+          ng-show="internalrouteFormApp['url'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.URL_REQUIRED"
+              >Url field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveInternalRouteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="internalrouteFormApp.$invalid || internalrouteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/goto/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/goto/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index e7e12b9..0000000
--- a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/goto/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,155 +0,0 @@
-<md-dialog class="internalroute-dialog" aria-label="New InternalRoute">
-  <form name="internalrouteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.CONTEXT">Context</label>
-        <md-select
-          name="context"
-          ng-model="vm.goto.context"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="context.name"
-            ng-repeat="context in vm.contexts"
-            ng-disabled="context.canSelect === false"
-            >{{ context.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="internalrouteFormApp['context'].$error"
-          ng-show="internalrouteFormApp['context'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.CONTEXT_REQUIRED"
-              >Context field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.EXTENSION">Extension</label>
-        <input
-          type="text"
-          name="extension"
-          ng-model="vm.goto.extension"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="internalrouteFormApp['extension'].$error"
-          ng-show="internalrouteFormApp['extension'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.EXTENSION_REQUIRED"
-              >Extension field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.PRIORITY">Priority</label>
-        <input
-          type="text"
-          name="priority"
-          ng-model="vm.goto.priority"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="internalrouteFormApp['priority'].$error"
-          ng-show="internalrouteFormApp['priority'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.PRIORITY_REQUIRED"
-              >Priority field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveInternalRouteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="internalrouteFormApp.$invalid || internalrouteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/goto/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/goto/dialog.html/dialog.html
new file mode 100644
index 0000000..e7e12b9
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/goto/dialog.html/dialog.html
@@ -0,0 +1,155 @@
+<md-dialog class="internalroute-dialog" aria-label="New InternalRoute">
+  <form name="internalrouteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.CONTEXT">Context</label>
+        <md-select
+          name="context"
+          ng-model="vm.goto.context"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="context.name"
+            ng-repeat="context in vm.contexts"
+            ng-disabled="context.canSelect === false"
+            >{{ context.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="internalrouteFormApp['context'].$error"
+          ng-show="internalrouteFormApp['context'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.CONTEXT_REQUIRED"
+              >Context field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.EXTENSION">Extension</label>
+        <input
+          type="text"
+          name="extension"
+          ng-model="vm.goto.extension"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="internalrouteFormApp['extension'].$error"
+          ng-show="internalrouteFormApp['extension'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.EXTENSION_REQUIRED"
+              >Extension field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.PRIORITY">Priority</label>
+        <input
+          type="text"
+          name="priority"
+          ng-model="vm.goto.priority"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="internalrouteFormApp['priority'].$error"
+          ng-show="internalrouteFormApp['priority'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.PRIORITY_REQUIRED"
+              >Priority field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveInternalRouteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="internalrouteFormApp.$invalid || internalrouteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/hangup/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/hangup/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index fd5e75e..0000000
--- a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/hangup/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,140 +0,0 @@
-<md-dialog class="internalroute-dialog" aria-label="New InternalRoute">
-  <form name="internalrouteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.HANGUP_CAUSE">Hangup_Cause</label>
-        <md-select
-          name="appdata"
-          ng-model="vm.hangup.appdata"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="'1'">
-            {{ 'VOICE.HANGUPCAUSE_1' | translate }}
-          </md-option>
-
-          <md-option ng-value="'16'">
-            {{ 'VOICE.HANGUPCAUSE_16' | translate }}
-          </md-option>
-
-          <md-option ng-value="'17'">
-            {{ 'VOICE.HANGUPCAUSE_17' | translate }}
-          </md-option>
-
-          <md-option ng-value="'18'">
-            {{ 'VOICE.HANGUPCAUSE_18' | translate }}
-          </md-option>
-
-          <md-option ng-value="'21'">
-            {{ 'VOICE.HANGUPCAUSE_21' | translate }}
-          </md-option>
-
-          <md-option ng-value="'22'">
-            {{ 'VOICE.HANGUPCAUSE_22' | translate }}
-          </md-option>
-
-          <md-option ng-value="'27'">
-            {{ 'VOICE.HANGUPCAUSE_27' | translate }}
-          </md-option>
-
-          <md-option ng-value="'38'">
-            {{ 'VOICE.HANGUPCAUSE_38' | translate }}
-          </md-option>
-
-          <md-option ng-value="'41'">
-            {{ 'VOICE.HANGUPCAUSE_41' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="internalrouteFormApp['appdata'].$error"
-          ng-show="internalrouteFormApp['appdata'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.HANGUP_CAUSE_REQUIRED"
-              >Hangup_Cause field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveInternalRouteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="internalrouteFormApp.$invalid || internalrouteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/hangup/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/hangup/dialog.html/dialog.html
new file mode 100644
index 0000000..fd5e75e
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/hangup/dialog.html/dialog.html
@@ -0,0 +1,140 @@
+<md-dialog class="internalroute-dialog" aria-label="New InternalRoute">
+  <form name="internalrouteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.HANGUP_CAUSE">Hangup_Cause</label>
+        <md-select
+          name="appdata"
+          ng-model="vm.hangup.appdata"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="'1'">
+            {{ 'VOICE.HANGUPCAUSE_1' | translate }}
+          </md-option>
+
+          <md-option ng-value="'16'">
+            {{ 'VOICE.HANGUPCAUSE_16' | translate }}
+          </md-option>
+
+          <md-option ng-value="'17'">
+            {{ 'VOICE.HANGUPCAUSE_17' | translate }}
+          </md-option>
+
+          <md-option ng-value="'18'">
+            {{ 'VOICE.HANGUPCAUSE_18' | translate }}
+          </md-option>
+
+          <md-option ng-value="'21'">
+            {{ 'VOICE.HANGUPCAUSE_21' | translate }}
+          </md-option>
+
+          <md-option ng-value="'22'">
+            {{ 'VOICE.HANGUPCAUSE_22' | translate }}
+          </md-option>
+
+          <md-option ng-value="'27'">
+            {{ 'VOICE.HANGUPCAUSE_27' | translate }}
+          </md-option>
+
+          <md-option ng-value="'38'">
+            {{ 'VOICE.HANGUPCAUSE_38' | translate }}
+          </md-option>
+
+          <md-option ng-value="'41'">
+            {{ 'VOICE.HANGUPCAUSE_41' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="internalrouteFormApp['appdata'].$error"
+          ng-show="internalrouteFormApp['appdata'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.HANGUP_CAUSE_REQUIRED"
+              >Hangup_Cause field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveInternalRouteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="internalrouteFormApp.$invalid || internalrouteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/internaldial/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/internaldial/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index a70155d..0000000
--- a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/internaldial/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,182 +0,0 @@
-<md-dialog class="internalroute-dialog" aria-label="New InternalRoute">
-  <form name="internalrouteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.USER">User</label>
-        <md-select
-          name="user"
-          ng-model="vm.internaldial.user"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="'SIP/{{user.name}}'"
-            ng-repeat="user in vm.users"
-            ng-disabled="user.canSelect === false"
-            >{{ user.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="internalrouteFormApp['user'].$error"
-          ng-show="internalrouteFormApp['user'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.USER_REQUIRED"
-              >User field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.TIMEOUT">Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.internaldial.timeout"
-          min="0"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="internalrouteFormApp['timeout'].$error"
-          ng-show="internalrouteFormApp['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.TIMEOUT_REQUIRED"
-              >Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="VOICE.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.OPTIONS">Options</label>
-        <input
-          type="text"
-          name="options"
-          ng-model="vm.internaldial.options"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="internalrouteFormApp['options'].$error"
-          ng-show="internalrouteFormApp['options'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
-              >Options field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.URL">Url</label>
-        <input
-          type="text"
-          name="url"
-          ng-model="vm.internaldial.url"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="internalrouteFormApp['url'].$error"
-          ng-show="internalrouteFormApp['url'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.URL_REQUIRED"
-              >Url field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveInternalRouteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="internalrouteFormApp.$invalid || internalrouteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/internaldial/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/internaldial/dialog.html/dialog.html
new file mode 100644
index 0000000..a70155d
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/internaldial/dialog.html/dialog.html
@@ -0,0 +1,182 @@
+<md-dialog class="internalroute-dialog" aria-label="New InternalRoute">
+  <form name="internalrouteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.USER">User</label>
+        <md-select
+          name="user"
+          ng-model="vm.internaldial.user"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="'SIP/{{user.name}}'"
+            ng-repeat="user in vm.users"
+            ng-disabled="user.canSelect === false"
+            >{{ user.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="internalrouteFormApp['user'].$error"
+          ng-show="internalrouteFormApp['user'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.USER_REQUIRED"
+              >User field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.TIMEOUT">Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.internaldial.timeout"
+          min="0"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="internalrouteFormApp['timeout'].$error"
+          ng-show="internalrouteFormApp['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.TIMEOUT_REQUIRED"
+              >Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="VOICE.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.OPTIONS">Options</label>
+        <input
+          type="text"
+          name="options"
+          ng-model="vm.internaldial.options"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="internalrouteFormApp['options'].$error"
+          ng-show="internalrouteFormApp['options'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
+              >Options field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.URL">Url</label>
+        <input
+          type="text"
+          name="url"
+          ng-model="vm.internaldial.url"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="internalrouteFormApp['url'].$error"
+          ng-show="internalrouteFormApp['url'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.URL_REQUIRED"
+              >Url field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveInternalRouteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="internalrouteFormApp.$invalid || internalrouteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/interval/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/interval/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index ca0ed91..0000000
--- a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/interval/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,313 +0,0 @@
-<md-dialog class="inboundroute-dialog" aria-label="New Interval">
-  <form name="intervalForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <md-input-container class="md-block">
-        <label translate="TOOLS.TYPE">Type</label>
-        <md-select
-          ng-model="vm.type"
-          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="type" ng-repeat="type in vm.types"
-            >{{ type | ucfirst }}</md-option
-          >
-        </md-select>
-      </md-input-container>
-
-      <md-input-container class="md-block" ng-if="vm.type === 'list'">
-        <label translate="TOOLS.INTERVALS">Intervals</label>
-        <md-select
-          ng-model="vm.interval.IntervalId"
-          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="interval.id" ng-repeat="interval in vm.intervals"
-            >{{ interval.name }}</md-option
-          >
-        </md-select>
-      </md-input-container>
-
-      <!-- TIMERANGE START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.TIME_RANGE"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <div class="md-block" flex>
-          <mdp-time-picker
-            name="timeRangeFrom"
-            mdp-placeholder="FROM"
-            ng-model="vm.timeRangeFrom"
-            mdp-format="HH:mm"
-            mdp-auto-switch="true"
-            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <div
-              ng-messages="intervalForm.timeRangeFrom.$error"
-              ng-show="intervalForm.timeRangeFrom.$touched"
-              role="alert"
-            >
-              <div ng-message="format">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_FROM_INVALID"
-                  >Time Range From field is invalid</span
-                >
-              </div>
-            </div>
-          </mdp-time-picker>
-        </div>
-        <div class="md-block" flex ng-if="vm.timeRangeFrom">
-          <mdp-time-picker
-            name="timeRangeTo"
-            mdp-placeholder="TO*"
-            ng-model="vm.timeRangeTo"
-            mdp-format="HH:mm"
-            mdp-auto-switch="true"
-            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-            required
-          >
-            <div
-              ng-messages="intervalForm.timeRangeTo.$error"
-              ng-show="intervalForm.timeRangeTo.$invalid"
-              role="alert"
-            >
-              <div ng-message="format">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_INVALID"
-                  >Time Range To field is invalid</span
-                >
-              </div>
-              <div ng-message="required">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_REQUIRED"
-                  >Time Range To field is required</span
-                >
-              </div>
-            </div>
-          </mdp-time-picker>
-        </div>
-      </div>
-      <!-- TIMERANGE END -->
-
-      <!-- DAYSOFWEEK START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.WEEK_DAYS"
-        >Week Days</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.dayOfWeekFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
-              ><span translate="TOOLS.{{day.value | uppercase}}"
-                >{{ day.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container flex class="md-block" ng-if="vm.dayOfWeekFrom">
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="dayOfWeekTo"
-            ng-model="vm.dayOfWeekTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
-              ><span translate="TOOLS.{{day.value | uppercase}}"
-                >{{ day.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.dayOfWeekTo.$error"
-            ng-show="intervalForm.dayOfWeekTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- DAYSOFWEEK END -->
-
-      <!-- MONTHDAY START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTH_DAYS"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex layout="column" class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.monthDayFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
-              >{{ month }}</md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container
-          flex
-          layout="column"
-          class="md-block"
-          ng-if="vm.monthDayFrom"
-        >
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="monthDayTo"
-            ng-model="vm.monthDayTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
-              >{{ month }}</md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.monthDayTo.$error"
-            ng-show="intervalForm.monthDayTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- MONTHDAY END -->
-
-      <!-- MONTH START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTHS"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex layout="column" class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.monthFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
-              ><span translate="TOOLS.{{month.value | uppercase}}"
-                >{{ month.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container
-          flex
-          layout="column"
-          class="md-block"
-          ng-if="vm.monthFrom"
-        >
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="monthTo"
-            ng-model="vm.monthTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
-              ><span translate="TOOLS.{{month.value | uppercase}}"
-                >{{ month.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.monthTo.$error"
-            ng-show="intervalForm.monthTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- MONTH END -->
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="!vm.newInterval && vm.crudPermissions.canEdit"
-          ng-click="vm.saveInterval()"
-          class="send-button md-accent md-raised"
-          ng-disabled="intervalForm.$invalid || intervalForm.$pristine"
-          aria-label="SAVE"
-          translate="TOOLS.SAVE"
-          translate-attr-aria-label="TOOLS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.newInterval && vm.crudPermissions.canEdit"
-          ng-click="vm.addNewInterval()"
-          class="send-button md-accent md-raised"
-          ng-disabled="intervalForm.$invalid"
-          aria-label="ADD"
-          translate="TOOLS.ADD_INTERVAL"
-          translate-attr-aria-label="TOOLS.ADD_INTERVAL"
-        >
-          ADD INTERVAL
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/interval/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/interval/dialog.html/dialog.html
new file mode 100644
index 0000000..ca0ed91
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/interval/dialog.html/dialog.html
@@ -0,0 +1,313 @@
+<md-dialog class="inboundroute-dialog" aria-label="New Interval">
+  <form name="intervalForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <md-input-container class="md-block">
+        <label translate="TOOLS.TYPE">Type</label>
+        <md-select
+          ng-model="vm.type"
+          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="type" ng-repeat="type in vm.types"
+            >{{ type | ucfirst }}</md-option
+          >
+        </md-select>
+      </md-input-container>
+
+      <md-input-container class="md-block" ng-if="vm.type === 'list'">
+        <label translate="TOOLS.INTERVALS">Intervals</label>
+        <md-select
+          ng-model="vm.interval.IntervalId"
+          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="interval.id" ng-repeat="interval in vm.intervals"
+            >{{ interval.name }}</md-option
+          >
+        </md-select>
+      </md-input-container>
+
+      <!-- TIMERANGE START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.TIME_RANGE"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <div class="md-block" flex>
+          <mdp-time-picker
+            name="timeRangeFrom"
+            mdp-placeholder="FROM"
+            ng-model="vm.timeRangeFrom"
+            mdp-format="HH:mm"
+            mdp-auto-switch="true"
+            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <div
+              ng-messages="intervalForm.timeRangeFrom.$error"
+              ng-show="intervalForm.timeRangeFrom.$touched"
+              role="alert"
+            >
+              <div ng-message="format">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_FROM_INVALID"
+                  >Time Range From field is invalid</span
+                >
+              </div>
+            </div>
+          </mdp-time-picker>
+        </div>
+        <div class="md-block" flex ng-if="vm.timeRangeFrom">
+          <mdp-time-picker
+            name="timeRangeTo"
+            mdp-placeholder="TO*"
+            ng-model="vm.timeRangeTo"
+            mdp-format="HH:mm"
+            mdp-auto-switch="true"
+            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+            required
+          >
+            <div
+              ng-messages="intervalForm.timeRangeTo.$error"
+              ng-show="intervalForm.timeRangeTo.$invalid"
+              role="alert"
+            >
+              <div ng-message="format">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_INVALID"
+                  >Time Range To field is invalid</span
+                >
+              </div>
+              <div ng-message="required">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_REQUIRED"
+                  >Time Range To field is required</span
+                >
+              </div>
+            </div>
+          </mdp-time-picker>
+        </div>
+      </div>
+      <!-- TIMERANGE END -->
+
+      <!-- DAYSOFWEEK START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.WEEK_DAYS"
+        >Week Days</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.dayOfWeekFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
+              ><span translate="TOOLS.{{day.value | uppercase}}"
+                >{{ day.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container flex class="md-block" ng-if="vm.dayOfWeekFrom">
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="dayOfWeekTo"
+            ng-model="vm.dayOfWeekTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
+              ><span translate="TOOLS.{{day.value | uppercase}}"
+                >{{ day.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.dayOfWeekTo.$error"
+            ng-show="intervalForm.dayOfWeekTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- DAYSOFWEEK END -->
+
+      <!-- MONTHDAY START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTH_DAYS"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex layout="column" class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.monthDayFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
+              >{{ month }}</md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container
+          flex
+          layout="column"
+          class="md-block"
+          ng-if="vm.monthDayFrom"
+        >
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="monthDayTo"
+            ng-model="vm.monthDayTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
+              >{{ month }}</md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.monthDayTo.$error"
+            ng-show="intervalForm.monthDayTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- MONTHDAY END -->
+
+      <!-- MONTH START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTHS"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex layout="column" class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.monthFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
+              ><span translate="TOOLS.{{month.value | uppercase}}"
+                >{{ month.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container
+          flex
+          layout="column"
+          class="md-block"
+          ng-if="vm.monthFrom"
+        >
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="monthTo"
+            ng-model="vm.monthTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
+              ><span translate="TOOLS.{{month.value | uppercase}}"
+                >{{ month.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.monthTo.$error"
+            ng-show="intervalForm.monthTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- MONTH END -->
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="!vm.newInterval && vm.crudPermissions.canEdit"
+          ng-click="vm.saveInterval()"
+          class="send-button md-accent md-raised"
+          ng-disabled="intervalForm.$invalid || intervalForm.$pristine"
+          aria-label="SAVE"
+          translate="TOOLS.SAVE"
+          translate-attr-aria-label="TOOLS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.newInterval && vm.crudPermissions.canEdit"
+          ng-click="vm.addNewInterval()"
+          class="send-button md-accent md-raised"
+          ng-disabled="intervalForm.$invalid"
+          aria-label="ADD"
+          translate="TOOLS.ADD_INTERVAL"
+          translate-attr-aria-label="TOOLS.ADD_INTERVAL"
+        >
+          ADD INTERVAL
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/playback/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/playback/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 9256ce9..0000000
--- a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/playback/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,140 +0,0 @@
-<md-dialog class="internalroute-dialog" aria-label="New InternalRoute">
-  <form name="internalrouteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.AUDIO_FILES">Audio_Files</label>
-        <md-select
-          name="appdata"
-          ng-model="vm.playback.appdata"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="'/var/opt/motion2/server/files/sounds/converted/{{appdata.save_name}}'"
-            ng-repeat="appdata in vm.sounds"
-            ng-disabled="appdata.canSelect === false"
-            >{{ appdata.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="internalrouteFormApp['appdata'].$error"
-          ng-show="internalrouteFormApp['appdata'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.AUDIO_FILES_REQUIRED"
-              >Audio_Files field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.OPTIONS">Options</label>
-        <input
-          type="text"
-          name="options"
-          ng-model="vm.playback.options"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="internalrouteFormApp['options'].$error"
-          ng-show="internalrouteFormApp['options'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
-              >Options field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <md-switch
-          ng-model="vm.playback.answer"
-          aria-label="Answer"
-          ng-disabled="!vm.crudPermissions.canEdit"
-          ><span translate="VOICE.ANSWER">Answer</span></md-switch
-        >
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveInternalRouteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="internalrouteFormApp.$invalid || internalrouteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/playback/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/playback/dialog.html/dialog.html
new file mode 100644
index 0000000..9256ce9
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/playback/dialog.html/dialog.html
@@ -0,0 +1,140 @@
+<md-dialog class="internalroute-dialog" aria-label="New InternalRoute">
+  <form name="internalrouteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.AUDIO_FILES">Audio_Files</label>
+        <md-select
+          name="appdata"
+          ng-model="vm.playback.appdata"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="'/var/opt/motion2/server/files/sounds/converted/{{appdata.save_name}}'"
+            ng-repeat="appdata in vm.sounds"
+            ng-disabled="appdata.canSelect === false"
+            >{{ appdata.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="internalrouteFormApp['appdata'].$error"
+          ng-show="internalrouteFormApp['appdata'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.AUDIO_FILES_REQUIRED"
+              >Audio_Files field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.OPTIONS">Options</label>
+        <input
+          type="text"
+          name="options"
+          ng-model="vm.playback.options"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="internalrouteFormApp['options'].$error"
+          ng-show="internalrouteFormApp['options'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
+              >Options field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <md-switch
+          ng-model="vm.playback.answer"
+          aria-label="Answer"
+          ng-disabled="!vm.crudPermissions.canEdit"
+          ><span translate="VOICE.ANSWER">Answer</span></md-switch
+        >
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveInternalRouteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="internalrouteFormApp.$invalid || internalrouteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/queue/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/queue/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 79fa7b1..0000000
--- a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/queue/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,330 +0,0 @@
-<md-dialog class="internalroute-dialog" aria-label="New InternalRoute">
-  <form name="internalrouteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.QUEUE">Queue</label>
-        <md-select
-          name="queue"
-          ng-model="vm.queue.queue"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="queue.name"
-            ng-repeat="queue in vm.queues"
-            ng-disabled="queue.canSelect === false"
-            >{{ queue.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="internalrouteFormApp['queue'].$error"
-          ng-show="internalrouteFormApp['queue'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.QUEUE_REQUIRED"
-              >Queue field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.OPTIONS">Options</label>
-        <input
-          type="text"
-          name="options"
-          ng-model="vm.queue.options"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="internalrouteFormApp['options'].$error"
-          ng-show="internalrouteFormApp['options'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
-              >Options field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.URL">Url</label>
-        <input
-          type="text"
-          name="URL"
-          ng-model="vm.queue.URL"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="internalrouteFormApp['URL'].$error"
-          ng-show="internalrouteFormApp['URL'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.URL_REQUIRED"
-              >Url field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.ANNOUNCE_OVERRIDES">Announce_Overrides</label>
-        <md-select
-          name="sound"
-          ng-model="vm.queue.sound"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="''">None</md-option>
-          <md-option
-            ng-value="'/var/opt/motion2/server/files/sounds/converted/{{sound.save_name}}'"
-            ng-repeat="sound in vm.sounds"
-            ng-disabled="sound.canSelect === false"
-            >{{ sound.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="internalrouteFormApp['sound'].$error"
-          ng-show="internalrouteFormApp['sound'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.ANNOUNCE_OVERRIDES_REQUIRED"
-              >Announce_Overrides field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.TIMEOUT">Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.queue.timeout"
-          min="0"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="internalrouteFormApp['timeout'].$error"
-          ng-show="internalrouteFormApp['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.TIMEOUT_REQUIRED"
-              >Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="VOICE.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.AGI">Agi</label>
-        <input
-          type="text"
-          name="agi"
-          ng-model="vm.queue.agi"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="internalrouteFormApp['agi'].$error"
-          ng-show="internalrouteFormApp['agi'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.AGI_REQUIRED"
-              >Agi field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.MACRO">Macro</label>
-        <input
-          type="text"
-          name="macro"
-          ng-model="vm.queue.macro"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="internalrouteFormApp['macro'].$error"
-          ng-show="internalrouteFormApp['macro'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.MACRO_REQUIRED"
-              >Macro field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.GOSUB">GoSub</label>
-        <input
-          type="text"
-          name="gosub"
-          ng-model="vm.queue.gosub"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="internalrouteFormApp['gosub'].$error"
-          ng-show="internalrouteFormApp['gosub'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.GOSUB_REQUIRED"
-              >GoSub field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.RULE">Rule</label>
-        <input
-          type="text"
-          name="rule"
-          ng-model="vm.queue.rule"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="internalrouteFormApp['rule'].$error"
-          ng-show="internalrouteFormApp['rule'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.RULE_REQUIRED"
-              >Rule field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.POSITION">Position</label>
-        <input
-          type="number"
-          name="position"
-          ng-model="vm.queue.position"
-          min="0"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="internalrouteFormApp['position'].$error"
-          ng-show="internalrouteFormApp['position'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.POSITION_REQUIRED"
-              >Position field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="VOICE.ERRORS.POSITION_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Position must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <md-switch
-          ng-model="vm.queue.answer"
-          aria-label="Answer"
-          ng-disabled="!vm.crudPermissions.canEdit"
-          ><span translate="VOICE.ANSWER">Answer</span></md-switch
-        >
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveInternalRouteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="internalrouteFormApp.$invalid || internalrouteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/queue/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/queue/dialog.html/dialog.html
new file mode 100644
index 0000000..79fa7b1
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/queue/dialog.html/dialog.html
@@ -0,0 +1,330 @@
+<md-dialog class="internalroute-dialog" aria-label="New InternalRoute">
+  <form name="internalrouteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.QUEUE">Queue</label>
+        <md-select
+          name="queue"
+          ng-model="vm.queue.queue"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="queue.name"
+            ng-repeat="queue in vm.queues"
+            ng-disabled="queue.canSelect === false"
+            >{{ queue.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="internalrouteFormApp['queue'].$error"
+          ng-show="internalrouteFormApp['queue'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.QUEUE_REQUIRED"
+              >Queue field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.OPTIONS">Options</label>
+        <input
+          type="text"
+          name="options"
+          ng-model="vm.queue.options"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="internalrouteFormApp['options'].$error"
+          ng-show="internalrouteFormApp['options'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
+              >Options field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.URL">Url</label>
+        <input
+          type="text"
+          name="URL"
+          ng-model="vm.queue.URL"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="internalrouteFormApp['URL'].$error"
+          ng-show="internalrouteFormApp['URL'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.URL_REQUIRED"
+              >Url field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.ANNOUNCE_OVERRIDES">Announce_Overrides</label>
+        <md-select
+          name="sound"
+          ng-model="vm.queue.sound"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="''">None</md-option>
+          <md-option
+            ng-value="'/var/opt/motion2/server/files/sounds/converted/{{sound.save_name}}'"
+            ng-repeat="sound in vm.sounds"
+            ng-disabled="sound.canSelect === false"
+            >{{ sound.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="internalrouteFormApp['sound'].$error"
+          ng-show="internalrouteFormApp['sound'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.ANNOUNCE_OVERRIDES_REQUIRED"
+              >Announce_Overrides field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.TIMEOUT">Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.queue.timeout"
+          min="0"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="internalrouteFormApp['timeout'].$error"
+          ng-show="internalrouteFormApp['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.TIMEOUT_REQUIRED"
+              >Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="VOICE.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.AGI">Agi</label>
+        <input
+          type="text"
+          name="agi"
+          ng-model="vm.queue.agi"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="internalrouteFormApp['agi'].$error"
+          ng-show="internalrouteFormApp['agi'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.AGI_REQUIRED"
+              >Agi field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.MACRO">Macro</label>
+        <input
+          type="text"
+          name="macro"
+          ng-model="vm.queue.macro"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="internalrouteFormApp['macro'].$error"
+          ng-show="internalrouteFormApp['macro'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.MACRO_REQUIRED"
+              >Macro field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.GOSUB">GoSub</label>
+        <input
+          type="text"
+          name="gosub"
+          ng-model="vm.queue.gosub"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="internalrouteFormApp['gosub'].$error"
+          ng-show="internalrouteFormApp['gosub'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.GOSUB_REQUIRED"
+              >GoSub field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.RULE">Rule</label>
+        <input
+          type="text"
+          name="rule"
+          ng-model="vm.queue.rule"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="internalrouteFormApp['rule'].$error"
+          ng-show="internalrouteFormApp['rule'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.RULE_REQUIRED"
+              >Rule field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.POSITION">Position</label>
+        <input
+          type="number"
+          name="position"
+          ng-model="vm.queue.position"
+          min="0"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="internalrouteFormApp['position'].$error"
+          ng-show="internalrouteFormApp['position'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.POSITION_REQUIRED"
+              >Position field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="VOICE.ERRORS.POSITION_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Position must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <md-switch
+          ng-model="vm.queue.answer"
+          aria-label="Answer"
+          ng-disabled="!vm.crudPermissions.canEdit"
+          ><span translate="VOICE.ANSWER">Answer</span></md-switch
+        >
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveInternalRouteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="internalrouteFormApp.$invalid || internalrouteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/ringgroup/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/ringgroup/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index dfc5be3..0000000
--- a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/ringgroup/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,183 +0,0 @@
-<md-dialog class="internalroute-dialog" aria-label="New InternalRoute">
-  <form name="internalrouteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.USER">User</label>
-        <md-select
-          name="multipleUsers"
-          ng-model="vm.ringgroup.multipleUsers"
-          autofocus
-          multiple
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="'SIP/{{multipleUsers.name}}'"
-            ng-repeat="multipleUsers in vm.users"
-            ng-disabled="multipleUsers.canSelect === false"
-            >{{ multipleUsers.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="internalrouteFormApp['multipleUsers'].$error"
-          ng-show="internalrouteFormApp['multipleUsers'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.USER_REQUIRED"
-              >User field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.TIMEOUT">Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.ringgroup.timeout"
-          min="0"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="internalrouteFormApp['timeout'].$error"
-          ng-show="internalrouteFormApp['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.TIMEOUT_REQUIRED"
-              >Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="VOICE.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.OPTIONS">Options</label>
-        <input
-          type="text"
-          name="options"
-          ng-model="vm.ringgroup.options"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="internalrouteFormApp['options'].$error"
-          ng-show="internalrouteFormApp['options'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
-              >Options field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.URL">Url</label>
-        <input
-          type="text"
-          name="url"
-          ng-model="vm.ringgroup.url"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="internalrouteFormApp['url'].$error"
-          ng-show="internalrouteFormApp['url'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.URL_REQUIRED"
-              >Url field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveInternalRouteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="internalrouteFormApp.$invalid || internalrouteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/ringgroup/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/ringgroup/dialog.html/dialog.html
new file mode 100644
index 0000000..dfc5be3
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/ringgroup/dialog.html/dialog.html
@@ -0,0 +1,183 @@
+<md-dialog class="internalroute-dialog" aria-label="New InternalRoute">
+  <form name="internalrouteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.USER">User</label>
+        <md-select
+          name="multipleUsers"
+          ng-model="vm.ringgroup.multipleUsers"
+          autofocus
+          multiple
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="'SIP/{{multipleUsers.name}}'"
+            ng-repeat="multipleUsers in vm.users"
+            ng-disabled="multipleUsers.canSelect === false"
+            >{{ multipleUsers.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="internalrouteFormApp['multipleUsers'].$error"
+          ng-show="internalrouteFormApp['multipleUsers'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.USER_REQUIRED"
+              >User field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.TIMEOUT">Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.ringgroup.timeout"
+          min="0"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="internalrouteFormApp['timeout'].$error"
+          ng-show="internalrouteFormApp['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.TIMEOUT_REQUIRED"
+              >Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="VOICE.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.OPTIONS">Options</label>
+        <input
+          type="text"
+          name="options"
+          ng-model="vm.ringgroup.options"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="internalrouteFormApp['options'].$error"
+          ng-show="internalrouteFormApp['options'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
+              >Options field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.URL">Url</label>
+        <input
+          type="text"
+          name="url"
+          ng-model="vm.ringgroup.url"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="internalrouteFormApp['url'].$error"
+          ng-show="internalrouteFormApp['url'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.URL_REQUIRED"
+              >Url field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveInternalRouteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="internalrouteFormApp.$invalid || internalrouteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/set/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/set/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 016b4ba..0000000
--- a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/set/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,133 +0,0 @@
-<md-dialog class="internalroute-dialog" aria-label="New InternalRoute">
-  <form name="internalrouteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.VARIABLE">Variable</label>
-        <md-select
-          name="name"
-          ng-model="vm.set.name"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="name.name"
-            ng-repeat="name in vm.variables"
-            ng-disabled="name.canSelect === false"
-            >{{ name.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="internalrouteFormApp['name'].$error"
-          ng-show="internalrouteFormApp['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.VARIABLE_REQUIRED"
-              >Variable field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.VALUE">Value</label>
-        <input
-          type="text"
-          name="value"
-          ng-model="vm.set.value"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="internalrouteFormApp['value'].$error"
-          ng-show="internalrouteFormApp['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.VALUE_REQUIRED"
-              >Value field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveInternalRouteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="internalrouteFormApp.$invalid || internalrouteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/set/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/set/dialog.html/dialog.html
new file mode 100644
index 0000000..016b4ba
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/set/dialog.html/dialog.html
@@ -0,0 +1,133 @@
+<md-dialog class="internalroute-dialog" aria-label="New InternalRoute">
+  <form name="internalrouteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.VARIABLE">Variable</label>
+        <md-select
+          name="name"
+          ng-model="vm.set.name"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="name.name"
+            ng-repeat="name in vm.variables"
+            ng-disabled="name.canSelect === false"
+            >{{ name.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="internalrouteFormApp['name'].$error"
+          ng-show="internalrouteFormApp['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.VARIABLE_REQUIRED"
+              >Variable field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.VALUE">Value</label>
+        <input
+          type="text"
+          name="value"
+          ng-model="vm.set.value"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="internalrouteFormApp['value'].$error"
+          ng-show="internalrouteFormApp['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.VALUE_REQUIRED"
+              >Value field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveInternalRouteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="internalrouteFormApp.$invalid || internalrouteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/voicemail/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/voicemail/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 927dd9c..0000000
--- a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/voicemail/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,132 +0,0 @@
-<md-dialog class="internalroute-dialog" aria-label="New InternalRoute">
-  <form name="internalrouteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.MAILBOX@CONTEXT">Mailbox@Context</label>
-        <md-select
-          name="voiceMail"
-          ng-model="vm.voicemail.voiceMail"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="'{{voiceMail.mailbox}}@from-voicemail'"
-            ng-repeat="voiceMail in vm.voiceMails"
-            ng-disabled="voiceMail.canSelect === false"
-            >{{ voiceMail.mailbox }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="internalrouteFormApp['voiceMail'].$error"
-          ng-show="internalrouteFormApp['voiceMail'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.MAILBOX@CONTEXT_REQUIRED"
-              >Mailbox@Context field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.OPTIONS">Options</label>
-        <input
-          type="text"
-          name="options"
-          ng-model="vm.voicemail.options"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="internalrouteFormApp['options'].$error"
-          ng-show="internalrouteFormApp['options'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
-              >Options field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveInternalRouteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="internalrouteFormApp.$invalid || internalrouteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/voicemail/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/voicemail/dialog.html/dialog.html
new file mode 100644
index 0000000..927dd9c
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/apps/voicemail/dialog.html/dialog.html
@@ -0,0 +1,132 @@
+<md-dialog class="internalroute-dialog" aria-label="New InternalRoute">
+  <form name="internalrouteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.MAILBOX@CONTEXT">Mailbox@Context</label>
+        <md-select
+          name="voiceMail"
+          ng-model="vm.voicemail.voiceMail"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="'{{voiceMail.mailbox}}@from-voicemail'"
+            ng-repeat="voiceMail in vm.voiceMails"
+            ng-disabled="voiceMail.canSelect === false"
+            >{{ voiceMail.mailbox }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="internalrouteFormApp['voiceMail'].$error"
+          ng-show="internalrouteFormApp['voiceMail'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.MAILBOX@CONTEXT_REQUIRED"
+              >Mailbox@Context field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.OPTIONS">Options</label>
+        <input
+          type="text"
+          name="options"
+          ng-model="vm.voicemail.options"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="internalrouteFormApp['options'].$error"
+          ng-show="internalrouteFormApp['options'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
+              >Options field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveInternalRouteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="internalrouteFormApp.$invalid || internalrouteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index 02c1523..0000000
--- a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,403 +0,0 @@
-<div id="voice-internalroute" class="page-layout simple tabbed" layout="column">
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-internalroutes-button md-icon-button"
-        aria-label="Go to internalroutes"
-        ng-click="vm.gotoInternalRoutes()"
-        translate
-        translate-attr-aria-label="VOICE.GO_TO_INTERNALROUTES"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="internalroute-image" hide-xs>
-          <img ng-src="assets/images/business/internalroutes.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.internalroute.id}}
-            <span ng-if="vm.internalroute.name">{{vm.internalroute.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="VOICE.CREATED_AT"></span>
-            <span>{{vm.internalroute.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveInternalRoute()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (actionsForm.$invalid)"
-        translate="VOICE.SAVE"
-        translate-attr-aria-label="VOICE.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="VOICE.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="internalroute-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="VOICE.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="VOICE.PHONENUMBER">PhoneNumber</label>
-                <input
-                  type="text"
-                  name="exten"
-                  ng-model="vm.internalroute.exten"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['exten'].$error"
-                  ng-show="generalForm['exten'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.PHONENUMBER_REQUIRED"
-                      >PhoneNumber field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.CONTEXT">Context</label>
-                <md-select
-                  name="context"
-                  ng-model="vm.internalroute.context"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="context.name"
-                    ng-repeat="context in vm.contexts"
-                    ng-disabled="context.canSelect === false"
-                    >{{ context.name }}</md-option
-                  >
-                </md-select>
-                <div
-                  ng-messages="generalForm['context'].$error"
-                  ng-show="generalForm['context'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.CONTEXT_REQUIRED"
-                      >Context field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.internalroute.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="VOICE.ACTIONS">ACTIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="internalroute-detail-form-container actions md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="InternalRouteActionsController as vm_ac"
-              ng-init="vm_ac.init(vm.internalroute, vm.crudPermissions)"
-              class="content"
-              md-background-bg
-              layout="row"
-              layout-align="start start"
-            >
-              <!-- SIDENAV -->
-              <div
-                class="navigation-simple sidenav main-sidenav md-background-bg md-whiteframe-1dp"
-                ms-scroll
-                layout="column"
-                flex="20"
-                ng-if="vm_ac.crudPermissions.canEdit"
-              >
-                <!-- SIDENAV CONTENT -->
-                <md-list class="no-padding">
-                  <md-subheader class="md-no-sticky">
-                    <span translate="VOICE.APPLICATIONS_LIST">
-                      Applications List
-                    </span>
-                  </md-subheader>
-                </md-list>
-                <md-divider></md-divider>
-                <md-list ng-sortable="vm_ac.list">
-                  <md-list-item class="handle" ng-repeat="a in vm_ac.apps">
-                    <md-icon md-font-icon="{{a.icon}}" class="s16"></md-icon>
-                    <p
-                      class="text-truncate"
-                      translate="VOICE.{{(a.alias || a.appType) | uppercase}}"
-                    >
-                      {{a.alias || a.appType}}
-                    </p>
-                  </md-list-item>
-                </md-list>
-                <!-- / SIDENAV CONTENT -->
-              </div>
-              <!-- / SIDENAV -->
-              <div flex></div>
-              <!-- MAIN -->
-              <div
-                class="main scrollable md-background-bg md-whiteframe-1dp"
-                ms-scroll
-                layout="column"
-                flex="{{vm_ac.crudPermissions.canEdit ? 75 : 100}}"
-              >
-                <md-toolbar
-                  class="md-table-toolbar md-default"
-                  ng-hide="vm_ac.selectedInternalRouteApps.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead">Drag & Drop Routing</span>
-                    <div flex></div>
-                    <ms-search-bar
-                      on-search="vm_ac.query.filter = query"
-                      on-collapse="vm_ac.query.filter = undefined"
-                      debounce="300"
-                    ></ms-search-bar>
-                  </div>
-                </md-toolbar>
-                <md-toolbar
-                  class="md-table-toolbar md-accent"
-                  ng-show="vm_ac.selectedInternalRouteApps.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead"
-                      >{{vm_ac.selectedInternalRouteApps.length}}
-                      {{vm_ac.selectedInternalRouteApps.length > 1 ? 'items' :
-                      'item'}} selected</span
-                    >
-                    <div flex></div>
-                    <md-button
-                      ng-if="vm_ac.crudPermissions.canDelete"
-                      class="md-icon-button"
-                      ng-click="vm_ac.deleteSelectedInternalRouteApps($event)"
-                      aria-label="delete selected"
-                      translate
-                      translate-attr-label="VOICE.DELETE_SELECTED"
-                    >
-                      <md-icon md-font-icon="icon-delete"></md-icon>
-                    </md-button>
-                  </div>
-                </md-toolbar>
-
-                <!-- QUEUES TABLE -->
-                <md-table-container>
-                  <table
-                    md-table
-                    md-row-select
-                    multiple
-                    ng-model="vm_ac.selectedInternalRouteApps"
-                  >
-                    <thead md-head>
-                      <tr md-row>
-                        <th md-column width="10px"></th>
-                        <th md-column>
-                          <span>Type</span>
-                        </th>
-                        <th md-column>
-                          <span>Appdata</span>
-                        </th>
-                        <th md-column>
-                          <span>Interval</span>
-                        </th>
-                        <th md-column width="10px"></th>
-                        <th md-column width="10px"></th>
-                      </tr>
-                    </thead>
-                    <tbody md-body ng-sortable="vm_ac.applications">
-                      <tr
-                        md-row
-                        md-select="app"
-                        md-select-id="id"
-                        ng-repeat="app in vm_ac.internalrouteApps.rows | filter: vm_ac.query.filter"
-                      >
-                        <td md-cell>
-                          <md-icon
-                            md-font-icon="icon-drag-vertical"
-                            class="s16 handle"
-                          ></md-icon>
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editInternalRouteApp($event, $index)"
-                        >
-                          {{app.app.toLowerCase() === 'agi' ? 'Cally-Square' :
-                          app.app | ucfirst}}<span
-                            ng-if="app.appType.toLowerCase() === 'custom'"
-                            >*</span
-                          >
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editInternalRouteApp($event, $index)"
-                        >
-                          <span class="text-truncate" style="width: 200px"
-                            >{{app.appdata}}</span
-                          >
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editInterval($event, $index)"
-                        >
-                          {{app.IntervalId ? 'From List' : app.interval}}
-                        </td>
-                        <td md-cell>
-                          <md-button
-                            ng-click="vm_ac.editInterval($event, $index)"
-                            class="md-icon-button"
-                            aria-label="Interval"
-                          >
-                            <md-icon md-font-icon="icon-timer"></md-icon>
-                            <md-tooltip>
-                              {{app.IntervalId ? 'From List' : (app.interval ===
-                              '*,*,*,*' ? 'Always' : 'Custom')}}
-                            </md-tooltip>
-                          </md-button>
-                        </td>
-                        <td
-                          md-cell
-                          class="actions"
-                          ng-if="!vm_ac.crudPermissions.readOnly"
-                        >
-                          <md-menu>
-                            <md-button
-                              class="md-icon-button"
-                              aria-label="More"
-                              translate
-                              translate-attr-aria-label="VOICE.MORE"
-                              ng-click="$mdOpenMenu($event)"
-                            >
-                              <md-icon
-                                md-font-icon="icon-dots-vertical"
-                              ></md-icon>
-                            </md-button>
-
-                            <md-menu-content width="3">
-                              <md-menu-item
-                                ng-if="vm_ac.crudPermissions.canEdit"
-                              >
-                                <md-button
-                                  ng-click="vm_ac.editInternalRouteApp($event, $index)"
-                                  translate="VOICE.EDIT_APP"
-                                >
-                                  Edit App
-                                </md-button>
-                              </md-menu-item>
-                              <md-menu-item
-                                ng-if="vm_ac.crudPermissions.canEdit"
-                              >
-                                <md-button
-                                  ng-click="vm_ac.editInterval($event, $index)"
-                                  translate="VOICE.EDIT_INTERVAL"
-                                >
-                                  Edit Interval
-                                </md-button>
-                              </md-menu-item>
-                              <md-menu-item
-                                ng-if="vm_ac.crudPermissions.canDelete"
-                              >
-                                <md-button
-                                  ng-click="vm_ac.deleteConfirm(app, $index, $event)"
-                                  translate="VOICE.DELETE_APP"
-                                >
-                                  Delete App
-                                </md-button>
-                              </md-menu-item>
-                            </md-menu-content>
-                          </md-menu>
-                        </td>
-                      </tr>
-                      <tr md-row ng-hide="vm_ac.internalrouteApps.rows.length">
-                        <td md-cell colspan="6">
-                          <span
-                            class="text-boxed-light"
-                            translate="VOICE.NO_APPS_AVAILABLE"
-                            >No apps available</span
-                          >
-                        </td>
-                      </tr>
-                    </tbody>
-                    <tfoot md-foot>
-                      <tr md-row>
-                        <td md-cell colspan="7">
-                          <span
-                            ><em translate="VOICE.LEGEND.CUSTOM_APPLICATION"
-                              >(*) - Custom application.</em
-                            ></span
-                          >
-                        </td>
-                      </tr>
-                    </tfoot>
-                  </table>
-                </md-table-container>
-                <!-- / QUEUES TABLE -->
-
-                <!-- NO RESULTS -->
-
-                <!-- / NO RESULTS -->
-              </div>
-              <!-- / MAIN -->
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/edit/view.html/view.html b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/view.html/view.html
new file mode 100644
index 0000000..02c1523
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/internalroutes/edit/view.html/view.html
@@ -0,0 +1,403 @@
+<div id="voice-internalroute" class="page-layout simple tabbed" layout="column">
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-internalroutes-button md-icon-button"
+        aria-label="Go to internalroutes"
+        ng-click="vm.gotoInternalRoutes()"
+        translate
+        translate-attr-aria-label="VOICE.GO_TO_INTERNALROUTES"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="internalroute-image" hide-xs>
+          <img ng-src="assets/images/business/internalroutes.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.internalroute.id}}
+            <span ng-if="vm.internalroute.name">{{vm.internalroute.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="VOICE.CREATED_AT"></span>
+            <span>{{vm.internalroute.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveInternalRoute()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (actionsForm.$invalid)"
+        translate="VOICE.SAVE"
+        translate-attr-aria-label="VOICE.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="VOICE.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="internalroute-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="VOICE.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="VOICE.PHONENUMBER">PhoneNumber</label>
+                <input
+                  type="text"
+                  name="exten"
+                  ng-model="vm.internalroute.exten"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['exten'].$error"
+                  ng-show="generalForm['exten'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.PHONENUMBER_REQUIRED"
+                      >PhoneNumber field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.CONTEXT">Context</label>
+                <md-select
+                  name="context"
+                  ng-model="vm.internalroute.context"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="context.name"
+                    ng-repeat="context in vm.contexts"
+                    ng-disabled="context.canSelect === false"
+                    >{{ context.name }}</md-option
+                  >
+                </md-select>
+                <div
+                  ng-messages="generalForm['context'].$error"
+                  ng-show="generalForm['context'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.CONTEXT_REQUIRED"
+                      >Context field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.internalroute.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="VOICE.ACTIONS">ACTIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="internalroute-detail-form-container actions md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="InternalRouteActionsController as vm_ac"
+              ng-init="vm_ac.init(vm.internalroute, vm.crudPermissions)"
+              class="content"
+              md-background-bg
+              layout="row"
+              layout-align="start start"
+            >
+              <!-- SIDENAV -->
+              <div
+                class="navigation-simple sidenav main-sidenav md-background-bg md-whiteframe-1dp"
+                ms-scroll
+                layout="column"
+                flex="20"
+                ng-if="vm_ac.crudPermissions.canEdit"
+              >
+                <!-- SIDENAV CONTENT -->
+                <md-list class="no-padding">
+                  <md-subheader class="md-no-sticky">
+                    <span translate="VOICE.APPLICATIONS_LIST">
+                      Applications List
+                    </span>
+                  </md-subheader>
+                </md-list>
+                <md-divider></md-divider>
+                <md-list ng-sortable="vm_ac.list">
+                  <md-list-item class="handle" ng-repeat="a in vm_ac.apps">
+                    <md-icon md-font-icon="{{a.icon}}" class="s16"></md-icon>
+                    <p
+                      class="text-truncate"
+                      translate="VOICE.{{(a.alias || a.appType) | uppercase}}"
+                    >
+                      {{a.alias || a.appType}}
+                    </p>
+                  </md-list-item>
+                </md-list>
+                <!-- / SIDENAV CONTENT -->
+              </div>
+              <!-- / SIDENAV -->
+              <div flex></div>
+              <!-- MAIN -->
+              <div
+                class="main scrollable md-background-bg md-whiteframe-1dp"
+                ms-scroll
+                layout="column"
+                flex="{{vm_ac.crudPermissions.canEdit ? 75 : 100}}"
+              >
+                <md-toolbar
+                  class="md-table-toolbar md-default"
+                  ng-hide="vm_ac.selectedInternalRouteApps.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead">Drag & Drop Routing</span>
+                    <div flex></div>
+                    <ms-search-bar
+                      on-search="vm_ac.query.filter = query"
+                      on-collapse="vm_ac.query.filter = undefined"
+                      debounce="300"
+                    ></ms-search-bar>
+                  </div>
+                </md-toolbar>
+                <md-toolbar
+                  class="md-table-toolbar md-accent"
+                  ng-show="vm_ac.selectedInternalRouteApps.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead"
+                      >{{vm_ac.selectedInternalRouteApps.length}}
+                      {{vm_ac.selectedInternalRouteApps.length > 1 ? 'items' :
+                      'item'}} selected</span
+                    >
+                    <div flex></div>
+                    <md-button
+                      ng-if="vm_ac.crudPermissions.canDelete"
+                      class="md-icon-button"
+                      ng-click="vm_ac.deleteSelectedInternalRouteApps($event)"
+                      aria-label="delete selected"
+                      translate
+                      translate-attr-label="VOICE.DELETE_SELECTED"
+                    >
+                      <md-icon md-font-icon="icon-delete"></md-icon>
+                    </md-button>
+                  </div>
+                </md-toolbar>
+
+                <!-- QUEUES TABLE -->
+                <md-table-container>
+                  <table
+                    md-table
+                    md-row-select
+                    multiple
+                    ng-model="vm_ac.selectedInternalRouteApps"
+                  >
+                    <thead md-head>
+                      <tr md-row>
+                        <th md-column width="10px"></th>
+                        <th md-column>
+                          <span>Type</span>
+                        </th>
+                        <th md-column>
+                          <span>Appdata</span>
+                        </th>
+                        <th md-column>
+                          <span>Interval</span>
+                        </th>
+                        <th md-column width="10px"></th>
+                        <th md-column width="10px"></th>
+                      </tr>
+                    </thead>
+                    <tbody md-body ng-sortable="vm_ac.applications">
+                      <tr
+                        md-row
+                        md-select="app"
+                        md-select-id="id"
+                        ng-repeat="app in vm_ac.internalrouteApps.rows | filter: vm_ac.query.filter"
+                      >
+                        <td md-cell>
+                          <md-icon
+                            md-font-icon="icon-drag-vertical"
+                            class="s16 handle"
+                          ></md-icon>
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editInternalRouteApp($event, $index)"
+                        >
+                          {{app.app.toLowerCase() === 'agi' ? 'Cally-Square' :
+                          app.app | ucfirst}}<span
+                            ng-if="app.appType.toLowerCase() === 'custom'"
+                            >*</span
+                          >
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editInternalRouteApp($event, $index)"
+                        >
+                          <span class="text-truncate" style="width: 200px"
+                            >{{app.appdata}}</span
+                          >
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editInterval($event, $index)"
+                        >
+                          {{app.IntervalId ? 'From List' : app.interval}}
+                        </td>
+                        <td md-cell>
+                          <md-button
+                            ng-click="vm_ac.editInterval($event, $index)"
+                            class="md-icon-button"
+                            aria-label="Interval"
+                          >
+                            <md-icon md-font-icon="icon-timer"></md-icon>
+                            <md-tooltip>
+                              {{app.IntervalId ? 'From List' : (app.interval ===
+                              '*,*,*,*' ? 'Always' : 'Custom')}}
+                            </md-tooltip>
+                          </md-button>
+                        </td>
+                        <td
+                          md-cell
+                          class="actions"
+                          ng-if="!vm_ac.crudPermissions.readOnly"
+                        >
+                          <md-menu>
+                            <md-button
+                              class="md-icon-button"
+                              aria-label="More"
+                              translate
+                              translate-attr-aria-label="VOICE.MORE"
+                              ng-click="$mdOpenMenu($event)"
+                            >
+                              <md-icon
+                                md-font-icon="icon-dots-vertical"
+                              ></md-icon>
+                            </md-button>
+
+                            <md-menu-content width="3">
+                              <md-menu-item
+                                ng-if="vm_ac.crudPermissions.canEdit"
+                              >
+                                <md-button
+                                  ng-click="vm_ac.editInternalRouteApp($event, $index)"
+                                  translate="VOICE.EDIT_APP"
+                                >
+                                  Edit App
+                                </md-button>
+                              </md-menu-item>
+                              <md-menu-item
+                                ng-if="vm_ac.crudPermissions.canEdit"
+                              >
+                                <md-button
+                                  ng-click="vm_ac.editInterval($event, $index)"
+                                  translate="VOICE.EDIT_INTERVAL"
+                                >
+                                  Edit Interval
+                                </md-button>
+                              </md-menu-item>
+                              <md-menu-item
+                                ng-if="vm_ac.crudPermissions.canDelete"
+                              >
+                                <md-button
+                                  ng-click="vm_ac.deleteConfirm(app, $index, $event)"
+                                  translate="VOICE.DELETE_APP"
+                                >
+                                  Delete App
+                                </md-button>
+                              </md-menu-item>
+                            </md-menu-content>
+                          </md-menu>
+                        </td>
+                      </tr>
+                      <tr md-row ng-hide="vm_ac.internalrouteApps.rows.length">
+                        <td md-cell colspan="6">
+                          <span
+                            class="text-boxed-light"
+                            translate="VOICE.NO_APPS_AVAILABLE"
+                            >No apps available</span
+                          >
+                        </td>
+                      </tr>
+                    </tbody>
+                    <tfoot md-foot>
+                      <tr md-row>
+                        <td md-cell colspan="7">
+                          <span
+                            ><em translate="VOICE.LEGEND.CUSTOM_APPLICATION"
+                              >(*) - Custom application.</em
+                            ></span
+                          >
+                        </td>
+                      </tr>
+                    </tfoot>
+                  </table>
+                </md-table-container>
+                <!-- / QUEUES TABLE -->
+
+                <!-- NO RESULTS -->
+
+                <!-- / NO RESULTS -->
+              </div>
+              <!-- / MAIN -->
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/internalroutes.html/internalroutes-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/internalroutes/internalroutes.html/internalroutes-[chunkhash].html
deleted file mode 100644
index 674301c..0000000
--- a/public/src/js/modules/main/apps/voice/views/internalroutes/internalroutes.html/internalroutes-[chunkhash].html
+++ /dev/null
@@ -1,299 +0,0 @@
-<div
-  id="internalroutes"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-phone" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="VOICE.INTERNALROUTES"
-          >InternalRoutes</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="VOICE.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedInternalRoutes.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedInternalRoutes =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="VOICE.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-internalroutes-count">
-          <span>{{vm.selectedInternalRoutes.length}}</span>
-          <span translate="VOICE.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="VOICE.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllInternalRoutes()"
-                translate="VOICE.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectInternalRoutes()"
-                translate="VOICE.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedInternalRoutes"
-          csv-label="true"
-          filename="internalroutes.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedInternalRoutes($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="VOICE.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- INTERNALROUTE TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedInternalRoutes"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getInternalRoutes"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'VOICE.ID' | translate }}</th>
-                <th md-column md-order-by="exten">
-                  {{ 'VOICE.PHONENUMBER' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'VOICE.DESCRIPTION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.internalroutes.rows.length">
-                <td md-cell colspan="4">
-                  <div layout="row" layout-align="center center">
-                    <span translate="VOICE.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="internalroute"
-                md-select-id="id"
-                ng-repeat="internalroute in vm.internalroutes.rows"
-              >
-                <td md-cell ng-if="internalroute.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{internalroute.name}}"
-                    ng-src="api/users/{{internalroute.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!internalroute.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{internalroute.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(internalroute, ev) : vm.createOrEditInternalRoute($event, internalroute)"
-                  md-cell
-                  class="id"
-                >
-                  {{internalroute.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(internalroute, ev) : vm.createOrEditInternalRoute($event, internalroute)"
-                  md-cell
-                  class="exten"
-                >
-                  {{internalroute.exten}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(internalroute, ev) : vm.createOrEditInternalRoute($event, internalroute)"
-                  md-cell
-                  class="description"
-                >
-                  {{internalroute.description}}
-                </td>
-
-                <td
-                  md-cell
-                  class="actions"
-                  ng-if="!vm.crudPermissions.readOnly"
-                >
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="VOICE.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(internalroute, $event    )"
-                          translate="VOICE.EDIT_INTERNALROUTE"
-                        >
-                          Edit InternalRoute
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(internalroute, $event    )"
-                          translate="VOICE.DELETE_INTERNALROUTE"
-                        >
-                          Delete InternalRoute
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.internalroutes.count}}"
-          md-on-paginate="vm.getInternalRoutes"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / INTERNALROUTE TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD INTERNALROUTE BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-internalroute-button"
-    ng-click="vm.createOrEditInternalRoute($event)"
-    aria-label="add internalroute"
-    translate
-    translate-attr-aria-label="VOICE.ADD_INTERNALROUTE"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD INTERNALROUTE BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/voice/views/internalroutes/internalroutes.html/internalroutes.html b/public/src/js/modules/main/apps/voice/views/internalroutes/internalroutes.html/internalroutes.html
new file mode 100644
index 0000000..674301c
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/internalroutes/internalroutes.html/internalroutes.html
@@ -0,0 +1,299 @@
+<div
+  id="internalroutes"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-phone" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="VOICE.INTERNALROUTES"
+          >InternalRoutes</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="VOICE.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedInternalRoutes.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedInternalRoutes =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="VOICE.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-internalroutes-count">
+          <span>{{vm.selectedInternalRoutes.length}}</span>
+          <span translate="VOICE.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="VOICE.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllInternalRoutes()"
+                translate="VOICE.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectInternalRoutes()"
+                translate="VOICE.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedInternalRoutes"
+          csv-label="true"
+          filename="internalroutes.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedInternalRoutes($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="VOICE.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- INTERNALROUTE TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedInternalRoutes"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getInternalRoutes"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'VOICE.ID' | translate }}</th>
+                <th md-column md-order-by="exten">
+                  {{ 'VOICE.PHONENUMBER' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'VOICE.DESCRIPTION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.internalroutes.rows.length">
+                <td md-cell colspan="4">
+                  <div layout="row" layout-align="center center">
+                    <span translate="VOICE.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="internalroute"
+                md-select-id="id"
+                ng-repeat="internalroute in vm.internalroutes.rows"
+              >
+                <td md-cell ng-if="internalroute.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{internalroute.name}}"
+                    ng-src="api/users/{{internalroute.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!internalroute.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{internalroute.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(internalroute, ev) : vm.createOrEditInternalRoute($event, internalroute)"
+                  md-cell
+                  class="id"
+                >
+                  {{internalroute.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(internalroute, ev) : vm.createOrEditInternalRoute($event, internalroute)"
+                  md-cell
+                  class="exten"
+                >
+                  {{internalroute.exten}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(internalroute, ev) : vm.createOrEditInternalRoute($event, internalroute)"
+                  md-cell
+                  class="description"
+                >
+                  {{internalroute.description}}
+                </td>
+
+                <td
+                  md-cell
+                  class="actions"
+                  ng-if="!vm.crudPermissions.readOnly"
+                >
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="VOICE.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(internalroute, $event    )"
+                          translate="VOICE.EDIT_INTERNALROUTE"
+                        >
+                          Edit InternalRoute
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(internalroute, $event    )"
+                          translate="VOICE.DELETE_INTERNALROUTE"
+                        >
+                          Delete InternalRoute
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.internalroutes.count}}"
+          md-on-paginate="vm.getInternalRoutes"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / INTERNALROUTE TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD INTERNALROUTE BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-internalroute-button"
+    ng-click="vm.createOrEditInternalRoute($event)"
+    aria-label="add internalroute"
+    translate
+    translate-attr-aria-label="VOICE.ADD_INTERNALROUTE"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD INTERNALROUTE BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/voice/views/musiconholds/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/musiconholds/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 554a364..0000000
--- a/public/src/js/modules/main/apps/voice/views/musiconholds/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,230 +0,0 @@
-<md-dialog class="musiconhold-dialog" aria-label="New MusicOnHold">
-  <form name="musiconholdForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.musiconhold.name"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.newMusicOnHold"
-        />
-
-        <div
-          ng-messages="musiconholdForm['name'].$error"
-          ng-show="musiconholdForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.MODE">Mode</label>
-        <md-select
-          name="mode"
-          ng-model="vm.musiconhold.mode"
-          required
-          ng-disabled="!vm.newMusicOnHold"
-        >
-          <md-option ng-value="'files'">
-            {{ 'VOICE.FILES' | translate }}
-          </md-option>
-
-          <md-option ng-value="'custom'">
-            {{ 'VOICE.CUSTOM' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="musiconholdForm['mode'].$error"
-          ng-show="musiconholdForm['mode'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.MODE_REQUIRED"
-              >Mode field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.musiconhold.mode == 'custom'"
-        class="md-block"
-      >
-        <label translate="VOICE.DIRECTORY">Directory</label>
-        <input type="" name="directory" ng-model="vm.musiconhold.directory" />
-
-        <div
-          ng-messages="musiconholdForm['directory'].$error"
-          ng-show="musiconholdForm['directory'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.DIRECTORY_REQUIRED"
-              >Directory field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.musiconhold.mode == 'custom'"
-        class="md-block"
-      >
-        <label translate="VOICE.APPLICATION">Application</label>
-        <input
-          type="text"
-          name="application"
-          ng-model="vm.musiconhold.application"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="musiconholdForm['application'].$error"
-          ng-show="musiconholdForm['application'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.APPLICATION_REQUIRED"
-              >Application field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.musiconhold.mode == 'files'"
-        class="md-block"
-      >
-        <label translate="VOICE.SORT">Sort</label>
-        <md-select name="sort" ng-model="vm.musiconhold.sort">
-          <md-option ng-value="'random'">
-            {{ 'VOICE.RANDOM' | translate }}
-          </md-option>
-
-          <md-option ng-value="'alpha'">
-            {{ 'VOICE.ALPHABETICAL' | translate }}
-          </md-option>
-        </md-select>
-        <div
-          ng-messages="musiconholdForm['sort'].$error"
-          ng-show="musiconholdForm['sort'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.SORT_REQUIRED"
-              >Sort field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newMusicOnHold"
-          ng-click="vm.saveMusicOnHold()"
-          class="send-button md-accent md-raised"
-          ng-disabled="musiconholdForm.$invalid || musiconholdForm.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newMusicOnHold"
-          ng-click="vm.addNewMusicOnHold()"
-          class="send-button md-accent md-raised"
-          ng-disabled="musiconholdForm.$invalid"
-          aria-label="ADD"
-          translate="VOICE.ADD_MUSICONHOLD"
-          translate-attr-aria-label="VOICE.ADD_MUSICONHOLD"
-        >
-          ADD MUSICONHOLD
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newMusicOnHold"
-          ng-click="vm.deleteMusicOnHold($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="VOICE.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="VOICE.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/musiconholds/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/musiconholds/create/dialog.html/dialog.html
new file mode 100644
index 0000000..554a364
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/musiconholds/create/dialog.html/dialog.html
@@ -0,0 +1,230 @@
+<md-dialog class="musiconhold-dialog" aria-label="New MusicOnHold">
+  <form name="musiconholdForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.musiconhold.name"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.newMusicOnHold"
+        />
+
+        <div
+          ng-messages="musiconholdForm['name'].$error"
+          ng-show="musiconholdForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.MODE">Mode</label>
+        <md-select
+          name="mode"
+          ng-model="vm.musiconhold.mode"
+          required
+          ng-disabled="!vm.newMusicOnHold"
+        >
+          <md-option ng-value="'files'">
+            {{ 'VOICE.FILES' | translate }}
+          </md-option>
+
+          <md-option ng-value="'custom'">
+            {{ 'VOICE.CUSTOM' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="musiconholdForm['mode'].$error"
+          ng-show="musiconholdForm['mode'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.MODE_REQUIRED"
+              >Mode field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.musiconhold.mode == 'custom'"
+        class="md-block"
+      >
+        <label translate="VOICE.DIRECTORY">Directory</label>
+        <input type="" name="directory" ng-model="vm.musiconhold.directory" />
+
+        <div
+          ng-messages="musiconholdForm['directory'].$error"
+          ng-show="musiconholdForm['directory'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.DIRECTORY_REQUIRED"
+              >Directory field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.musiconhold.mode == 'custom'"
+        class="md-block"
+      >
+        <label translate="VOICE.APPLICATION">Application</label>
+        <input
+          type="text"
+          name="application"
+          ng-model="vm.musiconhold.application"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="musiconholdForm['application'].$error"
+          ng-show="musiconholdForm['application'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.APPLICATION_REQUIRED"
+              >Application field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.musiconhold.mode == 'files'"
+        class="md-block"
+      >
+        <label translate="VOICE.SORT">Sort</label>
+        <md-select name="sort" ng-model="vm.musiconhold.sort">
+          <md-option ng-value="'random'">
+            {{ 'VOICE.RANDOM' | translate }}
+          </md-option>
+
+          <md-option ng-value="'alpha'">
+            {{ 'VOICE.ALPHABETICAL' | translate }}
+          </md-option>
+        </md-select>
+        <div
+          ng-messages="musiconholdForm['sort'].$error"
+          ng-show="musiconholdForm['sort'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.SORT_REQUIRED"
+              >Sort field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newMusicOnHold"
+          ng-click="vm.saveMusicOnHold()"
+          class="send-button md-accent md-raised"
+          ng-disabled="musiconholdForm.$invalid || musiconholdForm.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newMusicOnHold"
+          ng-click="vm.addNewMusicOnHold()"
+          class="send-button md-accent md-raised"
+          ng-disabled="musiconholdForm.$invalid"
+          aria-label="ADD"
+          translate="VOICE.ADD_MUSICONHOLD"
+          translate-attr-aria-label="VOICE.ADD_MUSICONHOLD"
+        >
+          ADD MUSICONHOLD
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newMusicOnHold"
+          ng-click="vm.deleteMusicOnHold($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="VOICE.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="VOICE.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/musiconholds/edit/mohSounds/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/musiconholds/edit/mohSounds/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index be40793..0000000
--- a/public/src/js/modules/main/apps/voice/views/musiconholds/edit/mohSounds/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,132 +0,0 @@
-<md-dialog class="mohSound-dialog" aria-label="New MohSound">
-  <form name="mohSoundForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.FILE">File</label>
-        <md-select name="id" ng-model="vm.mohSound.id" autofocus>
-          <md-option
-            ng-value="id.id"
-            ng-repeat="id in vm.sounds"
-            ng-disabled="id.canSelect === false"
-            >{{ id.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="mohSoundForm['id'].$error"
-          ng-show="mohSoundForm['id'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.FILE_REQUIRED"
-              >File field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newMohSound"
-          ng-click="vm.saveMohSound()"
-          class="send-button md-accent md-raised"
-          ng-disabled="mohSoundForm.$invalid || mohSoundForm.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newMohSound"
-          ng-click="vm.addNewMohSound()"
-          class="send-button md-accent md-raised"
-          ng-disabled="mohSoundForm.$invalid"
-          aria-label="ADD"
-          translate="VOICE.ADD_MOHSOUND"
-          translate-attr-aria-label="VOICE.ADD_MOHSOUND"
-        >
-          ADD MOHSOUND
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newMohSound"
-          ng-click="vm.deleteMohSound($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="VOICE.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="VOICE.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/musiconholds/edit/mohSounds/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/musiconholds/edit/mohSounds/dialog.html/dialog.html
new file mode 100644
index 0000000..be40793
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/musiconholds/edit/mohSounds/dialog.html/dialog.html
@@ -0,0 +1,132 @@
+<md-dialog class="mohSound-dialog" aria-label="New MohSound">
+  <form name="mohSoundForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.FILE">File</label>
+        <md-select name="id" ng-model="vm.mohSound.id" autofocus>
+          <md-option
+            ng-value="id.id"
+            ng-repeat="id in vm.sounds"
+            ng-disabled="id.canSelect === false"
+            >{{ id.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="mohSoundForm['id'].$error"
+          ng-show="mohSoundForm['id'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.FILE_REQUIRED"
+              >File field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newMohSound"
+          ng-click="vm.saveMohSound()"
+          class="send-button md-accent md-raised"
+          ng-disabled="mohSoundForm.$invalid || mohSoundForm.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newMohSound"
+          ng-click="vm.addNewMohSound()"
+          class="send-button md-accent md-raised"
+          ng-disabled="mohSoundForm.$invalid"
+          aria-label="ADD"
+          translate="VOICE.ADD_MOHSOUND"
+          translate-attr-aria-label="VOICE.ADD_MOHSOUND"
+        >
+          ADD MOHSOUND
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newMohSound"
+          ng-click="vm.deleteMohSound($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="VOICE.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="VOICE.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/musiconholds/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/musiconholds/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index 69f30c2..0000000
--- a/public/src/js/modules/main/apps/voice/views/musiconholds/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,377 +0,0 @@
-<div id="voice-musiconhold" class="page-layout simple tabbed" layout="column">
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-musiconholds-button md-icon-button"
-        aria-label="Go to musiconholds"
-        ng-click="vm.gotoMusicOnHolds()"
-        translate
-        translate-attr-aria-label="VOICE.GO_TO_MUSICONHOLDS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="musiconhold-image" hide-xs>
-          <img ng-src="assets/images/business/musiconholds.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.musiconhold.id}}
-            <span ng-if="vm.musiconhold.name">{{vm.musiconhold.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="VOICE.CREATED_AT"></span>
-            <span>{{vm.musiconhold.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveMusicOnHold()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (mohSoundsForm.$invalid)"
-        translate="VOICE.SAVE"
-        translate-attr-aria-label="VOICE.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="VOICE.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="musiconhold-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="VOICE.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="VOICE.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.musiconhold.name"
-                  ng-required="true"
-                  autofocus
-                  disabled
-                />
-
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.MODE">Mode</label>
-                <md-select
-                  name="mode"
-                  ng-model="vm.musiconhold.mode"
-                  required
-                  disabled
-                >
-                  <md-option ng-value="'files'">
-                    {{ 'VOICE.FILES' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'custom'">
-                    {{ 'VOICE.CUSTOM' | translate }}
-                  </md-option>
-                </md-select>
-                <div
-                  ng-messages="generalForm['mode'].$error"
-                  ng-show="generalForm['mode'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.MODE_REQUIRED"
-                      >Mode field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.musiconhold.mode == 'custom'"
-                class="md-block"
-              >
-                <label translate="VOICE.DIRECTORY">Directory</label>
-                <input
-                  type=""
-                  name="directory"
-                  ng-model="vm.musiconhold.directory"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['directory'].$error"
-                  ng-show="generalForm['directory'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.DIRECTORY_REQUIRED"
-                      >Directory field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.musiconhold.mode == 'custom'"
-                class="md-block"
-              >
-                <label translate="VOICE.APPLICATION">Application</label>
-                <input
-                  type="text"
-                  name="application"
-                  ng-model="vm.musiconhold.application"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['application'].$error"
-                  ng-show="generalForm['application'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.APPLICATION_REQUIRED"
-                      >Application field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.musiconhold.mode == 'files'"
-                class="md-block"
-              >
-                <label translate="VOICE.SORT">Sort</label>
-                <md-select
-                  name="sort"
-                  ng-model="vm.musiconhold.sort"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'random'">
-                    {{ 'VOICE.RANDOM' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'alpha'">
-                    {{ 'VOICE.ALPHABETICAL' | translate }}
-                  </md-option>
-                </md-select>
-                <div
-                  ng-messages="generalForm['sort'].$error"
-                  ng-show="generalForm['sort'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.SORT_REQUIRED"
-                      >Sort field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="VOICE.AUDIOFILES">AUDIOFILES</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="musiconhold-detail-form-container mohsounds md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="MusicOnHoldMohSoundsController as vm_dc"
-              ng-init="vm_dc.init(vm.musiconhold, vm.crudPermissions)"
-            >
-              <md-toolbar
-                class="md-table-toolbar md-default"
-                ng-hide="vm_dc.selectedMusicOnHoldMohSounds.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead" translate="VOICE.MOHSOUNDS"
-                    >MohSounds</span
-                  >
-                  <ms-search-bar
-                    on-search="vm_dc.query.filter = query"
-                    on-collapse="vm_dc.query.filter = undefined"
-                    debounce="300"
-                    direction="down"
-                  ></ms-search-bar>
-                  <div flex></div>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canEdit"
-                    class="md-icon-button"
-                    ng-click="vm_dc.createOrEditMusicOnHoldMohSound($event)"
-                    aria-label="add mohSound"
-                    translate
-                    translate-attr-label="VOICE.ADD_MOHSOUND"
-                  >
-                    <md-icon md-font-icon="icon-plus"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-toolbar
-                class="md-table-toolbar md-accent"
-                ng-show="vm_dc.selectedMusicOnHoldMohSounds.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead"
-                    >{{vm_dc.selectedMusicOnHoldMohSounds.length}}
-                    {{vm_dc.selectedMusicOnHoldMohSounds.length > 1 ? 'items' :
-                    'item'}} selected</span
-                  >
-                  <div flex></div>
-                  <button
-                    class="md-icon-button"
-                    ng-csv="vm_dc.exportSelectedMusicOnHoldMohSounds"
-                    csv-label="true"
-                    filename="musiconholds.csv"
-                  >
-                    <md-icon md-font-icon="icon-file-excel"></md-icon>
-                  </button>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canDelete"
-                    class="md-icon-button"
-                    ng-click="vm_dc.deleteSelectedMusicOnHoldMohSounds($event)"
-                    aria-label="delete selected"
-                    translate
-                    translate-attr-label="VOICE.DELETE_SELECTED"
-                  >
-                    <md-icon md-font-icon="icon-delete"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-table-container class="font-size-12">
-                <table
-                  md-table
-                  md-row-select
-                  multiple
-                  ng-model="vm_dc.selectedMusicOnHoldMohSounds"
-                  md-progress="vm_dc.promise"
-                >
-                  <thead
-                    md-head
-                    md-order="vm_dc.query.sort"
-                    md-on-reorder="vm_dc.getMusicOnHoldMohSounds"
-                  >
-                    <tr md-row>
-                      <th md-column md-order-by="id">
-                        {{ 'VOICE.ID' | translate }}
-                      </th>
-                      <th md-column md-order-by="audio">
-                        {{ 'VOICE.AUDIO' | translate }}
-                      </th>
-                      <th md-column md-order-by="createdAt">
-                        {{ 'VOICE.CREATED_AT' | translate }}
-                      </th>
-                      <th md-column width="10px"></th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr
-                      md-row
-                      md-select="mohSound"
-                      md-select-id="id"
-                      ng-repeat="mohSound in vm_dc.musiconholdMohSounds.rows"
-                    >
-                      <td md-cell>{{mohSound.id}}</td>
-                      <td md-cell>
-                        <!-- audio recording directive -->
-                        <ms-recording
-                          id="mohSound.id"
-                          model="'sound'"
-                        ></ms-recording>
-                        <!-- / audio recording directive -->
-                      </td>
-                      <td md-cell>{{ mohSound.createdAt | formatdate }}</td>
-                      <td md-cell class="actions">
-                        <md-menu>
-                          <md-button
-                            class="md-icon-button"
-                            aria-label="More"
-                            translate
-                            translate-attr-aria-label="VOICE.MORE"
-                            ng-click="$mdOpenMenu($event)"
-                          >
-                            <md-icon
-                              md-font-icon="icon-dots-vertical"
-                            ></md-icon>
-                          </md-button>
-
-                          <md-menu-content width="3">
-                            <md-menu-item
-                              ng-if="vm_dc.crudPermissions.canDelete"
-                            >
-                              <md-button
-                                ng-click="vm_dc.deleteConfirm(mohSound, $event)"
-                                translate="VOICE.DELETE_MOHSOUND"
-                              >
-                                Delete MohSound
-                              </md-button>
-                            </md-menu-item>
-                          </md-menu-content>
-                        </md-menu>
-                      </td>
-                    </tr>
-                    <tr md-row ng-if="!vm_dc.musiconholdMohSounds.rows.length">
-                      <td md-cell colspan="8">
-                        <div layout="row" layout-align="center center">
-                          <span
-                            class="text-boxed-light"
-                            translate="VOICE.NO_MOHSOUND_AVAILABLE"
-                            >No mohsound available</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-              <md-table-pagination
-                md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
-                md-limit="vm_dc.query.limit"
-                md-limit-options="[10, 15, 20, 50, 100, 250]"
-                md-page="vm_dc.query.page"
-                md-total="{{vm_dc.musiconholdMohSounds.count}}"
-                md-on-paginate="vm_dc.getMusicOnHoldMohSounds"
-                md-page-select
-              ></md-table-pagination>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/voice/views/musiconholds/edit/view.html/view.html b/public/src/js/modules/main/apps/voice/views/musiconholds/edit/view.html/view.html
new file mode 100644
index 0000000..69f30c2
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/musiconholds/edit/view.html/view.html
@@ -0,0 +1,377 @@
+<div id="voice-musiconhold" class="page-layout simple tabbed" layout="column">
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-musiconholds-button md-icon-button"
+        aria-label="Go to musiconholds"
+        ng-click="vm.gotoMusicOnHolds()"
+        translate
+        translate-attr-aria-label="VOICE.GO_TO_MUSICONHOLDS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="musiconhold-image" hide-xs>
+          <img ng-src="assets/images/business/musiconholds.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.musiconhold.id}}
+            <span ng-if="vm.musiconhold.name">{{vm.musiconhold.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="VOICE.CREATED_AT"></span>
+            <span>{{vm.musiconhold.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveMusicOnHold()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (mohSoundsForm.$invalid)"
+        translate="VOICE.SAVE"
+        translate-attr-aria-label="VOICE.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="VOICE.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="musiconhold-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="VOICE.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="VOICE.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.musiconhold.name"
+                  ng-required="true"
+                  autofocus
+                  disabled
+                />
+
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.MODE">Mode</label>
+                <md-select
+                  name="mode"
+                  ng-model="vm.musiconhold.mode"
+                  required
+                  disabled
+                >
+                  <md-option ng-value="'files'">
+                    {{ 'VOICE.FILES' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'custom'">
+                    {{ 'VOICE.CUSTOM' | translate }}
+                  </md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['mode'].$error"
+                  ng-show="generalForm['mode'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.MODE_REQUIRED"
+                      >Mode field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.musiconhold.mode == 'custom'"
+                class="md-block"
+              >
+                <label translate="VOICE.DIRECTORY">Directory</label>
+                <input
+                  type=""
+                  name="directory"
+                  ng-model="vm.musiconhold.directory"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['directory'].$error"
+                  ng-show="generalForm['directory'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.DIRECTORY_REQUIRED"
+                      >Directory field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.musiconhold.mode == 'custom'"
+                class="md-block"
+              >
+                <label translate="VOICE.APPLICATION">Application</label>
+                <input
+                  type="text"
+                  name="application"
+                  ng-model="vm.musiconhold.application"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['application'].$error"
+                  ng-show="generalForm['application'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.APPLICATION_REQUIRED"
+                      >Application field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.musiconhold.mode == 'files'"
+                class="md-block"
+              >
+                <label translate="VOICE.SORT">Sort</label>
+                <md-select
+                  name="sort"
+                  ng-model="vm.musiconhold.sort"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'random'">
+                    {{ 'VOICE.RANDOM' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'alpha'">
+                    {{ 'VOICE.ALPHABETICAL' | translate }}
+                  </md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['sort'].$error"
+                  ng-show="generalForm['sort'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.SORT_REQUIRED"
+                      >Sort field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="VOICE.AUDIOFILES">AUDIOFILES</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="musiconhold-detail-form-container mohsounds md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="MusicOnHoldMohSoundsController as vm_dc"
+              ng-init="vm_dc.init(vm.musiconhold, vm.crudPermissions)"
+            >
+              <md-toolbar
+                class="md-table-toolbar md-default"
+                ng-hide="vm_dc.selectedMusicOnHoldMohSounds.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead" translate="VOICE.MOHSOUNDS"
+                    >MohSounds</span
+                  >
+                  <ms-search-bar
+                    on-search="vm_dc.query.filter = query"
+                    on-collapse="vm_dc.query.filter = undefined"
+                    debounce="300"
+                    direction="down"
+                  ></ms-search-bar>
+                  <div flex></div>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canEdit"
+                    class="md-icon-button"
+                    ng-click="vm_dc.createOrEditMusicOnHoldMohSound($event)"
+                    aria-label="add mohSound"
+                    translate
+                    translate-attr-label="VOICE.ADD_MOHSOUND"
+                  >
+                    <md-icon md-font-icon="icon-plus"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-toolbar
+                class="md-table-toolbar md-accent"
+                ng-show="vm_dc.selectedMusicOnHoldMohSounds.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead"
+                    >{{vm_dc.selectedMusicOnHoldMohSounds.length}}
+                    {{vm_dc.selectedMusicOnHoldMohSounds.length > 1 ? 'items' :
+                    'item'}} selected</span
+                  >
+                  <div flex></div>
+                  <button
+                    class="md-icon-button"
+                    ng-csv="vm_dc.exportSelectedMusicOnHoldMohSounds"
+                    csv-label="true"
+                    filename="musiconholds.csv"
+                  >
+                    <md-icon md-font-icon="icon-file-excel"></md-icon>
+                  </button>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canDelete"
+                    class="md-icon-button"
+                    ng-click="vm_dc.deleteSelectedMusicOnHoldMohSounds($event)"
+                    aria-label="delete selected"
+                    translate
+                    translate-attr-label="VOICE.DELETE_SELECTED"
+                  >
+                    <md-icon md-font-icon="icon-delete"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-table-container class="font-size-12">
+                <table
+                  md-table
+                  md-row-select
+                  multiple
+                  ng-model="vm_dc.selectedMusicOnHoldMohSounds"
+                  md-progress="vm_dc.promise"
+                >
+                  <thead
+                    md-head
+                    md-order="vm_dc.query.sort"
+                    md-on-reorder="vm_dc.getMusicOnHoldMohSounds"
+                  >
+                    <tr md-row>
+                      <th md-column md-order-by="id">
+                        {{ 'VOICE.ID' | translate }}
+                      </th>
+                      <th md-column md-order-by="audio">
+                        {{ 'VOICE.AUDIO' | translate }}
+                      </th>
+                      <th md-column md-order-by="createdAt">
+                        {{ 'VOICE.CREATED_AT' | translate }}
+                      </th>
+                      <th md-column width="10px"></th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr
+                      md-row
+                      md-select="mohSound"
+                      md-select-id="id"
+                      ng-repeat="mohSound in vm_dc.musiconholdMohSounds.rows"
+                    >
+                      <td md-cell>{{mohSound.id}}</td>
+                      <td md-cell>
+                        <!-- audio recording directive -->
+                        <ms-recording
+                          id="mohSound.id"
+                          model="'sound'"
+                        ></ms-recording>
+                        <!-- / audio recording directive -->
+                      </td>
+                      <td md-cell>{{ mohSound.createdAt | formatdate }}</td>
+                      <td md-cell class="actions">
+                        <md-menu>
+                          <md-button
+                            class="md-icon-button"
+                            aria-label="More"
+                            translate
+                            translate-attr-aria-label="VOICE.MORE"
+                            ng-click="$mdOpenMenu($event)"
+                          >
+                            <md-icon
+                              md-font-icon="icon-dots-vertical"
+                            ></md-icon>
+                          </md-button>
+
+                          <md-menu-content width="3">
+                            <md-menu-item
+                              ng-if="vm_dc.crudPermissions.canDelete"
+                            >
+                              <md-button
+                                ng-click="vm_dc.deleteConfirm(mohSound, $event)"
+                                translate="VOICE.DELETE_MOHSOUND"
+                              >
+                                Delete MohSound
+                              </md-button>
+                            </md-menu-item>
+                          </md-menu-content>
+                        </md-menu>
+                      </td>
+                    </tr>
+                    <tr md-row ng-if="!vm_dc.musiconholdMohSounds.rows.length">
+                      <td md-cell colspan="8">
+                        <div layout="row" layout-align="center center">
+                          <span
+                            class="text-boxed-light"
+                            translate="VOICE.NO_MOHSOUND_AVAILABLE"
+                            >No mohsound available</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+              <md-table-pagination
+                md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
+                md-limit="vm_dc.query.limit"
+                md-limit-options="[10, 15, 20, 50, 100, 250]"
+                md-page="vm_dc.query.page"
+                md-total="{{vm_dc.musiconholdMohSounds.count}}"
+                md-on-paginate="vm_dc.getMusicOnHoldMohSounds"
+                md-page-select
+              ></md-table-pagination>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/voice/views/musiconholds/musiconholds.html/musiconholds-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/musiconholds/musiconholds.html/musiconholds-[chunkhash].html
deleted file mode 100644
index 2985e8b..0000000
--- a/public/src/js/modules/main/apps/voice/views/musiconholds/musiconholds.html/musiconholds-[chunkhash].html
+++ /dev/null
@@ -1,311 +0,0 @@
-<div
-  id="musiconholds"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-phone" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="VOICE.MUSICONHOLDS"
-          >MusicOnHolds</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="VOICE.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedMusicOnHolds.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedMusicOnHolds =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="VOICE.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-musiconholds-count">
-          <span>{{vm.selectedMusicOnHolds.length}}</span>
-          <span translate="VOICE.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="VOICE.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllMusicOnHolds()"
-                translate="VOICE.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectMusicOnHolds()"
-                translate="VOICE.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedMusicOnHolds"
-          csv-label="true"
-          filename="musiconholds.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedMusicOnHolds($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="VOICE.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- MUSICONHOLD TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedMusicOnHolds"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getMusicOnHolds"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'VOICE.ID' | translate }}</th>
-                <th md-column md-order-by="name">
-                  {{ 'VOICE.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="mode">
-                  {{ 'VOICE.MODE' | translate }}
-                </th>
-                <th md-column md-order-by="sort">
-                  {{ 'VOICE.SORT' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.musiconholds.rows.length">
-                <td md-cell colspan="5">
-                  <div layout="row" layout-align="center center">
-                    <span translate="VOICE.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="musiconhold"
-                md-select-id="id"
-                ng-repeat="musiconhold in vm.musiconholds.rows"
-              >
-                <td md-cell ng-if="musiconhold.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{musiconhold.name}}"
-                    ng-src="api/users/{{musiconhold.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!musiconhold.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{musiconhold.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(musiconhold, ev) : vm.createOrEditMusicOnHold($event, musiconhold)"
-                  md-cell
-                  class="id"
-                >
-                  {{musiconhold.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(musiconhold, ev) : vm.createOrEditMusicOnHold($event, musiconhold)"
-                  md-cell
-                  class="name"
-                >
-                  {{musiconhold.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(musiconhold, ev) : vm.createOrEditMusicOnHold($event, musiconhold)"
-                  md-cell
-                  class="mode"
-                >
-                  {{ 'VOICE.' + vm.arraymode[musiconhold.mode].option |
-                  uppercase | translate }}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(musiconhold, ev) : vm.createOrEditMusicOnHold($event, musiconhold)"
-                  md-cell
-                  class="sort"
-                >
-                  {{ 'VOICE.' + vm.arraysort[musiconhold.sort].option |
-                  uppercase | translate }}
-                </td>
-
-                <td
-                  md-cell
-                  class="actions"
-                  ng-if="!vm.crudPermissions.readOnly"
-                >
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="VOICE.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(musiconhold, $event    )"
-                          translate="VOICE.EDIT_MUSICONHOLD"
-                        >
-                          Edit MusicOnHold
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(musiconhold, $event    )"
-                          translate="VOICE.DELETE_MUSICONHOLD"
-                        >
-                          Delete MusicOnHold
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.musiconholds.count}}"
-          md-on-paginate="vm.getMusicOnHolds"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / MUSICONHOLD TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD MUSICONHOLD BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-musiconhold-button"
-    ng-click="vm.createOrEditMusicOnHold($event)"
-    aria-label="add musiconhold"
-    translate
-    translate-attr-aria-label="VOICE.ADD_MUSICONHOLD"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD MUSICONHOLD BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/voice/views/musiconholds/musiconholds.html/musiconholds.html b/public/src/js/modules/main/apps/voice/views/musiconholds/musiconholds.html/musiconholds.html
new file mode 100644
index 0000000..2985e8b
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/musiconholds/musiconholds.html/musiconholds.html
@@ -0,0 +1,311 @@
+<div
+  id="musiconholds"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-phone" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="VOICE.MUSICONHOLDS"
+          >MusicOnHolds</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="VOICE.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedMusicOnHolds.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedMusicOnHolds =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="VOICE.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-musiconholds-count">
+          <span>{{vm.selectedMusicOnHolds.length}}</span>
+          <span translate="VOICE.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="VOICE.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllMusicOnHolds()"
+                translate="VOICE.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectMusicOnHolds()"
+                translate="VOICE.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedMusicOnHolds"
+          csv-label="true"
+          filename="musiconholds.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedMusicOnHolds($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="VOICE.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- MUSICONHOLD TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedMusicOnHolds"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getMusicOnHolds"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'VOICE.ID' | translate }}</th>
+                <th md-column md-order-by="name">
+                  {{ 'VOICE.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="mode">
+                  {{ 'VOICE.MODE' | translate }}
+                </th>
+                <th md-column md-order-by="sort">
+                  {{ 'VOICE.SORT' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.musiconholds.rows.length">
+                <td md-cell colspan="5">
+                  <div layout="row" layout-align="center center">
+                    <span translate="VOICE.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="musiconhold"
+                md-select-id="id"
+                ng-repeat="musiconhold in vm.musiconholds.rows"
+              >
+                <td md-cell ng-if="musiconhold.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{musiconhold.name}}"
+                    ng-src="api/users/{{musiconhold.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!musiconhold.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{musiconhold.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(musiconhold, ev) : vm.createOrEditMusicOnHold($event, musiconhold)"
+                  md-cell
+                  class="id"
+                >
+                  {{musiconhold.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(musiconhold, ev) : vm.createOrEditMusicOnHold($event, musiconhold)"
+                  md-cell
+                  class="name"
+                >
+                  {{musiconhold.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(musiconhold, ev) : vm.createOrEditMusicOnHold($event, musiconhold)"
+                  md-cell
+                  class="mode"
+                >
+                  {{ 'VOICE.' + vm.arraymode[musiconhold.mode].option |
+                  uppercase | translate }}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(musiconhold, ev) : vm.createOrEditMusicOnHold($event, musiconhold)"
+                  md-cell
+                  class="sort"
+                >
+                  {{ 'VOICE.' + vm.arraysort[musiconhold.sort].option |
+                  uppercase | translate }}
+                </td>
+
+                <td
+                  md-cell
+                  class="actions"
+                  ng-if="!vm.crudPermissions.readOnly"
+                >
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="VOICE.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(musiconhold, $event    )"
+                          translate="VOICE.EDIT_MUSICONHOLD"
+                        >
+                          Edit MusicOnHold
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(musiconhold, $event    )"
+                          translate="VOICE.DELETE_MUSICONHOLD"
+                        >
+                          Delete MusicOnHold
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.musiconholds.count}}"
+          md-on-paginate="vm.getMusicOnHolds"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / MUSICONHOLD TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD MUSICONHOLD BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-musiconhold-button"
+    ng-click="vm.createOrEditMusicOnHold($event)"
+    aria-label="add musiconhold"
+    translate
+    translate-attr-aria-label="VOICE.ADD_MUSICONHOLD"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD MUSICONHOLD BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/voice/views/outboundroutes/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/outboundroutes/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 85d3bec..0000000
--- a/public/src/js/modules/main/apps/voice/views/outboundroutes/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,227 +0,0 @@
-<md-dialog class="outboundroute-dialog" aria-label="New OutboundRoute">
-  <form name="outboundrouteForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.PHONENUMBER">PhoneNumber</label>
-        <input
-          type="text"
-          name="exten"
-          ng-model="vm.outboundroute.exten"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="outboundrouteForm['exten'].$error"
-          ng-show="outboundrouteForm['exten'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.PHONENUMBER_REQUIRED"
-              >PhoneNumber field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.CONTEXT">Context</label>
-        <md-select name="context" ng-model="vm.outboundroute.context" required>
-          <md-option
-            ng-value="context.name"
-            ng-repeat="context in vm.contexts"
-            ng-disabled="context.canSelect === false"
-            >{{ context.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="outboundrouteForm['context'].$error"
-          ng-show="outboundrouteForm['context'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.CONTEXT_REQUIRED"
-              >Context field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.RECORDING">Recording</label>
-        <md-select
-          name="recordingFormat"
-          ng-model="vm.outboundroute.recordingFormat"
-          required
-        >
-          <md-option ng-value="'none'">none</md-option>
-          <md-option ng-value="'wav'">wav</md-option>
-          <md-option ng-value="'WAV'">wav49</md-option>
-          <md-option ng-value="'gsm'">gsm</md-option>
-        </md-select>
-        <div class="hint"><span translate="VOICE.HELP.RECORDING"></span></div>
-        <div
-          ng-messages="outboundrouteForm['recordingFormat'].$error"
-          ng-show="outboundrouteForm['recordingFormat'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.RECORDING_REQUIRED"
-              >Recording field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.CUTDIGITS">CutDigits</label>
-        <input
-          type="number"
-          name="cutdigits"
-          ng-model="vm.outboundroute.cutdigits"
-          min="0"
-        />
-
-        <div
-          ng-messages="outboundrouteForm['cutdigits'].$error"
-          ng-show="outboundrouteForm['cutdigits'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.CUTDIGITS_REQUIRED"
-              >CutDigits field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="VOICE.ERRORS.CUTDIGITS_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >CutDigits must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.outboundroute.description"
-        />
-
-        <div
-          ng-messages="outboundrouteForm['description'].$error"
-          ng-show="outboundrouteForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newOutboundRoute"
-          ng-click="vm.saveOutboundRoute()"
-          class="send-button md-accent md-raised"
-          ng-disabled="outboundrouteForm.$invalid || outboundrouteForm.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newOutboundRoute"
-          ng-click="vm.addNewOutboundRoute()"
-          class="send-button md-accent md-raised"
-          ng-disabled="outboundrouteForm.$invalid"
-          aria-label="ADD"
-          translate="VOICE.ADD_OUTBOUNDROUTE"
-          translate-attr-aria-label="VOICE.ADD_OUTBOUNDROUTE"
-        >
-          ADD OUTBOUNDROUTE
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newOutboundRoute"
-          ng-click="vm.deleteOutboundRoute($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="VOICE.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="VOICE.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/outboundroutes/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/outboundroutes/create/dialog.html/dialog.html
new file mode 100644
index 0000000..85d3bec
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/outboundroutes/create/dialog.html/dialog.html
@@ -0,0 +1,227 @@
+<md-dialog class="outboundroute-dialog" aria-label="New OutboundRoute">
+  <form name="outboundrouteForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.PHONENUMBER">PhoneNumber</label>
+        <input
+          type="text"
+          name="exten"
+          ng-model="vm.outboundroute.exten"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="outboundrouteForm['exten'].$error"
+          ng-show="outboundrouteForm['exten'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.PHONENUMBER_REQUIRED"
+              >PhoneNumber field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.CONTEXT">Context</label>
+        <md-select name="context" ng-model="vm.outboundroute.context" required>
+          <md-option
+            ng-value="context.name"
+            ng-repeat="context in vm.contexts"
+            ng-disabled="context.canSelect === false"
+            >{{ context.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="outboundrouteForm['context'].$error"
+          ng-show="outboundrouteForm['context'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.CONTEXT_REQUIRED"
+              >Context field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.RECORDING">Recording</label>
+        <md-select
+          name="recordingFormat"
+          ng-model="vm.outboundroute.recordingFormat"
+          required
+        >
+          <md-option ng-value="'none'">none</md-option>
+          <md-option ng-value="'wav'">wav</md-option>
+          <md-option ng-value="'WAV'">wav49</md-option>
+          <md-option ng-value="'gsm'">gsm</md-option>
+        </md-select>
+        <div class="hint"><span translate="VOICE.HELP.RECORDING"></span></div>
+        <div
+          ng-messages="outboundrouteForm['recordingFormat'].$error"
+          ng-show="outboundrouteForm['recordingFormat'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.RECORDING_REQUIRED"
+              >Recording field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.CUTDIGITS">CutDigits</label>
+        <input
+          type="number"
+          name="cutdigits"
+          ng-model="vm.outboundroute.cutdigits"
+          min="0"
+        />
+
+        <div
+          ng-messages="outboundrouteForm['cutdigits'].$error"
+          ng-show="outboundrouteForm['cutdigits'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.CUTDIGITS_REQUIRED"
+              >CutDigits field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="VOICE.ERRORS.CUTDIGITS_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >CutDigits must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.outboundroute.description"
+        />
+
+        <div
+          ng-messages="outboundrouteForm['description'].$error"
+          ng-show="outboundrouteForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newOutboundRoute"
+          ng-click="vm.saveOutboundRoute()"
+          class="send-button md-accent md-raised"
+          ng-disabled="outboundrouteForm.$invalid || outboundrouteForm.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newOutboundRoute"
+          ng-click="vm.addNewOutboundRoute()"
+          class="send-button md-accent md-raised"
+          ng-disabled="outboundrouteForm.$invalid"
+          aria-label="ADD"
+          translate="VOICE.ADD_OUTBOUNDROUTE"
+          translate-attr-aria-label="VOICE.ADD_OUTBOUNDROUTE"
+        >
+          ADD OUTBOUNDROUTE
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newOutboundRoute"
+          ng-click="vm.deleteOutboundRoute($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="VOICE.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="VOICE.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/outboundroutes/edit/apps/custom/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/outboundroutes/edit/apps/custom/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 9e2277b..0000000
--- a/public/src/js/modules/main/apps/voice/views/outboundroutes/edit/apps/custom/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,127 +0,0 @@
-<md-dialog class="outboundroute-dialog" aria-label="New OutboundRoute">
-  <form name="outboundrouteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.APPLICATION_NAME">Application_Name</label>
-        <input
-          type="text"
-          name="app"
-          ng-model="vm.custom.app"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="outboundrouteFormApp['app'].$error"
-          ng-show="outboundrouteFormApp['app'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.APPLICATION_NAME_REQUIRED"
-              >Application_Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.ARGUMENTS">Arguments</label>
-        <input
-          type="text"
-          name="appdata"
-          ng-model="vm.custom.appdata"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="outboundrouteFormApp['appdata'].$error"
-          ng-show="outboundrouteFormApp['appdata'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.ARGUMENTS_REQUIRED"
-              >Arguments field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveOutboundRouteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="outboundrouteFormApp.$invalid || outboundrouteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/outboundroutes/edit/apps/custom/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/outboundroutes/edit/apps/custom/dialog.html/dialog.html
new file mode 100644
index 0000000..9e2277b
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/outboundroutes/edit/apps/custom/dialog.html/dialog.html
@@ -0,0 +1,127 @@
+<md-dialog class="outboundroute-dialog" aria-label="New OutboundRoute">
+  <form name="outboundrouteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.APPLICATION_NAME">Application_Name</label>
+        <input
+          type="text"
+          name="app"
+          ng-model="vm.custom.app"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="outboundrouteFormApp['app'].$error"
+          ng-show="outboundrouteFormApp['app'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.APPLICATION_NAME_REQUIRED"
+              >Application_Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.ARGUMENTS">Arguments</label>
+        <input
+          type="text"
+          name="appdata"
+          ng-model="vm.custom.appdata"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="outboundrouteFormApp['appdata'].$error"
+          ng-show="outboundrouteFormApp['appdata'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.ARGUMENTS_REQUIRED"
+              >Arguments field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveOutboundRouteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="outboundrouteFormApp.$invalid || outboundrouteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/outboundroutes/edit/apps/interval/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/outboundroutes/edit/apps/interval/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index ca0ed91..0000000
--- a/public/src/js/modules/main/apps/voice/views/outboundroutes/edit/apps/interval/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,313 +0,0 @@
-<md-dialog class="inboundroute-dialog" aria-label="New Interval">
-  <form name="intervalForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <md-input-container class="md-block">
-        <label translate="TOOLS.TYPE">Type</label>
-        <md-select
-          ng-model="vm.type"
-          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="type" ng-repeat="type in vm.types"
-            >{{ type | ucfirst }}</md-option
-          >
-        </md-select>
-      </md-input-container>
-
-      <md-input-container class="md-block" ng-if="vm.type === 'list'">
-        <label translate="TOOLS.INTERVALS">Intervals</label>
-        <md-select
-          ng-model="vm.interval.IntervalId"
-          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="interval.id" ng-repeat="interval in vm.intervals"
-            >{{ interval.name }}</md-option
-          >
-        </md-select>
-      </md-input-container>
-
-      <!-- TIMERANGE START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.TIME_RANGE"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <div class="md-block" flex>
-          <mdp-time-picker
-            name="timeRangeFrom"
-            mdp-placeholder="FROM"
-            ng-model="vm.timeRangeFrom"
-            mdp-format="HH:mm"
-            mdp-auto-switch="true"
-            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <div
-              ng-messages="intervalForm.timeRangeFrom.$error"
-              ng-show="intervalForm.timeRangeFrom.$touched"
-              role="alert"
-            >
-              <div ng-message="format">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_FROM_INVALID"
-                  >Time Range From field is invalid</span
-                >
-              </div>
-            </div>
-          </mdp-time-picker>
-        </div>
-        <div class="md-block" flex ng-if="vm.timeRangeFrom">
-          <mdp-time-picker
-            name="timeRangeTo"
-            mdp-placeholder="TO*"
-            ng-model="vm.timeRangeTo"
-            mdp-format="HH:mm"
-            mdp-auto-switch="true"
-            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-            required
-          >
-            <div
-              ng-messages="intervalForm.timeRangeTo.$error"
-              ng-show="intervalForm.timeRangeTo.$invalid"
-              role="alert"
-            >
-              <div ng-message="format">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_INVALID"
-                  >Time Range To field is invalid</span
-                >
-              </div>
-              <div ng-message="required">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_REQUIRED"
-                  >Time Range To field is required</span
-                >
-              </div>
-            </div>
-          </mdp-time-picker>
-        </div>
-      </div>
-      <!-- TIMERANGE END -->
-
-      <!-- DAYSOFWEEK START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.WEEK_DAYS"
-        >Week Days</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.dayOfWeekFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
-              ><span translate="TOOLS.{{day.value | uppercase}}"
-                >{{ day.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container flex class="md-block" ng-if="vm.dayOfWeekFrom">
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="dayOfWeekTo"
-            ng-model="vm.dayOfWeekTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
-              ><span translate="TOOLS.{{day.value | uppercase}}"
-                >{{ day.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.dayOfWeekTo.$error"
-            ng-show="intervalForm.dayOfWeekTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- DAYSOFWEEK END -->
-
-      <!-- MONTHDAY START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTH_DAYS"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex layout="column" class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.monthDayFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
-              >{{ month }}</md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container
-          flex
-          layout="column"
-          class="md-block"
-          ng-if="vm.monthDayFrom"
-        >
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="monthDayTo"
-            ng-model="vm.monthDayTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
-              >{{ month }}</md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.monthDayTo.$error"
-            ng-show="intervalForm.monthDayTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- MONTHDAY END -->
-
-      <!-- MONTH START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTHS"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex layout="column" class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.monthFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
-              ><span translate="TOOLS.{{month.value | uppercase}}"
-                >{{ month.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container
-          flex
-          layout="column"
-          class="md-block"
-          ng-if="vm.monthFrom"
-        >
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="monthTo"
-            ng-model="vm.monthTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
-              ><span translate="TOOLS.{{month.value | uppercase}}"
-                >{{ month.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.monthTo.$error"
-            ng-show="intervalForm.monthTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- MONTH END -->
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="!vm.newInterval && vm.crudPermissions.canEdit"
-          ng-click="vm.saveInterval()"
-          class="send-button md-accent md-raised"
-          ng-disabled="intervalForm.$invalid || intervalForm.$pristine"
-          aria-label="SAVE"
-          translate="TOOLS.SAVE"
-          translate-attr-aria-label="TOOLS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.newInterval && vm.crudPermissions.canEdit"
-          ng-click="vm.addNewInterval()"
-          class="send-button md-accent md-raised"
-          ng-disabled="intervalForm.$invalid"
-          aria-label="ADD"
-          translate="TOOLS.ADD_INTERVAL"
-          translate-attr-aria-label="TOOLS.ADD_INTERVAL"
-        >
-          ADD INTERVAL
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/outboundroutes/edit/apps/interval/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/outboundroutes/edit/apps/interval/dialog.html/dialog.html
new file mode 100644
index 0000000..ca0ed91
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/outboundroutes/edit/apps/interval/dialog.html/dialog.html
@@ -0,0 +1,313 @@
+<md-dialog class="inboundroute-dialog" aria-label="New Interval">
+  <form name="intervalForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <md-input-container class="md-block">
+        <label translate="TOOLS.TYPE">Type</label>
+        <md-select
+          ng-model="vm.type"
+          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="type" ng-repeat="type in vm.types"
+            >{{ type | ucfirst }}</md-option
+          >
+        </md-select>
+      </md-input-container>
+
+      <md-input-container class="md-block" ng-if="vm.type === 'list'">
+        <label translate="TOOLS.INTERVALS">Intervals</label>
+        <md-select
+          ng-model="vm.interval.IntervalId"
+          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="interval.id" ng-repeat="interval in vm.intervals"
+            >{{ interval.name }}</md-option
+          >
+        </md-select>
+      </md-input-container>
+
+      <!-- TIMERANGE START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.TIME_RANGE"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <div class="md-block" flex>
+          <mdp-time-picker
+            name="timeRangeFrom"
+            mdp-placeholder="FROM"
+            ng-model="vm.timeRangeFrom"
+            mdp-format="HH:mm"
+            mdp-auto-switch="true"
+            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <div
+              ng-messages="intervalForm.timeRangeFrom.$error"
+              ng-show="intervalForm.timeRangeFrom.$touched"
+              role="alert"
+            >
+              <div ng-message="format">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_FROM_INVALID"
+                  >Time Range From field is invalid</span
+                >
+              </div>
+            </div>
+          </mdp-time-picker>
+        </div>
+        <div class="md-block" flex ng-if="vm.timeRangeFrom">
+          <mdp-time-picker
+            name="timeRangeTo"
+            mdp-placeholder="TO*"
+            ng-model="vm.timeRangeTo"
+            mdp-format="HH:mm"
+            mdp-auto-switch="true"
+            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+            required
+          >
+            <div
+              ng-messages="intervalForm.timeRangeTo.$error"
+              ng-show="intervalForm.timeRangeTo.$invalid"
+              role="alert"
+            >
+              <div ng-message="format">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_INVALID"
+                  >Time Range To field is invalid</span
+                >
+              </div>
+              <div ng-message="required">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_REQUIRED"
+                  >Time Range To field is required</span
+                >
+              </div>
+            </div>
+          </mdp-time-picker>
+        </div>
+      </div>
+      <!-- TIMERANGE END -->
+
+      <!-- DAYSOFWEEK START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.WEEK_DAYS"
+        >Week Days</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.dayOfWeekFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
+              ><span translate="TOOLS.{{day.value | uppercase}}"
+                >{{ day.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container flex class="md-block" ng-if="vm.dayOfWeekFrom">
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="dayOfWeekTo"
+            ng-model="vm.dayOfWeekTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
+              ><span translate="TOOLS.{{day.value | uppercase}}"
+                >{{ day.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.dayOfWeekTo.$error"
+            ng-show="intervalForm.dayOfWeekTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- DAYSOFWEEK END -->
+
+      <!-- MONTHDAY START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTH_DAYS"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex layout="column" class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.monthDayFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
+              >{{ month }}</md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container
+          flex
+          layout="column"
+          class="md-block"
+          ng-if="vm.monthDayFrom"
+        >
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="monthDayTo"
+            ng-model="vm.monthDayTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
+              >{{ month }}</md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.monthDayTo.$error"
+            ng-show="intervalForm.monthDayTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- MONTHDAY END -->
+
+      <!-- MONTH START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTHS"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex layout="column" class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.monthFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
+              ><span translate="TOOLS.{{month.value | uppercase}}"
+                >{{ month.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container
+          flex
+          layout="column"
+          class="md-block"
+          ng-if="vm.monthFrom"
+        >
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="monthTo"
+            ng-model="vm.monthTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
+              ><span translate="TOOLS.{{month.value | uppercase}}"
+                >{{ month.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.monthTo.$error"
+            ng-show="intervalForm.monthTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- MONTH END -->
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="!vm.newInterval && vm.crudPermissions.canEdit"
+          ng-click="vm.saveInterval()"
+          class="send-button md-accent md-raised"
+          ng-disabled="intervalForm.$invalid || intervalForm.$pristine"
+          aria-label="SAVE"
+          translate="TOOLS.SAVE"
+          translate-attr-aria-label="TOOLS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.newInterval && vm.crudPermissions.canEdit"
+          ng-click="vm.addNewInterval()"
+          class="send-button md-accent md-raised"
+          ng-disabled="intervalForm.$invalid"
+          aria-label="ADD"
+          translate="TOOLS.ADD_INTERVAL"
+          translate-attr-aria-label="TOOLS.ADD_INTERVAL"
+        >
+          ADD INTERVAL
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/outboundroutes/edit/apps/outbounddial/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/outboundroutes/edit/apps/outbounddial/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index a07bc22..0000000
--- a/public/src/js/modules/main/apps/voice/views/outboundroutes/edit/apps/outbounddial/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,252 +0,0 @@
-<md-dialog class="outboundroute-dialog" aria-label="New OutboundRoute">
-  <form name="outboundrouteFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.TRUNK">Trunk</label>
-        <md-select
-          name="trunk"
-          ng-model="vm.outbounddial.trunk"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="trunk.name"
-            ng-repeat="trunk in vm.trunks"
-            ng-disabled="trunk.canSelect === false"
-            >{{ trunk.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="outboundrouteFormApp['trunk'].$error"
-          ng-show="outboundrouteFormApp['trunk'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.TRUNK_REQUIRED"
-              >Trunk field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.CALLER_ID">Caller_ID</label>
-        <input
-          type="text"
-          name="callerID"
-          ng-model="vm.outbounddial.callerID"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div class="hint"><span translate="VOICE.HELP.CALLER_ID"></span></div>
-        <div
-          ng-messages="outboundrouteFormApp['callerID'].$error"
-          ng-show="outboundrouteFormApp['callerID'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.CALLER_ID_REQUIRED"
-              >Caller_ID field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.PREFIX">Prefix</label>
-        <input
-          type="text"
-          name="prefix"
-          ng-model="vm.outbounddial.prefix"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="outboundrouteFormApp['prefix'].$error"
-          ng-show="outboundrouteFormApp['prefix'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.PREFIX_REQUIRED"
-              >Prefix field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.TAGS">Tags</label>
-        <md-select
-          name="tag"
-          ng-model="vm.outbounddial.tag"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="'--'">None</md-option>
-          <md-option
-            ng-value="tag.name"
-            ng-repeat="tag in vm.tags"
-            ng-disabled="tag.canSelect === false"
-            >{{ tag.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="outboundrouteFormApp['tag'].$error"
-          ng-show="outboundrouteFormApp['tag'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.TAGS_REQUIRED"
-              >Tags field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.TIMEOUT">Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.outbounddial.timeout"
-          min="0"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="outboundrouteFormApp['timeout'].$error"
-          ng-show="outboundrouteFormApp['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.TIMEOUT_REQUIRED"
-              >Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="VOICE.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.OPTIONS">Options</label>
-        <input
-          type="text"
-          name="options"
-          ng-model="vm.outbounddial.options"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="outboundrouteFormApp['options'].$error"
-          ng-show="outboundrouteFormApp['options'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
-              >Options field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.URL">Url</label>
-        <input
-          type="text"
-          name="url"
-          ng-model="vm.outbounddial.url"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="outboundrouteFormApp['url'].$error"
-          ng-show="outboundrouteFormApp['url'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.URL_REQUIRED"
-              >Url field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveOutboundRouteApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="outboundrouteFormApp.$invalid || outboundrouteFormApp.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/outboundroutes/edit/apps/outbounddial/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/outboundroutes/edit/apps/outbounddial/dialog.html/dialog.html
new file mode 100644
index 0000000..a07bc22
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/outboundroutes/edit/apps/outbounddial/dialog.html/dialog.html
@@ -0,0 +1,252 @@
+<md-dialog class="outboundroute-dialog" aria-label="New OutboundRoute">
+  <form name="outboundrouteFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.TRUNK">Trunk</label>
+        <md-select
+          name="trunk"
+          ng-model="vm.outbounddial.trunk"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="trunk.name"
+            ng-repeat="trunk in vm.trunks"
+            ng-disabled="trunk.canSelect === false"
+            >{{ trunk.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="outboundrouteFormApp['trunk'].$error"
+          ng-show="outboundrouteFormApp['trunk'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.TRUNK_REQUIRED"
+              >Trunk field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.CALLER_ID">Caller_ID</label>
+        <input
+          type="text"
+          name="callerID"
+          ng-model="vm.outbounddial.callerID"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div class="hint"><span translate="VOICE.HELP.CALLER_ID"></span></div>
+        <div
+          ng-messages="outboundrouteFormApp['callerID'].$error"
+          ng-show="outboundrouteFormApp['callerID'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.CALLER_ID_REQUIRED"
+              >Caller_ID field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.PREFIX">Prefix</label>
+        <input
+          type="text"
+          name="prefix"
+          ng-model="vm.outbounddial.prefix"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="outboundrouteFormApp['prefix'].$error"
+          ng-show="outboundrouteFormApp['prefix'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.PREFIX_REQUIRED"
+              >Prefix field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.TAGS">Tags</label>
+        <md-select
+          name="tag"
+          ng-model="vm.outbounddial.tag"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="'--'">None</md-option>
+          <md-option
+            ng-value="tag.name"
+            ng-repeat="tag in vm.tags"
+            ng-disabled="tag.canSelect === false"
+            >{{ tag.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="outboundrouteFormApp['tag'].$error"
+          ng-show="outboundrouteFormApp['tag'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.TAGS_REQUIRED"
+              >Tags field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.TIMEOUT">Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.outbounddial.timeout"
+          min="0"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="outboundrouteFormApp['timeout'].$error"
+          ng-show="outboundrouteFormApp['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.TIMEOUT_REQUIRED"
+              >Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="VOICE.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.OPTIONS">Options</label>
+        <input
+          type="text"
+          name="options"
+          ng-model="vm.outbounddial.options"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="outboundrouteFormApp['options'].$error"
+          ng-show="outboundrouteFormApp['options'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.OPTIONS_REQUIRED"
+              >Options field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.URL">Url</label>
+        <input
+          type="text"
+          name="url"
+          ng-model="vm.outbounddial.url"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="outboundrouteFormApp['url'].$error"
+          ng-show="outboundrouteFormApp['url'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.URL_REQUIRED"
+              >Url field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveOutboundRouteApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="outboundrouteFormApp.$invalid || outboundrouteFormApp.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/outboundroutes/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/outboundroutes/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index 97c211e..0000000
--- a/public/src/js/modules/main/apps/voice/views/outboundroutes/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,460 +0,0 @@
-<div id="voice-outboundroute" class="page-layout simple tabbed" layout="column">
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-outboundroutes-button md-icon-button"
-        aria-label="Go to outboundroutes"
-        ng-click="vm.gotoOutboundRoutes()"
-        translate
-        translate-attr-aria-label="VOICE.GO_TO_OUTBOUNDROUTES"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="outboundroute-image" hide-xs>
-          <img ng-src="assets/images/business/outboundroutes.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.outboundroute.id}}
-            <span ng-if="vm.outboundroute.name">{{vm.outboundroute.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="VOICE.CREATED_AT"></span>
-            <span>{{vm.outboundroute.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveOutboundRoute()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (actionsForm.$invalid)"
-        translate="VOICE.SAVE"
-        translate-attr-aria-label="VOICE.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="VOICE.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="outboundroute-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="VOICE.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="VOICE.PHONENUMBER">PhoneNumber</label>
-                <input
-                  type="text"
-                  name="exten"
-                  ng-model="vm.outboundroute.exten"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['exten'].$error"
-                  ng-show="generalForm['exten'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.PHONENUMBER_REQUIRED"
-                      >PhoneNumber field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.CONTEXT">Context</label>
-                <md-select
-                  name="context"
-                  ng-model="vm.outboundroute.context"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="context.name"
-                    ng-repeat="context in vm.contexts"
-                    ng-disabled="context.canSelect === false"
-                    >{{ context.name }}</md-option
-                  >
-                </md-select>
-                <div
-                  ng-messages="generalForm['context'].$error"
-                  ng-show="generalForm['context'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.CONTEXT_REQUIRED"
-                      >Context field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.RECORDING">Recording</label>
-                <md-select
-                  name="recordingFormat"
-                  ng-model="vm.outboundroute.recordingFormat"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'none'">none</md-option>
-                  <md-option ng-value="'wav'">wav</md-option>
-                  <md-option ng-value="'WAV'">wav49</md-option>
-                  <md-option ng-value="'gsm'">gsm</md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="VOICE.HELP.RECORDING"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['recordingFormat'].$error"
-                  ng-show="generalForm['recordingFormat'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.RECORDING_REQUIRED"
-                      >Recording field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.CUTDIGITS">CutDigits</label>
-                <input
-                  type="number"
-                  name="cutdigits"
-                  ng-model="vm.outboundroute.cutdigits"
-                  min="0"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['cutdigits'].$error"
-                  ng-show="generalForm['cutdigits'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.CUTDIGITS_REQUIRED"
-                      >CutDigits field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="VOICE.ERRORS.CUTDIGITS_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >CutDigits must be a valid greater or equal than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.outboundroute.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="VOICE.ACTIONS">ACTIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="outboundroute-detail-form-container actions md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="OutboundRouteActionsController as vm_ac"
-              ng-init="vm_ac.init(vm.outboundroute, vm.crudPermissions)"
-              class="content"
-              md-background-bg
-              layout="row"
-              layout-align="start start"
-            >
-              <!-- SIDENAV -->
-              <div
-                class="navigation-simple sidenav main-sidenav md-background-bg md-whiteframe-1dp"
-                ms-scroll
-                layout="column"
-                flex="20"
-                ng-if="vm_ac.crudPermissions.canEdit"
-              >
-                <!-- SIDENAV CONTENT -->
-                <md-list class="no-padding">
-                  <md-subheader class="md-no-sticky">
-                    <span translate="VOICE.APPLICATIONS_LIST">
-                      Applications List
-                    </span>
-                  </md-subheader>
-                </md-list>
-                <md-divider></md-divider>
-                <md-list ng-sortable="vm_ac.list">
-                  <md-list-item class="handle" ng-repeat="a in vm_ac.apps">
-                    <md-icon md-font-icon="{{a.icon}}" class="s16"></md-icon>
-                    <p
-                      class="text-truncate"
-                      translate="VOICE.{{(a.alias || a.appType) | uppercase}}"
-                    >
-                      {{a.alias || a.appType}}
-                    </p>
-                  </md-list-item>
-                </md-list>
-                <!-- / SIDENAV CONTENT -->
-              </div>
-              <!-- / SIDENAV -->
-              <div flex></div>
-              <!-- MAIN -->
-              <div
-                class="main scrollable md-background-bg md-whiteframe-1dp"
-                ms-scroll
-                layout="column"
-                flex="{{vm_ac.crudPermissions.canEdit ? 75 : 100}}"
-              >
-                <md-toolbar
-                  class="md-table-toolbar md-default"
-                  ng-hide="vm_ac.selectedOutboundRouteApps.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead">Drag & Drop Routing</span>
-                    <div flex></div>
-                    <ms-search-bar
-                      on-search="vm_ac.query.filter = query"
-                      on-collapse="vm_ac.query.filter = undefined"
-                      debounce="300"
-                    ></ms-search-bar>
-                  </div>
-                </md-toolbar>
-                <md-toolbar
-                  class="md-table-toolbar md-accent"
-                  ng-show="vm_ac.selectedOutboundRouteApps.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead"
-                      >{{vm_ac.selectedOutboundRouteApps.length}}
-                      {{vm_ac.selectedOutboundRouteApps.length > 1 ? 'items' :
-                      'item'}} selected</span
-                    >
-                    <div flex></div>
-                    <md-button
-                      ng-if="vm_ac.crudPermissions.canDelete"
-                      class="md-icon-button"
-                      ng-click="vm_ac.deleteSelectedOutboundRouteApps($event)"
-                      aria-label="delete selected"
-                      translate
-                      translate-attr-label="VOICE.DELETE_SELECTED"
-                    >
-                      <md-icon md-font-icon="icon-delete"></md-icon>
-                    </md-button>
-                  </div>
-                </md-toolbar>
-
-                <!-- QUEUES TABLE -->
-                <md-table-container>
-                  <table
-                    md-table
-                    md-row-select
-                    multiple
-                    ng-model="vm_ac.selectedOutboundRouteApps"
-                  >
-                    <thead md-head>
-                      <tr md-row>
-                        <th md-column width="10px"></th>
-                        <th md-column>
-                          <span>Type</span>
-                        </th>
-                        <th md-column>
-                          <span>Appdata</span>
-                        </th>
-                        <th md-column>
-                          <span>Interval</span>
-                        </th>
-                        <th md-column width="10px"></th>
-                        <th md-column width="10px"></th>
-                      </tr>
-                    </thead>
-                    <tbody md-body ng-sortable="vm_ac.applications">
-                      <tr
-                        md-row
-                        md-select="app"
-                        md-select-id="id"
-                        ng-repeat="app in vm_ac.outboundrouteApps.rows | filter: vm_ac.query.filter"
-                      >
-                        <td md-cell>
-                          <md-icon
-                            md-font-icon="icon-drag-vertical"
-                            class="s16 handle"
-                          ></md-icon>
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editOutboundRouteApp($event, $index)"
-                        >
-                          {{app.app.toLowerCase() === 'agi' ? 'Cally-Square' :
-                          app.app | ucfirst}}<span
-                            ng-if="app.appType.toLowerCase() === 'custom'"
-                            >*</span
-                          >
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editOutboundRouteApp($event, $index)"
-                        >
-                          <span class="text-truncate" style="width: 200px"
-                            >{{app.appdata}}</span
-                          >
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editInterval($event, $index)"
-                        >
-                          {{app.IntervalId ? 'From List' : app.interval}}
-                        </td>
-                        <td md-cell>
-                          <md-button
-                            ng-click="vm_ac.editInterval($event, $index)"
-                            class="md-icon-button"
-                            aria-label="Interval"
-                          >
-                            <md-icon md-font-icon="icon-timer"></md-icon>
-                            <md-tooltip>
-                              {{app.IntervalId ? 'From List' : (app.interval ===
-                              '*,*,*,*' ? 'Always' : 'Custom')}}
-                            </md-tooltip>
-                          </md-button>
-                        </td>
-                        <td
-                          md-cell
-                          class="actions"
-                          ng-if="!vm_ac.crudPermissions.readOnly"
-                        >
-                          <md-menu>
-                            <md-button
-                              class="md-icon-button"
-                              aria-label="More"
-                              translate
-                              translate-attr-aria-label="VOICE.MORE"
-                              ng-click="$mdOpenMenu($event)"
-                            >
-                              <md-icon
-                                md-font-icon="icon-dots-vertical"
-                              ></md-icon>
-                            </md-button>
-
-                            <md-menu-content width="3">
-                              <md-menu-item
-                                ng-if="vm_ac.crudPermissions.canEdit"
-                              >
-                                <md-button
-                                  ng-click="vm_ac.editOutboundRouteApp($event, $index)"
-                                  translate="VOICE.EDIT_APP"
-                                >
-                                  Edit App
-                                </md-button>
-                              </md-menu-item>
-                              <md-menu-item
-                                ng-if="vm_ac.crudPermissions.canEdit"
-                              >
-                                <md-button
-                                  ng-click="vm_ac.editInterval($event, $index)"
-                                  translate="VOICE.EDIT_INTERVAL"
-                                >
-                                  Edit Interval
-                                </md-button>
-                              </md-menu-item>
-                              <md-menu-item
-                                ng-if="vm_ac.crudPermissions.canDelete"
-                              >
-                                <md-button
-                                  ng-click="vm_ac.deleteConfirm(app, $index, $event)"
-                                  translate="VOICE.DELETE_APP"
-                                >
-                                  Delete App
-                                </md-button>
-                              </md-menu-item>
-                            </md-menu-content>
-                          </md-menu>
-                        </td>
-                      </tr>
-                      <tr md-row ng-hide="vm_ac.outboundrouteApps.rows.length">
-                        <td md-cell colspan="6">
-                          <span
-                            class="text-boxed-light"
-                            translate="VOICE.NO_APPS_AVAILABLE"
-                            >No apps available</span
-                          >
-                        </td>
-                      </tr>
-                    </tbody>
-                    <tfoot md-foot>
-                      <tr md-row>
-                        <td md-cell colspan="7">
-                          <span
-                            ><em translate="VOICE.LEGEND.CUSTOM_APPLICATION"
-                              >(*) - Custom application.</em
-                            ></span
-                          >
-                        </td>
-                      </tr>
-                    </tfoot>
-                  </table>
-                </md-table-container>
-                <!-- / QUEUES TABLE -->
-
-                <!-- NO RESULTS -->
-
-                <!-- / NO RESULTS -->
-              </div>
-              <!-- / MAIN -->
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/voice/views/outboundroutes/edit/view.html/view.html b/public/src/js/modules/main/apps/voice/views/outboundroutes/edit/view.html/view.html
new file mode 100644
index 0000000..97c211e
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/outboundroutes/edit/view.html/view.html
@@ -0,0 +1,460 @@
+<div id="voice-outboundroute" class="page-layout simple tabbed" layout="column">
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-outboundroutes-button md-icon-button"
+        aria-label="Go to outboundroutes"
+        ng-click="vm.gotoOutboundRoutes()"
+        translate
+        translate-attr-aria-label="VOICE.GO_TO_OUTBOUNDROUTES"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="outboundroute-image" hide-xs>
+          <img ng-src="assets/images/business/outboundroutes.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.outboundroute.id}}
+            <span ng-if="vm.outboundroute.name">{{vm.outboundroute.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="VOICE.CREATED_AT"></span>
+            <span>{{vm.outboundroute.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveOutboundRoute()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (actionsForm.$invalid)"
+        translate="VOICE.SAVE"
+        translate-attr-aria-label="VOICE.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="VOICE.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="outboundroute-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="VOICE.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="VOICE.PHONENUMBER">PhoneNumber</label>
+                <input
+                  type="text"
+                  name="exten"
+                  ng-model="vm.outboundroute.exten"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['exten'].$error"
+                  ng-show="generalForm['exten'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.PHONENUMBER_REQUIRED"
+                      >PhoneNumber field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.CONTEXT">Context</label>
+                <md-select
+                  name="context"
+                  ng-model="vm.outboundroute.context"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="context.name"
+                    ng-repeat="context in vm.contexts"
+                    ng-disabled="context.canSelect === false"
+                    >{{ context.name }}</md-option
+                  >
+                </md-select>
+                <div
+                  ng-messages="generalForm['context'].$error"
+                  ng-show="generalForm['context'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.CONTEXT_REQUIRED"
+                      >Context field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.RECORDING">Recording</label>
+                <md-select
+                  name="recordingFormat"
+                  ng-model="vm.outboundroute.recordingFormat"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'none'">none</md-option>
+                  <md-option ng-value="'wav'">wav</md-option>
+                  <md-option ng-value="'WAV'">wav49</md-option>
+                  <md-option ng-value="'gsm'">gsm</md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="VOICE.HELP.RECORDING"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['recordingFormat'].$error"
+                  ng-show="generalForm['recordingFormat'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.RECORDING_REQUIRED"
+                      >Recording field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.CUTDIGITS">CutDigits</label>
+                <input
+                  type="number"
+                  name="cutdigits"
+                  ng-model="vm.outboundroute.cutdigits"
+                  min="0"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['cutdigits'].$error"
+                  ng-show="generalForm['cutdigits'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.CUTDIGITS_REQUIRED"
+                      >CutDigits field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="VOICE.ERRORS.CUTDIGITS_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >CutDigits must be a valid greater or equal than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.outboundroute.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="VOICE.ACTIONS">ACTIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="outboundroute-detail-form-container actions md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="OutboundRouteActionsController as vm_ac"
+              ng-init="vm_ac.init(vm.outboundroute, vm.crudPermissions)"
+              class="content"
+              md-background-bg
+              layout="row"
+              layout-align="start start"
+            >
+              <!-- SIDENAV -->
+              <div
+                class="navigation-simple sidenav main-sidenav md-background-bg md-whiteframe-1dp"
+                ms-scroll
+                layout="column"
+                flex="20"
+                ng-if="vm_ac.crudPermissions.canEdit"
+              >
+                <!-- SIDENAV CONTENT -->
+                <md-list class="no-padding">
+                  <md-subheader class="md-no-sticky">
+                    <span translate="VOICE.APPLICATIONS_LIST">
+                      Applications List
+                    </span>
+                  </md-subheader>
+                </md-list>
+                <md-divider></md-divider>
+                <md-list ng-sortable="vm_ac.list">
+                  <md-list-item class="handle" ng-repeat="a in vm_ac.apps">
+                    <md-icon md-font-icon="{{a.icon}}" class="s16"></md-icon>
+                    <p
+                      class="text-truncate"
+                      translate="VOICE.{{(a.alias || a.appType) | uppercase}}"
+                    >
+                      {{a.alias || a.appType}}
+                    </p>
+                  </md-list-item>
+                </md-list>
+                <!-- / SIDENAV CONTENT -->
+              </div>
+              <!-- / SIDENAV -->
+              <div flex></div>
+              <!-- MAIN -->
+              <div
+                class="main scrollable md-background-bg md-whiteframe-1dp"
+                ms-scroll
+                layout="column"
+                flex="{{vm_ac.crudPermissions.canEdit ? 75 : 100}}"
+              >
+                <md-toolbar
+                  class="md-table-toolbar md-default"
+                  ng-hide="vm_ac.selectedOutboundRouteApps.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead">Drag & Drop Routing</span>
+                    <div flex></div>
+                    <ms-search-bar
+                      on-search="vm_ac.query.filter = query"
+                      on-collapse="vm_ac.query.filter = undefined"
+                      debounce="300"
+                    ></ms-search-bar>
+                  </div>
+                </md-toolbar>
+                <md-toolbar
+                  class="md-table-toolbar md-accent"
+                  ng-show="vm_ac.selectedOutboundRouteApps.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead"
+                      >{{vm_ac.selectedOutboundRouteApps.length}}
+                      {{vm_ac.selectedOutboundRouteApps.length > 1 ? 'items' :
+                      'item'}} selected</span
+                    >
+                    <div flex></div>
+                    <md-button
+                      ng-if="vm_ac.crudPermissions.canDelete"
+                      class="md-icon-button"
+                      ng-click="vm_ac.deleteSelectedOutboundRouteApps($event)"
+                      aria-label="delete selected"
+                      translate
+                      translate-attr-label="VOICE.DELETE_SELECTED"
+                    >
+                      <md-icon md-font-icon="icon-delete"></md-icon>
+                    </md-button>
+                  </div>
+                </md-toolbar>
+
+                <!-- QUEUES TABLE -->
+                <md-table-container>
+                  <table
+                    md-table
+                    md-row-select
+                    multiple
+                    ng-model="vm_ac.selectedOutboundRouteApps"
+                  >
+                    <thead md-head>
+                      <tr md-row>
+                        <th md-column width="10px"></th>
+                        <th md-column>
+                          <span>Type</span>
+                        </th>
+                        <th md-column>
+                          <span>Appdata</span>
+                        </th>
+                        <th md-column>
+                          <span>Interval</span>
+                        </th>
+                        <th md-column width="10px"></th>
+                        <th md-column width="10px"></th>
+                      </tr>
+                    </thead>
+                    <tbody md-body ng-sortable="vm_ac.applications">
+                      <tr
+                        md-row
+                        md-select="app"
+                        md-select-id="id"
+                        ng-repeat="app in vm_ac.outboundrouteApps.rows | filter: vm_ac.query.filter"
+                      >
+                        <td md-cell>
+                          <md-icon
+                            md-font-icon="icon-drag-vertical"
+                            class="s16 handle"
+                          ></md-icon>
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editOutboundRouteApp($event, $index)"
+                        >
+                          {{app.app.toLowerCase() === 'agi' ? 'Cally-Square' :
+                          app.app | ucfirst}}<span
+                            ng-if="app.appType.toLowerCase() === 'custom'"
+                            >*</span
+                          >
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editOutboundRouteApp($event, $index)"
+                        >
+                          <span class="text-truncate" style="width: 200px"
+                            >{{app.appdata}}</span
+                          >
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editInterval($event, $index)"
+                        >
+                          {{app.IntervalId ? 'From List' : app.interval}}
+                        </td>
+                        <td md-cell>
+                          <md-button
+                            ng-click="vm_ac.editInterval($event, $index)"
+                            class="md-icon-button"
+                            aria-label="Interval"
+                          >
+                            <md-icon md-font-icon="icon-timer"></md-icon>
+                            <md-tooltip>
+                              {{app.IntervalId ? 'From List' : (app.interval ===
+                              '*,*,*,*' ? 'Always' : 'Custom')}}
+                            </md-tooltip>
+                          </md-button>
+                        </td>
+                        <td
+                          md-cell
+                          class="actions"
+                          ng-if="!vm_ac.crudPermissions.readOnly"
+                        >
+                          <md-menu>
+                            <md-button
+                              class="md-icon-button"
+                              aria-label="More"
+                              translate
+                              translate-attr-aria-label="VOICE.MORE"
+                              ng-click="$mdOpenMenu($event)"
+                            >
+                              <md-icon
+                                md-font-icon="icon-dots-vertical"
+                              ></md-icon>
+                            </md-button>
+
+                            <md-menu-content width="3">
+                              <md-menu-item
+                                ng-if="vm_ac.crudPermissions.canEdit"
+                              >
+                                <md-button
+                                  ng-click="vm_ac.editOutboundRouteApp($event, $index)"
+                                  translate="VOICE.EDIT_APP"
+                                >
+                                  Edit App
+                                </md-button>
+                              </md-menu-item>
+                              <md-menu-item
+                                ng-if="vm_ac.crudPermissions.canEdit"
+                              >
+                                <md-button
+                                  ng-click="vm_ac.editInterval($event, $index)"
+                                  translate="VOICE.EDIT_INTERVAL"
+                                >
+                                  Edit Interval
+                                </md-button>
+                              </md-menu-item>
+                              <md-menu-item
+                                ng-if="vm_ac.crudPermissions.canDelete"
+                              >
+                                <md-button
+                                  ng-click="vm_ac.deleteConfirm(app, $index, $event)"
+                                  translate="VOICE.DELETE_APP"
+                                >
+                                  Delete App
+                                </md-button>
+                              </md-menu-item>
+                            </md-menu-content>
+                          </md-menu>
+                        </td>
+                      </tr>
+                      <tr md-row ng-hide="vm_ac.outboundrouteApps.rows.length">
+                        <td md-cell colspan="6">
+                          <span
+                            class="text-boxed-light"
+                            translate="VOICE.NO_APPS_AVAILABLE"
+                            >No apps available</span
+                          >
+                        </td>
+                      </tr>
+                    </tbody>
+                    <tfoot md-foot>
+                      <tr md-row>
+                        <td md-cell colspan="7">
+                          <span
+                            ><em translate="VOICE.LEGEND.CUSTOM_APPLICATION"
+                              >(*) - Custom application.</em
+                            ></span
+                          >
+                        </td>
+                      </tr>
+                    </tfoot>
+                  </table>
+                </md-table-container>
+                <!-- / QUEUES TABLE -->
+
+                <!-- NO RESULTS -->
+
+                <!-- / NO RESULTS -->
+              </div>
+              <!-- / MAIN -->
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/voice/views/outboundroutes/outboundroutes.html/outboundroutes-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/outboundroutes/outboundroutes.html/outboundroutes-[chunkhash].html
deleted file mode 100644
index ffe6857..0000000
--- a/public/src/js/modules/main/apps/voice/views/outboundroutes/outboundroutes.html/outboundroutes-[chunkhash].html
+++ /dev/null
@@ -1,299 +0,0 @@
-<div
-  id="outboundroutes"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-phone" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="VOICE.OUTBOUNDROUTES"
-          >OutboundRoutes</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="VOICE.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedOutboundRoutes.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedOutboundRoutes =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="VOICE.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-outboundroutes-count">
-          <span>{{vm.selectedOutboundRoutes.length}}</span>
-          <span translate="VOICE.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="VOICE.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllOutboundRoutes()"
-                translate="VOICE.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectOutboundRoutes()"
-                translate="VOICE.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedOutboundRoutes"
-          csv-label="true"
-          filename="outboundroutes.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedOutboundRoutes($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="VOICE.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- OUTBOUNDROUTE TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedOutboundRoutes"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getOutboundRoutes"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'VOICE.ID' | translate }}</th>
-                <th md-column md-order-by="exten">
-                  {{ 'VOICE.PHONENUMBER' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'VOICE.DESCRIPTION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.outboundroutes.rows.length">
-                <td md-cell colspan="4">
-                  <div layout="row" layout-align="center center">
-                    <span translate="VOICE.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="outboundroute"
-                md-select-id="id"
-                ng-repeat="outboundroute in vm.outboundroutes.rows"
-              >
-                <td md-cell ng-if="outboundroute.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{outboundroute.name}}"
-                    ng-src="api/users/{{outboundroute.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!outboundroute.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{outboundroute.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(outboundroute, ev) : vm.createOrEditOutboundRoute($event, outboundroute)"
-                  md-cell
-                  class="id"
-                >
-                  {{outboundroute.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(outboundroute, ev) : vm.createOrEditOutboundRoute($event, outboundroute)"
-                  md-cell
-                  class="exten"
-                >
-                  {{outboundroute.exten}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(outboundroute, ev) : vm.createOrEditOutboundRoute($event, outboundroute)"
-                  md-cell
-                  class="description"
-                >
-                  {{outboundroute.description}}
-                </td>
-
-                <td
-                  md-cell
-                  class="actions"
-                  ng-if="!vm.crudPermissions.readOnly"
-                >
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="VOICE.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(outboundroute, $event    )"
-                          translate="VOICE.EDIT_OUTBOUNDROUTE"
-                        >
-                          Edit OutboundRoute
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(outboundroute, $event    )"
-                          translate="VOICE.DELETE_OUTBOUNDROUTE"
-                        >
-                          Delete OutboundRoute
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.outboundroutes.count}}"
-          md-on-paginate="vm.getOutboundRoutes"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / OUTBOUNDROUTE TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD OUTBOUNDROUTE BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-outboundroute-button"
-    ng-click="vm.createOrEditOutboundRoute($event)"
-    aria-label="add outboundroute"
-    translate
-    translate-attr-aria-label="VOICE.ADD_OUTBOUNDROUTE"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD OUTBOUNDROUTE BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/voice/views/outboundroutes/outboundroutes.html/outboundroutes.html b/public/src/js/modules/main/apps/voice/views/outboundroutes/outboundroutes.html/outboundroutes.html
new file mode 100644
index 0000000..ffe6857
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/outboundroutes/outboundroutes.html/outboundroutes.html
@@ -0,0 +1,299 @@
+<div
+  id="outboundroutes"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-phone" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="VOICE.OUTBOUNDROUTES"
+          >OutboundRoutes</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="VOICE.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedOutboundRoutes.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedOutboundRoutes =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="VOICE.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-outboundroutes-count">
+          <span>{{vm.selectedOutboundRoutes.length}}</span>
+          <span translate="VOICE.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="VOICE.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllOutboundRoutes()"
+                translate="VOICE.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectOutboundRoutes()"
+                translate="VOICE.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedOutboundRoutes"
+          csv-label="true"
+          filename="outboundroutes.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedOutboundRoutes($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="VOICE.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- OUTBOUNDROUTE TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedOutboundRoutes"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getOutboundRoutes"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'VOICE.ID' | translate }}</th>
+                <th md-column md-order-by="exten">
+                  {{ 'VOICE.PHONENUMBER' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'VOICE.DESCRIPTION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.outboundroutes.rows.length">
+                <td md-cell colspan="4">
+                  <div layout="row" layout-align="center center">
+                    <span translate="VOICE.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="outboundroute"
+                md-select-id="id"
+                ng-repeat="outboundroute in vm.outboundroutes.rows"
+              >
+                <td md-cell ng-if="outboundroute.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{outboundroute.name}}"
+                    ng-src="api/users/{{outboundroute.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!outboundroute.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{outboundroute.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(outboundroute, ev) : vm.createOrEditOutboundRoute($event, outboundroute)"
+                  md-cell
+                  class="id"
+                >
+                  {{outboundroute.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(outboundroute, ev) : vm.createOrEditOutboundRoute($event, outboundroute)"
+                  md-cell
+                  class="exten"
+                >
+                  {{outboundroute.exten}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(outboundroute, ev) : vm.createOrEditOutboundRoute($event, outboundroute)"
+                  md-cell
+                  class="description"
+                >
+                  {{outboundroute.description}}
+                </td>
+
+                <td
+                  md-cell
+                  class="actions"
+                  ng-if="!vm.crudPermissions.readOnly"
+                >
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="VOICE.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(outboundroute, $event    )"
+                          translate="VOICE.EDIT_OUTBOUNDROUTE"
+                        >
+                          Edit OutboundRoute
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(outboundroute, $event    )"
+                          translate="VOICE.DELETE_OUTBOUNDROUTE"
+                        >
+                          Delete OutboundRoute
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.outboundroutes.count}}"
+          md-on-paginate="vm.getOutboundRoutes"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / OUTBOUNDROUTE TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD OUTBOUNDROUTE BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-outboundroute-button"
+    ng-click="vm.createOrEditOutboundRoute($event)"
+    aria-label="add outboundroute"
+    translate
+    translate-attr-aria-label="VOICE.ADD_OUTBOUNDROUTE"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD OUTBOUNDROUTE BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/voice/views/realtime/abandonedcalls/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/realtime/abandonedcalls/view.html/view-[chunkhash].html
deleted file mode 100644
index 4cb54f5..0000000
--- a/public/src/js/modules/main/apps/voice/views/realtime/abandonedcalls/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,151 +0,0 @@
-<md-toolbar class="md-table-toolbar md-default table-header">
-  <div class="md-toolbar-tools" layout="row" layout-align="center center">
-    <span class="md-subhead" translate="DASHBOARDS.ABANDONEDQUEUECALLS"
-      >ABANDONED QUEUE CALLS</span
-    >
-    <ms-search-bar
-      on-search="vm.query.filter = query"
-      on-collapse="vm.query.filter = undefined"
-      debounce="300"
-    >
-    </ms-search-bar>
-    <div flex></div>
-
-    <ms-quick-filter
-      filters="vm.quickFilters"
-      query="vm.query"
-      search="vm.getAbandonedCalls()"
-    ></ms-quick-filter>
-
-    <md-button
-      class="md-icon-button"
-      ng-click="vm.refresh && vm.refreshAbandonedCalls($event)"
-      aria-label="Reload"
-      translate
-      translate-attr-label="DASHBOARDS.RELOAD"
-    >
-      <md-icon md-font-icon="icon-reload"></md-icon>
-      <md-tooltip ng-if="vm.showTooltip" md-visible="vm.showTooltip"
-        >{{'DASHBOARDS.CLICKRELOAD' | translate}}
-      </md-tooltip>
-    </md-button>
-  </div>
-</md-toolbar>
-<md-table-container>
-  <table md-table md-progress="vm.promise">
-    <thead
-      md-head
-      md-order="vm.query.sort"
-      md-on-reorder="vm.getAbandonedCalls"
-    >
-      <tr md-row>
-        <th md-column md-order-by="id">ID</th>
-        <th md-column md-order-by="calleridname">
-          {{'DASHBOARDS.FULLNAME' | translate}}
-        </th>
-        <th md-column md-order-by="calleridnum">
-          {{'DASHBOARDS.PHONE' | translate}}
-        </th>
-        <th md-column md-order-by="queue">
-          {{'DASHBOARDS.QUEUE' | translate}}
-        </th>
-        <th md-column md-order-by="queuecallerabandonAt">
-          {{'DASHBOARDS.ABANDONAT' | translate}}
-        </th>
-        <th md-column md-order-by="lastAssignedTo">
-          {{'DASHBOARDS.LASTASSIGNEDTO' | translate}}
-        </th>
-        <th md-column md-order-by="disposition">
-          {{'DASHBOARDS.DISPOSITION' | translate}}
-        </th>
-        <th md-column md-order-by="disposition">
-          {{'DASHBOARDS.SECOND_LEVEL_DISPOSITION' | translate}}
-        </th>
-        <th md-column md-order-by="disposition">
-          {{'DASHBOARDS.THIRD_LEVEL_DISPOSITION' | translate}}
-        </th>
-        <th md-column width="10px"></th>
-      </tr>
-    </thead>
-    <tbody md-body>
-      <tr md-row ng-hide="vm.abandonedCalls.rows.length">
-        <td md-cell colspan="12">
-          <div layout="row" layout-align="center center">
-            <span translate="VOICE.NO_AVAILABLE_INFO">No Available Info</span>
-          </div>
-        </td>
-      </tr>
-      <tr md-row ng-repeat="call in vm.abandonedCalls.rows">
-        <td md-cell class="id">{{call.id}}</td>
-        <td md-cell class="firstName">{{call.calleridname}}</td>
-        <td md-cell class="list">{{call.calleridnum}}</td>
-        <td md-cell class="list">{{vm.queuesMap[call.queue]}}</td>
-        <td md-cell class="list">
-          {{call.queuecallerabandonAt ? (call.queuecallerabandonAt | formatdate)
-          : undefined }}
-        </td>
-        <td md-cell class="list">{{call.lastAssignedTo}}</td>
-        <td md-cell class="list">{{ call.disposition }}</td>
-        <td md-cell class="list">{{ call.secondDisposition }}</td>
-        <td md-cell class="list">{{ call.thirdDisposition }}</td>
-        <td md-cell class="actions">
-          <md-menu>
-            <md-button
-              class="md-icon-button"
-              aria-label="More"
-              translate
-              translate-attr-aria-label="DASHBOARDS.MORE"
-              ng-click="$mdOpenMenu($event)"
-            >
-              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-            </md-button>
-            <md-menu-content width="2">
-              <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                <md-menu>
-                  <md-button
-                    ng-click="$mdMenu.open()"
-                    class="text-capitalize"
-                    translate="DASHBOARDS.ASSIGNTO"
-                    >Assigned to</md-button
-                  >
-                  <md-menu-content>
-                    <md-menu-item ng-if="call.lastAssignedTo">
-                      <md-button ng-click="vm.assignTo(call)"
-                        ><em translate="DASHBOARDS.NONE">Not Assigned</em>
-                      </md-button>
-                    </md-menu-item>
-                    <md-menu-item
-                      ng-if="vm.agents.rows.length"
-                      ng-repeat="agent in vm.agents.rows"
-                    >
-                      <md-button ng-click="vm.assignTo(call,agent)"
-                        >{{agent.name}}</md-button
-                      >
-                    </md-menu-item>
-                  </md-menu-content>
-                </md-menu>
-              </md-menu-item>
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.dispose(call)"
-                  class="text-capitalize"
-                  translate="DASHBOARDS.DISPOSE"
-                  >Dispose
-                </md-button>
-              </md-menu-item>
-            </md-menu-content>
-          </md-menu>
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</md-table-container>
-
-<md-table-pagination
-  md-limit="vm.query.limit"
-  md-limit-options="[10, 15, 20, 50, 100, 250]"
-  md-page="vm.query.page"
-  md-total="{{vm.abandonedCalls.count}}"
-  md-on-paginate="vm.getAbandonedCalls"
-  md-page-select
-></md-table-pagination>
diff --git a/public/src/js/modules/main/apps/voice/views/realtime/abandonedcalls/view.html/view.html b/public/src/js/modules/main/apps/voice/views/realtime/abandonedcalls/view.html/view.html
new file mode 100644
index 0000000..4cb54f5
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/realtime/abandonedcalls/view.html/view.html
@@ -0,0 +1,151 @@
+<md-toolbar class="md-table-toolbar md-default table-header">
+  <div class="md-toolbar-tools" layout="row" layout-align="center center">
+    <span class="md-subhead" translate="DASHBOARDS.ABANDONEDQUEUECALLS"
+      >ABANDONED QUEUE CALLS</span
+    >
+    <ms-search-bar
+      on-search="vm.query.filter = query"
+      on-collapse="vm.query.filter = undefined"
+      debounce="300"
+    >
+    </ms-search-bar>
+    <div flex></div>
+
+    <ms-quick-filter
+      filters="vm.quickFilters"
+      query="vm.query"
+      search="vm.getAbandonedCalls()"
+    ></ms-quick-filter>
+
+    <md-button
+      class="md-icon-button"
+      ng-click="vm.refresh && vm.refreshAbandonedCalls($event)"
+      aria-label="Reload"
+      translate
+      translate-attr-label="DASHBOARDS.RELOAD"
+    >
+      <md-icon md-font-icon="icon-reload"></md-icon>
+      <md-tooltip ng-if="vm.showTooltip" md-visible="vm.showTooltip"
+        >{{'DASHBOARDS.CLICKRELOAD' | translate}}
+      </md-tooltip>
+    </md-button>
+  </div>
+</md-toolbar>
+<md-table-container>
+  <table md-table md-progress="vm.promise">
+    <thead
+      md-head
+      md-order="vm.query.sort"
+      md-on-reorder="vm.getAbandonedCalls"
+    >
+      <tr md-row>
+        <th md-column md-order-by="id">ID</th>
+        <th md-column md-order-by="calleridname">
+          {{'DASHBOARDS.FULLNAME' | translate}}
+        </th>
+        <th md-column md-order-by="calleridnum">
+          {{'DASHBOARDS.PHONE' | translate}}
+        </th>
+        <th md-column md-order-by="queue">
+          {{'DASHBOARDS.QUEUE' | translate}}
+        </th>
+        <th md-column md-order-by="queuecallerabandonAt">
+          {{'DASHBOARDS.ABANDONAT' | translate}}
+        </th>
+        <th md-column md-order-by="lastAssignedTo">
+          {{'DASHBOARDS.LASTASSIGNEDTO' | translate}}
+        </th>
+        <th md-column md-order-by="disposition">
+          {{'DASHBOARDS.DISPOSITION' | translate}}
+        </th>
+        <th md-column md-order-by="disposition">
+          {{'DASHBOARDS.SECOND_LEVEL_DISPOSITION' | translate}}
+        </th>
+        <th md-column md-order-by="disposition">
+          {{'DASHBOARDS.THIRD_LEVEL_DISPOSITION' | translate}}
+        </th>
+        <th md-column width="10px"></th>
+      </tr>
+    </thead>
+    <tbody md-body>
+      <tr md-row ng-hide="vm.abandonedCalls.rows.length">
+        <td md-cell colspan="12">
+          <div layout="row" layout-align="center center">
+            <span translate="VOICE.NO_AVAILABLE_INFO">No Available Info</span>
+          </div>
+        </td>
+      </tr>
+      <tr md-row ng-repeat="call in vm.abandonedCalls.rows">
+        <td md-cell class="id">{{call.id}}</td>
+        <td md-cell class="firstName">{{call.calleridname}}</td>
+        <td md-cell class="list">{{call.calleridnum}}</td>
+        <td md-cell class="list">{{vm.queuesMap[call.queue]}}</td>
+        <td md-cell class="list">
+          {{call.queuecallerabandonAt ? (call.queuecallerabandonAt | formatdate)
+          : undefined }}
+        </td>
+        <td md-cell class="list">{{call.lastAssignedTo}}</td>
+        <td md-cell class="list">{{ call.disposition }}</td>
+        <td md-cell class="list">{{ call.secondDisposition }}</td>
+        <td md-cell class="list">{{ call.thirdDisposition }}</td>
+        <td md-cell class="actions">
+          <md-menu>
+            <md-button
+              class="md-icon-button"
+              aria-label="More"
+              translate
+              translate-attr-aria-label="DASHBOARDS.MORE"
+              ng-click="$mdOpenMenu($event)"
+            >
+              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+            </md-button>
+            <md-menu-content width="2">
+              <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                <md-menu>
+                  <md-button
+                    ng-click="$mdMenu.open()"
+                    class="text-capitalize"
+                    translate="DASHBOARDS.ASSIGNTO"
+                    >Assigned to</md-button
+                  >
+                  <md-menu-content>
+                    <md-menu-item ng-if="call.lastAssignedTo">
+                      <md-button ng-click="vm.assignTo(call)"
+                        ><em translate="DASHBOARDS.NONE">Not Assigned</em>
+                      </md-button>
+                    </md-menu-item>
+                    <md-menu-item
+                      ng-if="vm.agents.rows.length"
+                      ng-repeat="agent in vm.agents.rows"
+                    >
+                      <md-button ng-click="vm.assignTo(call,agent)"
+                        >{{agent.name}}</md-button
+                      >
+                    </md-menu-item>
+                  </md-menu-content>
+                </md-menu>
+              </md-menu-item>
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.dispose(call)"
+                  class="text-capitalize"
+                  translate="DASHBOARDS.DISPOSE"
+                  >Dispose
+                </md-button>
+              </md-menu-item>
+            </md-menu-content>
+          </md-menu>
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</md-table-container>
+
+<md-table-pagination
+  md-limit="vm.query.limit"
+  md-limit-options="[10, 15, 20, 50, 100, 250]"
+  md-page="vm.query.page"
+  md-total="{{vm.abandonedCalls.count}}"
+  md-on-paginate="vm.getAbandonedCalls"
+  md-page-select
+></md-table-pagination>
diff --git a/public/src/js/modules/main/apps/voice/views/realtime/agents/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/realtime/agents/view.html/view-[chunkhash].html
deleted file mode 100644
index f43fd23..0000000
--- a/public/src/js/modules/main/apps/voice/views/realtime/agents/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,517 +0,0 @@
-<!-- MAIN -->
-<md-toolbar class="md-table-toolbar md-default">
-  <div class="md-toolbar-tools">
-    <span class="md-subhead" translate="VOICE.AGENTS">Agents</span>
-    <div flex></div>
-    <ms-search-bar
-      on-search="vm.query.filter = query; vm.onInit()"
-      on-collapse="vm.query.filter = undefined; vm.onInit()"
-      debounce="300"
-    ></ms-search-bar>
-    <md-select
-      ng-model="vm.query.globalStatusFilter"
-      class="md-caption"
-      ng-change="vm.query.pauseTypeFilter = ''; vm.onInit()"
-    >
-      <md-option ng-value="''">{{ 'VOICE.ALL' | translate }}</md-option>
-      <md-option value="pause">{{ 'VOICE.PAUSE' | translate }}</md-option>
-      <md-option value="*pause"
-        >{{ 'VOICE.PARTIALPAUSE' | translate }}</md-option
-      >
-      <md-option value="busy">{{ 'VOICE.BUSY' | translate }}</md-option>
-      <md-option value="idle">{{ 'VOICE.IDLE' | translate }}</md-option>
-    </md-select>
-
-    <md-select
-      ng-if="vm.isPause(vm.query.globalStatusFilter)"
-      ng-model="vm.query.pauseTypeFilter"
-      class="md-caption"
-      ng-change="vm.onInit()"
-    >
-      <md-option ng-value="''">All</md-option>
-      <md-option value="DEFAULT PAUSE">DEFAULT PAUSE</md-option>
-      <md-option value="ACW">ACW</md-option>
-      <md-option value="LOGININPAUSE">LOGININPAUSE</md-option>
-      <md-option value="Auto-Pause">AUTOPAUSE</md-option>
-      <md-option ng-value="pause.name" ng-repeat="pause in vm.pauses.rows"
-        >{{pause.name}}</md-option
-      >
-    </md-select>
-  </div>
-</md-toolbar>
-
-<!-- AGENT TABLE -->
-<md-table-container>
-  <table md-table multiple md-progress="vm.promise">
-    <thead md-head md-order="vm.query.order" md-on-reorder="vm.onInit">
-      <tr md-row border="1">
-        <th class="bv text-center" colspan="5">
-          {{ 'VOICE.AGENT' | translate }}
-        </th>
-        <th class="bv bl text-center" colspan="2">
-          {{ 'VOICE.VOICE' | translate }}
-        </th>
-        <th ng-if="vm.license.chat" class="bv bl text-center" colspan="2">
-          {{ 'CHAT.CHAT' | translate }}
-        </th>
-        <th ng-if="vm.license.mail" class="bv bl text-center" colspan="2">
-          {{ 'MAIL.MAIL' | translate }}
-        </th>
-        <th ng-if="vm.license.messaging" class="bv bl text-center" colspan="2">
-          {{ 'SMS.SMS' | translate }}
-        </th>
-        <th
-          ng-if="vm.license.openchannel"
-          class="bv bl text-center"
-          colspan="2"
-        >
-          {{ 'OPENCHANNEL.OPENCHANNEL' | translate }}
-        </th>
-        <th ng-if="vm.license.fax" class="bv bl text-center" colspan="2">
-          {{ 'FAX.FAX' | translate }}
-        </th>
-        <th ng-if="vm.license.whatsapp" class="bv bl text-center" colspan="2">
-          {{ 'WHATSAPP.WHATSAPP' | translate }}
-        </th>
-        <th width="10px" class="bt bl" rowspan="2"></th>
-      </tr>
-      <tr md-row>
-        <th class="bl" colspan="2" md-column md-order-by="fullname">
-          {{ 'VOICE.NAME' | translate }}
-        </th>
-        <th class="bl custom-column" md-column md-order-by="globalStatus">
-          {{ 'VOICE.STATUS' | translate }}
-        </th>
-        <th class="bl custom-column" md-column md-order-by="lastLoginAt">
-          {{ 'VOICE.LOGIN_TIME' | translate }}
-        </th>
-        <th class="bl custom-column" md-column md-order-by="lastPauseAt">
-          {{ 'VOICE.PAUSE_TIME' | translate }}
-        </th>
-
-        <th class="bl custom-column">{{ 'VOICE.STATUS' | translate }}</th>
-        <th class="bl custom-column">Info</th>
-
-        <th ng-if="vm.license.chat" class="bl text-center">
-          {{ 'CHAT.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.chat" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'CHAT.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.mail" class="bl text-center">
-          {{ 'MAIL.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.mail" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'MAIL.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.messaging" class="bl text-center">
-          {{ 'SMS.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.messaging" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'SMS.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.openchannel" class="bl text-center">
-          {{ 'OPENCHANNEL.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.openchannel" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'OPENCHANNEL.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.fax" class="bl text-center">
-          {{ 'FAX.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.fax" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'FAX.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.whatsapp" class="bl text-center">
-          {{ 'WHATSAPP.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.whatsapp" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'WHATSAPP.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-      </tr>
-    </thead>
-    <tbody md-body>
-      <tr md-row ng-hide="vm.order.length">
-        <td md-cell colspan="19">
-          <div layout="row" layout-align="center center">
-            <span>{{ 'VOICE.NO_AGENT_ONLINE' | translate }}</span>
-          </div>
-        </td>
-      </tr>
-      <tr
-        md-select="vm.agents[value]"
-        md-select-id="id"
-        ng-repeat="(id, value) in vm.order"
-      >
-        <td class="bt padding-5">
-          <div layout="row" layout-align="start center">
-            <img
-              class="avatar"
-              ng-src="{{vm.agents[value].userpic && 'api/users/'+vm.agents[value].id+'/avatar' || 'assets/images/avatars/profile.png'}}"
-            />
-            <div layout="column">
-              <span>{{vm.agents[value].fullname}}</span>
-              <span>{{vm.agents[value].internal}}</span>
-            </div>
-          </div>
-        </td>
-        <td class="bt padding-5">
-          <div
-            layout="row"
-            layout-align="start center"
-            ng-if="vm.license.screenrecording && (vm.agents[value].phoneBarEnableScreenRecordingByAgent || vm.agents[value].phoneBarEnableAutomaticScreenRecording)"
-          >
-            <div class="column" ng-if="vm.agents[value].screenrecording">
-              <span>
-                <md-icon
-                  md-font-icon="icon-camcorder-box"
-                  style="color: green; font-size: 36px"
-                  aria-label="icon-camcorder-box26"
-                >
-                  <md-tooltip>
-                    {{ 'VOICE.TOOLTIP_SCREENRECORDING_ON' | translate }}
-                  </md-tooltip>
-                </md-icon>
-              </span>
-            </div>
-            <div class="column" ng-if="!vm.agents[value].screenrecording">
-              <span>
-                <md-icon
-                  md-font-icon="icon-camcorder-box"
-                  style="color: gray"
-                  aria-label="icon-camcorder-box26"
-                >
-                  <md-tooltip>
-                    {{ 'VOICE.TOOLTIP_SCREENRECORDING_OFF' | translate }}
-                  </md-tooltip>
-                </md-icon>
-              </span>
-            </div>
-          </div>
-        </td>
-
-        <td class="bt">
-          <span
-            class="text-boxed md-background-bg bl bt padding-5"
-            ng-class="{'idle':'lime-300-bg','busy':'indigo-100-bg','*pause':'amber-50-bg','pause':'amber-200-bg'}[vm.agents[value].globalStatus]"
-            >{{ vm.isPause(vm.agents[value].globalStatus) ? '' :
-            vm.agents[value].globalStatus | uppercase }} {{
-            vm.isPause(vm.agents[value].globalStatus) ?
-            (vm.isPartialPause(vm.agents[value].globalStatus) ?
-            '*'+vm.agents[value].pauseType || 'DEFAULT PAUSE' :
-            vm.agents[value].pauseType || 'DEFAULT PAUSE') : ''}}</span
-          >
-        </td>
-        <td class="bt custom-column">
-          <timer start-time="vm.agents[value].lastLoginAt" interval="1000"
-            >{{ days > 0 ? days + 'd' : '' }}
-            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
-          >
-        </td>
-        <td class="bt custom-column">
-          <timer
-            ng-if="vm.isPause(vm.agents[value].globalStatus) || vm.isPartialPause(vm.agents[value].globalStatus)"
-            start-time="vm.agents[value].lastPauseAt"
-            interval="1000"
-            >{{ days > 0 ? days + 'd' : '' }}
-            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
-          >
-        </td>
-        <td class="bt bl">
-          <div layout="row">
-            <span
-              ng-if="!vm.agents[value].onhold"
-              class="text-boxed md-background-bg bl bt padding-5"
-              ng-class="{'idle':'lime-300-bg','talking':'indigo-100-bg','ringing':'orange-400-bg','pause':'amber-200-bg'}[vm.agents[value].voiceStatus]"
-              >{{ vm.agents[value].voiceStatus | uppercase }}</span
-            >
-            <span
-              ng-if="vm.agents[value].onhold"
-              class="text-boxed md-background-bg bl bt padding-5 orange-400-bg"
-              >ONHOLD</span
-            >
-          </div>
-        </td>
-        <td class="bt bl">
-          <div layout="column">
-            <span
-              ng-if="vm.agents[value].queue"
-              class="padding-5"
-              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
-              >{{ vm.agents[value].queue }}</span
-            >
-            <span
-              ng-if="vm.agents[value].destconnectedlinenum"
-              class="padding-5"
-              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
-              >{{ vm.agents[value].destconnectedlinenum }}</span
-            >
-            <span
-              class="padding-5"
-              ng-if="vm.agents[value].queue || vm.agents[value].destconnectedlinenum"
-            >
-              <timer
-                start-time="vm.agents[value].voiceStatusTime"
-                interval="1000"
-                ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
-              >
-                {{hhours}}:{{mminutes}}:{{sseconds}}</timer
-              >
-            </span>
-          </div>
-        </td>
-
-        <td class="bt bl" ng-if="vm.license.chat">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].chatStatus]"
-                >{{ vm.agents[value].chatStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          md-number
-          class="bt text-center font-size-20"
-          ng-if="vm.license.chat"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].chatStatus]"
-        >
-          {{ vm.agents[value].chatCurrentCapacity }}
-        </td>
-
-        <td class="bl bt" ng-if="vm.license.mail">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].mailStatus]"
-                >{{ vm.agents[value].mailStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.mail"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].mailStatus]"
-        >
-          {{ vm.agents[value].mailCurrentCapacity }}
-        </td>
-
-        <td class="bl bt" ng-if="vm.license.messaging">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].smsStatus]"
-                >{{ vm.agents[value].smsStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.messaging"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].smsStatus]"
-        >
-          {{ vm.agents[value].smsCurrentCapacity }}
-        </td>
-
-        <td class="bt bl" ng-if="vm.license.openchannel">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].openchannelStatus]"
-                >{{ vm.agents[value].openchannelStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.openchannel"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].openchannelStatus]"
-        >
-          {{ vm.agents[value].openchannelCurrentCapacity }}
-        </td>
-
-        <td class="bt bl" ng-if="vm.license.fax">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].faxStatus]"
-                >{{ vm.agents[value].faxStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.fax"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].faxStatus]"
-        >
-          {{ vm.agents[value].faxCurrentCapacity }}
-        </td>
-
-        <td class="bl bt" ng-if="vm.license.whatsapp">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].whatsappStatus]"
-                >{{ vm.agents[value].whatsappStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.whatsapp"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].whatsappStatus]"
-        >
-          {{ vm.agents[value].whatsappCurrentCapacity }}
-        </td>
-
-        <td
-          class="bl bt padding-5 text-center"
-          ng-if="vm.crudPermissions.canEdit"
-        >
-          <md-menu>
-            <md-button
-              class="md-icon-button"
-              aria-label="More"
-              translate
-              translate-attr-aria-label="STAFF.MORE"
-              ng-click="$mdMenu.open($event)"
-            >
-              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-            </md-button>
-
-            <md-menu-content width="4">
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.logout(vm.agents[value], $event)"
-                  translate="VOICE.LOGOUT"
-                >
-                  Logout
-                </md-button>
-              </md-menu-item>
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.queueAdd(vm.agents[value], $event)"
-                  translate="VOICE.AGENTADD_QUEUE"
-                >
-                  Add Agent In Queue
-                </md-button>
-              </md-menu-item>
-
-              <md-menu-item
-                ng-if="vm.license.screenrecording && vm.agents[value].phoneBarEnableScreenRecordingByAgent"
-              >
-                <md-menu>
-                  <md-button
-                    ng-click="$mdMenu.open()"
-                    class="text-capitalize"
-                    translate="VOICE.SCREENRECORDING"
-                    >Screen Recording
-                  </md-button>
-                  <md-menu-content>
-                    <md-menu-item ng-if="!vm.agents[value].screenrecording">
-                      <md-button
-                        ng-click="vm.screenRecording(vm.agents[value], true)"
-                        ><em translate="VOICE.START_SCREENRECORDING"
-                          >Start Screen Recording</em
-                        ></md-button
-                      >
-                    </md-menu-item>
-                    <md-menu-item ng-if="vm.agents[value].screenrecording">
-                      <md-button
-                        ng-click="vm.screenRecording(vm.agents[value], false)"
-                        ><em translate="VOICE.STOP_SCREENRECORDING"
-                          >Stop Screen Recording</em
-                        ></md-button
-                      >
-                    </md-menu-item>
-                  </md-menu-content>
-                </md-menu>
-              </md-menu-item>
-
-              <md-menu-item>
-                <md-menu>
-                  <md-button
-                    ng-click="$mdMenu.open()"
-                    class="text-capitalize"
-                    translate="VOICE.PAUSE"
-                    >Pause</md-button
-                  >
-                  <md-menu-content>
-                    <md-menu-item>
-                      <md-button
-                        ng-disabled=" vm.agents[value].voicePause && 'DEFAULT PAUSE' === vm.agents[value].pauseType"
-                        ng-click="vm.pause(vm.agents[value])"
-                        ><em translate="VOICE.DEFAULT_PAUSE"
-                          >Default Pause</em
-                        ></md-button
-                      >
-                    </md-menu-item>
-                    <md-menu-item
-                      ng-if="vm.pauses.rows.length"
-                      ng-repeat="pause in vm.pauses.rows"
-                    >
-                      <md-button
-                        ng-disabled="vm.agents[value].voicePause && pause.name === vm.agents[value].pauseType"
-                        ng-click="vm.pause(vm.agents[value], pause.name)"
-                        >{{pause.name}}
-                      </md-button>
-                    </md-menu-item>
-                  </md-menu-content>
-                </md-menu>
-              </md-menu-item>
-              <md-menu-item ng-if="vm.isPause(vm.agents[value].globalStatus)">
-                <md-button
-                  ng-click="vm.unPause(vm.agents[value])"
-                  translate="VOICE.UNPAUSE"
-                >
-                  Unpause
-                </md-button>
-              </md-menu-item>
-            </md-menu-content>
-          </md-menu>
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</md-table-container>
-
-<md-table-pagination
-  md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
-  md-limit="vm.query.limit"
-  md-limit-options="[10, 15, 20, 50, 100, 250]"
-  md-page="vm.query.page"
-  md-total="{{vm.filteredAgents.length}}"
-  md-on-paginate="vm.onInit"
-  md-page-select
-></md-table-pagination>
-<!-- / AGENT TABLE -->
-<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/voice/views/realtime/agents/view.html/view.html b/public/src/js/modules/main/apps/voice/views/realtime/agents/view.html/view.html
new file mode 100644
index 0000000..f43fd23
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/realtime/agents/view.html/view.html
@@ -0,0 +1,517 @@
+<!-- MAIN -->
+<md-toolbar class="md-table-toolbar md-default">
+  <div class="md-toolbar-tools">
+    <span class="md-subhead" translate="VOICE.AGENTS">Agents</span>
+    <div flex></div>
+    <ms-search-bar
+      on-search="vm.query.filter = query; vm.onInit()"
+      on-collapse="vm.query.filter = undefined; vm.onInit()"
+      debounce="300"
+    ></ms-search-bar>
+    <md-select
+      ng-model="vm.query.globalStatusFilter"
+      class="md-caption"
+      ng-change="vm.query.pauseTypeFilter = ''; vm.onInit()"
+    >
+      <md-option ng-value="''">{{ 'VOICE.ALL' | translate }}</md-option>
+      <md-option value="pause">{{ 'VOICE.PAUSE' | translate }}</md-option>
+      <md-option value="*pause"
+        >{{ 'VOICE.PARTIALPAUSE' | translate }}</md-option
+      >
+      <md-option value="busy">{{ 'VOICE.BUSY' | translate }}</md-option>
+      <md-option value="idle">{{ 'VOICE.IDLE' | translate }}</md-option>
+    </md-select>
+
+    <md-select
+      ng-if="vm.isPause(vm.query.globalStatusFilter)"
+      ng-model="vm.query.pauseTypeFilter"
+      class="md-caption"
+      ng-change="vm.onInit()"
+    >
+      <md-option ng-value="''">All</md-option>
+      <md-option value="DEFAULT PAUSE">DEFAULT PAUSE</md-option>
+      <md-option value="ACW">ACW</md-option>
+      <md-option value="LOGININPAUSE">LOGININPAUSE</md-option>
+      <md-option value="Auto-Pause">AUTOPAUSE</md-option>
+      <md-option ng-value="pause.name" ng-repeat="pause in vm.pauses.rows"
+        >{{pause.name}}</md-option
+      >
+    </md-select>
+  </div>
+</md-toolbar>
+
+<!-- AGENT TABLE -->
+<md-table-container>
+  <table md-table multiple md-progress="vm.promise">
+    <thead md-head md-order="vm.query.order" md-on-reorder="vm.onInit">
+      <tr md-row border="1">
+        <th class="bv text-center" colspan="5">
+          {{ 'VOICE.AGENT' | translate }}
+        </th>
+        <th class="bv bl text-center" colspan="2">
+          {{ 'VOICE.VOICE' | translate }}
+        </th>
+        <th ng-if="vm.license.chat" class="bv bl text-center" colspan="2">
+          {{ 'CHAT.CHAT' | translate }}
+        </th>
+        <th ng-if="vm.license.mail" class="bv bl text-center" colspan="2">
+          {{ 'MAIL.MAIL' | translate }}
+        </th>
+        <th ng-if="vm.license.messaging" class="bv bl text-center" colspan="2">
+          {{ 'SMS.SMS' | translate }}
+        </th>
+        <th
+          ng-if="vm.license.openchannel"
+          class="bv bl text-center"
+          colspan="2"
+        >
+          {{ 'OPENCHANNEL.OPENCHANNEL' | translate }}
+        </th>
+        <th ng-if="vm.license.fax" class="bv bl text-center" colspan="2">
+          {{ 'FAX.FAX' | translate }}
+        </th>
+        <th ng-if="vm.license.whatsapp" class="bv bl text-center" colspan="2">
+          {{ 'WHATSAPP.WHATSAPP' | translate }}
+        </th>
+        <th width="10px" class="bt bl" rowspan="2"></th>
+      </tr>
+      <tr md-row>
+        <th class="bl" colspan="2" md-column md-order-by="fullname">
+          {{ 'VOICE.NAME' | translate }}
+        </th>
+        <th class="bl custom-column" md-column md-order-by="globalStatus">
+          {{ 'VOICE.STATUS' | translate }}
+        </th>
+        <th class="bl custom-column" md-column md-order-by="lastLoginAt">
+          {{ 'VOICE.LOGIN_TIME' | translate }}
+        </th>
+        <th class="bl custom-column" md-column md-order-by="lastPauseAt">
+          {{ 'VOICE.PAUSE_TIME' | translate }}
+        </th>
+
+        <th class="bl custom-column">{{ 'VOICE.STATUS' | translate }}</th>
+        <th class="bl custom-column">Info</th>
+
+        <th ng-if="vm.license.chat" class="bl text-center">
+          {{ 'CHAT.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.chat" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'CHAT.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.mail" class="bl text-center">
+          {{ 'MAIL.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.mail" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'MAIL.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.messaging" class="bl text-center">
+          {{ 'SMS.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.messaging" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'SMS.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.openchannel" class="bl text-center">
+          {{ 'OPENCHANNEL.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.openchannel" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'OPENCHANNEL.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.fax" class="bl text-center">
+          {{ 'FAX.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.fax" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'FAX.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.whatsapp" class="bl text-center">
+          {{ 'WHATSAPP.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.whatsapp" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'WHATSAPP.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+      </tr>
+    </thead>
+    <tbody md-body>
+      <tr md-row ng-hide="vm.order.length">
+        <td md-cell colspan="19">
+          <div layout="row" layout-align="center center">
+            <span>{{ 'VOICE.NO_AGENT_ONLINE' | translate }}</span>
+          </div>
+        </td>
+      </tr>
+      <tr
+        md-select="vm.agents[value]"
+        md-select-id="id"
+        ng-repeat="(id, value) in vm.order"
+      >
+        <td class="bt padding-5">
+          <div layout="row" layout-align="start center">
+            <img
+              class="avatar"
+              ng-src="{{vm.agents[value].userpic && 'api/users/'+vm.agents[value].id+'/avatar' || 'assets/images/avatars/profile.png'}}"
+            />
+            <div layout="column">
+              <span>{{vm.agents[value].fullname}}</span>
+              <span>{{vm.agents[value].internal}}</span>
+            </div>
+          </div>
+        </td>
+        <td class="bt padding-5">
+          <div
+            layout="row"
+            layout-align="start center"
+            ng-if="vm.license.screenrecording && (vm.agents[value].phoneBarEnableScreenRecordingByAgent || vm.agents[value].phoneBarEnableAutomaticScreenRecording)"
+          >
+            <div class="column" ng-if="vm.agents[value].screenrecording">
+              <span>
+                <md-icon
+                  md-font-icon="icon-camcorder-box"
+                  style="color: green; font-size: 36px"
+                  aria-label="icon-camcorder-box26"
+                >
+                  <md-tooltip>
+                    {{ 'VOICE.TOOLTIP_SCREENRECORDING_ON' | translate }}
+                  </md-tooltip>
+                </md-icon>
+              </span>
+            </div>
+            <div class="column" ng-if="!vm.agents[value].screenrecording">
+              <span>
+                <md-icon
+                  md-font-icon="icon-camcorder-box"
+                  style="color: gray"
+                  aria-label="icon-camcorder-box26"
+                >
+                  <md-tooltip>
+                    {{ 'VOICE.TOOLTIP_SCREENRECORDING_OFF' | translate }}
+                  </md-tooltip>
+                </md-icon>
+              </span>
+            </div>
+          </div>
+        </td>
+
+        <td class="bt">
+          <span
+            class="text-boxed md-background-bg bl bt padding-5"
+            ng-class="{'idle':'lime-300-bg','busy':'indigo-100-bg','*pause':'amber-50-bg','pause':'amber-200-bg'}[vm.agents[value].globalStatus]"
+            >{{ vm.isPause(vm.agents[value].globalStatus) ? '' :
+            vm.agents[value].globalStatus | uppercase }} {{
+            vm.isPause(vm.agents[value].globalStatus) ?
+            (vm.isPartialPause(vm.agents[value].globalStatus) ?
+            '*'+vm.agents[value].pauseType || 'DEFAULT PAUSE' :
+            vm.agents[value].pauseType || 'DEFAULT PAUSE') : ''}}</span
+          >
+        </td>
+        <td class="bt custom-column">
+          <timer start-time="vm.agents[value].lastLoginAt" interval="1000"
+            >{{ days > 0 ? days + 'd' : '' }}
+            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
+          >
+        </td>
+        <td class="bt custom-column">
+          <timer
+            ng-if="vm.isPause(vm.agents[value].globalStatus) || vm.isPartialPause(vm.agents[value].globalStatus)"
+            start-time="vm.agents[value].lastPauseAt"
+            interval="1000"
+            >{{ days > 0 ? days + 'd' : '' }}
+            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
+          >
+        </td>
+        <td class="bt bl">
+          <div layout="row">
+            <span
+              ng-if="!vm.agents[value].onhold"
+              class="text-boxed md-background-bg bl bt padding-5"
+              ng-class="{'idle':'lime-300-bg','talking':'indigo-100-bg','ringing':'orange-400-bg','pause':'amber-200-bg'}[vm.agents[value].voiceStatus]"
+              >{{ vm.agents[value].voiceStatus | uppercase }}</span
+            >
+            <span
+              ng-if="vm.agents[value].onhold"
+              class="text-boxed md-background-bg bl bt padding-5 orange-400-bg"
+              >ONHOLD</span
+            >
+          </div>
+        </td>
+        <td class="bt bl">
+          <div layout="column">
+            <span
+              ng-if="vm.agents[value].queue"
+              class="padding-5"
+              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
+              >{{ vm.agents[value].queue }}</span
+            >
+            <span
+              ng-if="vm.agents[value].destconnectedlinenum"
+              class="padding-5"
+              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
+              >{{ vm.agents[value].destconnectedlinenum }}</span
+            >
+            <span
+              class="padding-5"
+              ng-if="vm.agents[value].queue || vm.agents[value].destconnectedlinenum"
+            >
+              <timer
+                start-time="vm.agents[value].voiceStatusTime"
+                interval="1000"
+                ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
+              >
+                {{hhours}}:{{mminutes}}:{{sseconds}}</timer
+              >
+            </span>
+          </div>
+        </td>
+
+        <td class="bt bl" ng-if="vm.license.chat">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].chatStatus]"
+                >{{ vm.agents[value].chatStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          md-number
+          class="bt text-center font-size-20"
+          ng-if="vm.license.chat"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].chatStatus]"
+        >
+          {{ vm.agents[value].chatCurrentCapacity }}
+        </td>
+
+        <td class="bl bt" ng-if="vm.license.mail">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].mailStatus]"
+                >{{ vm.agents[value].mailStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.mail"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].mailStatus]"
+        >
+          {{ vm.agents[value].mailCurrentCapacity }}
+        </td>
+
+        <td class="bl bt" ng-if="vm.license.messaging">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].smsStatus]"
+                >{{ vm.agents[value].smsStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.messaging"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].smsStatus]"
+        >
+          {{ vm.agents[value].smsCurrentCapacity }}
+        </td>
+
+        <td class="bt bl" ng-if="vm.license.openchannel">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].openchannelStatus]"
+                >{{ vm.agents[value].openchannelStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.openchannel"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].openchannelStatus]"
+        >
+          {{ vm.agents[value].openchannelCurrentCapacity }}
+        </td>
+
+        <td class="bt bl" ng-if="vm.license.fax">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].faxStatus]"
+                >{{ vm.agents[value].faxStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.fax"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].faxStatus]"
+        >
+          {{ vm.agents[value].faxCurrentCapacity }}
+        </td>
+
+        <td class="bl bt" ng-if="vm.license.whatsapp">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].whatsappStatus]"
+                >{{ vm.agents[value].whatsappStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.whatsapp"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].whatsappStatus]"
+        >
+          {{ vm.agents[value].whatsappCurrentCapacity }}
+        </td>
+
+        <td
+          class="bl bt padding-5 text-center"
+          ng-if="vm.crudPermissions.canEdit"
+        >
+          <md-menu>
+            <md-button
+              class="md-icon-button"
+              aria-label="More"
+              translate
+              translate-attr-aria-label="STAFF.MORE"
+              ng-click="$mdMenu.open($event)"
+            >
+              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+            </md-button>
+
+            <md-menu-content width="4">
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.logout(vm.agents[value], $event)"
+                  translate="VOICE.LOGOUT"
+                >
+                  Logout
+                </md-button>
+              </md-menu-item>
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.queueAdd(vm.agents[value], $event)"
+                  translate="VOICE.AGENTADD_QUEUE"
+                >
+                  Add Agent In Queue
+                </md-button>
+              </md-menu-item>
+
+              <md-menu-item
+                ng-if="vm.license.screenrecording && vm.agents[value].phoneBarEnableScreenRecordingByAgent"
+              >
+                <md-menu>
+                  <md-button
+                    ng-click="$mdMenu.open()"
+                    class="text-capitalize"
+                    translate="VOICE.SCREENRECORDING"
+                    >Screen Recording
+                  </md-button>
+                  <md-menu-content>
+                    <md-menu-item ng-if="!vm.agents[value].screenrecording">
+                      <md-button
+                        ng-click="vm.screenRecording(vm.agents[value], true)"
+                        ><em translate="VOICE.START_SCREENRECORDING"
+                          >Start Screen Recording</em
+                        ></md-button
+                      >
+                    </md-menu-item>
+                    <md-menu-item ng-if="vm.agents[value].screenrecording">
+                      <md-button
+                        ng-click="vm.screenRecording(vm.agents[value], false)"
+                        ><em translate="VOICE.STOP_SCREENRECORDING"
+                          >Stop Screen Recording</em
+                        ></md-button
+                      >
+                    </md-menu-item>
+                  </md-menu-content>
+                </md-menu>
+              </md-menu-item>
+
+              <md-menu-item>
+                <md-menu>
+                  <md-button
+                    ng-click="$mdMenu.open()"
+                    class="text-capitalize"
+                    translate="VOICE.PAUSE"
+                    >Pause</md-button
+                  >
+                  <md-menu-content>
+                    <md-menu-item>
+                      <md-button
+                        ng-disabled=" vm.agents[value].voicePause && 'DEFAULT PAUSE' === vm.agents[value].pauseType"
+                        ng-click="vm.pause(vm.agents[value])"
+                        ><em translate="VOICE.DEFAULT_PAUSE"
+                          >Default Pause</em
+                        ></md-button
+                      >
+                    </md-menu-item>
+                    <md-menu-item
+                      ng-if="vm.pauses.rows.length"
+                      ng-repeat="pause in vm.pauses.rows"
+                    >
+                      <md-button
+                        ng-disabled="vm.agents[value].voicePause && pause.name === vm.agents[value].pauseType"
+                        ng-click="vm.pause(vm.agents[value], pause.name)"
+                        >{{pause.name}}
+                      </md-button>
+                    </md-menu-item>
+                  </md-menu-content>
+                </md-menu>
+              </md-menu-item>
+              <md-menu-item ng-if="vm.isPause(vm.agents[value].globalStatus)">
+                <md-button
+                  ng-click="vm.unPause(vm.agents[value])"
+                  translate="VOICE.UNPAUSE"
+                >
+                  Unpause
+                </md-button>
+              </md-menu-item>
+            </md-menu-content>
+          </md-menu>
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</md-table-container>
+
+<md-table-pagination
+  md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
+  md-limit="vm.query.limit"
+  md-limit-options="[10, 15, 20, 50, 100, 250]"
+  md-page="vm.query.page"
+  md-total="{{vm.filteredAgents.length}}"
+  md-on-paginate="vm.onInit"
+  md-page-select
+></md-table-pagination>
+<!-- / AGENT TABLE -->
+<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/voice/views/realtime/outbound_calls/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/realtime/outbound_calls/view.html/view-[chunkhash].html
deleted file mode 100644
index b8b2dfc..0000000
--- a/public/src/js/modules/main/apps/voice/views/realtime/outbound_calls/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,88 +0,0 @@
-<!-- MAIN -->
-<md-toolbar class="md-table-toolbar md-default">
-  <div class="md-toolbar-tools">
-    <span class="md-subhead" translate="VOICE.OUTBOUND_CALLS"
-      >Ooutbound Calls</span
-    >
-    <div flex></div>
-    <ms-search-bar
-      on-search="vm.query.filter = query;"
-      on-collapse="vm.query.filter = undefined;"
-      debounce="300"
-    ></ms-search-bar>
-  </div>
-</md-toolbar>
-
-<!-- OUTBOUNDS TABLE -->
-<md-table-container>
-  <table md-table>
-    <thead md-head>
-      <tr md-row>
-        <th md-column width="30px"></th>
-        <th md-column>{{ 'VOICE.SOURCE' | translate }}</th>
-        <th md-column>{{ 'VOICE.DESTINATION' | translate }}</th>
-        <th md-column>{{ 'VOICE.DURATION' | translate }}</th>
-      </tr>
-    </thead>
-    <tbody md-body>
-      <tr md-row ng-hide="vm.calls.rows.length">
-        <td md-cell colspan="4">
-          <div layout="row" layout-align="center center">
-            <span translate="VOICE.NO_AVAILABLE_INFO">No Available Info</span>
-          </div>
-        </td>
-      </tr>
-      <tr
-        md-row
-        ng-repeat="call in vm.calls.rows | filter: vm.query.filter | limitTo: vm.query.limit: (vm.query.page - 1) * vm.query.limit"
-      >
-        <td md-cell>
-          <i
-            ng-class="vm.channelStatus[call.channelstatedesc.toLowerCase()]"
-          ></i>
-        </td>
-        <td md-cell>
-          {{call.calleridname}}, {{call.calleridnum}}
-          <span class="text-boxed" ng-if="call.answered"
-            ><timer
-              ng-if="call.answertime"
-              start-time="call.answertime"
-              interval="1000"
-              >{{hhours}}:{{mminutes}}:{{sseconds}}</timer
-            ></span
-          >
-        </td>
-        <td md-cell>{{call.exten}}</td>
-        <td md-cell>
-          <span
-            class="text-boxed"
-            ng-if="call.channelstatedesc.toLowerCase() !== 'hangup'"
-          >
-            <timer
-              ng-if="call.starttime"
-              start-time="call.starttime"
-              interval="1000"
-              >{{hhours}}:{{mminutes}}:{{sseconds}}</timer
-            >
-          </span>
-          <span
-            class="text-boxed"
-            ng-if="call.channelstatedesc.toLowerCase() === 'hangup'"
-            translate="VOICE.CLOSING"
-            >Closing</span
-          >
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</md-table-container>
-
-<md-table-pagination
-  md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
-  md-limit="vm.query.limit"
-  md-limit-options="[10, 15, 20, 50, 100, 250]"
-  md-page="vm.query.page"
-  md-total="{{vm.calls.count}}"
-></md-table-pagination>
-<!-- / OUTBOUNDS TABLE -->
-<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/voice/views/realtime/outbound_calls/view.html/view.html b/public/src/js/modules/main/apps/voice/views/realtime/outbound_calls/view.html/view.html
new file mode 100644
index 0000000..b8b2dfc
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/realtime/outbound_calls/view.html/view.html
@@ -0,0 +1,88 @@
+<!-- MAIN -->
+<md-toolbar class="md-table-toolbar md-default">
+  <div class="md-toolbar-tools">
+    <span class="md-subhead" translate="VOICE.OUTBOUND_CALLS"
+      >Ooutbound Calls</span
+    >
+    <div flex></div>
+    <ms-search-bar
+      on-search="vm.query.filter = query;"
+      on-collapse="vm.query.filter = undefined;"
+      debounce="300"
+    ></ms-search-bar>
+  </div>
+</md-toolbar>
+
+<!-- OUTBOUNDS TABLE -->
+<md-table-container>
+  <table md-table>
+    <thead md-head>
+      <tr md-row>
+        <th md-column width="30px"></th>
+        <th md-column>{{ 'VOICE.SOURCE' | translate }}</th>
+        <th md-column>{{ 'VOICE.DESTINATION' | translate }}</th>
+        <th md-column>{{ 'VOICE.DURATION' | translate }}</th>
+      </tr>
+    </thead>
+    <tbody md-body>
+      <tr md-row ng-hide="vm.calls.rows.length">
+        <td md-cell colspan="4">
+          <div layout="row" layout-align="center center">
+            <span translate="VOICE.NO_AVAILABLE_INFO">No Available Info</span>
+          </div>
+        </td>
+      </tr>
+      <tr
+        md-row
+        ng-repeat="call in vm.calls.rows | filter: vm.query.filter | limitTo: vm.query.limit: (vm.query.page - 1) * vm.query.limit"
+      >
+        <td md-cell>
+          <i
+            ng-class="vm.channelStatus[call.channelstatedesc.toLowerCase()]"
+          ></i>
+        </td>
+        <td md-cell>
+          {{call.calleridname}}, {{call.calleridnum}}
+          <span class="text-boxed" ng-if="call.answered"
+            ><timer
+              ng-if="call.answertime"
+              start-time="call.answertime"
+              interval="1000"
+              >{{hhours}}:{{mminutes}}:{{sseconds}}</timer
+            ></span
+          >
+        </td>
+        <td md-cell>{{call.exten}}</td>
+        <td md-cell>
+          <span
+            class="text-boxed"
+            ng-if="call.channelstatedesc.toLowerCase() !== 'hangup'"
+          >
+            <timer
+              ng-if="call.starttime"
+              start-time="call.starttime"
+              interval="1000"
+              >{{hhours}}:{{mminutes}}:{{sseconds}}</timer
+            >
+          </span>
+          <span
+            class="text-boxed"
+            ng-if="call.channelstatedesc.toLowerCase() === 'hangup'"
+            translate="VOICE.CLOSING"
+            >Closing</span
+          >
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</md-table-container>
+
+<md-table-pagination
+  md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
+  md-limit="vm.query.limit"
+  md-limit-options="[10, 15, 20, 50, 100, 250]"
+  md-page="vm.query.page"
+  md-total="{{vm.calls.count}}"
+></md-table-pagination>
+<!-- / OUTBOUNDS TABLE -->
+<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/voice/views/realtime/queue_calls/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/realtime/queue_calls/view.html/view-[chunkhash].html
deleted file mode 100644
index 350815d..0000000
--- a/public/src/js/modules/main/apps/voice/views/realtime/queue_calls/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,135 +0,0 @@
-<!-- MAIN -->
-<md-toolbar class="md-table-toolbar md-default">
-  <div class="md-toolbar-tools">
-    <span class="md-subhead" translate="VOICE.QUEUE_CALLS">Queue Calls</span>
-    <!-- <div flex></div>
-    <ms-search-bar on-search="vm.query.filter = query;" on-collapse="vm.query.filter = undefined;" debounce="300"></ms-search-bar> -->
-  </div>
-</md-toolbar>
-
-<!-- QUEUES TABLE -->
-<md-table-container>
-  <table md-table>
-    <thead md-head>
-      <tr md-row>
-        <th md-column width="30px"></th>
-        <th md-column>{{ 'VOICE.DID' | translate }}</th>
-        <th md-column>{{ 'VOICE.QUEUE' | translate }}</th>
-        <th md-column>{{ 'VOICE.CALLER' | translate }}</th>
-        <th md-column>{{ 'VOICE.AGENT' | translate }}</th>
-        <th md-column>{{ 'VOICE.DURATION' | translate }}</th>
-        <th md-column width="10px"></th>
-      </tr>
-    </thead>
-    <tbody md-body>
-      <tr md-row ng-hide="vm.getSize(vm.rpcVoiceQueuesChannels)">
-        <td md-cell colspan="6">
-          <div layout="row" layout-align="center center">
-            <span translate="VOICE.NO_AVAILABLE_INFO">No Available Info</span>
-          </div>
-        </td>
-      </tr>
-      <tr
-        md-row
-        ng-repeat="(key, channel) in vm.rpcVoiceQueuesChannels | limitObjectFromTo: vm.queryChannels.limit:(vm.queryChannels.page - 1) * vm.queryChannels.limit"
-      >
-        <td md-cell>
-          <md-icon
-            ng-if="channel.queuecallerleaveAt"
-            md-font-icon="icon-phone-in-talk green-fg"
-          ></md-icon>
-          <md-icon
-            ng-if="!channel.queuecallerleaveAt"
-            md-font-icon="icon-phone-incoming md-accent"
-          ></md-icon>
-        </td>
-        <td md-cell>{{channel.exten}}</td>
-        <td md-cell>{{channel.queue}}</td>
-        <td md-cell>{{channel.calleridnum}}</td>
-        <td md-cell>
-          <span ng-if="channel.queuecallerleaveAt">
-            {{channel.connectedlinename}}, {{channel.connectedlinenum}}
-            <span class="text-boxed">
-              <timer start-time="channel.queuecallerleaveAt" interval="1000"
-                >{{hhours}}:{{mminutes}}:{{sseconds}}</timer
-              >
-            </span>
-          </span>
-          <span ng-if="!channel.queuecallerleaveAt" class="text-boxed">
-            {{ 'VOICE.WAITING_FOR_AGENT' | translate }}
-            <timer start-time="channel.queuecallerjoinAt" interval="1000"
-              >{{hhours}}:{{mminutes}}:{{sseconds}}</timer
-            >
-          </span>
-        </td>
-        <td md-cell>
-          <span class="text-boxed">
-            <timer start-time="channel.queuecallerjoinAt" interval="1000"
-              >{{hhours}}:{{mminutes}}:{{sseconds}}</timer
-            >
-          </span>
-        </td>
-        <td md-cell class="actions" ng-if="vm.crudPermissions.canEdit">
-          <md-menu>
-            <md-button
-              class="md-icon-button"
-              aria-label="More"
-              translate
-              translate-attr-aria-label="STAFF.MORE"
-              ng-click="$mdMenu.open($event)"
-            >
-              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-            </md-button>
-
-            <md-menu-content width="2">
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.hangup(channel.uniqueid)"
-                  translate="VOICE.HANGUP"
-                >
-                  Hangup
-                </md-button>
-              </md-menu-item>
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.redirectToNumber($event, channel.uniqueid)"
-                  translate="VOICE.REDIRECT_TO_NUMBER"
-                >
-                  Number
-                </md-button>
-              </md-menu-item>
-              <md-menu-item>
-                <md-menu>
-                  <md-button
-                    ng-click="$mdMenu.open()"
-                    translate="VOICE.REDIRECT_TO_AGENT"
-                    >Redirect to Agent</md-button
-                  >
-                  <md-menu-content>
-                    <md-menu-item ng-repeat="agent in vm.agents.rows">
-                      <md-button
-                        ng-click="vm.redirectToAgent(channel.uniqueid, agent.name, agent.context)"
-                        >{{agent.name}}</md-button
-                      >
-                    </md-menu-item>
-                  </md-menu-content>
-                </md-menu>
-              </md-menu-item>
-            </md-menu-content>
-          </md-menu>
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</md-table-container>
-
-<md-table-pagination
-  md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
-  md-limit="vm.queryChannels.limit"
-  md-page="vm.queryChannels.page"
-  md-limit-options="[10, 15, 20, 50, 100, 250]"
-  md-total="{{vm.getSize(vm.rpcVoiceQueuesChannels)}}"
-  md-page-select
-></md-table-pagination>
-<!-- / QUEUES TABLE -->
-<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/voice/views/realtime/queue_calls/view.html/view.html b/public/src/js/modules/main/apps/voice/views/realtime/queue_calls/view.html/view.html
new file mode 100644
index 0000000..350815d
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/realtime/queue_calls/view.html/view.html
@@ -0,0 +1,135 @@
+<!-- MAIN -->
+<md-toolbar class="md-table-toolbar md-default">
+  <div class="md-toolbar-tools">
+    <span class="md-subhead" translate="VOICE.QUEUE_CALLS">Queue Calls</span>
+    <!-- <div flex></div>
+    <ms-search-bar on-search="vm.query.filter = query;" on-collapse="vm.query.filter = undefined;" debounce="300"></ms-search-bar> -->
+  </div>
+</md-toolbar>
+
+<!-- QUEUES TABLE -->
+<md-table-container>
+  <table md-table>
+    <thead md-head>
+      <tr md-row>
+        <th md-column width="30px"></th>
+        <th md-column>{{ 'VOICE.DID' | translate }}</th>
+        <th md-column>{{ 'VOICE.QUEUE' | translate }}</th>
+        <th md-column>{{ 'VOICE.CALLER' | translate }}</th>
+        <th md-column>{{ 'VOICE.AGENT' | translate }}</th>
+        <th md-column>{{ 'VOICE.DURATION' | translate }}</th>
+        <th md-column width="10px"></th>
+      </tr>
+    </thead>
+    <tbody md-body>
+      <tr md-row ng-hide="vm.getSize(vm.rpcVoiceQueuesChannels)">
+        <td md-cell colspan="6">
+          <div layout="row" layout-align="center center">
+            <span translate="VOICE.NO_AVAILABLE_INFO">No Available Info</span>
+          </div>
+        </td>
+      </tr>
+      <tr
+        md-row
+        ng-repeat="(key, channel) in vm.rpcVoiceQueuesChannels | limitObjectFromTo: vm.queryChannels.limit:(vm.queryChannels.page - 1) * vm.queryChannels.limit"
+      >
+        <td md-cell>
+          <md-icon
+            ng-if="channel.queuecallerleaveAt"
+            md-font-icon="icon-phone-in-talk green-fg"
+          ></md-icon>
+          <md-icon
+            ng-if="!channel.queuecallerleaveAt"
+            md-font-icon="icon-phone-incoming md-accent"
+          ></md-icon>
+        </td>
+        <td md-cell>{{channel.exten}}</td>
+        <td md-cell>{{channel.queue}}</td>
+        <td md-cell>{{channel.calleridnum}}</td>
+        <td md-cell>
+          <span ng-if="channel.queuecallerleaveAt">
+            {{channel.connectedlinename}}, {{channel.connectedlinenum}}
+            <span class="text-boxed">
+              <timer start-time="channel.queuecallerleaveAt" interval="1000"
+                >{{hhours}}:{{mminutes}}:{{sseconds}}</timer
+              >
+            </span>
+          </span>
+          <span ng-if="!channel.queuecallerleaveAt" class="text-boxed">
+            {{ 'VOICE.WAITING_FOR_AGENT' | translate }}
+            <timer start-time="channel.queuecallerjoinAt" interval="1000"
+              >{{hhours}}:{{mminutes}}:{{sseconds}}</timer
+            >
+          </span>
+        </td>
+        <td md-cell>
+          <span class="text-boxed">
+            <timer start-time="channel.queuecallerjoinAt" interval="1000"
+              >{{hhours}}:{{mminutes}}:{{sseconds}}</timer
+            >
+          </span>
+        </td>
+        <td md-cell class="actions" ng-if="vm.crudPermissions.canEdit">
+          <md-menu>
+            <md-button
+              class="md-icon-button"
+              aria-label="More"
+              translate
+              translate-attr-aria-label="STAFF.MORE"
+              ng-click="$mdMenu.open($event)"
+            >
+              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+            </md-button>
+
+            <md-menu-content width="2">
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.hangup(channel.uniqueid)"
+                  translate="VOICE.HANGUP"
+                >
+                  Hangup
+                </md-button>
+              </md-menu-item>
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.redirectToNumber($event, channel.uniqueid)"
+                  translate="VOICE.REDIRECT_TO_NUMBER"
+                >
+                  Number
+                </md-button>
+              </md-menu-item>
+              <md-menu-item>
+                <md-menu>
+                  <md-button
+                    ng-click="$mdMenu.open()"
+                    translate="VOICE.REDIRECT_TO_AGENT"
+                    >Redirect to Agent</md-button
+                  >
+                  <md-menu-content>
+                    <md-menu-item ng-repeat="agent in vm.agents.rows">
+                      <md-button
+                        ng-click="vm.redirectToAgent(channel.uniqueid, agent.name, agent.context)"
+                        >{{agent.name}}</md-button
+                      >
+                    </md-menu-item>
+                  </md-menu-content>
+                </md-menu>
+              </md-menu-item>
+            </md-menu-content>
+          </md-menu>
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</md-table-container>
+
+<md-table-pagination
+  md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
+  md-limit="vm.queryChannels.limit"
+  md-page="vm.queryChannels.page"
+  md-limit-options="[10, 15, 20, 50, 100, 250]"
+  md-total="{{vm.getSize(vm.rpcVoiceQueuesChannels)}}"
+  md-page-select
+></md-table-pagination>
+<!-- / QUEUES TABLE -->
+<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/voice/views/realtime/queue_params/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/realtime/queue_params/view.html/view-[chunkhash].html
deleted file mode 100644
index 4a2c00e..0000000
--- a/public/src/js/modules/main/apps/voice/views/realtime/queue_params/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,100 +0,0 @@
-<!-- MAIN -->
-<md-toolbar class="md-table-toolbar md-default">
-  <div class="md-toolbar-tools">
-    <span class="md-subhead" translate="MOTIONDIALER.QUEUE_PARAMETERS"
-      >Params</span
-    >
-    <div flex></div>
-    <ms-search-bar
-      on-search="vm.query.filter = query;"
-      on-collapse="vm.query.filter = undefined;"
-      debounce="300"
-    ></ms-search-bar>
-  </div>
-</md-toolbar>
-
-<!-- QUEUE TABLE -->
-<md-table-container>
-  <table md-table multiple md-progress="vm.promise">
-    <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getQueues">
-      <tr md-row>
-        <th md-column>{{' VOICE.NAME' | translate}}</th>
-        <th md-column>{{' VOICE.TOTAL_OFFERED' | translate}}</th>
-        <th md-column>{{' VOICE.ANSWERED' | translate}}</th>
-        <th md-column>{{' VOICE.ABANDONED' | translate}}</th>
-        <th md-column>{{' VOICE.UNMANAGED' | translate}}</th>
-        <th md-column>{{' VOICE.AVG_HOLD_TIME' | translate}}</th>
-        <th md-column>{{' VOICE.AVG_DURATION' | translate}}</th>
-        <th md-column>{{' VOICE.AVG_BILLABLE' | translate}}</th>
-      </tr>
-    </thead>
-    <tbody md-body>
-      <tr md-row ng-hide="vm.queues">
-        <td md-cell colspan="8">
-          <div layout="row" layout-align="center center">
-            <span translate="MOTIONDIALER.NO_AVAILABLE_INFO"
-              >No Available Info</span
-            >
-          </div>
-        </td>
-      </tr>
-      <tr md-row ng-repeat="(id, queue) in vm.queues">
-        <td md-cell>
-          <span>{{queue.name}}</span>
-        </td>
-        <td md-cell>
-          <!-- <span class="font-size-20 grey-fg">{{queue.total || 0}}</span> -->
-          <span class="font-size-20 grey-fg"
-            >{{ (queue.answered || 0) + (queue.abandoned || 0) +
-            (queue.unmanaged || 0) }}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-16 grey-fg"
-            >{{queue.answered || 0}} ({{(queue.total) ? (queue.answered || 0) *
-            100/queue.total : 0 | number:1}}%)</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-16 grey-fg"
-            >{{queue.abandoned || 0}} ({{(queue.total) ? (queue.abandoned || 0)
-            * 100/queue.total : 0 | number:1}}%)</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-16 grey-fg">{{queue.unmanaged || 0}}</span>
-        </td>
-        <td md-cell>
-          <span class="font-size-16 grey-fg"
-            >{{queue.total ? ((queue.sumHoldTime || 0) / queue.total) : 0 |
-            number: 0 | secToTime | date:'HH:mm:ss'}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-16 grey-fg"
-            >{{(queue.total ? ((queue.sumDuration || 0) / queue.total) : 0) |
-            number: 0 | secToTime | date:'HH:mm:ss'}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-16 grey-fg"
-            >{{queue.answered ? ((queue.sumBillable || 0) / queue.answered) : 0
-            | number: 0 | secToTime | date:'HH:mm:ss'}}</span
-          >
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</md-table-container>
-
-<md-table-pagination
-  md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
-  md-limit="vm.query.limit"
-  md-limit-options="[10, 15, 20, 50, 100, 250]"
-  md-page="vm.query.page"
-  md-total="{{vm.count}}"
-  md-on-paginate="vm.getQueues"
-  md-page-select
-></md-table-pagination>
-<!-- / QUEUE TABLE -->
-<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/voice/views/realtime/queue_params/view.html/view.html b/public/src/js/modules/main/apps/voice/views/realtime/queue_params/view.html/view.html
new file mode 100644
index 0000000..4a2c00e
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/realtime/queue_params/view.html/view.html
@@ -0,0 +1,100 @@
+<!-- MAIN -->
+<md-toolbar class="md-table-toolbar md-default">
+  <div class="md-toolbar-tools">
+    <span class="md-subhead" translate="MOTIONDIALER.QUEUE_PARAMETERS"
+      >Params</span
+    >
+    <div flex></div>
+    <ms-search-bar
+      on-search="vm.query.filter = query;"
+      on-collapse="vm.query.filter = undefined;"
+      debounce="300"
+    ></ms-search-bar>
+  </div>
+</md-toolbar>
+
+<!-- QUEUE TABLE -->
+<md-table-container>
+  <table md-table multiple md-progress="vm.promise">
+    <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getQueues">
+      <tr md-row>
+        <th md-column>{{' VOICE.NAME' | translate}}</th>
+        <th md-column>{{' VOICE.TOTAL_OFFERED' | translate}}</th>
+        <th md-column>{{' VOICE.ANSWERED' | translate}}</th>
+        <th md-column>{{' VOICE.ABANDONED' | translate}}</th>
+        <th md-column>{{' VOICE.UNMANAGED' | translate}}</th>
+        <th md-column>{{' VOICE.AVG_HOLD_TIME' | translate}}</th>
+        <th md-column>{{' VOICE.AVG_DURATION' | translate}}</th>
+        <th md-column>{{' VOICE.AVG_BILLABLE' | translate}}</th>
+      </tr>
+    </thead>
+    <tbody md-body>
+      <tr md-row ng-hide="vm.queues">
+        <td md-cell colspan="8">
+          <div layout="row" layout-align="center center">
+            <span translate="MOTIONDIALER.NO_AVAILABLE_INFO"
+              >No Available Info</span
+            >
+          </div>
+        </td>
+      </tr>
+      <tr md-row ng-repeat="(id, queue) in vm.queues">
+        <td md-cell>
+          <span>{{queue.name}}</span>
+        </td>
+        <td md-cell>
+          <!-- <span class="font-size-20 grey-fg">{{queue.total || 0}}</span> -->
+          <span class="font-size-20 grey-fg"
+            >{{ (queue.answered || 0) + (queue.abandoned || 0) +
+            (queue.unmanaged || 0) }}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-16 grey-fg"
+            >{{queue.answered || 0}} ({{(queue.total) ? (queue.answered || 0) *
+            100/queue.total : 0 | number:1}}%)</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-16 grey-fg"
+            >{{queue.abandoned || 0}} ({{(queue.total) ? (queue.abandoned || 0)
+            * 100/queue.total : 0 | number:1}}%)</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-16 grey-fg">{{queue.unmanaged || 0}}</span>
+        </td>
+        <td md-cell>
+          <span class="font-size-16 grey-fg"
+            >{{queue.total ? ((queue.sumHoldTime || 0) / queue.total) : 0 |
+            number: 0 | secToTime | date:'HH:mm:ss'}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-16 grey-fg"
+            >{{(queue.total ? ((queue.sumDuration || 0) / queue.total) : 0) |
+            number: 0 | secToTime | date:'HH:mm:ss'}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-16 grey-fg"
+            >{{queue.answered ? ((queue.sumBillable || 0) / queue.answered) : 0
+            | number: 0 | secToTime | date:'HH:mm:ss'}}</span
+          >
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</md-table-container>
+
+<md-table-pagination
+  md-label="{page: '{{'MOTIONDIALER.PAGE' | translate}}:', rowsPerPage: '{{'MOTIONDIALER.ROWSPERPAGE' | translate}}:', of: '{{'MOTIONDIALER.OF' | translate}}'}"
+  md-limit="vm.query.limit"
+  md-limit-options="[10, 15, 20, 50, 100, 250]"
+  md-page="vm.query.page"
+  md-total="{{vm.count}}"
+  md-on-paginate="vm.getQueues"
+  md-page-select
+></md-table-pagination>
+<!-- / QUEUE TABLE -->
+<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/voice/views/realtime/queues/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/realtime/queues/view.html/view-[chunkhash].html
deleted file mode 100644
index 3065fd0..0000000
--- a/public/src/js/modules/main/apps/voice/views/realtime/queues/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,116 +0,0 @@
-<!-- MAIN -->
-<md-toolbar class="md-table-toolbar md-default">
-  <div class="md-toolbar-tools">
-    <span class="md-subhead" translate="VOICE.QUEUES">Queues</span>
-    <div flex></div>
-    <ms-search-bar
-      on-search="vm.query.filter = query;"
-      on-collapse="vm.query.filter = undefined;"
-      debounce="300"
-    ></ms-search-bar>
-  </div>
-</md-toolbar>
-
-<!-- QUEUE TABLE -->
-<md-table-container>
-  <table md-table multiple md-progress="vm.promise">
-    <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getQueues">
-      <tr md-row>
-        <th md-column md-order-by="name">{{ 'VOICE.NAME' | translate }}</th>
-        <th md-column>{{ 'VOICE.LOGGED_IN' | translate }}</th>
-        <th md-column>{{ 'VOICE.PAUSED' | translate }}</th>
-        <th md-column>{{ 'VOICE.READY' | translate }}</th>
-        <th md-column>{{ 'VOICE.WAITING' | translate }}</th>
-        <th md-column>{{ 'VOICE.TALKING' | translate }}</th>
-        <th md-column width="10px"></th>
-      </tr>
-    </thead>
-    <tbody md-body>
-      <tr md-row ng-hide="vm.queues">
-        <td md-cell colspan="7">
-          <div layout="row" layout-align="center center">
-            <span translate="VOICE.NO_AVAILABLE_INFO">No Available Info</span>
-          </div>
-        </td>
-      </tr>
-      <tr
-        md-row
-        md-select="vm.queues[value]"
-        md-select-id="id"
-        ng-repeat="(id, value) in vm.order"
-      >
-        <td md-cell>{{vm.queues[value].name}}</td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{vm.queues[value].loggedInDb || 0}} ({{vm.queues[value].loggedIn
-            || 0}})</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{vm.queues[value].paused || 0}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-16 grey-fg"
-            >{{vm.queues[value].available || 0}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{vm.queues[value].waiting || 0}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-16 grey-fg"
-            >{{(vm.queues[value].talking || 0) }}</span
-          >
-        </td>
-        <td md-cell class="actions" ng-if="vm.crudPermissions.canEdit">
-          <md-menu>
-            <md-button
-              class="md-icon-button"
-              aria-label="More"
-              translate
-              translate-attr-aria-label="VOICE.MORE"
-              ng-click="$mdMenu.open($event)"
-            >
-              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-            </md-button>
-
-            <md-menu-content width="3">
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.createOrEditVoiceQueue($event, vm.queues[value])"
-                  translate="VOICE.EDIT_QUEUE"
-                >
-                  Edit Queue
-                </md-button>
-              </md-menu-item>
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.agentAdd($event, vm.queues[value])"
-                  translate="VOICE.AGENTSADD_QUEUE"
-                >
-                  Add Agents to queue
-                </md-button>
-              </md-menu-item>
-            </md-menu-content>
-          </md-menu>
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</md-table-container>
-
-<md-table-pagination
-  md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
-  md-limit="vm.query.limit"
-  md-limit-options="[10, 15, 20, 50, 100, 250]"
-  md-page="vm.query.page"
-  md-total="{{vm.count}}"
-  md-on-paginate="vm.getQueues"
-  md-page-select
-></md-table-pagination>
-<!-- / QUEUE TABLE -->
-<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/voice/views/realtime/queues/view.html/view.html b/public/src/js/modules/main/apps/voice/views/realtime/queues/view.html/view.html
new file mode 100644
index 0000000..3065fd0
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/realtime/queues/view.html/view.html
@@ -0,0 +1,116 @@
+<!-- MAIN -->
+<md-toolbar class="md-table-toolbar md-default">
+  <div class="md-toolbar-tools">
+    <span class="md-subhead" translate="VOICE.QUEUES">Queues</span>
+    <div flex></div>
+    <ms-search-bar
+      on-search="vm.query.filter = query;"
+      on-collapse="vm.query.filter = undefined;"
+      debounce="300"
+    ></ms-search-bar>
+  </div>
+</md-toolbar>
+
+<!-- QUEUE TABLE -->
+<md-table-container>
+  <table md-table multiple md-progress="vm.promise">
+    <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getQueues">
+      <tr md-row>
+        <th md-column md-order-by="name">{{ 'VOICE.NAME' | translate }}</th>
+        <th md-column>{{ 'VOICE.LOGGED_IN' | translate }}</th>
+        <th md-column>{{ 'VOICE.PAUSED' | translate }}</th>
+        <th md-column>{{ 'VOICE.READY' | translate }}</th>
+        <th md-column>{{ 'VOICE.WAITING' | translate }}</th>
+        <th md-column>{{ 'VOICE.TALKING' | translate }}</th>
+        <th md-column width="10px"></th>
+      </tr>
+    </thead>
+    <tbody md-body>
+      <tr md-row ng-hide="vm.queues">
+        <td md-cell colspan="7">
+          <div layout="row" layout-align="center center">
+            <span translate="VOICE.NO_AVAILABLE_INFO">No Available Info</span>
+          </div>
+        </td>
+      </tr>
+      <tr
+        md-row
+        md-select="vm.queues[value]"
+        md-select-id="id"
+        ng-repeat="(id, value) in vm.order"
+      >
+        <td md-cell>{{vm.queues[value].name}}</td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{vm.queues[value].loggedInDb || 0}} ({{vm.queues[value].loggedIn
+            || 0}})</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{vm.queues[value].paused || 0}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-16 grey-fg"
+            >{{vm.queues[value].available || 0}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{vm.queues[value].waiting || 0}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-16 grey-fg"
+            >{{(vm.queues[value].talking || 0) }}</span
+          >
+        </td>
+        <td md-cell class="actions" ng-if="vm.crudPermissions.canEdit">
+          <md-menu>
+            <md-button
+              class="md-icon-button"
+              aria-label="More"
+              translate
+              translate-attr-aria-label="VOICE.MORE"
+              ng-click="$mdMenu.open($event)"
+            >
+              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+            </md-button>
+
+            <md-menu-content width="3">
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.createOrEditVoiceQueue($event, vm.queues[value])"
+                  translate="VOICE.EDIT_QUEUE"
+                >
+                  Edit Queue
+                </md-button>
+              </md-menu-item>
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.agentAdd($event, vm.queues[value])"
+                  translate="VOICE.AGENTSADD_QUEUE"
+                >
+                  Add Agents to queue
+                </md-button>
+              </md-menu-item>
+            </md-menu-content>
+          </md-menu>
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</md-table-container>
+
+<md-table-pagination
+  md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
+  md-limit="vm.query.limit"
+  md-limit-options="[10, 15, 20, 50, 100, 250]"
+  md-page="vm.query.page"
+  md-total="{{vm.count}}"
+  md-on-paginate="vm.getQueues"
+  md-page-select
+></md-table-pagination>
+<!-- / QUEUE TABLE -->
+<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/voice/views/realtime/realtime.html/realtime-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/realtime/realtime.html/realtime-[chunkhash].html
deleted file mode 100644
index a5e17e8..0000000
--- a/public/src/js/modules/main/apps/voice/views/realtime/realtime.html/realtime-[chunkhash].html
+++ /dev/null
@@ -1,56 +0,0 @@
-<div id="realtime" class="page-layout simple tabbed" layout="column" ng-cloak>
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="VOICE.AGENTS">Agents</span>
-        </md-tab-label>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="VOICE.TELEPHONES">Telephones</span>
-        </md-tab-label>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="VOICE.TRUNKS">Trunks</span>
-        </md-tab-label>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="VOICE.QUEUES">Queues</span>
-        </md-tab-label>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="VOICE.QUEUE_CALLS">Queue Calls</span>
-        </md-tab-label>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="VOICE.ABANDONEDCALLS">Abandoned Queue Calls</span>
-        </md-tab-label>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="VOICE.QUEUE_PARAMS">Queue Parameters</span>
-        </md-tab-label>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="VOICE.OUTBOUND_CALLS">Outbound Calls</span>
-        </md-tab-label>
-      </md-tab>
-    </md-tabs>
-
-    <md-card ui-view></md-card>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/voice/views/realtime/realtime.html/realtime.html b/public/src/js/modules/main/apps/voice/views/realtime/realtime.html/realtime.html
new file mode 100644
index 0000000..a5e17e8
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/realtime/realtime.html/realtime.html
@@ -0,0 +1,56 @@
+<div id="realtime" class="page-layout simple tabbed" layout="column" ng-cloak>
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="VOICE.AGENTS">Agents</span>
+        </md-tab-label>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="VOICE.TELEPHONES">Telephones</span>
+        </md-tab-label>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="VOICE.TRUNKS">Trunks</span>
+        </md-tab-label>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="VOICE.QUEUES">Queues</span>
+        </md-tab-label>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="VOICE.QUEUE_CALLS">Queue Calls</span>
+        </md-tab-label>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="VOICE.ABANDONEDCALLS">Abandoned Queue Calls</span>
+        </md-tab-label>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="VOICE.QUEUE_PARAMS">Queue Parameters</span>
+        </md-tab-label>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="VOICE.OUTBOUND_CALLS">Outbound Calls</span>
+        </md-tab-label>
+      </md-tab>
+    </md-tabs>
+
+    <md-card ui-view></md-card>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/voice/views/realtime/telephones/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/realtime/telephones/view.html/view-[chunkhash].html
deleted file mode 100644
index c181172..0000000
--- a/public/src/js/modules/main/apps/voice/views/realtime/telephones/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,84 +0,0 @@
-<!-- MAIN -->
-<md-toolbar class="md-table-toolbar md-default">
-  <div class="md-toolbar-tools">
-    <span class="md-subhead" translate="VOICE.TELEPHONES">Telephones</span>
-    <div flex></div>
-    <ms-search-bar
-      on-search="vm.query.filter = query;"
-      on-collapse="vm.query.filter = undefined;"
-      debounce="300"
-    ></ms-search-bar>
-    <!-- <md-button class="md-icon-button" ng-click="vm.showInfo($event)">
-            <i class="icon-information-outline grey-600-fg">
-              <md-tooltip>{{'VOICE.INFO' | translate}}</md-tooltip>
-            </i>
-        </md-button> -->
-  </div>
-</md-toolbar>
-
-<!-- AGENT TABLE -->
-<md-table-container>
-  <table md-table multiple md-progress="vm.promise">
-    <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getTelephones">
-      <tr md-row>
-        <th md-column md-order-by="fullname">
-          {{ 'VOICE.ACCOUNTNAME' | translate }}
-        </th>
-        <th md-column md-order-by="internal">
-          {{ 'VOICE.INTERNAL' | translate }}
-        </th>
-        <th md-column>{{ 'VOICE.PHONE_STATE' | translate }}</th>
-        <th md-column>{{ 'VOICE.PHONE_STATUS' | translate }}</th>
-      </tr>
-    </thead>
-    <tbody md-body>
-      <tr md-row ng-hide="vm.telephones">
-        <td md-cell colspan="4">
-          <div layout="row" layout-align="center center">
-            <span translate="VOICE.NO_AVAILABLE_INFO">No Available Info</span>
-          </div>
-        </td>
-      </tr>
-      <tr
-        md-row
-        md-select="telephone"
-        md-select-id="id"
-        ng-repeat="(id, telephone) in vm.telephones"
-      >
-        <td md-cell>{{telephone.fullname}}</td>
-        <td md-cell>{{telephone.internal}}</td>
-        <td md-cell>
-          <i ng-class="vm.stateClass[telephone.state]">
-            <md-tooltip
-              >{{'VOICE.' + telephone.state | uppercase |
-              translate}}</md-tooltip
-            >
-          </i>
-        </td>
-        <td md-cell>
-          <i ng-class="vm.statusClass[telephone.status]">
-            <md-tooltip
-              >{{'VOICE.' + telephone.status | uppercase |
-              translate}}</md-tooltip
-            >
-          </i>
-          <span ng-if="telephone.status === 'registered'" class="text-boxed"
-            >{{telephone.address}}</span
-          >
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</md-table-container>
-
-<md-table-pagination
-  md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
-  md-limit="vm.query.limit"
-  md-limit-options="[10, 15, 20, 50, 100, 250]"
-  md-page="vm.query.page"
-  md-total="{{vm.count}}"
-  md-on-paginate="vm.getTelephones"
-  md-page-select
-></md-table-pagination>
-<!-- / AGENT TABLE -->
-<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/voice/views/realtime/telephones/view.html/view.html b/public/src/js/modules/main/apps/voice/views/realtime/telephones/view.html/view.html
new file mode 100644
index 0000000..c181172
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/realtime/telephones/view.html/view.html
@@ -0,0 +1,84 @@
+<!-- MAIN -->
+<md-toolbar class="md-table-toolbar md-default">
+  <div class="md-toolbar-tools">
+    <span class="md-subhead" translate="VOICE.TELEPHONES">Telephones</span>
+    <div flex></div>
+    <ms-search-bar
+      on-search="vm.query.filter = query;"
+      on-collapse="vm.query.filter = undefined;"
+      debounce="300"
+    ></ms-search-bar>
+    <!-- <md-button class="md-icon-button" ng-click="vm.showInfo($event)">
+            <i class="icon-information-outline grey-600-fg">
+              <md-tooltip>{{'VOICE.INFO' | translate}}</md-tooltip>
+            </i>
+        </md-button> -->
+  </div>
+</md-toolbar>
+
+<!-- AGENT TABLE -->
+<md-table-container>
+  <table md-table multiple md-progress="vm.promise">
+    <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getTelephones">
+      <tr md-row>
+        <th md-column md-order-by="fullname">
+          {{ 'VOICE.ACCOUNTNAME' | translate }}
+        </th>
+        <th md-column md-order-by="internal">
+          {{ 'VOICE.INTERNAL' | translate }}
+        </th>
+        <th md-column>{{ 'VOICE.PHONE_STATE' | translate }}</th>
+        <th md-column>{{ 'VOICE.PHONE_STATUS' | translate }}</th>
+      </tr>
+    </thead>
+    <tbody md-body>
+      <tr md-row ng-hide="vm.telephones">
+        <td md-cell colspan="4">
+          <div layout="row" layout-align="center center">
+            <span translate="VOICE.NO_AVAILABLE_INFO">No Available Info</span>
+          </div>
+        </td>
+      </tr>
+      <tr
+        md-row
+        md-select="telephone"
+        md-select-id="id"
+        ng-repeat="(id, telephone) in vm.telephones"
+      >
+        <td md-cell>{{telephone.fullname}}</td>
+        <td md-cell>{{telephone.internal}}</td>
+        <td md-cell>
+          <i ng-class="vm.stateClass[telephone.state]">
+            <md-tooltip
+              >{{'VOICE.' + telephone.state | uppercase |
+              translate}}</md-tooltip
+            >
+          </i>
+        </td>
+        <td md-cell>
+          <i ng-class="vm.statusClass[telephone.status]">
+            <md-tooltip
+              >{{'VOICE.' + telephone.status | uppercase |
+              translate}}</md-tooltip
+            >
+          </i>
+          <span ng-if="telephone.status === 'registered'" class="text-boxed"
+            >{{telephone.address}}</span
+          >
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</md-table-container>
+
+<md-table-pagination
+  md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
+  md-limit="vm.query.limit"
+  md-limit-options="[10, 15, 20, 50, 100, 250]"
+  md-page="vm.query.page"
+  md-total="{{vm.count}}"
+  md-on-paginate="vm.getTelephones"
+  md-page-select
+></md-table-pagination>
+<!-- / AGENT TABLE -->
+<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/voice/views/realtime/trunks/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/realtime/trunks/view.html/view-[chunkhash].html
deleted file mode 100644
index 3467fda..0000000
--- a/public/src/js/modules/main/apps/voice/views/realtime/trunks/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,111 +0,0 @@
-<!-- MAIN -->
-<md-toolbar class="md-table-toolbar md-default">
-  <div class="md-toolbar-tools">
-    <span class="md-subhead" translate="VOICE.TRUNKS">Telephones</span>
-    <div flex></div>
-    <ms-search-bar
-      on-search="vm.query.filter = query;"
-      on-collapse="vm.query.filter = undefined;"
-      debounce="300"
-    ></ms-search-bar>
-    <!-- <md-button class="md-icon-button" ng-click="vm.showInfo($event)">
-      <i class="icon-information-outline grey-600-fg">
-        <md-tooltip>{{'FAX.INFO' | translate}}</md-tooltip>
-      </i>
-    </md-button> -->
-  </div>
-</md-toolbar>
-
-<!-- TRUNKS TABLE -->
-<md-table-container>
-  <table md-table multiple md-progress="vm.promise">
-    <thead md-head>
-      <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getTrunks">
-        <tr md-row>
-          <th md-column md-order-by="name">{{ 'VOICE.NAME' | translate }}</th>
-          <th md-column>{{ 'VOICE.TRUNK_STATUS' | translate }}</th>
-          <th md-column>{{ 'VOICE.REGISTRY' | translate }}</th>
-          <th md-column width="10px"></th>
-        </tr>
-      </thead>
-    </thead>
-
-    <tbody md-body>
-      <tr md-row ng-hide="vm.trunks">
-        <td md-cell colspan="3">
-          <div layout="row" layout-align="center center">
-            <span translate="VOICE.NO_AVAILABLE_INFO">No Available Info</span>
-          </div>
-        </td>
-      </tr>
-      <tr md-row ng-repeat="(id, trunk) in vm.trunks">
-        <td md-cell>{{trunk.name}}</td>
-        <td md-cell>
-          <i ng-class="vm.statusClass[trunk.status.toLowerCase()]">
-            <md-tooltip
-              >{{'VOICE.' + trunk.status | uppercase | translate}}</md-tooltip
-            >
-          </i>
-          <span ng-if="trunk.status === 'registered'" class="text-boxed"
-            >{{trunk.address}}</span
-          >
-        </td>
-        <td md-cell>
-          <i
-            ng-if="trunk.registry"
-            ng-class="(trunk.stateRegistry.toLowerCase() === 'registered') ? 'green-300-fg icon-checkbox-marked-circle' : 'red-300-fg icon-close-circle'"
-          >
-            <md-tooltip
-              >{{'VOICE.' + trunk.stateRegistry | uppercase |
-              translate}}</md-tooltip
-            >
-          </i>
-          <span
-            ng-if="trunk.registry && trunk.host && trunk.port"
-            class="text-boxed"
-            >{{trunk.host}}:{{trunk.port}}</span
-          >
-          <span ng-if="!trunk.registry" translate="VOICE.NO_REGISTRY">
-            No Registry
-          </span>
-        </td>
-        <td md-cell class="actions" ng-if="vm.crudPermissions.canEdit">
-          <md-menu>
-            <md-button
-              class="md-icon-button"
-              aria-label="More"
-              translate
-              translate-attr-aria-label="STAFF.MORE"
-              ng-click="$mdMenu.open($event)"
-            >
-              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-            </md-button>
-
-            <md-menu-content width="4">
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.goToTrunk($event, trunk)"
-                  translate="VOICE.EDIT_TRUNK"
-                >
-                  Edit Trunk
-                </md-button>
-              </md-menu-item>
-            </md-menu-content>
-          </md-menu>
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</md-table-container>
-
-<md-table-pagination
-  md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
-  md-limit="vm.query.limit"
-  md-limit-options="[10, 15, 20, 50, 100, 250]"
-  md-page="vm.query.page"
-  md-total="{{vm.count}}"
-  md-on-paginate="vm.getTrunks"
-  md-page-select
-></md-table-pagination>
-<!-- / TRUNKS TABLE -->
-<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/voice/views/realtime/trunks/view.html/view.html b/public/src/js/modules/main/apps/voice/views/realtime/trunks/view.html/view.html
new file mode 100644
index 0000000..3467fda
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/realtime/trunks/view.html/view.html
@@ -0,0 +1,111 @@
+<!-- MAIN -->
+<md-toolbar class="md-table-toolbar md-default">
+  <div class="md-toolbar-tools">
+    <span class="md-subhead" translate="VOICE.TRUNKS">Telephones</span>
+    <div flex></div>
+    <ms-search-bar
+      on-search="vm.query.filter = query;"
+      on-collapse="vm.query.filter = undefined;"
+      debounce="300"
+    ></ms-search-bar>
+    <!-- <md-button class="md-icon-button" ng-click="vm.showInfo($event)">
+      <i class="icon-information-outline grey-600-fg">
+        <md-tooltip>{{'FAX.INFO' | translate}}</md-tooltip>
+      </i>
+    </md-button> -->
+  </div>
+</md-toolbar>
+
+<!-- TRUNKS TABLE -->
+<md-table-container>
+  <table md-table multiple md-progress="vm.promise">
+    <thead md-head>
+      <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getTrunks">
+        <tr md-row>
+          <th md-column md-order-by="name">{{ 'VOICE.NAME' | translate }}</th>
+          <th md-column>{{ 'VOICE.TRUNK_STATUS' | translate }}</th>
+          <th md-column>{{ 'VOICE.REGISTRY' | translate }}</th>
+          <th md-column width="10px"></th>
+        </tr>
+      </thead>
+    </thead>
+
+    <tbody md-body>
+      <tr md-row ng-hide="vm.trunks">
+        <td md-cell colspan="3">
+          <div layout="row" layout-align="center center">
+            <span translate="VOICE.NO_AVAILABLE_INFO">No Available Info</span>
+          </div>
+        </td>
+      </tr>
+      <tr md-row ng-repeat="(id, trunk) in vm.trunks">
+        <td md-cell>{{trunk.name}}</td>
+        <td md-cell>
+          <i ng-class="vm.statusClass[trunk.status.toLowerCase()]">
+            <md-tooltip
+              >{{'VOICE.' + trunk.status | uppercase | translate}}</md-tooltip
+            >
+          </i>
+          <span ng-if="trunk.status === 'registered'" class="text-boxed"
+            >{{trunk.address}}</span
+          >
+        </td>
+        <td md-cell>
+          <i
+            ng-if="trunk.registry"
+            ng-class="(trunk.stateRegistry.toLowerCase() === 'registered') ? 'green-300-fg icon-checkbox-marked-circle' : 'red-300-fg icon-close-circle'"
+          >
+            <md-tooltip
+              >{{'VOICE.' + trunk.stateRegistry | uppercase |
+              translate}}</md-tooltip
+            >
+          </i>
+          <span
+            ng-if="trunk.registry && trunk.host && trunk.port"
+            class="text-boxed"
+            >{{trunk.host}}:{{trunk.port}}</span
+          >
+          <span ng-if="!trunk.registry" translate="VOICE.NO_REGISTRY">
+            No Registry
+          </span>
+        </td>
+        <td md-cell class="actions" ng-if="vm.crudPermissions.canEdit">
+          <md-menu>
+            <md-button
+              class="md-icon-button"
+              aria-label="More"
+              translate
+              translate-attr-aria-label="STAFF.MORE"
+              ng-click="$mdMenu.open($event)"
+            >
+              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+            </md-button>
+
+            <md-menu-content width="4">
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.goToTrunk($event, trunk)"
+                  translate="VOICE.EDIT_TRUNK"
+                >
+                  Edit Trunk
+                </md-button>
+              </md-menu-item>
+            </md-menu-content>
+          </md-menu>
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</md-table-container>
+
+<md-table-pagination
+  md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
+  md-limit="vm.query.limit"
+  md-limit-options="[10, 15, 20, 50, 100, 250]"
+  md-page="vm.query.page"
+  md-total="{{vm.count}}"
+  md-on-paginate="vm.getTrunks"
+  md-page-select
+></md-table-pagination>
+<!-- / TRUNKS TABLE -->
+<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/voice/views/voicePrefixes/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/voicePrefixes/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 5b4ecf7..0000000
--- a/public/src/js/modules/main/apps/voice/views/voicePrefixes/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,216 +0,0 @@
-<md-dialog class="voicePrefix-dialog" aria-label="New voicePrefix">
-  <form name="voicePrefixForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.voicePrefix.name"
-          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-          ng-required="true"
-          autofocus
-        />
-
-        <div class="hint"><span translate="VOICE.HELP.NAME"></span></div>
-        <div
-          ng-messages="voicePrefixForm['name'].$error"
-          ng-show="voicePrefixForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span
-              translate="VOICE.ERRORS.NAME_MUST_VALID_PATTERN"
-              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-              >Name must be valid pattern
-            </span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.OUTBOUNDROUTE">OutboundRoute</label>
-        <md-select
-          name="VoiceExtensionId"
-          ng-model="vm.voicePrefix.VoiceExtensionId"
-          required
-        >
-          <md-option
-            ng-value="VoiceExtensionId.id"
-            ng-repeat="VoiceExtensionId in vm.outboundRoutes"
-            ng-disabled="VoiceExtensionId.canSelect === false"
-            >{{ VoiceExtensionId.exten }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="voicePrefixForm['VoiceExtensionId'].$error"
-          ng-show="voicePrefixForm['VoiceExtensionId'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.OUTBOUNDROUTE_REQUIRED"
-              >OutboundRoute field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.CALLERIDALL">CallerIdAll</label>
-        <input
-          type="text"
-          name="callerIdAll"
-          ng-model="vm.voicePrefix.callerIdAll"
-          ng-pattern='/"(.*)"\s&lt;(.*?)&gt;$/'
-        />
-
-        <div class="hint"><span translate="VOICE.HELP.CALLERIDALL"></span></div>
-        <div
-          ng-messages="voicePrefixForm['callerIdAll'].$error"
-          ng-show="voicePrefixForm['callerIdAll'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.CALLERIDALL_REQUIRED"
-              >CallerIdAll field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span
-              translate="VOICE.ERRORS.CALLERIDALL_MUST_VALID_PATTERN"
-              translate-values="{ regex: '/&quot;(.*)&quot;\s&lt;(.*?)&gt;$/' }"
-              >CallerIdAll must be valid pattern
-            </span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.voicePrefix.description"
-        />
-
-        <div
-          ng-messages="voicePrefixForm['description'].$error"
-          ng-show="voicePrefixForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newvoicePrefix"
-          ng-click="vm.savevoicePrefix()"
-          class="send-button md-accent md-raised"
-          ng-disabled="voicePrefixForm.$invalid || voicePrefixForm.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newvoicePrefix"
-          ng-click="vm.addNewvoicePrefix()"
-          class="send-button md-accent md-raised"
-          ng-disabled="voicePrefixForm.$invalid"
-          aria-label="ADD"
-          translate="VOICE.ADD_VOICEPREFIX"
-          translate-attr-aria-label="VOICE.ADD_VOICEPREFIX"
-        >
-          ADD VOICEPREFIX
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newvoicePrefix"
-          ng-click="vm.deletevoicePrefix($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="VOICE.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="VOICE.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/voicePrefixes/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/voicePrefixes/create/dialog.html/dialog.html
new file mode 100644
index 0000000..5b4ecf7
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/voicePrefixes/create/dialog.html/dialog.html
@@ -0,0 +1,216 @@
+<md-dialog class="voicePrefix-dialog" aria-label="New voicePrefix">
+  <form name="voicePrefixForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.voicePrefix.name"
+          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+          ng-required="true"
+          autofocus
+        />
+
+        <div class="hint"><span translate="VOICE.HELP.NAME"></span></div>
+        <div
+          ng-messages="voicePrefixForm['name'].$error"
+          ng-show="voicePrefixForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span
+              translate="VOICE.ERRORS.NAME_MUST_VALID_PATTERN"
+              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+              >Name must be valid pattern
+            </span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.OUTBOUNDROUTE">OutboundRoute</label>
+        <md-select
+          name="VoiceExtensionId"
+          ng-model="vm.voicePrefix.VoiceExtensionId"
+          required
+        >
+          <md-option
+            ng-value="VoiceExtensionId.id"
+            ng-repeat="VoiceExtensionId in vm.outboundRoutes"
+            ng-disabled="VoiceExtensionId.canSelect === false"
+            >{{ VoiceExtensionId.exten }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="voicePrefixForm['VoiceExtensionId'].$error"
+          ng-show="voicePrefixForm['VoiceExtensionId'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.OUTBOUNDROUTE_REQUIRED"
+              >OutboundRoute field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.CALLERIDALL">CallerIdAll</label>
+        <input
+          type="text"
+          name="callerIdAll"
+          ng-model="vm.voicePrefix.callerIdAll"
+          ng-pattern='/"(.*)"\s&lt;(.*?)&gt;$/'
+        />
+
+        <div class="hint"><span translate="VOICE.HELP.CALLERIDALL"></span></div>
+        <div
+          ng-messages="voicePrefixForm['callerIdAll'].$error"
+          ng-show="voicePrefixForm['callerIdAll'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.CALLERIDALL_REQUIRED"
+              >CallerIdAll field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span
+              translate="VOICE.ERRORS.CALLERIDALL_MUST_VALID_PATTERN"
+              translate-values="{ regex: '/&quot;(.*)&quot;\s&lt;(.*?)&gt;$/' }"
+              >CallerIdAll must be valid pattern
+            </span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.voicePrefix.description"
+        />
+
+        <div
+          ng-messages="voicePrefixForm['description'].$error"
+          ng-show="voicePrefixForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newvoicePrefix"
+          ng-click="vm.savevoicePrefix()"
+          class="send-button md-accent md-raised"
+          ng-disabled="voicePrefixForm.$invalid || voicePrefixForm.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newvoicePrefix"
+          ng-click="vm.addNewvoicePrefix()"
+          class="send-button md-accent md-raised"
+          ng-disabled="voicePrefixForm.$invalid"
+          aria-label="ADD"
+          translate="VOICE.ADD_VOICEPREFIX"
+          translate-attr-aria-label="VOICE.ADD_VOICEPREFIX"
+        >
+          ADD VOICEPREFIX
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newvoicePrefix"
+          ng-click="vm.deletevoicePrefix($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="VOICE.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="VOICE.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/voicePrefixes/edit/agentadd/agentadd.html/agentadd-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/voicePrefixes/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
deleted file mode 100644
index 5f50b8f..0000000
--- a/public/src/js/modules/main/apps/voice/views/voicePrefixes/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
+++ /dev/null
@@ -1,44 +0,0 @@
-<md-dialog
-  class="voicePrefix-dialog"
-  aria-label="voicePrefix"
-  ng-init="vm.onInit()"
->
-  <form name="voicePrefixForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="VOICE.AGENTADD_VOICEPREFIX">Add Agent to voicePrefix</h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <ms-dual-multiselect
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveAgents()"
-        class="send-button md-accent md-raised"
-        ng-disabled="!vm.pendingChanges"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/voicePrefixes/edit/agentadd/agentadd.html/agentadd.html b/public/src/js/modules/main/apps/voice/views/voicePrefixes/edit/agentadd/agentadd.html/agentadd.html
new file mode 100644
index 0000000..5f50b8f
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/voicePrefixes/edit/agentadd/agentadd.html/agentadd.html
@@ -0,0 +1,44 @@
+<md-dialog
+  class="voicePrefix-dialog"
+  aria-label="voicePrefix"
+  ng-init="vm.onInit()"
+>
+  <form name="voicePrefixForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="VOICE.AGENTADD_VOICEPREFIX">Add Agent to voicePrefix</h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <ms-dual-multiselect
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveAgents()"
+        class="send-button md-accent md-raised"
+        ng-disabled="!vm.pendingChanges"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/voicePrefixes/voicePrefixes.html/voicePrefixes-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/voicePrefixes/voicePrefixes.html/voicePrefixes-[chunkhash].html
deleted file mode 100644
index 0320a80..0000000
--- a/public/src/js/modules/main/apps/voice/views/voicePrefixes/voicePrefixes.html/voicePrefixes-[chunkhash].html
+++ /dev/null
@@ -1,329 +0,0 @@
-<div
-  id="voicePrefixes"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-phone" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="VOICE.VOICEPREFIXES"
-          >VoicePrefixes</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="VOICE.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedVoicePrefixes.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedVoicePrefixes =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="VOICE.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-voicePrefixes-count">
-          <span>{{vm.selectedVoicePrefixes.length}}</span>
-          <span translate="VOICE.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="VOICE.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllVoicePrefixes()"
-                translate="VOICE.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectVoicePrefixes()"
-                translate="VOICE.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedVoicePrefixes"
-          csv-label="true"
-          filename="voicePrefixes.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedVoicePrefixes($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="VOICE.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- VOICEPREFIX TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedVoicePrefixes"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getVoicePrefixes"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'VOICE.ID' | translate }}</th>
-                <th md-column md-order-by="name">
-                  {{ 'VOICE.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="VoiceExtensionId">
-                  {{ 'VOICE.OUTBOUNDROUTE' | translate }}
-                </th>
-                <th md-column md-order-by="callerIdAll">
-                  {{ 'VOICE.CALLERIDALL' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'VOICE.DESCRIPTION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.voicePrefixes.rows.length">
-                <td md-cell colspan="6">
-                  <div layout="row" layout-align="center center">
-                    <span translate="VOICE.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="voicePrefix"
-                md-select-id="id"
-                ng-repeat="voicePrefix in vm.voicePrefixes.rows"
-              >
-                <td md-cell ng-if="voicePrefix.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{voicePrefix.name}}"
-                    ng-src="api/users/{{voicePrefix.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!voicePrefix.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{voicePrefix.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.createOrEditvoicePrefix($event, voicePrefix)"
-                  md-cell
-                  class="id"
-                >
-                  {{voicePrefix.id}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditvoicePrefix($event, voicePrefix)"
-                  md-cell
-                  class="name"
-                >
-                  {{voicePrefix.name}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditvoicePrefix($event, voicePrefix)"
-                  md-cell
-                  class="VoiceExtensionId"
-                >
-                  {{ (vm.outboundRoutes | filter :
-                  {'id':voicePrefix.VoiceExtensionId} : true)[0].exten }}
-                </td>
-                <td
-                  ng-click="vm.createOrEditvoicePrefix($event, voicePrefix)"
-                  md-cell
-                  class="callerIdAll"
-                >
-                  {{voicePrefix.callerIdAll}}
-                </td>
-                <td
-                  ng-click="vm.createOrEditvoicePrefix($event, voicePrefix)"
-                  md-cell
-                  class="description"
-                >
-                  {{voicePrefix.description}}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="VOICE.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editdialog(voicePrefix, $event    )"
-                          translate="VOICE.EDIT_VOICEPREFIX"
-                        >
-                          Edit voicePrefix
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.agentadddialog(voicePrefix, $event    )"
-                          translate="VOICE.AGENTADD_VOICEPREFIX"
-                        >
-                          AgentAdd voicePrefix
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(voicePrefix, $event    )"
-                          translate="VOICE.DELETE_VOICEPREFIX"
-                        >
-                          Delete voicePrefix
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.voicePrefixes.count}}"
-          md-on-paginate="vm.getVoicePrefixes"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / VOICEPREFIX TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD VOICEPREFIX BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-voicePrefix-button"
-    ng-click="vm.createOrEditvoicePrefix($event)"
-    aria-label="add voicePrefix"
-    translate
-    translate-attr-aria-label="VOICE.ADD_VOICEPREFIX"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD VOICEPREFIX BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/voice/views/voicePrefixes/voicePrefixes.html/voicePrefixes.html b/public/src/js/modules/main/apps/voice/views/voicePrefixes/voicePrefixes.html/voicePrefixes.html
new file mode 100644
index 0000000..0320a80
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/voicePrefixes/voicePrefixes.html/voicePrefixes.html
@@ -0,0 +1,329 @@
+<div
+  id="voicePrefixes"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-phone" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="VOICE.VOICEPREFIXES"
+          >VoicePrefixes</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="VOICE.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedVoicePrefixes.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedVoicePrefixes =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="VOICE.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-voicePrefixes-count">
+          <span>{{vm.selectedVoicePrefixes.length}}</span>
+          <span translate="VOICE.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="VOICE.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllVoicePrefixes()"
+                translate="VOICE.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectVoicePrefixes()"
+                translate="VOICE.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedVoicePrefixes"
+          csv-label="true"
+          filename="voicePrefixes.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedVoicePrefixes($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="VOICE.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- VOICEPREFIX TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedVoicePrefixes"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getVoicePrefixes"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'VOICE.ID' | translate }}</th>
+                <th md-column md-order-by="name">
+                  {{ 'VOICE.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="VoiceExtensionId">
+                  {{ 'VOICE.OUTBOUNDROUTE' | translate }}
+                </th>
+                <th md-column md-order-by="callerIdAll">
+                  {{ 'VOICE.CALLERIDALL' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'VOICE.DESCRIPTION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.voicePrefixes.rows.length">
+                <td md-cell colspan="6">
+                  <div layout="row" layout-align="center center">
+                    <span translate="VOICE.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="voicePrefix"
+                md-select-id="id"
+                ng-repeat="voicePrefix in vm.voicePrefixes.rows"
+              >
+                <td md-cell ng-if="voicePrefix.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{voicePrefix.name}}"
+                    ng-src="api/users/{{voicePrefix.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!voicePrefix.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{voicePrefix.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.createOrEditvoicePrefix($event, voicePrefix)"
+                  md-cell
+                  class="id"
+                >
+                  {{voicePrefix.id}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditvoicePrefix($event, voicePrefix)"
+                  md-cell
+                  class="name"
+                >
+                  {{voicePrefix.name}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditvoicePrefix($event, voicePrefix)"
+                  md-cell
+                  class="VoiceExtensionId"
+                >
+                  {{ (vm.outboundRoutes | filter :
+                  {'id':voicePrefix.VoiceExtensionId} : true)[0].exten }}
+                </td>
+                <td
+                  ng-click="vm.createOrEditvoicePrefix($event, voicePrefix)"
+                  md-cell
+                  class="callerIdAll"
+                >
+                  {{voicePrefix.callerIdAll}}
+                </td>
+                <td
+                  ng-click="vm.createOrEditvoicePrefix($event, voicePrefix)"
+                  md-cell
+                  class="description"
+                >
+                  {{voicePrefix.description}}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="VOICE.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editdialog(voicePrefix, $event    )"
+                          translate="VOICE.EDIT_VOICEPREFIX"
+                        >
+                          Edit voicePrefix
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.agentadddialog(voicePrefix, $event    )"
+                          translate="VOICE.AGENTADD_VOICEPREFIX"
+                        >
+                          AgentAdd voicePrefix
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(voicePrefix, $event    )"
+                          translate="VOICE.DELETE_VOICEPREFIX"
+                        >
+                          Delete voicePrefix
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.voicePrefixes.count}}"
+          md-on-paginate="vm.getVoicePrefixes"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / VOICEPREFIX TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD VOICEPREFIX BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-voicePrefix-button"
+    ng-click="vm.createOrEditvoicePrefix($event)"
+    aria-label="add voicePrefix"
+    translate
+    translate-attr-aria-label="VOICE.ADD_VOICEPREFIX"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD VOICEPREFIX BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/voice/views/voiceQueues/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/voiceQueues/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 6baac09..0000000
--- a/public/src/js/modules/main/apps/voice/views/voiceQueues/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,185 +0,0 @@
-<md-dialog class="voiceQueue-dialog" aria-label="New VoiceQueue">
-  <form name="voiceQueueForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.voiceQueue.name"
-          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.newVoiceQueue"
-        />
-
-        <div class="hint"><span translate="VOICE.HELP.NAME"></span></div>
-        <div
-          ng-messages="voiceQueueForm['name'].$error"
-          ng-show="voiceQueueForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span
-              translate="VOICE.ERRORS.NAME_MUST_VALID_PATTERN"
-              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-              >Name must be valid pattern
-            </span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.STRATEGY">Strategy</label>
-        <md-select name="strategy" ng-model="vm.voiceQueue.strategy" required>
-          <md-option ng-value="'ringall'">Ringall</md-option>
-          <md-option ng-value="'rrmemory'">Round Robin Memory</md-option>
-          <md-option ng-value="'leastrecent'">Least Recent</md-option>
-          <md-option ng-value="'fewestcalls'">Fewest Calls</md-option>
-          <md-option ng-value="'random'">Random</md-option>
-          <md-option ng-value="'linear'">Linear</md-option>
-          <md-option ng-value="'wrandom'">Weight Random</md-option>
-        </md-select>
-        <div
-          ng-messages="voiceQueueForm['strategy'].$error"
-          ng-show="voiceQueueForm['strategy'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.STRATEGY_REQUIRED"
-              >Strategy field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.voiceQueue.description"
-        />
-
-        <div
-          ng-messages="voiceQueueForm['description'].$error"
-          ng-show="voiceQueueForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newVoiceQueue"
-          ng-click="vm.saveVoiceQueue()"
-          class="send-button md-accent md-raised"
-          ng-disabled="voiceQueueForm.$invalid || voiceQueueForm.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newVoiceQueue"
-          ng-click="vm.addNewVoiceQueue()"
-          class="send-button md-accent md-raised"
-          ng-disabled="voiceQueueForm.$invalid"
-          aria-label="ADD"
-          translate="VOICE.ADD_VOICEQUEUE"
-          translate-attr-aria-label="VOICE.ADD_VOICEQUEUE"
-        >
-          ADD VOICEQUEUE
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newVoiceQueue"
-          ng-click="vm.deleteVoiceQueue($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="VOICE.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="VOICE.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/voiceQueues/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/voiceQueues/create/dialog.html/dialog.html
new file mode 100644
index 0000000..6baac09
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/voiceQueues/create/dialog.html/dialog.html
@@ -0,0 +1,185 @@
+<md-dialog class="voiceQueue-dialog" aria-label="New VoiceQueue">
+  <form name="voiceQueueForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.voiceQueue.name"
+          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.newVoiceQueue"
+        />
+
+        <div class="hint"><span translate="VOICE.HELP.NAME"></span></div>
+        <div
+          ng-messages="voiceQueueForm['name'].$error"
+          ng-show="voiceQueueForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span
+              translate="VOICE.ERRORS.NAME_MUST_VALID_PATTERN"
+              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+              >Name must be valid pattern
+            </span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.STRATEGY">Strategy</label>
+        <md-select name="strategy" ng-model="vm.voiceQueue.strategy" required>
+          <md-option ng-value="'ringall'">Ringall</md-option>
+          <md-option ng-value="'rrmemory'">Round Robin Memory</md-option>
+          <md-option ng-value="'leastrecent'">Least Recent</md-option>
+          <md-option ng-value="'fewestcalls'">Fewest Calls</md-option>
+          <md-option ng-value="'random'">Random</md-option>
+          <md-option ng-value="'linear'">Linear</md-option>
+          <md-option ng-value="'wrandom'">Weight Random</md-option>
+        </md-select>
+        <div
+          ng-messages="voiceQueueForm['strategy'].$error"
+          ng-show="voiceQueueForm['strategy'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.STRATEGY_REQUIRED"
+              >Strategy field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.voiceQueue.description"
+        />
+
+        <div
+          ng-messages="voiceQueueForm['description'].$error"
+          ng-show="voiceQueueForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newVoiceQueue"
+          ng-click="vm.saveVoiceQueue()"
+          class="send-button md-accent md-raised"
+          ng-disabled="voiceQueueForm.$invalid || voiceQueueForm.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newVoiceQueue"
+          ng-click="vm.addNewVoiceQueue()"
+          class="send-button md-accent md-raised"
+          ng-disabled="voiceQueueForm.$invalid"
+          aria-label="ADD"
+          translate="VOICE.ADD_VOICEQUEUE"
+          translate-attr-aria-label="VOICE.ADD_VOICEQUEUE"
+        >
+          ADD VOICEQUEUE
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newVoiceQueue"
+          ng-click="vm.deleteVoiceQueue($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="VOICE.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="VOICE.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/voiceQueues/edit/agentadd/agentadd.html/agentadd-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/voiceQueues/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
deleted file mode 100644
index 7b7ca44..0000000
--- a/public/src/js/modules/main/apps/voice/views/voiceQueues/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
+++ /dev/null
@@ -1,66 +0,0 @@
-<md-dialog
-  class="voiceQueue-dialog"
-  aria-label="voiceQueue"
-  ng-init="vm.onInit()"
->
-  <form name="voiceQueueForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="VOICE.AGENTADD_VOICEQUEUE">Add Agent to voiceQueue</h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <md-input-container flex class="no-margin">
-        <label translate="VOICE.PENALTY">Penalty</label>
-        <input
-          name="penalty"
-          ng-model="vm.penalty"
-          placeholder="0"
-          required
-          md-minlength="0"
-          md-maxlength="3"
-        />
-        <div ng-messages="voiceQueueForm.penalty.$error" role="alert" multiple>
-          <div ng-message="required">
-            <span>You must supply a penalty.</span>
-          </div>
-          <div ng-message="md-minlength">
-            <span>Min Penalty 0 characters.</span>
-          </div>
-          <div ng-message="md-maxlength">
-            <span>Max Penalty 3 characters.</span>
-          </div>
-        </div>
-      </md-input-container>
-      <ms-dual-multiselect
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveAgents()"
-        class="send-button md-accent md-raised"
-        ng-disabled="!vm.pendingChanges"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/voiceQueues/edit/agentadd/agentadd.html/agentadd.html b/public/src/js/modules/main/apps/voice/views/voiceQueues/edit/agentadd/agentadd.html/agentadd.html
new file mode 100644
index 0000000..7b7ca44
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/voiceQueues/edit/agentadd/agentadd.html/agentadd.html
@@ -0,0 +1,66 @@
+<md-dialog
+  class="voiceQueue-dialog"
+  aria-label="voiceQueue"
+  ng-init="vm.onInit()"
+>
+  <form name="voiceQueueForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="VOICE.AGENTADD_VOICEQUEUE">Add Agent to voiceQueue</h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <md-input-container flex class="no-margin">
+        <label translate="VOICE.PENALTY">Penalty</label>
+        <input
+          name="penalty"
+          ng-model="vm.penalty"
+          placeholder="0"
+          required
+          md-minlength="0"
+          md-maxlength="3"
+        />
+        <div ng-messages="voiceQueueForm.penalty.$error" role="alert" multiple>
+          <div ng-message="required">
+            <span>You must supply a penalty.</span>
+          </div>
+          <div ng-message="md-minlength">
+            <span>Min Penalty 0 characters.</span>
+          </div>
+          <div ng-message="md-maxlength">
+            <span>Max Penalty 3 characters.</span>
+          </div>
+        </div>
+      </md-input-container>
+      <ms-dual-multiselect
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveAgents()"
+        class="send-button md-accent md-raised"
+        ng-disabled="!vm.pendingChanges"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/voiceQueues/edit/teamadd/teamadd.html/teamadd-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/voiceQueues/edit/teamadd/teamadd.html/teamadd-[chunkhash].html
deleted file mode 100644
index 2f6eb3d..0000000
--- a/public/src/js/modules/main/apps/voice/views/voiceQueues/edit/teamadd/teamadd.html/teamadd-[chunkhash].html
+++ /dev/null
@@ -1,66 +0,0 @@
-<md-dialog
-  class="voiceQueue-dialog"
-  aria-label="voiceQueue"
-  ng-init="vm.onInit()"
->
-  <form name="voiceQueueForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="VOICE.TEAMS_ASSOCIATION">Teams Association</h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <md-input-container flex class="no-margin">
-        <label translate="VOICE.PENALTY">Penalty</label>
-        <input
-          name="penalty"
-          ng-model="vm.penalty"
-          placeholder="0"
-          required
-          md-minlength="0"
-          md-maxlength="3"
-        />
-        <div ng-messages="voiceQueueForm.penalty.$error" role="alert" multiple>
-          <div ng-message="required">
-            <span>You must supply a penalty.</span>
-          </div>
-          <div ng-message="md-minlength">
-            <span>Min Penalty 0 characters.</span>
-          </div>
-          <div ng-message="md-maxlength">
-            <span>Max Penalty 3 characters.</span>
-          </div>
-        </div>
-      </md-input-container>
-      <ms-dual-multiselect
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveTeams()"
-        ng-disabled="!vm.pendingChanges"
-        class="send-button md-accent md-raised"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/voiceQueues/edit/teamadd/teamadd.html/teamadd.html b/public/src/js/modules/main/apps/voice/views/voiceQueues/edit/teamadd/teamadd.html/teamadd.html
new file mode 100644
index 0000000..2f6eb3d
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/voiceQueues/edit/teamadd/teamadd.html/teamadd.html
@@ -0,0 +1,66 @@
+<md-dialog
+  class="voiceQueue-dialog"
+  aria-label="voiceQueue"
+  ng-init="vm.onInit()"
+>
+  <form name="voiceQueueForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="VOICE.TEAMS_ASSOCIATION">Teams Association</h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <md-input-container flex class="no-margin">
+        <label translate="VOICE.PENALTY">Penalty</label>
+        <input
+          name="penalty"
+          ng-model="vm.penalty"
+          placeholder="0"
+          required
+          md-minlength="0"
+          md-maxlength="3"
+        />
+        <div ng-messages="voiceQueueForm.penalty.$error" role="alert" multiple>
+          <div ng-message="required">
+            <span>You must supply a penalty.</span>
+          </div>
+          <div ng-message="md-minlength">
+            <span>Min Penalty 0 characters.</span>
+          </div>
+          <div ng-message="md-maxlength">
+            <span>Max Penalty 3 characters.</span>
+          </div>
+        </div>
+      </md-input-container>
+      <ms-dual-multiselect
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveTeams()"
+        ng-disabled="!vm.pendingChanges"
+        class="send-button md-accent md-raised"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/voiceQueues/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/voiceQueues/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index 2b9f75c..0000000
--- a/public/src/js/modules/main/apps/voice/views/voiceQueues/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,1628 +0,0 @@
-<div id="voice-voiceQueue" class="page-layout simple tabbed" layout="column">
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-voiceQueues-button md-icon-button"
-        aria-label="Go to voiceQueues"
-        ng-click="vm.gotoVoiceQueues()"
-        translate
-        translate-attr-aria-label="VOICE.GO_TO_VOICEQUEUES"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="voiceQueue-image" hide-xs>
-          <img ng-src="assets/images/business/voiceQueues.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.voiceQueue.id}}
-            <span ng-if="vm.voiceQueue.name">{{vm.voiceQueue.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="VOICE.CREATED_AT"></span>
-            <span>{{vm.voiceQueue.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.teamadddialog(vm.voiceQueue, $event)"
-        class="md-fab md-orange-500-bg md-icon-button"
-        aria-label="teamadd"
-      >
-        <md-tooltip
-          ><span translate="VOICE.TEAMADD_VOICEQUEUE"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
-      </md-button>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.agentadddialog(vm.voiceQueue, $event)"
-        class="md-fab md-purple-500-bg md-icon-button"
-        aria-label="agentadd"
-      >
-        <md-tooltip
-          ><span translate="VOICE.AGENTADD_VOICEQUEUE"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-account-plus"></md-icon>
-      </md-button>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.gotogoto(vm.voiceQueue, $event)"
-        class="md-fab md-warn md-icon-button"
-        aria-label="goto"
-      >
-        <md-tooltip><span translate="VOICE.GOTO_VOICEQUEUE"></span></md-tooltip>
-        <md-icon md-font-icon="icon-cast"></md-icon>
-      </md-button>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveVoiceQueue()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (settingsForm.$invalid) || (announcementsForm.$invalid) || (advancedForm.$invalid)"
-        translate="VOICE.SAVE"
-        translate-attr-aria-label="VOICE.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="VOICE.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="voiceQueue-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="VOICE.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="VOICE.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.voiceQueue.name"
-                  ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-                  ng-required="true"
-                  autofocus
-                  disabled
-                />
-
-                <div class="hint">
-                  <span translate="VOICE.HELP.NAME"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                  <div ng-message="pattern">
-                    <span
-                      translate="VOICE.ERRORS.NAME_MUST_VALID_PATTERN"
-                      translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-                      >Name must be valid pattern
-                    </span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.STRATEGY">Strategy</label>
-                <md-select
-                  name="strategy"
-                  ng-model="vm.voiceQueue.strategy"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'ringall'">Ringall</md-option>
-                  <md-option ng-value="'rrmemory'"
-                    >Round Robin Memory</md-option
-                  >
-                  <md-option ng-value="'leastrecent'">Least Recent</md-option>
-                  <md-option ng-value="'fewestcalls'">Fewest Calls</md-option>
-                  <md-option ng-value="'random'">Random</md-option>
-                  <md-option ng-value="'linear'">Linear</md-option>
-                  <md-option ng-value="'wrandom'">Weight Random</md-option>
-                </md-select>
-                <div
-                  ng-messages="generalForm['strategy'].$error"
-                  ng-show="generalForm['strategy'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.STRATEGY_REQUIRED"
-                      >Strategy field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.TIMEOUT">Timeout</label>
-                <input
-                  type="number"
-                  name="timeout"
-                  ng-model="vm.voiceQueue.timeout"
-                  min="0"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="VOICE.HELP.TIMEOUT"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['timeout'].$error"
-                  ng-show="generalForm['timeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.TIMEOUT_REQUIRED"
-                      >Timeout field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="VOICE.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >Timeout must be a valid greater or equal than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.MAXLENGTH">MaxLength</label>
-                <input
-                  type="number"
-                  name="maxlen"
-                  ng-model="vm.voiceQueue.maxlen"
-                  min="0"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="VOICE.HELP.MAXLENGTH"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['maxlen'].$error"
-                  ng-show="generalForm['maxlen'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.MAXLENGTH_REQUIRED"
-                      >MaxLength field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="VOICE.ERRORS.MAXLENGTH_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >MaxLength must be a valid greater or equal than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.RETRY">Retry</label>
-                <input
-                  type="number"
-                  name="retry"
-                  ng-model="vm.voiceQueue.retry"
-                  min="0"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="VOICE.HELP.RETRY"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['retry'].$error"
-                  ng-show="generalForm['retry'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.RETRY_REQUIRED"
-                      >Retry field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="VOICE.ERRORS.RETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >Retry must be a valid greater or equal than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.WRAPUPTIME">WrapupTime</label>
-                <input
-                  type="number"
-                  name="wrapuptime"
-                  ng-model="vm.voiceQueue.wrapuptime"
-                  min="0"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="VOICE.HELP.WRAPUPTIME"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['wrapuptime'].$error"
-                  ng-show="generalForm['wrapuptime'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.WRAPUPTIME_REQUIRED"
-                      >WrapupTime field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="VOICE.ERRORS.WRAPUPTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >WrapupTime must be a valid greater or equal than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.WEIGHT">Weight</label>
-                <input
-                  type="number"
-                  name="weight"
-                  ng-model="vm.voiceQueue.weight"
-                  min="0"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="VOICE.HELP.WEIGHT"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['weight'].$error"
-                  ng-show="generalForm['weight'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.WEIGHT_REQUIRED"
-                      >Weight field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="VOICE.ERRORS.WEIGHT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >Weight must be a valid greater or equal than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.JOINWHENEMPTY">JoinWhenEmpty</label>
-                <md-select
-                  name="joinempty"
-                  ng-model="vm.voiceQueue.joinempty"
-                  multiple
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="'no'"
-                    ng-disabled="vm.voiceQueue.joinempty.length === 1  && vm.voiceQueue.joinempty[0] === 'no'"
-                    >no</md-option
-                  >
-                  <md-option
-                    ng-value="'yes'"
-                    ng-disabled="vm.voiceQueue.joinempty.length === 1 && vm.voiceQueue.joinempty[0] === 'yes'"
-                    >yes</md-option
-                  >
-                  <md-option
-                    ng-value="'strict'"
-                    ng-disabled="vm.voiceQueue.joinempty.length === 1 && vm.voiceQueue.joinempty[0] === 'strict'"
-                    >strict</md-option
-                  >
-                  <md-option
-                    ng-value="'loose'"
-                    ng-disabled="vm.voiceQueue.joinempty.length === 1 && vm.voiceQueue.joinempty[0] === 'loose'"
-                    >loose</md-option
-                  >
-                  <md-option
-                    ng-value="'paused'"
-                    ng-disabled="vm.voiceQueue.joinempty.length === 1 && vm.voiceQueue.joinempty[0] === 'paused'"
-                    >paused</md-option
-                  >
-                  <md-option
-                    ng-value="'penalty'"
-                    ng-disabled="vm.voiceQueue.joinempty.length === 1 && vm.voiceQueue.joinempty[0] === 'penalty'"
-                    >penalty</md-option
-                  >
-                  <md-option
-                    ng-value="'inuse'"
-                    ng-disabled="vm.voiceQueue.joinempty.length === 1 && vm.voiceQueue.joinempty[0] === 'inuse'"
-                    >inuse</md-option
-                  >
-                  <md-option
-                    ng-value="'ringing'"
-                    ng-disabled="vm.voiceQueue.joinempty.length === 1 && vm.voiceQueue.joinempty[0] === 'ringing'"
-                    >ringing</md-option
-                  >
-                  <md-option
-                    ng-value="'unavailable'"
-                    ng-disabled="vm.voiceQueue.joinempty.length === 1 && vm.voiceQueue.joinempty[0] === 'unavailable'"
-                    >unavailable</md-option
-                  >
-                  <md-option
-                    ng-value="'invalid'"
-                    ng-disabled="vm.voiceQueue.joinempty.length === 1 && vm.voiceQueue.joinempty[0] === 'invalid'"
-                    >invalid</md-option
-                  >
-                  <md-option
-                    ng-value="'unknown'"
-                    ng-disabled="vm.voiceQueue.joinempty.length === 1 && vm.voiceQueue.joinempty[0] === 'unknown'"
-                    >unknown</md-option
-                  >
-                  <md-option
-                    ng-value="'wrapup'"
-                    ng-disabled="vm.voiceQueue.joinempty.length === 1 && vm.voiceQueue.joinempty[0] === 'wrapup'"
-                    >wrapup</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span translate="VOICE.HELP.JOINWHENEMPTY"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['joinempty'].$error"
-                  ng-show="generalForm['joinempty'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.JOINWHENEMPTY_REQUIRED"
-                      >JoinWhenEmpty field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.LEAVEWHENEMPTY">LeaveWhenEmpty</label>
-                <md-select
-                  name="leavewhenempty"
-                  ng-model="vm.voiceQueue.leavewhenempty"
-                  multiple
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="'no'"
-                    ng-disabled="vm.voiceQueue.leavewhenempty.length === 1 && vm.voiceQueue.leavewhenempty[0] === 'no'"
-                    >no</md-option
-                  >
-                  <md-option
-                    ng-value="'yes'"
-                    ng-disabled="vm.voiceQueue.leavewhenempty.length === 1 && vm.voiceQueue.leavewhenempty[0] === 'yes'"
-                    >yes</md-option
-                  >
-                  <md-option
-                    ng-value="'strict'"
-                    ng-disabled="vm.voiceQueue.leavewhenempty.length === 1 && vm.voiceQueue.leavewhenempty[0] === 'strict'"
-                    >strict</md-option
-                  >
-                  <md-option
-                    ng-value="'loose'"
-                    ng-disabled="vm.voiceQueue.leavewhenempty.length === 1 && vm.voiceQueue.leavewhenempty[0] === 'loose'"
-                    >loose</md-option
-                  >
-                  <md-option
-                    ng-value="'paused'"
-                    ng-disabled="vm.voiceQueue.leavewhenempty.length === 1 && vm.voiceQueue.leavewhenempty[0] === 'paused'"
-                    >paused</md-option
-                  >
-                  <md-option
-                    ng-value="'penalty'"
-                    ng-disabled="vm.voiceQueue.leavewhenempty.length === 1 && vm.voiceQueue.leavewhenempty[0] === 'penalty'"
-                    >penalty</md-option
-                  >
-                  <md-option
-                    ng-value="'inuse'"
-                    ng-disabled="vm.voiceQueue.leavewhenempty.length === 1 && vm.voiceQueue.leavewhenempty[0] === 'inuse'"
-                    >inuse</md-option
-                  >
-                  <md-option
-                    ng-value="'ringing'"
-                    ng-disabled="vm.voiceQueue.leavewhenempty.length === 1 && vm.voiceQueue.leavewhenempty[0] === 'ringing'"
-                    >ringing</md-option
-                  >
-                  <md-option
-                    ng-value="'unavailable'"
-                    ng-disabled="vm.voiceQueue.leavewhenempty.length === 1 && vm.voiceQueue.leavewhenempty[0] === 'unavailable'"
-                    >unavailable</md-option
-                  >
-                  <md-option
-                    ng-value="'invalid'"
-                    ng-disabled="vm.voiceQueue.leavewhenempty.length === 1 && vm.voiceQueue.leavewhenempty[0] === 'invalid'"
-                    >invalid</md-option
-                  >
-                  <md-option
-                    ng-value="'unknown'"
-                    ng-disabled="vm.voiceQueue.leavewhenempty.length === 1 && vm.voiceQueue.leavewhenempty[0] === 'unknown'"
-                    >unknown</md-option
-                  >
-                  <md-option
-                    ng-value="'wrapup'"
-                    ng-disabled="vm.voiceQueue.leavewhenempty.length === 1 && vm.voiceQueue.leavewhenempty[0] === 'wrapup'"
-                    >wrapup</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span translate="VOICE.HELP.LEAVEWHENEMPTY"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['leavewhenempty'].$error"
-                  ng-show="generalForm['leavewhenempty'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.LEAVEWHENEMPTY_REQUIRED"
-                      >LeaveWhenEmpty field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.MUSICONHOLD">MusicOnHold</label>
-                <md-select
-                  name="musiconhold"
-                  ng-model="vm.voiceQueue.musiconhold"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="musiconhold.name"
-                    ng-repeat="musiconhold in vm.musiconholds"
-                    ng-disabled="musiconhold.canSelect === false"
-                    >{{ musiconhold.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span translate="VOICE.HELP.MUSICONHOLD"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['musiconhold'].$error"
-                  ng-show="generalForm['musiconhold'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.MUSICONHOLD_REQUIRED"
-                      >MusicOnHold field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.ANNOUNCETOAGENT">AnnounceToAgent</label>
-                <md-select
-                  name="announce"
-                  ng-model="vm.voiceQueue.announce"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'FALSE'">None</md-option>
-                  <md-option
-                    ng-value="'/var/opt/motion2/server/files/sounds/converted/' + announce.save_name"
-                    ng-repeat="announce in vm.sounds"
-                    ng-disabled="announce.canSelect === false"
-                    >{{ announce.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span translate="VOICE.HELP.ANNOUNCETOAGENT"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['announce'].$error"
-                  ng-show="generalForm['announce'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.ANNOUNCETOAGENT_REQUIRED"
-                      >AnnounceToAgent field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.voiceQueue.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="VOICE.ANNOUNCEMENTS">ANNOUNCEMENTS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="voiceQueue-detail-form-container settings md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="VOICE.SETTINGS">
-                SETTINGS
-              </div>
-            </div>
-            <form name="settingsForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="VOICE.ANNOUNCEFREQUENCY"
-                  >AnnounceFrequency</label
-                >
-                <input
-                  type="number"
-                  name="announce_frequency"
-                  ng-model="vm.voiceQueue.announce_frequency"
-                  min="0"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="VOICE.HELP.ANNOUNCEFREQUENCY"></span>
-                </div>
-                <div
-                  ng-messages="settingsForm['announce_frequency'].$error"
-                  ng-show="settingsForm['announce_frequency'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.ANNOUNCEFREQUENCY_REQUIRED"
-                      >AnnounceFrequency field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="VOICE.ERRORS.ANNOUNCEFREQUENCY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AnnounceFrequency must be a valid greater or equal
-                      than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.MINANNOUNCEFREQUENCY"
-                  >MinAnnounceFrequency</label
-                >
-                <input
-                  type="number"
-                  name="min_announce_frequency"
-                  ng-model="vm.voiceQueue.min_announce_frequency"
-                  min="0"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="VOICE.HELP.MINANNOUNCEFREQUENCY"></span>
-                </div>
-                <div
-                  ng-messages="settingsForm['min_announce_frequency'].$error"
-                  ng-show="settingsForm['min_announce_frequency'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.MINANNOUNCEFREQUENCY_REQUIRED"
-                      >MinAnnounceFrequency field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="VOICE.ERRORS.MINANNOUNCEFREQUENCY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >MinAnnounceFrequency must be a valid greater or equal
-                      than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.PERIODICANNOUNCEFREQUENCY"
-                  >PeriodicAnnounceFrequency</label
-                >
-                <input
-                  type="number"
-                  name="periodic_announce_frequency"
-                  ng-model="vm.voiceQueue.periodic_announce_frequency"
-                  min="0"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="VOICE.HELP.PERIODICANNOUNCEFREQUENCY"></span>
-                </div>
-                <div
-                  ng-messages="settingsForm['periodic_announce_frequency'].$error"
-                  ng-show="settingsForm['periodic_announce_frequency'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="VOICE.ERRORS.PERIODICANNOUNCEFREQUENCY_REQUIRED"
-                      >PeriodicAnnounceFrequency field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="VOICE.ERRORS.PERIODICANNOUNCEFREQUENCY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >PeriodicAnnounceFrequency must be a valid greater or
-                      equal than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.RANDOMPERIODICANNOUNCE"
-                  >RandomPeriodicAnnounce</label
-                >
-                <md-select
-                  name="random_periodic_announce"
-                  ng-model="vm.voiceQueue.random_periodic_announce"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">
-                    {{ 'VOICE.YES' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'no'">
-                    {{ 'VOICE.NO' | translate }}
-                  </md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="VOICE.HELP.RANDOMPERIODICANNOUNCE"></span>
-                </div>
-                <div
-                  ng-messages="settingsForm['random_periodic_announce'].$error"
-                  ng-show="settingsForm['random_periodic_announce'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="VOICE.ERRORS.RANDOMPERIODICANNOUNCE_REQUIRED"
-                      >RandomPeriodicAnnounce field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.ANNOUNCEHOLDTIME"
-                  >AnnounceHoldtime</label
-                >
-                <md-select
-                  name="announce_holdtime"
-                  ng-model="vm.voiceQueue.announce_holdtime"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">Yes</md-option>
-                  <md-option ng-value="'no'">No</md-option>
-                  <md-option ng-value="'once'">Once</md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="VOICE.HELP.ANNOUNCEHOLDTIME"></span>
-                </div>
-                <div
-                  ng-messages="settingsForm['announce_holdtime'].$error"
-                  ng-show="settingsForm['announce_holdtime'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.ANNOUNCEHOLDTIME_REQUIRED"
-                      >AnnounceHoldtime field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.ANNOUNCECALLERPOSITION"
-                  >AnnounceCallerPosition</label
-                >
-                <md-select
-                  name="announce_position"
-                  ng-model="vm.voiceQueue.announce_position"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">Yes</md-option>
-                  <md-option ng-value="'no'">No</md-option>
-                  <md-option ng-value="'limit'">Limit</md-option>
-                  <md-option ng-value="'more'">More</md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="VOICE.HELP.ANNOUNCECALLERPOSITION"></span>
-                </div>
-                <div
-                  ng-messages="settingsForm['announce_position'].$error"
-                  ng-show="settingsForm['announce_position'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="VOICE.ERRORS.ANNOUNCECALLERPOSITION_REQUIRED"
-                      >AnnounceCallerPosition field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.ANNOUNCEPOSITIONLIMIT"
-                  >AnnouncePositionLimit</label
-                >
-                <input
-                  type="number"
-                  name="announce_position_limit"
-                  ng-model="vm.voiceQueue.announce_position_limit"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="VOICE.HELP.ANNOUNCEPOSITIONLIMIT"></span>
-                </div>
-                <div
-                  ng-messages="settingsForm['announce_position_limit'].$error"
-                  ng-show="settingsForm['announce_position_limit'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="VOICE.ERRORS.ANNOUNCEPOSITIONLIMIT_REQUIRED"
-                      >AnnouncePositionLimit field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.REPORTHOLDTIMEAGENT"
-                  >ReportHoldtimeAgent</label
-                >
-                <md-select
-                  name="reportholdtime"
-                  ng-model="vm.voiceQueue.reportholdtime"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">
-                    {{ 'VOICE.YES' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'no'">
-                    {{ 'VOICE.NO' | translate }}
-                  </md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="VOICE.HELP.REPORTHOLDTIMEAGENT"></span>
-                </div>
-                <div
-                  ng-messages="settingsForm['reportholdtime'].$error"
-                  ng-show="settingsForm['reportholdtime'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.REPORTHOLDTIMEAGENT_REQUIRED"
-                      >ReportHoldtimeAgent field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="voiceQueue-detail-form-container announcements md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="VOICE.ANNOUNCEMENTS">
-                ANNOUNCEMENTS
-              </div>
-            </div>
-            <form name="announcementsForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="VOICE.PERIODICANNOUNCE"
-                  >PeriodicAnnounce</label
-                >
-                <md-select
-                  name="periodic_announce"
-                  ng-model="vm.voiceQueue.periodic_announce"
-                  autofocus
-                  multiple
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="''">Default</md-option>
-                  <md-option
-                    ng-value="'/var/opt/motion2/server/files/sounds/converted/' + periodic_announce.save_name"
-                    ng-repeat="periodic_announce in vm.sounds"
-                    ng-disabled="periodic_announce.canSelect === false"
-                    >{{ periodic_announce.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span translate="VOICE.HELP.PERIODICANNOUNCE"></span>
-                </div>
-                <div
-                  ng-messages="announcementsForm['periodic_announce'].$error"
-                  ng-show="announcementsForm['periodic_announce'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.PERIODICANNOUNCE_REQUIRED"
-                      >PeriodicAnnounce field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.HOLDTIMEANNOUNCE"
-                  >HoldTimeAnnounce</label
-                >
-                <md-select
-                  name="queue_reporthold"
-                  ng-model="vm.voiceQueue.queue_reporthold"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="null">Default</md-option>
-                  <md-option ng-value="''">Disabled</md-option>
-                  <md-option
-                    ng-value="'/var/opt/motion2/server/files/sounds/converted/' + queue_reporthold.save_name"
-                    ng-repeat="queue_reporthold in vm.sounds"
-                    ng-disabled="queue_reporthold.canSelect === false"
-                    >{{ queue_reporthold.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span translate="VOICE.HELP.HOLDTIMEANNOUNCE"></span>
-                </div>
-                <div
-                  ng-messages="announcementsForm['queue_reporthold'].$error"
-                  ng-show="announcementsForm['queue_reporthold'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.HOLDTIMEANNOUNCE_REQUIRED"
-                      >HoldTimeAnnounce field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.YOUARENEXTANNOUNCE"
-                  >YouareNextAnnounce</label
-                >
-                <md-select
-                  name="queue_youarenext"
-                  ng-model="vm.voiceQueue.queue_youarenext"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="null">Default</md-option>
-                  <md-option ng-value="''">Disabled</md-option>
-                  <md-option
-                    ng-value="'/var/opt/motion2/server/files/sounds/converted/' + queue_youarenext.save_name"
-                    ng-repeat="queue_youarenext in vm.sounds"
-                    ng-disabled="queue_youarenext.canSelect === false"
-                    >{{ queue_youarenext.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span translate="VOICE.HELP.YOUARENEXTANNOUNCE"></span>
-                </div>
-                <div
-                  ng-messages="announcementsForm['queue_youarenext'].$error"
-                  ng-show="announcementsForm['queue_youarenext'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.YOUARENEXTANNOUNCE_REQUIRED"
-                      >YouareNextAnnounce field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.THEREAREANNOUNCE"
-                  >ThereareAnnounce</label
-                >
-                <md-select
-                  name="queue_thereare"
-                  ng-model="vm.voiceQueue.queue_thereare"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="null">Default</md-option>
-                  <md-option ng-value="''">Disabled</md-option>
-                  <md-option
-                    ng-value="'/var/opt/motion2/server/files/sounds/converted/' + queue_thereare.save_name"
-                    ng-repeat="queue_thereare in vm.sounds"
-                    ng-disabled="queue_thereare.canSelect === false"
-                    >{{ queue_thereare.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span translate="VOICE.HELP.THEREAREANNOUNCE"></span>
-                </div>
-                <div
-                  ng-messages="announcementsForm['queue_thereare'].$error"
-                  ng-show="announcementsForm['queue_thereare'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.THEREAREANNOUNCE_REQUIRED"
-                      >ThereareAnnounce field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.WAITINGCALLSANNOUNCE"
-                  >WaitingCallsAnnounce</label
-                >
-                <md-select
-                  name="queue_callswaiting"
-                  ng-model="vm.voiceQueue.queue_callswaiting"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="null">Default</md-option>
-                  <md-option ng-value="''">Disabled</md-option>
-                  <md-option
-                    ng-value="'/var/opt/motion2/server/files/sounds/converted/' + queue_callswaiting.save_name"
-                    ng-repeat="queue_callswaiting in vm.sounds"
-                    ng-disabled="queue_callswaiting.canSelect === false"
-                    >{{ queue_callswaiting.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span translate="VOICE.HELP.WAITINGCALLSANNOUNCE"></span>
-                </div>
-                <div
-                  ng-messages="announcementsForm['queue_callswaiting'].$error"
-                  ng-show="announcementsForm['queue_callswaiting'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.WAITINGCALLSANNOUNCE_REQUIRED"
-                      >WaitingCallsAnnounce field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.ESTIMATEDHOLDTIMEANNOUNCE"
-                  >EstimatedHoldTimeAnnounce</label
-                >
-                <md-select
-                  name="queue_holdtime"
-                  ng-model="vm.voiceQueue.queue_holdtime"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="null">Default</md-option>
-                  <md-option ng-value="''">Disabled</md-option>
-                  <md-option
-                    ng-value="'/var/opt/motion2/server/files/sounds/converted/' + queue_holdtime.save_name"
-                    ng-repeat="queue_holdtime in vm.sounds"
-                    ng-disabled="queue_holdtime.canSelect === false"
-                    >{{ queue_holdtime.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span translate="VOICE.HELP.ESTIMATEDHOLDTIMEANNOUNCE"></span>
-                </div>
-                <div
-                  ng-messages="announcementsForm['queue_holdtime'].$error"
-                  ng-show="announcementsForm['queue_holdtime'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="VOICE.ERRORS.ESTIMATEDHOLDTIMEANNOUNCE_REQUIRED"
-                      >EstimatedHoldTimeAnnounce field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.MINUTESANNOUNCE">MinutesAnnounce</label>
-                <md-select
-                  name="queue_minutes"
-                  ng-model="vm.voiceQueue.queue_minutes"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="null">Default</md-option>
-                  <md-option ng-value="''">Disabled</md-option>
-                  <md-option
-                    ng-value="'/var/opt/motion2/server/files/sounds/converted/' + queue_minutes.save_name"
-                    ng-repeat="queue_minutes in vm.sounds"
-                    ng-disabled="queue_minutes.canSelect === false"
-                    >{{ queue_minutes.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span translate="VOICE.HELP.MINUTESANNOUNCE"></span>
-                </div>
-                <div
-                  ng-messages="announcementsForm['queue_minutes'].$error"
-                  ng-show="announcementsForm['queue_minutes'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.MINUTESANNOUNCE_REQUIRED"
-                      >MinutesAnnounce field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.MINUTEANNOUNCE">MinuteAnnounce</label>
-                <md-select
-                  name="queue_minute"
-                  ng-model="vm.voiceQueue.queue_minute"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="null">Default</md-option>
-                  <md-option ng-value="''">Disabled</md-option>
-                  <md-option
-                    ng-value="'/var/opt/motion2/server/files/sounds/converted/' + queue_minute.save_name"
-                    ng-repeat="queue_minute in vm.sounds"
-                    ng-disabled="queue_minute.canSelect === false"
-                    >{{ queue_minute.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span translate="VOICE.HELP.MINUTEANNOUNCE"></span>
-                </div>
-                <div
-                  ng-messages="announcementsForm['queue_minute'].$error"
-                  ng-show="announcementsForm['queue_minute'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.MINUTEANNOUNCE_REQUIRED"
-                      >MinuteAnnounce field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.SECONDSANNOUNCE">SecondsAnnounce</label>
-                <md-select
-                  name="queue_seconds"
-                  ng-model="vm.voiceQueue.queue_seconds"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="null">Default</md-option>
-                  <md-option ng-value="''">Disabled</md-option>
-                  <md-option
-                    ng-value="'/var/opt/motion2/server/files/sounds/converted/' + queue_seconds.save_name"
-                    ng-repeat="queue_seconds in vm.sounds"
-                    ng-disabled="queue_seconds.canSelect === false"
-                    >{{ queue_seconds.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span translate="VOICE.HELP.SECONDSANNOUNCE"></span>
-                </div>
-                <div
-                  ng-messages="announcementsForm['queue_seconds'].$error"
-                  ng-show="announcementsForm['queue_seconds'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.SECONDSANNOUNCE_REQUIRED"
-                      >SecondsAnnounce field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.THANKYOUANNOUNCE"
-                  >ThankYouAnnounce</label
-                >
-                <md-select
-                  name="queue_thankyou"
-                  ng-model="vm.voiceQueue.queue_thankyou"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="null">Default</md-option>
-                  <md-option ng-value="''">Disabled</md-option>
-                  <md-option
-                    ng-value="'/var/opt/motion2/server/files/sounds/converted/' + queue_thankyou.save_name"
-                    ng-repeat="queue_thankyou in vm.sounds"
-                    ng-disabled="queue_thankyou.canSelect === false"
-                    >{{ queue_thankyou.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span translate="VOICE.HELP.THANKYOUANNOUNCE"></span>
-                </div>
-                <div
-                  ng-messages="announcementsForm['queue_thankyou'].$error"
-                  ng-show="announcementsForm['queue_thankyou'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.THANKYOUANNOUNCE_REQUIRED"
-                      >ThankYouAnnounce field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="VOICE.ADVANCED">ADVANCED</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="voiceQueue-detail-form-container advanced md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="VOICE.ADVANCED">
-                ADVANCED
-              </div>
-            </div>
-            <form name="advancedForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.voiceQueue.acw"
-                  aria-label="AfterCallWork"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="VOICE.AFTERCALLWORK"
-                    >AfterCallWork</span
-                  ></md-switch
-                >
-
-                <div class="hint">
-                  <span translate="VOICE.HELP.AFTERCALLWORK"></span>
-                </div>
-              </md-input-container>
-              <md-input-container ng-if="vm.voiceQueue.acw" class="md-block">
-                <label translate="VOICE.AFTERCALLWORKDURATION"
-                  >AfterCallWorkDuration</label
-                >
-                <input
-                  type="number"
-                  name="acwTimeout"
-                  ng-model="vm.voiceQueue.acwTimeout"
-                  min="0"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="VOICE.HELP.AFTERCALLWORKDURATION"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['acwTimeout'].$error"
-                  ng-show="advancedForm['acwTimeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="VOICE.ERRORS.AFTERCALLWORKDURATION_REQUIRED"
-                      >AfterCallWorkDuration field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="VOICE.ERRORS.AFTERCALLWORKDURATION_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >AfterCallWorkDuration must be a valid greater or equal
-                      than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.AUTOPAUSE">AutoPause</label>
-                <md-select
-                  name="autopause"
-                  ng-model="vm.voiceQueue.autopause"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'all'">
-                    {{ 'VOICE.YES' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'no'">
-                    {{ 'VOICE.NO' | translate }}
-                  </md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="VOICE.HELP.AUTOPAUSE"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['autopause'].$error"
-                  ng-show="advancedForm['autopause'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.AUTOPAUSE_REQUIRED"
-                      >AutoPause field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.RINGINUSE">RingInUse</label>
-                <md-select
-                  name="ringinuse"
-                  ng-model="vm.voiceQueue.ringinuse"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">
-                    {{ 'VOICE.YES' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'no'">
-                    {{ 'VOICE.NO' | translate }}
-                  </md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="VOICE.HELP.RINGINUSE"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['ringinuse'].$error"
-                  ng-show="advancedForm['ringinuse'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.RINGINUSE_REQUIRED"
-                      >RingInUse field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.MEMBERDELAY">MemberDelay</label>
-                <input
-                  type="number"
-                  name="memberdelay"
-                  ng-model="vm.voiceQueue.memberdelay"
-                  min="0"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="VOICE.HELP.MEMBERDELAY"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['memberdelay'].$error"
-                  ng-show="advancedForm['memberdelay'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.MEMBERDELAY_REQUIRED"
-                      >MemberDelay field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="VOICE.ERRORS.MEMBERDELAY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >MemberDelay must be a valid greater or equal than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.TIMEOUTRESTART">TimeoutRestart</label>
-                <md-select
-                  name="timeoutrestart"
-                  ng-model="vm.voiceQueue.timeoutrestart"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">
-                    {{ 'VOICE.YES' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'no'">
-                    {{ 'VOICE.NO' | translate }}
-                  </md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="VOICE.HELP.TIMEOUTRESTART"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['timeoutrestart'].$error"
-                  ng-show="advancedForm['timeoutrestart'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.TIMEOUTRESTART_REQUIRED"
-                      >TimeoutRestart field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.MONITORFORMAT">MonitorFormat</label>
-                <md-select
-                  name="monitor_format"
-                  ng-model="vm.voiceQueue.monitor_format"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="''">Inactive</md-option>
-                  <md-option ng-value="'wav'">wav</md-option>
-                  <md-option ng-value="'wav49'">wav49</md-option>
-                  <md-option ng-value="'gsm'">gsm</md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="VOICE.HELP.MONITORFORMAT"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['monitor_format'].$error"
-                  ng-show="advancedForm['monitor_format'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.MONITORFORMAT_REQUIRED"
-                      >MonitorFormat field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.CONTEXT">Context</label>
-                <input
-                  type="text"
-                  name="context"
-                  ng-model="vm.voiceQueue.context"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="VOICE.HELP.CONTEXT"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['context'].$error"
-                  ng-show="advancedForm['context'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.CONTEXT_REQUIRED"
-                      >Context field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.SETINTERFACEVARIABLES"
-                  >SetInterfaceVariables</label
-                >
-                <md-select
-                  name="setinterfacevar"
-                  ng-model="vm.voiceQueue.setinterfacevar"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">
-                    {{ 'VOICE.YES' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'no'">
-                    {{ 'VOICE.NO' | translate }}
-                  </md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="VOICE.HELP.SETINTERFACEVARIABLES"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['setinterfacevar'].$error"
-                  ng-show="advancedForm['setinterfacevar'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="VOICE.ERRORS.SETINTERFACEVARIABLES_REQUIRED"
-                      >SetInterfaceVariables field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.SETQUEUEVARIABLES"
-                  >SetQueueVariables</label
-                >
-                <md-select
-                  name="setqueuevar"
-                  ng-model="vm.voiceQueue.setqueuevar"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">
-                    {{ 'VOICE.YES' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'no'">
-                    {{ 'VOICE.NO' | translate }}
-                  </md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="VOICE.HELP.SETQUEUEVARIABLES"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['setqueuevar'].$error"
-                  ng-show="advancedForm['setqueuevar'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.SETQUEUEVARIABLES_REQUIRED"
-                      >SetQueueVariables field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.SETQUEUEENTRYVARIABLES"
-                  >SetQueueEntryVariables</label
-                >
-                <md-select
-                  name="setqueueentryvar"
-                  ng-model="vm.voiceQueue.setqueueentryvar"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">
-                    {{ 'VOICE.YES' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'no'">
-                    {{ 'VOICE.NO' | translate }}
-                  </md-option>
-                </md-select>
-                <div class="hint">
-                  <span translate="VOICE.HELP.SETQUEUEENTRYVARIABLES"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['setqueueentryvar'].$error"
-                  ng-show="advancedForm['setqueueentryvar'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="VOICE.ERRORS.SETQUEUEENTRYVARIABLES_REQUIRED"
-                      >SetQueueEntryVariables field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.SERVICELEVEL">ServiceLevel</label>
-                <input
-                  type="number"
-                  name="servicelevel"
-                  ng-model="vm.voiceQueue.servicelevel"
-                  min="0"
-                  max="100"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="VOICE.HELP.SERVICELEVEL"></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['servicelevel'].$error"
-                  ng-show="advancedForm['servicelevel'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.SERVICELEVEL_REQUIRED"
-                      >ServiceLevel field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="VOICE.ERRORS.SERVICELEVEL_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >ServiceLevel must be a valid greater or equal than</span
-                    >
-                    <span>0</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="VOICE.ERRORS.SERVICELEVEL_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >ServiceLevel must be a valid greater or equal than</span
-                    >
-                    <span>100</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.voiceQueue.mandatoryDisposition"
-                  aria-label="MandatoryDisposition"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="VOICE.MANDATORYDISPOSITION"
-                    >MandatoryDisposition</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.voiceQueue.mandatoryDisposition"
-                class="md-block"
-              >
-                <label translate="VOICE.MANDATORYDISPOSITIONPAUSEID"
-                  >MandatoryDispositionPauseId</label
-                >
-                <md-select
-                  name="mandatoryDispositionPauseId"
-                  ng-model="vm.voiceQueue.mandatoryDispositionPauseId"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="mandatoryDispositionPauseId.id"
-                    ng-repeat="mandatoryDispositionPauseId in vm.pauses"
-                    ng-disabled="mandatoryDispositionPauseId.canSelect === false"
-                    >{{ mandatoryDispositionPauseId.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span
-                    translate="VOICE.HELP.MANDATORYDISPOSITIONPAUSEID"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="advancedForm['mandatoryDispositionPauseId'].$error"
-                  ng-show="advancedForm['mandatoryDispositionPauseId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="VOICE.ERRORS.MANDATORYDISPOSITIONPAUSEID_REQUIRED"
-                      >MandatoryDispositionPauseId field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/voice/views/voiceQueues/edit/view.html/view.html b/public/src/js/modules/main/apps/voice/views/voiceQueues/edit/view.html/view.html
new file mode 100644
index 0000000..2b9f75c
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/voiceQueues/edit/view.html/view.html
@@ -0,0 +1,1628 @@
+<div id="voice-voiceQueue" class="page-layout simple tabbed" layout="column">
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-voiceQueues-button md-icon-button"
+        aria-label="Go to voiceQueues"
+        ng-click="vm.gotoVoiceQueues()"
+        translate
+        translate-attr-aria-label="VOICE.GO_TO_VOICEQUEUES"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="voiceQueue-image" hide-xs>
+          <img ng-src="assets/images/business/voiceQueues.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.voiceQueue.id}}
+            <span ng-if="vm.voiceQueue.name">{{vm.voiceQueue.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="VOICE.CREATED_AT"></span>
+            <span>{{vm.voiceQueue.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.teamadddialog(vm.voiceQueue, $event)"
+        class="md-fab md-orange-500-bg md-icon-button"
+        aria-label="teamadd"
+      >
+        <md-tooltip
+          ><span translate="VOICE.TEAMADD_VOICEQUEUE"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
+      </md-button>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.agentadddialog(vm.voiceQueue, $event)"
+        class="md-fab md-purple-500-bg md-icon-button"
+        aria-label="agentadd"
+      >
+        <md-tooltip
+          ><span translate="VOICE.AGENTADD_VOICEQUEUE"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-account-plus"></md-icon>
+      </md-button>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.gotogoto(vm.voiceQueue, $event)"
+        class="md-fab md-warn md-icon-button"
+        aria-label="goto"
+      >
+        <md-tooltip><span translate="VOICE.GOTO_VOICEQUEUE"></span></md-tooltip>
+        <md-icon md-font-icon="icon-cast"></md-icon>
+      </md-button>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveVoiceQueue()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (settingsForm.$invalid) || (announcementsForm.$invalid) || (advancedForm.$invalid)"
+        translate="VOICE.SAVE"
+        translate-attr-aria-label="VOICE.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="VOICE.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="voiceQueue-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="VOICE.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="VOICE.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.voiceQueue.name"
+                  ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+                  ng-required="true"
+                  autofocus
+                  disabled
+                />
+
+                <div class="hint">
+                  <span translate="VOICE.HELP.NAME"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                  <div ng-message="pattern">
+                    <span
+                      translate="VOICE.ERRORS.NAME_MUST_VALID_PATTERN"
+                      translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+                      >Name must be valid pattern
+                    </span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.STRATEGY">Strategy</label>
+                <md-select
+                  name="strategy"
+                  ng-model="vm.voiceQueue.strategy"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'ringall'">Ringall</md-option>
+                  <md-option ng-value="'rrmemory'"
+                    >Round Robin Memory</md-option
+                  >
+                  <md-option ng-value="'leastrecent'">Least Recent</md-option>
+                  <md-option ng-value="'fewestcalls'">Fewest Calls</md-option>
+                  <md-option ng-value="'random'">Random</md-option>
+                  <md-option ng-value="'linear'">Linear</md-option>
+                  <md-option ng-value="'wrandom'">Weight Random</md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['strategy'].$error"
+                  ng-show="generalForm['strategy'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.STRATEGY_REQUIRED"
+                      >Strategy field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.TIMEOUT">Timeout</label>
+                <input
+                  type="number"
+                  name="timeout"
+                  ng-model="vm.voiceQueue.timeout"
+                  min="0"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="VOICE.HELP.TIMEOUT"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['timeout'].$error"
+                  ng-show="generalForm['timeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.TIMEOUT_REQUIRED"
+                      >Timeout field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="VOICE.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >Timeout must be a valid greater or equal than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.MAXLENGTH">MaxLength</label>
+                <input
+                  type="number"
+                  name="maxlen"
+                  ng-model="vm.voiceQueue.maxlen"
+                  min="0"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="VOICE.HELP.MAXLENGTH"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['maxlen'].$error"
+                  ng-show="generalForm['maxlen'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.MAXLENGTH_REQUIRED"
+                      >MaxLength field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="VOICE.ERRORS.MAXLENGTH_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >MaxLength must be a valid greater or equal than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.RETRY">Retry</label>
+                <input
+                  type="number"
+                  name="retry"
+                  ng-model="vm.voiceQueue.retry"
+                  min="0"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="VOICE.HELP.RETRY"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['retry'].$error"
+                  ng-show="generalForm['retry'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.RETRY_REQUIRED"
+                      >Retry field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="VOICE.ERRORS.RETRY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >Retry must be a valid greater or equal than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.WRAPUPTIME">WrapupTime</label>
+                <input
+                  type="number"
+                  name="wrapuptime"
+                  ng-model="vm.voiceQueue.wrapuptime"
+                  min="0"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="VOICE.HELP.WRAPUPTIME"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['wrapuptime'].$error"
+                  ng-show="generalForm['wrapuptime'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.WRAPUPTIME_REQUIRED"
+                      >WrapupTime field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="VOICE.ERRORS.WRAPUPTIME_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >WrapupTime must be a valid greater or equal than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.WEIGHT">Weight</label>
+                <input
+                  type="number"
+                  name="weight"
+                  ng-model="vm.voiceQueue.weight"
+                  min="0"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="VOICE.HELP.WEIGHT"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['weight'].$error"
+                  ng-show="generalForm['weight'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.WEIGHT_REQUIRED"
+                      >Weight field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="VOICE.ERRORS.WEIGHT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >Weight must be a valid greater or equal than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.JOINWHENEMPTY">JoinWhenEmpty</label>
+                <md-select
+                  name="joinempty"
+                  ng-model="vm.voiceQueue.joinempty"
+                  multiple
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="'no'"
+                    ng-disabled="vm.voiceQueue.joinempty.length === 1  && vm.voiceQueue.joinempty[0] === 'no'"
+                    >no</md-option
+                  >
+                  <md-option
+                    ng-value="'yes'"
+                    ng-disabled="vm.voiceQueue.joinempty.length === 1 && vm.voiceQueue.joinempty[0] === 'yes'"
+                    >yes</md-option
+                  >
+                  <md-option
+                    ng-value="'strict'"
+                    ng-disabled="vm.voiceQueue.joinempty.length === 1 && vm.voiceQueue.joinempty[0] === 'strict'"
+                    >strict</md-option
+                  >
+                  <md-option
+                    ng-value="'loose'"
+                    ng-disabled="vm.voiceQueue.joinempty.length === 1 && vm.voiceQueue.joinempty[0] === 'loose'"
+                    >loose</md-option
+                  >
+                  <md-option
+                    ng-value="'paused'"
+                    ng-disabled="vm.voiceQueue.joinempty.length === 1 && vm.voiceQueue.joinempty[0] === 'paused'"
+                    >paused</md-option
+                  >
+                  <md-option
+                    ng-value="'penalty'"
+                    ng-disabled="vm.voiceQueue.joinempty.length === 1 && vm.voiceQueue.joinempty[0] === 'penalty'"
+                    >penalty</md-option
+                  >
+                  <md-option
+                    ng-value="'inuse'"
+                    ng-disabled="vm.voiceQueue.joinempty.length === 1 && vm.voiceQueue.joinempty[0] === 'inuse'"
+                    >inuse</md-option
+                  >
+                  <md-option
+                    ng-value="'ringing'"
+                    ng-disabled="vm.voiceQueue.joinempty.length === 1 && vm.voiceQueue.joinempty[0] === 'ringing'"
+                    >ringing</md-option
+                  >
+                  <md-option
+                    ng-value="'unavailable'"
+                    ng-disabled="vm.voiceQueue.joinempty.length === 1 && vm.voiceQueue.joinempty[0] === 'unavailable'"
+                    >unavailable</md-option
+                  >
+                  <md-option
+                    ng-value="'invalid'"
+                    ng-disabled="vm.voiceQueue.joinempty.length === 1 && vm.voiceQueue.joinempty[0] === 'invalid'"
+                    >invalid</md-option
+                  >
+                  <md-option
+                    ng-value="'unknown'"
+                    ng-disabled="vm.voiceQueue.joinempty.length === 1 && vm.voiceQueue.joinempty[0] === 'unknown'"
+                    >unknown</md-option
+                  >
+                  <md-option
+                    ng-value="'wrapup'"
+                    ng-disabled="vm.voiceQueue.joinempty.length === 1 && vm.voiceQueue.joinempty[0] === 'wrapup'"
+                    >wrapup</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span translate="VOICE.HELP.JOINWHENEMPTY"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['joinempty'].$error"
+                  ng-show="generalForm['joinempty'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.JOINWHENEMPTY_REQUIRED"
+                      >JoinWhenEmpty field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.LEAVEWHENEMPTY">LeaveWhenEmpty</label>
+                <md-select
+                  name="leavewhenempty"
+                  ng-model="vm.voiceQueue.leavewhenempty"
+                  multiple
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="'no'"
+                    ng-disabled="vm.voiceQueue.leavewhenempty.length === 1 && vm.voiceQueue.leavewhenempty[0] === 'no'"
+                    >no</md-option
+                  >
+                  <md-option
+                    ng-value="'yes'"
+                    ng-disabled="vm.voiceQueue.leavewhenempty.length === 1 && vm.voiceQueue.leavewhenempty[0] === 'yes'"
+                    >yes</md-option
+                  >
+                  <md-option
+                    ng-value="'strict'"
+                    ng-disabled="vm.voiceQueue.leavewhenempty.length === 1 && vm.voiceQueue.leavewhenempty[0] === 'strict'"
+                    >strict</md-option
+                  >
+                  <md-option
+                    ng-value="'loose'"
+                    ng-disabled="vm.voiceQueue.leavewhenempty.length === 1 && vm.voiceQueue.leavewhenempty[0] === 'loose'"
+                    >loose</md-option
+                  >
+                  <md-option
+                    ng-value="'paused'"
+                    ng-disabled="vm.voiceQueue.leavewhenempty.length === 1 && vm.voiceQueue.leavewhenempty[0] === 'paused'"
+                    >paused</md-option
+                  >
+                  <md-option
+                    ng-value="'penalty'"
+                    ng-disabled="vm.voiceQueue.leavewhenempty.length === 1 && vm.voiceQueue.leavewhenempty[0] === 'penalty'"
+                    >penalty</md-option
+                  >
+                  <md-option
+                    ng-value="'inuse'"
+                    ng-disabled="vm.voiceQueue.leavewhenempty.length === 1 && vm.voiceQueue.leavewhenempty[0] === 'inuse'"
+                    >inuse</md-option
+                  >
+                  <md-option
+                    ng-value="'ringing'"
+                    ng-disabled="vm.voiceQueue.leavewhenempty.length === 1 && vm.voiceQueue.leavewhenempty[0] === 'ringing'"
+                    >ringing</md-option
+                  >
+                  <md-option
+                    ng-value="'unavailable'"
+                    ng-disabled="vm.voiceQueue.leavewhenempty.length === 1 && vm.voiceQueue.leavewhenempty[0] === 'unavailable'"
+                    >unavailable</md-option
+                  >
+                  <md-option
+                    ng-value="'invalid'"
+                    ng-disabled="vm.voiceQueue.leavewhenempty.length === 1 && vm.voiceQueue.leavewhenempty[0] === 'invalid'"
+                    >invalid</md-option
+                  >
+                  <md-option
+                    ng-value="'unknown'"
+                    ng-disabled="vm.voiceQueue.leavewhenempty.length === 1 && vm.voiceQueue.leavewhenempty[0] === 'unknown'"
+                    >unknown</md-option
+                  >
+                  <md-option
+                    ng-value="'wrapup'"
+                    ng-disabled="vm.voiceQueue.leavewhenempty.length === 1 && vm.voiceQueue.leavewhenempty[0] === 'wrapup'"
+                    >wrapup</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span translate="VOICE.HELP.LEAVEWHENEMPTY"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['leavewhenempty'].$error"
+                  ng-show="generalForm['leavewhenempty'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.LEAVEWHENEMPTY_REQUIRED"
+                      >LeaveWhenEmpty field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.MUSICONHOLD">MusicOnHold</label>
+                <md-select
+                  name="musiconhold"
+                  ng-model="vm.voiceQueue.musiconhold"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="musiconhold.name"
+                    ng-repeat="musiconhold in vm.musiconholds"
+                    ng-disabled="musiconhold.canSelect === false"
+                    >{{ musiconhold.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span translate="VOICE.HELP.MUSICONHOLD"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['musiconhold'].$error"
+                  ng-show="generalForm['musiconhold'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.MUSICONHOLD_REQUIRED"
+                      >MusicOnHold field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.ANNOUNCETOAGENT">AnnounceToAgent</label>
+                <md-select
+                  name="announce"
+                  ng-model="vm.voiceQueue.announce"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'FALSE'">None</md-option>
+                  <md-option
+                    ng-value="'/var/opt/motion2/server/files/sounds/converted/' + announce.save_name"
+                    ng-repeat="announce in vm.sounds"
+                    ng-disabled="announce.canSelect === false"
+                    >{{ announce.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span translate="VOICE.HELP.ANNOUNCETOAGENT"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['announce'].$error"
+                  ng-show="generalForm['announce'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.ANNOUNCETOAGENT_REQUIRED"
+                      >AnnounceToAgent field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.voiceQueue.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="VOICE.ANNOUNCEMENTS">ANNOUNCEMENTS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="voiceQueue-detail-form-container settings md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="VOICE.SETTINGS">
+                SETTINGS
+              </div>
+            </div>
+            <form name="settingsForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="VOICE.ANNOUNCEFREQUENCY"
+                  >AnnounceFrequency</label
+                >
+                <input
+                  type="number"
+                  name="announce_frequency"
+                  ng-model="vm.voiceQueue.announce_frequency"
+                  min="0"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="VOICE.HELP.ANNOUNCEFREQUENCY"></span>
+                </div>
+                <div
+                  ng-messages="settingsForm['announce_frequency'].$error"
+                  ng-show="settingsForm['announce_frequency'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.ANNOUNCEFREQUENCY_REQUIRED"
+                      >AnnounceFrequency field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="VOICE.ERRORS.ANNOUNCEFREQUENCY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AnnounceFrequency must be a valid greater or equal
+                      than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.MINANNOUNCEFREQUENCY"
+                  >MinAnnounceFrequency</label
+                >
+                <input
+                  type="number"
+                  name="min_announce_frequency"
+                  ng-model="vm.voiceQueue.min_announce_frequency"
+                  min="0"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="VOICE.HELP.MINANNOUNCEFREQUENCY"></span>
+                </div>
+                <div
+                  ng-messages="settingsForm['min_announce_frequency'].$error"
+                  ng-show="settingsForm['min_announce_frequency'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.MINANNOUNCEFREQUENCY_REQUIRED"
+                      >MinAnnounceFrequency field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="VOICE.ERRORS.MINANNOUNCEFREQUENCY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >MinAnnounceFrequency must be a valid greater or equal
+                      than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.PERIODICANNOUNCEFREQUENCY"
+                  >PeriodicAnnounceFrequency</label
+                >
+                <input
+                  type="number"
+                  name="periodic_announce_frequency"
+                  ng-model="vm.voiceQueue.periodic_announce_frequency"
+                  min="0"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="VOICE.HELP.PERIODICANNOUNCEFREQUENCY"></span>
+                </div>
+                <div
+                  ng-messages="settingsForm['periodic_announce_frequency'].$error"
+                  ng-show="settingsForm['periodic_announce_frequency'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="VOICE.ERRORS.PERIODICANNOUNCEFREQUENCY_REQUIRED"
+                      >PeriodicAnnounceFrequency field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="VOICE.ERRORS.PERIODICANNOUNCEFREQUENCY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >PeriodicAnnounceFrequency must be a valid greater or
+                      equal than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.RANDOMPERIODICANNOUNCE"
+                  >RandomPeriodicAnnounce</label
+                >
+                <md-select
+                  name="random_periodic_announce"
+                  ng-model="vm.voiceQueue.random_periodic_announce"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">
+                    {{ 'VOICE.YES' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'no'">
+                    {{ 'VOICE.NO' | translate }}
+                  </md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="VOICE.HELP.RANDOMPERIODICANNOUNCE"></span>
+                </div>
+                <div
+                  ng-messages="settingsForm['random_periodic_announce'].$error"
+                  ng-show="settingsForm['random_periodic_announce'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="VOICE.ERRORS.RANDOMPERIODICANNOUNCE_REQUIRED"
+                      >RandomPeriodicAnnounce field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.ANNOUNCEHOLDTIME"
+                  >AnnounceHoldtime</label
+                >
+                <md-select
+                  name="announce_holdtime"
+                  ng-model="vm.voiceQueue.announce_holdtime"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">Yes</md-option>
+                  <md-option ng-value="'no'">No</md-option>
+                  <md-option ng-value="'once'">Once</md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="VOICE.HELP.ANNOUNCEHOLDTIME"></span>
+                </div>
+                <div
+                  ng-messages="settingsForm['announce_holdtime'].$error"
+                  ng-show="settingsForm['announce_holdtime'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.ANNOUNCEHOLDTIME_REQUIRED"
+                      >AnnounceHoldtime field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.ANNOUNCECALLERPOSITION"
+                  >AnnounceCallerPosition</label
+                >
+                <md-select
+                  name="announce_position"
+                  ng-model="vm.voiceQueue.announce_position"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">Yes</md-option>
+                  <md-option ng-value="'no'">No</md-option>
+                  <md-option ng-value="'limit'">Limit</md-option>
+                  <md-option ng-value="'more'">More</md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="VOICE.HELP.ANNOUNCECALLERPOSITION"></span>
+                </div>
+                <div
+                  ng-messages="settingsForm['announce_position'].$error"
+                  ng-show="settingsForm['announce_position'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="VOICE.ERRORS.ANNOUNCECALLERPOSITION_REQUIRED"
+                      >AnnounceCallerPosition field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.ANNOUNCEPOSITIONLIMIT"
+                  >AnnouncePositionLimit</label
+                >
+                <input
+                  type="number"
+                  name="announce_position_limit"
+                  ng-model="vm.voiceQueue.announce_position_limit"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="VOICE.HELP.ANNOUNCEPOSITIONLIMIT"></span>
+                </div>
+                <div
+                  ng-messages="settingsForm['announce_position_limit'].$error"
+                  ng-show="settingsForm['announce_position_limit'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="VOICE.ERRORS.ANNOUNCEPOSITIONLIMIT_REQUIRED"
+                      >AnnouncePositionLimit field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.REPORTHOLDTIMEAGENT"
+                  >ReportHoldtimeAgent</label
+                >
+                <md-select
+                  name="reportholdtime"
+                  ng-model="vm.voiceQueue.reportholdtime"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">
+                    {{ 'VOICE.YES' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'no'">
+                    {{ 'VOICE.NO' | translate }}
+                  </md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="VOICE.HELP.REPORTHOLDTIMEAGENT"></span>
+                </div>
+                <div
+                  ng-messages="settingsForm['reportholdtime'].$error"
+                  ng-show="settingsForm['reportholdtime'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.REPORTHOLDTIMEAGENT_REQUIRED"
+                      >ReportHoldtimeAgent field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="voiceQueue-detail-form-container announcements md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="VOICE.ANNOUNCEMENTS">
+                ANNOUNCEMENTS
+              </div>
+            </div>
+            <form name="announcementsForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="VOICE.PERIODICANNOUNCE"
+                  >PeriodicAnnounce</label
+                >
+                <md-select
+                  name="periodic_announce"
+                  ng-model="vm.voiceQueue.periodic_announce"
+                  autofocus
+                  multiple
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="''">Default</md-option>
+                  <md-option
+                    ng-value="'/var/opt/motion2/server/files/sounds/converted/' + periodic_announce.save_name"
+                    ng-repeat="periodic_announce in vm.sounds"
+                    ng-disabled="periodic_announce.canSelect === false"
+                    >{{ periodic_announce.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span translate="VOICE.HELP.PERIODICANNOUNCE"></span>
+                </div>
+                <div
+                  ng-messages="announcementsForm['periodic_announce'].$error"
+                  ng-show="announcementsForm['periodic_announce'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.PERIODICANNOUNCE_REQUIRED"
+                      >PeriodicAnnounce field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.HOLDTIMEANNOUNCE"
+                  >HoldTimeAnnounce</label
+                >
+                <md-select
+                  name="queue_reporthold"
+                  ng-model="vm.voiceQueue.queue_reporthold"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="null">Default</md-option>
+                  <md-option ng-value="''">Disabled</md-option>
+                  <md-option
+                    ng-value="'/var/opt/motion2/server/files/sounds/converted/' + queue_reporthold.save_name"
+                    ng-repeat="queue_reporthold in vm.sounds"
+                    ng-disabled="queue_reporthold.canSelect === false"
+                    >{{ queue_reporthold.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span translate="VOICE.HELP.HOLDTIMEANNOUNCE"></span>
+                </div>
+                <div
+                  ng-messages="announcementsForm['queue_reporthold'].$error"
+                  ng-show="announcementsForm['queue_reporthold'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.HOLDTIMEANNOUNCE_REQUIRED"
+                      >HoldTimeAnnounce field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.YOUARENEXTANNOUNCE"
+                  >YouareNextAnnounce</label
+                >
+                <md-select
+                  name="queue_youarenext"
+                  ng-model="vm.voiceQueue.queue_youarenext"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="null">Default</md-option>
+                  <md-option ng-value="''">Disabled</md-option>
+                  <md-option
+                    ng-value="'/var/opt/motion2/server/files/sounds/converted/' + queue_youarenext.save_name"
+                    ng-repeat="queue_youarenext in vm.sounds"
+                    ng-disabled="queue_youarenext.canSelect === false"
+                    >{{ queue_youarenext.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span translate="VOICE.HELP.YOUARENEXTANNOUNCE"></span>
+                </div>
+                <div
+                  ng-messages="announcementsForm['queue_youarenext'].$error"
+                  ng-show="announcementsForm['queue_youarenext'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.YOUARENEXTANNOUNCE_REQUIRED"
+                      >YouareNextAnnounce field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.THEREAREANNOUNCE"
+                  >ThereareAnnounce</label
+                >
+                <md-select
+                  name="queue_thereare"
+                  ng-model="vm.voiceQueue.queue_thereare"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="null">Default</md-option>
+                  <md-option ng-value="''">Disabled</md-option>
+                  <md-option
+                    ng-value="'/var/opt/motion2/server/files/sounds/converted/' + queue_thereare.save_name"
+                    ng-repeat="queue_thereare in vm.sounds"
+                    ng-disabled="queue_thereare.canSelect === false"
+                    >{{ queue_thereare.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span translate="VOICE.HELP.THEREAREANNOUNCE"></span>
+                </div>
+                <div
+                  ng-messages="announcementsForm['queue_thereare'].$error"
+                  ng-show="announcementsForm['queue_thereare'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.THEREAREANNOUNCE_REQUIRED"
+                      >ThereareAnnounce field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.WAITINGCALLSANNOUNCE"
+                  >WaitingCallsAnnounce</label
+                >
+                <md-select
+                  name="queue_callswaiting"
+                  ng-model="vm.voiceQueue.queue_callswaiting"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="null">Default</md-option>
+                  <md-option ng-value="''">Disabled</md-option>
+                  <md-option
+                    ng-value="'/var/opt/motion2/server/files/sounds/converted/' + queue_callswaiting.save_name"
+                    ng-repeat="queue_callswaiting in vm.sounds"
+                    ng-disabled="queue_callswaiting.canSelect === false"
+                    >{{ queue_callswaiting.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span translate="VOICE.HELP.WAITINGCALLSANNOUNCE"></span>
+                </div>
+                <div
+                  ng-messages="announcementsForm['queue_callswaiting'].$error"
+                  ng-show="announcementsForm['queue_callswaiting'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.WAITINGCALLSANNOUNCE_REQUIRED"
+                      >WaitingCallsAnnounce field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.ESTIMATEDHOLDTIMEANNOUNCE"
+                  >EstimatedHoldTimeAnnounce</label
+                >
+                <md-select
+                  name="queue_holdtime"
+                  ng-model="vm.voiceQueue.queue_holdtime"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="null">Default</md-option>
+                  <md-option ng-value="''">Disabled</md-option>
+                  <md-option
+                    ng-value="'/var/opt/motion2/server/files/sounds/converted/' + queue_holdtime.save_name"
+                    ng-repeat="queue_holdtime in vm.sounds"
+                    ng-disabled="queue_holdtime.canSelect === false"
+                    >{{ queue_holdtime.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span translate="VOICE.HELP.ESTIMATEDHOLDTIMEANNOUNCE"></span>
+                </div>
+                <div
+                  ng-messages="announcementsForm['queue_holdtime'].$error"
+                  ng-show="announcementsForm['queue_holdtime'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="VOICE.ERRORS.ESTIMATEDHOLDTIMEANNOUNCE_REQUIRED"
+                      >EstimatedHoldTimeAnnounce field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.MINUTESANNOUNCE">MinutesAnnounce</label>
+                <md-select
+                  name="queue_minutes"
+                  ng-model="vm.voiceQueue.queue_minutes"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="null">Default</md-option>
+                  <md-option ng-value="''">Disabled</md-option>
+                  <md-option
+                    ng-value="'/var/opt/motion2/server/files/sounds/converted/' + queue_minutes.save_name"
+                    ng-repeat="queue_minutes in vm.sounds"
+                    ng-disabled="queue_minutes.canSelect === false"
+                    >{{ queue_minutes.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span translate="VOICE.HELP.MINUTESANNOUNCE"></span>
+                </div>
+                <div
+                  ng-messages="announcementsForm['queue_minutes'].$error"
+                  ng-show="announcementsForm['queue_minutes'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.MINUTESANNOUNCE_REQUIRED"
+                      >MinutesAnnounce field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.MINUTEANNOUNCE">MinuteAnnounce</label>
+                <md-select
+                  name="queue_minute"
+                  ng-model="vm.voiceQueue.queue_minute"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="null">Default</md-option>
+                  <md-option ng-value="''">Disabled</md-option>
+                  <md-option
+                    ng-value="'/var/opt/motion2/server/files/sounds/converted/' + queue_minute.save_name"
+                    ng-repeat="queue_minute in vm.sounds"
+                    ng-disabled="queue_minute.canSelect === false"
+                    >{{ queue_minute.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span translate="VOICE.HELP.MINUTEANNOUNCE"></span>
+                </div>
+                <div
+                  ng-messages="announcementsForm['queue_minute'].$error"
+                  ng-show="announcementsForm['queue_minute'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.MINUTEANNOUNCE_REQUIRED"
+                      >MinuteAnnounce field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.SECONDSANNOUNCE">SecondsAnnounce</label>
+                <md-select
+                  name="queue_seconds"
+                  ng-model="vm.voiceQueue.queue_seconds"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="null">Default</md-option>
+                  <md-option ng-value="''">Disabled</md-option>
+                  <md-option
+                    ng-value="'/var/opt/motion2/server/files/sounds/converted/' + queue_seconds.save_name"
+                    ng-repeat="queue_seconds in vm.sounds"
+                    ng-disabled="queue_seconds.canSelect === false"
+                    >{{ queue_seconds.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span translate="VOICE.HELP.SECONDSANNOUNCE"></span>
+                </div>
+                <div
+                  ng-messages="announcementsForm['queue_seconds'].$error"
+                  ng-show="announcementsForm['queue_seconds'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.SECONDSANNOUNCE_REQUIRED"
+                      >SecondsAnnounce field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.THANKYOUANNOUNCE"
+                  >ThankYouAnnounce</label
+                >
+                <md-select
+                  name="queue_thankyou"
+                  ng-model="vm.voiceQueue.queue_thankyou"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="null">Default</md-option>
+                  <md-option ng-value="''">Disabled</md-option>
+                  <md-option
+                    ng-value="'/var/opt/motion2/server/files/sounds/converted/' + queue_thankyou.save_name"
+                    ng-repeat="queue_thankyou in vm.sounds"
+                    ng-disabled="queue_thankyou.canSelect === false"
+                    >{{ queue_thankyou.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span translate="VOICE.HELP.THANKYOUANNOUNCE"></span>
+                </div>
+                <div
+                  ng-messages="announcementsForm['queue_thankyou'].$error"
+                  ng-show="announcementsForm['queue_thankyou'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.THANKYOUANNOUNCE_REQUIRED"
+                      >ThankYouAnnounce field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="VOICE.ADVANCED">ADVANCED</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="voiceQueue-detail-form-container advanced md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="VOICE.ADVANCED">
+                ADVANCED
+              </div>
+            </div>
+            <form name="advancedForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.voiceQueue.acw"
+                  aria-label="AfterCallWork"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="VOICE.AFTERCALLWORK"
+                    >AfterCallWork</span
+                  ></md-switch
+                >
+
+                <div class="hint">
+                  <span translate="VOICE.HELP.AFTERCALLWORK"></span>
+                </div>
+              </md-input-container>
+              <md-input-container ng-if="vm.voiceQueue.acw" class="md-block">
+                <label translate="VOICE.AFTERCALLWORKDURATION"
+                  >AfterCallWorkDuration</label
+                >
+                <input
+                  type="number"
+                  name="acwTimeout"
+                  ng-model="vm.voiceQueue.acwTimeout"
+                  min="0"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="VOICE.HELP.AFTERCALLWORKDURATION"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['acwTimeout'].$error"
+                  ng-show="advancedForm['acwTimeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="VOICE.ERRORS.AFTERCALLWORKDURATION_REQUIRED"
+                      >AfterCallWorkDuration field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="VOICE.ERRORS.AFTERCALLWORKDURATION_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >AfterCallWorkDuration must be a valid greater or equal
+                      than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.AUTOPAUSE">AutoPause</label>
+                <md-select
+                  name="autopause"
+                  ng-model="vm.voiceQueue.autopause"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'all'">
+                    {{ 'VOICE.YES' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'no'">
+                    {{ 'VOICE.NO' | translate }}
+                  </md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="VOICE.HELP.AUTOPAUSE"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['autopause'].$error"
+                  ng-show="advancedForm['autopause'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.AUTOPAUSE_REQUIRED"
+                      >AutoPause field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.RINGINUSE">RingInUse</label>
+                <md-select
+                  name="ringinuse"
+                  ng-model="vm.voiceQueue.ringinuse"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">
+                    {{ 'VOICE.YES' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'no'">
+                    {{ 'VOICE.NO' | translate }}
+                  </md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="VOICE.HELP.RINGINUSE"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['ringinuse'].$error"
+                  ng-show="advancedForm['ringinuse'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.RINGINUSE_REQUIRED"
+                      >RingInUse field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.MEMBERDELAY">MemberDelay</label>
+                <input
+                  type="number"
+                  name="memberdelay"
+                  ng-model="vm.voiceQueue.memberdelay"
+                  min="0"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="VOICE.HELP.MEMBERDELAY"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['memberdelay'].$error"
+                  ng-show="advancedForm['memberdelay'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.MEMBERDELAY_REQUIRED"
+                      >MemberDelay field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="VOICE.ERRORS.MEMBERDELAY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >MemberDelay must be a valid greater or equal than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.TIMEOUTRESTART">TimeoutRestart</label>
+                <md-select
+                  name="timeoutrestart"
+                  ng-model="vm.voiceQueue.timeoutrestart"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">
+                    {{ 'VOICE.YES' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'no'">
+                    {{ 'VOICE.NO' | translate }}
+                  </md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="VOICE.HELP.TIMEOUTRESTART"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['timeoutrestart'].$error"
+                  ng-show="advancedForm['timeoutrestart'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.TIMEOUTRESTART_REQUIRED"
+                      >TimeoutRestart field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.MONITORFORMAT">MonitorFormat</label>
+                <md-select
+                  name="monitor_format"
+                  ng-model="vm.voiceQueue.monitor_format"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="''">Inactive</md-option>
+                  <md-option ng-value="'wav'">wav</md-option>
+                  <md-option ng-value="'wav49'">wav49</md-option>
+                  <md-option ng-value="'gsm'">gsm</md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="VOICE.HELP.MONITORFORMAT"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['monitor_format'].$error"
+                  ng-show="advancedForm['monitor_format'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.MONITORFORMAT_REQUIRED"
+                      >MonitorFormat field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.CONTEXT">Context</label>
+                <input
+                  type="text"
+                  name="context"
+                  ng-model="vm.voiceQueue.context"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="VOICE.HELP.CONTEXT"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['context'].$error"
+                  ng-show="advancedForm['context'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.CONTEXT_REQUIRED"
+                      >Context field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.SETINTERFACEVARIABLES"
+                  >SetInterfaceVariables</label
+                >
+                <md-select
+                  name="setinterfacevar"
+                  ng-model="vm.voiceQueue.setinterfacevar"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">
+                    {{ 'VOICE.YES' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'no'">
+                    {{ 'VOICE.NO' | translate }}
+                  </md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="VOICE.HELP.SETINTERFACEVARIABLES"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['setinterfacevar'].$error"
+                  ng-show="advancedForm['setinterfacevar'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="VOICE.ERRORS.SETINTERFACEVARIABLES_REQUIRED"
+                      >SetInterfaceVariables field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.SETQUEUEVARIABLES"
+                  >SetQueueVariables</label
+                >
+                <md-select
+                  name="setqueuevar"
+                  ng-model="vm.voiceQueue.setqueuevar"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">
+                    {{ 'VOICE.YES' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'no'">
+                    {{ 'VOICE.NO' | translate }}
+                  </md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="VOICE.HELP.SETQUEUEVARIABLES"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['setqueuevar'].$error"
+                  ng-show="advancedForm['setqueuevar'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.SETQUEUEVARIABLES_REQUIRED"
+                      >SetQueueVariables field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.SETQUEUEENTRYVARIABLES"
+                  >SetQueueEntryVariables</label
+                >
+                <md-select
+                  name="setqueueentryvar"
+                  ng-model="vm.voiceQueue.setqueueentryvar"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">
+                    {{ 'VOICE.YES' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'no'">
+                    {{ 'VOICE.NO' | translate }}
+                  </md-option>
+                </md-select>
+                <div class="hint">
+                  <span translate="VOICE.HELP.SETQUEUEENTRYVARIABLES"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['setqueueentryvar'].$error"
+                  ng-show="advancedForm['setqueueentryvar'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="VOICE.ERRORS.SETQUEUEENTRYVARIABLES_REQUIRED"
+                      >SetQueueEntryVariables field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.SERVICELEVEL">ServiceLevel</label>
+                <input
+                  type="number"
+                  name="servicelevel"
+                  ng-model="vm.voiceQueue.servicelevel"
+                  min="0"
+                  max="100"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="VOICE.HELP.SERVICELEVEL"></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['servicelevel'].$error"
+                  ng-show="advancedForm['servicelevel'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.SERVICELEVEL_REQUIRED"
+                      >ServiceLevel field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="VOICE.ERRORS.SERVICELEVEL_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >ServiceLevel must be a valid greater or equal than</span
+                    >
+                    <span>0</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="VOICE.ERRORS.SERVICELEVEL_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >ServiceLevel must be a valid greater or equal than</span
+                    >
+                    <span>100</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.voiceQueue.mandatoryDisposition"
+                  aria-label="MandatoryDisposition"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="VOICE.MANDATORYDISPOSITION"
+                    >MandatoryDisposition</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.voiceQueue.mandatoryDisposition"
+                class="md-block"
+              >
+                <label translate="VOICE.MANDATORYDISPOSITIONPAUSEID"
+                  >MandatoryDispositionPauseId</label
+                >
+                <md-select
+                  name="mandatoryDispositionPauseId"
+                  ng-model="vm.voiceQueue.mandatoryDispositionPauseId"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="mandatoryDispositionPauseId.id"
+                    ng-repeat="mandatoryDispositionPauseId in vm.pauses"
+                    ng-disabled="mandatoryDispositionPauseId.canSelect === false"
+                    >{{ mandatoryDispositionPauseId.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span
+                    translate="VOICE.HELP.MANDATORYDISPOSITIONPAUSEID"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="advancedForm['mandatoryDispositionPauseId'].$error"
+                  ng-show="advancedForm['mandatoryDispositionPauseId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="VOICE.ERRORS.MANDATORYDISPOSITIONPAUSEID_REQUIRED"
+                      >MandatoryDispositionPauseId field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/voice/views/voiceQueues/voiceQueues.html/voiceQueues-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/voiceQueues/voiceQueues.html/voiceQueues-[chunkhash].html
deleted file mode 100644
index 96b0718..0000000
--- a/public/src/js/modules/main/apps/voice/views/voiceQueues/voiceQueues.html/voiceQueues-[chunkhash].html
+++ /dev/null
@@ -1,342 +0,0 @@
-<div
-  id="voiceQueues"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-phone" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="VOICE.VOICEQUEUES">VoiceQueues</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="VOICE.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedVoiceQueues.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedVoiceQueues =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="VOICE.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-voiceQueues-count">
-          <span>{{vm.selectedVoiceQueues.length}}</span>
-          <span translate="VOICE.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="VOICE.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllVoiceQueues()"
-                translate="VOICE.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectVoiceQueues()"
-                translate="VOICE.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedVoiceQueues"
-          csv-label="true"
-          filename="voiceQueues.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedVoiceQueues($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="VOICE.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- VOICEQUEUE TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedVoiceQueues"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getVoiceQueues"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'VOICE.ID' | translate }}</th>
-                <th md-column md-order-by="name">
-                  {{ 'VOICE.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="strategy">
-                  {{ 'VOICE.STRATEGY' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'VOICE.DESCRIPTION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.voiceQueues.rows.length">
-                <td md-cell colspan="5">
-                  <div layout="row" layout-align="center center">
-                    <span translate="VOICE.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="voiceQueue"
-                md-select-id="id"
-                ng-repeat="voiceQueue in vm.voiceQueues.rows"
-              >
-                <td md-cell ng-if="voiceQueue.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{voiceQueue.name}}"
-                    ng-src="api/users/{{voiceQueue.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!voiceQueue.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{voiceQueue.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceQueue, ev) : vm.createOrEditVoiceQueue($event, voiceQueue)"
-                  md-cell
-                  class="id"
-                >
-                  {{voiceQueue.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceQueue, ev) : vm.createOrEditVoiceQueue($event, voiceQueue)"
-                  md-cell
-                  class="name"
-                >
-                  {{voiceQueue.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceQueue, ev) : vm.createOrEditVoiceQueue($event, voiceQueue)"
-                  md-cell
-                  class="strategy"
-                >
-                  {{ vm.arraystrategy[voiceQueue.strategy].option }}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceQueue, ev) : vm.createOrEditVoiceQueue($event, voiceQueue)"
-                  md-cell
-                  class="description"
-                >
-                  {{voiceQueue.description}}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="VOICE.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(voiceQueue, $event    )"
-                          translate="VOICE.EDIT_VOICEQUEUE"
-                        >
-                          Edit VoiceQueue
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.teamadddialog(voiceQueue, $event    )"
-                          translate="VOICE.TEAMADD_VOICEQUEUE"
-                        >
-                          teamadd VoiceQueue
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.agentadddialog(voiceQueue, $event    )"
-                          translate="VOICE.AGENTADD_VOICEQUEUE"
-                        >
-                          agentadd VoiceQueue
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(voiceQueue, $event    )"
-                          translate="VOICE.DELETE_VOICEQUEUE"
-                        >
-                          Delete VoiceQueue
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.gotorealtimegoto(voiceQueue, $event    )"
-                          translate="VOICE.GOTOREALTIME_VOICEQUEUE"
-                        >
-                          goToRealtime VoiceQueue
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.voiceQueues.count}}"
-          md-on-paginate="vm.getVoiceQueues"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / VOICEQUEUE TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD VOICEQUEUE BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-voiceQueue-button"
-    ng-click="vm.createOrEditVoiceQueue($event)"
-    aria-label="add voiceQueue"
-    translate
-    translate-attr-aria-label="VOICE.ADD_VOICEQUEUE"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD VOICEQUEUE BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/voice/views/voiceQueues/voiceQueues.html/voiceQueues.html b/public/src/js/modules/main/apps/voice/views/voiceQueues/voiceQueues.html/voiceQueues.html
new file mode 100644
index 0000000..96b0718
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/voiceQueues/voiceQueues.html/voiceQueues.html
@@ -0,0 +1,342 @@
+<div
+  id="voiceQueues"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-phone" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="VOICE.VOICEQUEUES">VoiceQueues</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="VOICE.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedVoiceQueues.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedVoiceQueues =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="VOICE.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-voiceQueues-count">
+          <span>{{vm.selectedVoiceQueues.length}}</span>
+          <span translate="VOICE.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="VOICE.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllVoiceQueues()"
+                translate="VOICE.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectVoiceQueues()"
+                translate="VOICE.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedVoiceQueues"
+          csv-label="true"
+          filename="voiceQueues.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedVoiceQueues($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="VOICE.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- VOICEQUEUE TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedVoiceQueues"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getVoiceQueues"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'VOICE.ID' | translate }}</th>
+                <th md-column md-order-by="name">
+                  {{ 'VOICE.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="strategy">
+                  {{ 'VOICE.STRATEGY' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'VOICE.DESCRIPTION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.voiceQueues.rows.length">
+                <td md-cell colspan="5">
+                  <div layout="row" layout-align="center center">
+                    <span translate="VOICE.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="voiceQueue"
+                md-select-id="id"
+                ng-repeat="voiceQueue in vm.voiceQueues.rows"
+              >
+                <td md-cell ng-if="voiceQueue.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{voiceQueue.name}}"
+                    ng-src="api/users/{{voiceQueue.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!voiceQueue.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{voiceQueue.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceQueue, ev) : vm.createOrEditVoiceQueue($event, voiceQueue)"
+                  md-cell
+                  class="id"
+                >
+                  {{voiceQueue.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceQueue, ev) : vm.createOrEditVoiceQueue($event, voiceQueue)"
+                  md-cell
+                  class="name"
+                >
+                  {{voiceQueue.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceQueue, ev) : vm.createOrEditVoiceQueue($event, voiceQueue)"
+                  md-cell
+                  class="strategy"
+                >
+                  {{ vm.arraystrategy[voiceQueue.strategy].option }}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceQueue, ev) : vm.createOrEditVoiceQueue($event, voiceQueue)"
+                  md-cell
+                  class="description"
+                >
+                  {{voiceQueue.description}}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="VOICE.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(voiceQueue, $event    )"
+                          translate="VOICE.EDIT_VOICEQUEUE"
+                        >
+                          Edit VoiceQueue
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.teamadddialog(voiceQueue, $event    )"
+                          translate="VOICE.TEAMADD_VOICEQUEUE"
+                        >
+                          teamadd VoiceQueue
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.agentadddialog(voiceQueue, $event    )"
+                          translate="VOICE.AGENTADD_VOICEQUEUE"
+                        >
+                          agentadd VoiceQueue
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(voiceQueue, $event    )"
+                          translate="VOICE.DELETE_VOICEQUEUE"
+                        >
+                          Delete VoiceQueue
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.gotorealtimegoto(voiceQueue, $event    )"
+                          translate="VOICE.GOTOREALTIME_VOICEQUEUE"
+                        >
+                          goToRealtime VoiceQueue
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.voiceQueues.count}}"
+          md-on-paginate="vm.getVoiceQueues"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / VOICEQUEUE TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD VOICEQUEUE BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-voiceQueue-button"
+    ng-click="vm.createOrEditVoiceQueue($event)"
+    aria-label="add voiceQueue"
+    translate
+    translate-attr-aria-label="VOICE.ADD_VOICEQUEUE"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD VOICEQUEUE BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/voice/views/voiceRecordings/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/voiceRecordings/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index ea08f3b..0000000
--- a/public/src/js/modules/main/apps/voice/views/voiceRecordings/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,169 +0,0 @@
-<md-dialog class="voiceRecording-dialog" aria-label="New VoiceRecording">
-  <form name="voiceRecordingForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.RATING">Rating</label>
-        <md-select
-          name="rating"
-          ng-model="vm.voiceRecording.rating"
-          autofocus
-          ng-disabled="!vm.newVoiceRecording && !vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="null"
-            >{{'VOICE.NO_RATING' | translate}}</md-option
-          >
-          <md-option value="1"
-            ><md-icon
-              md-font-icon="icon-star"
-              style="color: red"
-              ng-repeat="icon in [1]"
-            ></md-icon
-          ></md-option>
-          <md-option value="2"
-            ><md-icon
-              md-font-icon="icon-star"
-              style="color: red"
-              ng-repeat="icon in [1,2]"
-            ></md-icon
-          ></md-option>
-          <md-option value="3"
-            ><md-icon
-              md-font-icon="icon-star"
-              style="color: red"
-              ng-repeat="icon in [1,2,3]"
-            ></md-icon
-          ></md-option>
-          <md-option value="4"
-            ><md-icon
-              md-font-icon="icon-star"
-              style="color: red"
-              ng-repeat="icon in [1,2,3,4]"
-            ></md-icon
-          ></md-option>
-          <md-option value="5"
-            ><md-icon
-              md-font-icon="icon-star"
-              style="color: red"
-              ng-repeat="icon in [1,2,3,4,5]"
-            ></md-icon
-          ></md-option>
-        </md-select>
-        <div
-          ng-messages="voiceRecordingForm['rating'].$error"
-          ng-show="voiceRecordingForm[rating].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.RATING_REQUIRED"
-              >Rating field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newVoiceRecording"
-          ng-click="vm.saveVoiceRecording()"
-          class="send-button md-accent md-raised"
-          ng-disabled="voiceRecordingForm.$invalid || voiceRecordingForm.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newVoiceRecording"
-          ng-click="vm.addNewVoiceRecording()"
-          class="send-button md-accent md-raised"
-          ng-disabled="voiceRecordingForm.$invalid"
-          aria-label="ADD"
-          translate="VOICE.ADD_VOICERECORDING"
-          translate-attr-aria-label="VOICE.ADD_VOICERECORDING"
-        >
-          ADD VOICERECORDING
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newVoiceRecording"
-          ng-click="vm.deleteVoiceRecording($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="VOICE.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="VOICE.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/voiceRecordings/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/voiceRecordings/create/dialog.html/dialog.html
new file mode 100644
index 0000000..ea08f3b
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/voiceRecordings/create/dialog.html/dialog.html
@@ -0,0 +1,169 @@
+<md-dialog class="voiceRecording-dialog" aria-label="New VoiceRecording">
+  <form name="voiceRecordingForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.RATING">Rating</label>
+        <md-select
+          name="rating"
+          ng-model="vm.voiceRecording.rating"
+          autofocus
+          ng-disabled="!vm.newVoiceRecording && !vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="null"
+            >{{'VOICE.NO_RATING' | translate}}</md-option
+          >
+          <md-option value="1"
+            ><md-icon
+              md-font-icon="icon-star"
+              style="color: red"
+              ng-repeat="icon in [1]"
+            ></md-icon
+          ></md-option>
+          <md-option value="2"
+            ><md-icon
+              md-font-icon="icon-star"
+              style="color: red"
+              ng-repeat="icon in [1,2]"
+            ></md-icon
+          ></md-option>
+          <md-option value="3"
+            ><md-icon
+              md-font-icon="icon-star"
+              style="color: red"
+              ng-repeat="icon in [1,2,3]"
+            ></md-icon
+          ></md-option>
+          <md-option value="4"
+            ><md-icon
+              md-font-icon="icon-star"
+              style="color: red"
+              ng-repeat="icon in [1,2,3,4]"
+            ></md-icon
+          ></md-option>
+          <md-option value="5"
+            ><md-icon
+              md-font-icon="icon-star"
+              style="color: red"
+              ng-repeat="icon in [1,2,3,4,5]"
+            ></md-icon
+          ></md-option>
+        </md-select>
+        <div
+          ng-messages="voiceRecordingForm['rating'].$error"
+          ng-show="voiceRecordingForm[rating].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.RATING_REQUIRED"
+              >Rating field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newVoiceRecording"
+          ng-click="vm.saveVoiceRecording()"
+          class="send-button md-accent md-raised"
+          ng-disabled="voiceRecordingForm.$invalid || voiceRecordingForm.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newVoiceRecording"
+          ng-click="vm.addNewVoiceRecording()"
+          class="send-button md-accent md-raised"
+          ng-disabled="voiceRecordingForm.$invalid"
+          aria-label="ADD"
+          translate="VOICE.ADD_VOICERECORDING"
+          translate-attr-aria-label="VOICE.ADD_VOICERECORDING"
+        >
+          ADD VOICERECORDING
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newVoiceRecording"
+          ng-click="vm.deleteVoiceRecording($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="VOICE.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="VOICE.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/voiceRecordings/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/voiceRecordings/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index 4741e13..0000000
--- a/public/src/js/modules/main/apps/voice/views/voiceRecordings/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,571 +0,0 @@
-<div
-  id="voice-voiceRecording"
-  class="page-layout simple tabbed"
-  layout="column"
->
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-voiceRecordings-button md-icon-button"
-        aria-label="Go to voiceRecordings"
-        ng-click="vm.gotoVoiceRecordings()"
-        translate
-        translate-attr-aria-label="VOICE.GO_TO_VOICERECORDINGS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="voiceRecording-image" hide-xs>
-          <img ng-src="assets/images/business/voiceRecordings.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.voiceRecording.id}}
-            <span ng-if="vm.voiceRecording.name"
-              >{{vm.voiceRecording.name}}</span
-            >
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="VOICE.CREATED_AT"></span>
-            <span>{{vm.voiceRecording.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveVoiceRecording()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(voiceRecordingsForm.$invalid) || (transcriptForm.$invalid) || (sentimentAnalysisForm.$invalid)"
-        translate="VOICE.SAVE"
-        translate-attr-aria-label="VOICE.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="VOICE.GENERAL">GENERAL</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="voiceRecording-detail-form-container voicerecordings md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="VOICE.VOICERECORDINGS">
-                VOICERECORDINGS
-              </div>
-            </div>
-            <form name="voiceRecordingsForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="VOICE.TYPE">Type</label>
-                <input
-                  type=""
-                  name="type"
-                  ng-model="vm.voiceRecording.type"
-                  autofocus
-                  disabled
-                />
-
-                <div
-                  ng-messages="voiceRecordingsForm['type'].$error"
-                  ng-show="voiceRecordingsForm['type'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.TYPE_REQUIRED"
-                      >Type field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.UNIQUEID">UniqueId</label>
-                <input
-                  type=""
-                  name="uniqueid"
-                  ng-model="vm.voiceRecording.uniqueid"
-                  disabled
-                />
-
-                <div
-                  ng-messages="voiceRecordingsForm['uniqueid'].$error"
-                  ng-show="voiceRecordingsForm['uniqueid'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.UNIQUEID_REQUIRED"
-                      >UniqueId field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.CALLER">Caller</label>
-                <input
-                  type=""
-                  name="calleridnum"
-                  ng-model="vm.voiceRecording.calleridnum"
-                  disabled
-                />
-
-                <div
-                  ng-messages="voiceRecordingsForm['calleridnum'].$error"
-                  ng-show="voiceRecordingsForm['calleridnum'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.CALLER_REQUIRED"
-                      >Caller field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.CALLED">Called</label>
-                <input
-                  type=""
-                  name="exten"
-                  ng-model="vm.voiceRecording.exten"
-                  disabled
-                />
-
-                <div
-                  ng-messages="voiceRecordingsForm['exten'].$error"
-                  ng-show="voiceRecordingsForm['exten'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.CALLED_REQUIRED"
-                      >Called field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.CONNECTED">Connected</label>
-                <input
-                  type=""
-                  name="connectedlinenum"
-                  ng-model="vm.voiceRecording.connectedlinenum"
-                  disabled
-                />
-
-                <div
-                  ng-messages="voiceRecordingsForm['connectedlinenum'].$error"
-                  ng-show="voiceRecordingsForm['connectedlinenum'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.CONNECTED_REQUIRED"
-                      >Connected field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.QUEUE">Queue</label>
-                <input
-                  type=""
-                  name="queue"
-                  ng-model="vm.voiceRecording.queue"
-                  disabled
-                />
-
-                <div
-                  ng-messages="voiceRecordingsForm['queue'].$error"
-                  ng-show="voiceRecordingsForm['queue'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.QUEUE_REQUIRED"
-                      >Queue field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.AGENT">Agent</label>
-                <input
-                  type="text"
-                  name="membername"
-                  ng-model="vm.voiceRecording.membername"
-                  disabled
-                />
-
-                <div
-                  ng-messages="voiceRecordingsForm['membername'].$error"
-                  ng-show="voiceRecordingsForm['membername'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.AGENT_REQUIRED"
-                      >Agent field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.RATING">Rating</label>
-                <md-select
-                  name="rating"
-                  ng-model="vm.voiceRecording.rating"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="null"
-                    >{{'VOICE.NO_RATING' | translate}}</md-option
-                  >
-                  <md-option value="1"
-                    ><md-icon
-                      md-font-icon="icon-star"
-                      style="color: red"
-                      ng-repeat="icon in [1]"
-                    ></md-icon
-                  ></md-option>
-                  <md-option value="2"
-                    ><md-icon
-                      md-font-icon="icon-star"
-                      style="color: red"
-                      ng-repeat="icon in [1,2]"
-                    ></md-icon
-                  ></md-option>
-                  <md-option value="3"
-                    ><md-icon
-                      md-font-icon="icon-star"
-                      style="color: red"
-                      ng-repeat="icon in [1,2,3]"
-                    ></md-icon
-                  ></md-option>
-                  <md-option value="4"
-                    ><md-icon
-                      md-font-icon="icon-star"
-                      style="color: red"
-                      ng-repeat="icon in [1,2,3,4]"
-                    ></md-icon
-                  ></md-option>
-                  <md-option value="5"
-                    ><md-icon
-                      md-font-icon="icon-star"
-                      style="color: red"
-                      ng-repeat="icon in [1,2,3,4,5]"
-                    ></md-icon
-                  ></md-option>
-                </md-select>
-                <div
-                  ng-messages="voiceRecordingsForm['rating'].$error"
-                  ng-show="voiceRecordingsForm[rating].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.RATING_REQUIRED"
-                      >Rating field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.DISPOSITION">Disposition</label>
-                <input
-                  type="text"
-                  name="userDisposition"
-                  ng-model="vm.voiceRecording.userDisposition"
-                  disabled
-                />
-
-                <div
-                  ng-messages="voiceRecordingsForm['userDisposition'].$error"
-                  ng-show="voiceRecordingsForm['userDisposition'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.DISPOSITION_REQUIRED"
-                      >Disposition field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.SECOND_LEVEL_DISPOSITION"
-                  >Second_Level_Disposition</label
-                >
-                <input
-                  type="text"
-                  name="userSecondDisposition"
-                  ng-model="vm.voiceRecording.userSecondDisposition"
-                  disabled
-                />
-
-                <div
-                  ng-messages="voiceRecordingsForm['userSecondDisposition'].$error"
-                  ng-show="voiceRecordingsForm['userSecondDisposition'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="VOICE.ERRORS.SECOND_LEVEL_DISPOSITION_REQUIRED"
-                      >Second_Level_Disposition field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.THIRD_LEVEL_DISPOSITION"
-                  >Third_Level_Disposition</label
-                >
-                <input
-                  type="text"
-                  name="userThirdDisposition"
-                  ng-model="vm.voiceRecording.userThirdDisposition"
-                  disabled
-                />
-
-                <div
-                  ng-messages="voiceRecordingsForm['userThirdDisposition'].$error"
-                  ng-show="voiceRecordingsForm['userThirdDisposition'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="VOICE.ERRORS.THIRD_LEVEL_DISPOSITION_REQUIRED"
-                      >Third_Level_Disposition field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab ng-if="vm.license.ai">
-        <md-tab-label>
-          <span translate="VOICE.TRANSCRIPTANALYSIS">TRANSCRIPTANALYSIS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="voiceRecording-detail-form-container transcript md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="VOICE.TRANSCRIPT">
-                TRANSCRIPT
-              </div>
-            </div>
-            <form name="transcriptForm" novalidate>
-              <md-input-container
-                ng-if="vm.voiceRecording.transcribeStatus == 'COMPLETED'"
-                class="md-block"
-              >
-                <label translate="VOICE.TEXT">Text</label>
-                <textarea
-                  name="fileText"
-                  ng-model="vm.voiceRecording.fileText"
-                  autofocus
-                  ng-disabled="true"
-                ></textarea>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.voiceRecording.transcribeStatus == 'FAILED'"
-                class="md-block"
-              >
-                <label translate="VOICE.FAILUREREASON">FailureReason</label>
-                <textarea
-                  name="failureReason"
-                  ng-model="vm.voiceRecording.failureReason"
-                  ng-disabled="true"
-                ></textarea>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="voiceRecording-detail-form-container sentimentanalysis md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="VoiceRecordingSentimentStatisticsController as vm_ss"
-              ng-init="vm_ss.init(vm.voiceRecording)"
-            >
-              <md-toolbar class="md-table-toolbar md-default">
-                <div class="md-toolbar-tools">
-                  <span
-                    class="md-subhead"
-                    translate="VOICE.SENTIMENTANALYSIS"
-                    style="width: 50px"
-                    >Sentiment Analysis</span
-                  >
-                  <div flex></div>
-                </div>
-              </md-toolbar>
-
-              <!-- WIDGET GROUP -->
-              <div class="widget-group" layout="row" flex="100" layout-wrap>
-                <!-- WIDGET 1 -->
-                <ms-widget
-                  class="h-140"
-                  layout="column"
-                  flex="100"
-                  flex-gt-xs="50"
-                  flex-gt-md="20"
-                >
-                  <!-- Front -->
-                  <ms-widget-front class="p-16 white-bg" layout="row" flex>
-                    <div
-                      class="pt-8 pb-8"
-                      layout="column"
-                      layout-align="center center"
-                      flex
-                    >
-                      <div
-                        class="md-display-1 pb-8 sentiment"
-                        ng-class="vm_ss.voiceRecording.sentiment"
-                      >
-                        {{vm_ss.voiceRecording.sentiment}}
-                      </div>
-                      <div class="font-weight-500 secondary-text">
-                        {{ 'VOICE.SENTIMENT' | translate | uppercase }}
-                      </div>
-                    </div>
-                  </ms-widget-front>
-                  <!-- / Front -->
-                </ms-widget>
-                <!-- / WIDGET 1 -->
-
-                <!-- WIDGET 2 -->
-                <ms-widget
-                  class="h-140"
-                  layout="column"
-                  flex="100"
-                  flex-gt-xs="50"
-                  flex-gt-md="20"
-                >
-                  <!-- Front -->
-                  <ms-widget-front class="p-16 white-bg" layout="row" flex>
-                    <div
-                      class="pt-8 pb-8"
-                      layout="column"
-                      layout-align="center center"
-                      flex
-                    >
-                      <div class="md-display-1 pb-8">
-                        ({{ (vm_ss.voiceRecording.sPositive || 0) * 100 |
-                        number: 2 }}%)
-                      </div>
-                      <div class="font-weight-500 secondary-text">
-                        {{ 'VOICE.SENTIMENT_POSITIVE' | translate | uppercase }}
-                      </div>
-                    </div>
-                  </ms-widget-front>
-                  <!-- / Front -->
-                </ms-widget>
-                <!-- / WIDGET 2 -->
-
-                <!-- WIDGET 3 -->
-                <ms-widget
-                  class="h-140"
-                  layout="column"
-                  flex="100"
-                  flex-gt-xs="50"
-                  flex-gt-md="20"
-                >
-                  <!-- Front -->
-                  <ms-widget-front class="p-16 white-bg" layout="row" flex>
-                    <div
-                      class="pt-8 pb-8"
-                      layout="column"
-                      layout-align="center center"
-                      flex
-                    >
-                      <div class="md-display-1 pb-8">
-                        ({{ (vm_ss.voiceRecording.sNegative || 0) * 100 |
-                        number: 2 }}%)
-                      </div>
-                      <div class="font-weight-500 secondary-text">
-                        {{ 'VOICE.SENTIMENT_NEGATIVE' | translate | uppercase }}
-                      </div>
-                    </div>
-                  </ms-widget-front>
-                  <!-- / Front -->
-                </ms-widget>
-                <!-- / WIDGET 3 -->
-
-                <!-- WIDGET 4 -->
-                <ms-widget
-                  class="h-140"
-                  layout="column"
-                  flex="100"
-                  flex-gt-xs="50"
-                  flex-gt-md="20"
-                >
-                  <!-- Front -->
-                  <ms-widget-front class="p-16 white-bg" layout="row" flex>
-                    <div
-                      class="pt-8 pb-8"
-                      layout="column"
-                      layout-align="center center"
-                      flex
-                    >
-                      <div class="md-display-1 pb-8">
-                        ({{ (vm_ss.voiceRecording.sNeutral || 0) * 100 | number:
-                        2 }}%)
-                      </div>
-                      <div class="font-weight-500 secondary-text">
-                        {{ 'VOICE.SENTIMENT_NEUTRAL' | translate | uppercase }}
-                      </div>
-                    </div>
-                  </ms-widget-front>
-                  <!-- / Front -->
-                </ms-widget>
-                <!-- / WIDGET 4 -->
-
-                <!-- WIDGET 5 -->
-                <ms-widget
-                  class="h-140"
-                  layout="column"
-                  flex="100"
-                  flex-gt-xs="50"
-                  flex-gt-md="20"
-                >
-                  <!-- Front -->
-                  <ms-widget-front class="p-16 white-bg" layout="row" flex>
-                    <div
-                      class="pt-8 pb-8"
-                      layout="column"
-                      layout-align="center center"
-                      flex
-                    >
-                      <div class="md-display-1 pb-8">
-                        ({{ (vm_ss.voiceRecording.sMixed || 0) * 100 | number: 2
-                        }}%)
-                      </div>
-                      <div class="font-weight-500 secondary-text">
-                        {{ 'VOICE.SENTIMENT_MIXED' | translate | uppercase }}
-                      </div>
-                    </div>
-                  </ms-widget-front>
-                  <!-- / Front -->
-                </ms-widget>
-                <!-- / WIDGET 5 -->
-              </div>
-              <!-- / WIDGET GROUP -->
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/voice/views/voiceRecordings/edit/view.html/view.html b/public/src/js/modules/main/apps/voice/views/voiceRecordings/edit/view.html/view.html
new file mode 100644
index 0000000..4741e13
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/voiceRecordings/edit/view.html/view.html
@@ -0,0 +1,571 @@
+<div
+  id="voice-voiceRecording"
+  class="page-layout simple tabbed"
+  layout="column"
+>
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-voiceRecordings-button md-icon-button"
+        aria-label="Go to voiceRecordings"
+        ng-click="vm.gotoVoiceRecordings()"
+        translate
+        translate-attr-aria-label="VOICE.GO_TO_VOICERECORDINGS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="voiceRecording-image" hide-xs>
+          <img ng-src="assets/images/business/voiceRecordings.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.voiceRecording.id}}
+            <span ng-if="vm.voiceRecording.name"
+              >{{vm.voiceRecording.name}}</span
+            >
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="VOICE.CREATED_AT"></span>
+            <span>{{vm.voiceRecording.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveVoiceRecording()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(voiceRecordingsForm.$invalid) || (transcriptForm.$invalid) || (sentimentAnalysisForm.$invalid)"
+        translate="VOICE.SAVE"
+        translate-attr-aria-label="VOICE.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="VOICE.GENERAL">GENERAL</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="voiceRecording-detail-form-container voicerecordings md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="VOICE.VOICERECORDINGS">
+                VOICERECORDINGS
+              </div>
+            </div>
+            <form name="voiceRecordingsForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="VOICE.TYPE">Type</label>
+                <input
+                  type=""
+                  name="type"
+                  ng-model="vm.voiceRecording.type"
+                  autofocus
+                  disabled
+                />
+
+                <div
+                  ng-messages="voiceRecordingsForm['type'].$error"
+                  ng-show="voiceRecordingsForm['type'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.TYPE_REQUIRED"
+                      >Type field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.UNIQUEID">UniqueId</label>
+                <input
+                  type=""
+                  name="uniqueid"
+                  ng-model="vm.voiceRecording.uniqueid"
+                  disabled
+                />
+
+                <div
+                  ng-messages="voiceRecordingsForm['uniqueid'].$error"
+                  ng-show="voiceRecordingsForm['uniqueid'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.UNIQUEID_REQUIRED"
+                      >UniqueId field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.CALLER">Caller</label>
+                <input
+                  type=""
+                  name="calleridnum"
+                  ng-model="vm.voiceRecording.calleridnum"
+                  disabled
+                />
+
+                <div
+                  ng-messages="voiceRecordingsForm['calleridnum'].$error"
+                  ng-show="voiceRecordingsForm['calleridnum'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.CALLER_REQUIRED"
+                      >Caller field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.CALLED">Called</label>
+                <input
+                  type=""
+                  name="exten"
+                  ng-model="vm.voiceRecording.exten"
+                  disabled
+                />
+
+                <div
+                  ng-messages="voiceRecordingsForm['exten'].$error"
+                  ng-show="voiceRecordingsForm['exten'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.CALLED_REQUIRED"
+                      >Called field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.CONNECTED">Connected</label>
+                <input
+                  type=""
+                  name="connectedlinenum"
+                  ng-model="vm.voiceRecording.connectedlinenum"
+                  disabled
+                />
+
+                <div
+                  ng-messages="voiceRecordingsForm['connectedlinenum'].$error"
+                  ng-show="voiceRecordingsForm['connectedlinenum'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.CONNECTED_REQUIRED"
+                      >Connected field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.QUEUE">Queue</label>
+                <input
+                  type=""
+                  name="queue"
+                  ng-model="vm.voiceRecording.queue"
+                  disabled
+                />
+
+                <div
+                  ng-messages="voiceRecordingsForm['queue'].$error"
+                  ng-show="voiceRecordingsForm['queue'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.QUEUE_REQUIRED"
+                      >Queue field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.AGENT">Agent</label>
+                <input
+                  type="text"
+                  name="membername"
+                  ng-model="vm.voiceRecording.membername"
+                  disabled
+                />
+
+                <div
+                  ng-messages="voiceRecordingsForm['membername'].$error"
+                  ng-show="voiceRecordingsForm['membername'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.AGENT_REQUIRED"
+                      >Agent field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.RATING">Rating</label>
+                <md-select
+                  name="rating"
+                  ng-model="vm.voiceRecording.rating"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="null"
+                    >{{'VOICE.NO_RATING' | translate}}</md-option
+                  >
+                  <md-option value="1"
+                    ><md-icon
+                      md-font-icon="icon-star"
+                      style="color: red"
+                      ng-repeat="icon in [1]"
+                    ></md-icon
+                  ></md-option>
+                  <md-option value="2"
+                    ><md-icon
+                      md-font-icon="icon-star"
+                      style="color: red"
+                      ng-repeat="icon in [1,2]"
+                    ></md-icon
+                  ></md-option>
+                  <md-option value="3"
+                    ><md-icon
+                      md-font-icon="icon-star"
+                      style="color: red"
+                      ng-repeat="icon in [1,2,3]"
+                    ></md-icon
+                  ></md-option>
+                  <md-option value="4"
+                    ><md-icon
+                      md-font-icon="icon-star"
+                      style="color: red"
+                      ng-repeat="icon in [1,2,3,4]"
+                    ></md-icon
+                  ></md-option>
+                  <md-option value="5"
+                    ><md-icon
+                      md-font-icon="icon-star"
+                      style="color: red"
+                      ng-repeat="icon in [1,2,3,4,5]"
+                    ></md-icon
+                  ></md-option>
+                </md-select>
+                <div
+                  ng-messages="voiceRecordingsForm['rating'].$error"
+                  ng-show="voiceRecordingsForm[rating].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.RATING_REQUIRED"
+                      >Rating field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.DISPOSITION">Disposition</label>
+                <input
+                  type="text"
+                  name="userDisposition"
+                  ng-model="vm.voiceRecording.userDisposition"
+                  disabled
+                />
+
+                <div
+                  ng-messages="voiceRecordingsForm['userDisposition'].$error"
+                  ng-show="voiceRecordingsForm['userDisposition'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.DISPOSITION_REQUIRED"
+                      >Disposition field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.SECOND_LEVEL_DISPOSITION"
+                  >Second_Level_Disposition</label
+                >
+                <input
+                  type="text"
+                  name="userSecondDisposition"
+                  ng-model="vm.voiceRecording.userSecondDisposition"
+                  disabled
+                />
+
+                <div
+                  ng-messages="voiceRecordingsForm['userSecondDisposition'].$error"
+                  ng-show="voiceRecordingsForm['userSecondDisposition'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="VOICE.ERRORS.SECOND_LEVEL_DISPOSITION_REQUIRED"
+                      >Second_Level_Disposition field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.THIRD_LEVEL_DISPOSITION"
+                  >Third_Level_Disposition</label
+                >
+                <input
+                  type="text"
+                  name="userThirdDisposition"
+                  ng-model="vm.voiceRecording.userThirdDisposition"
+                  disabled
+                />
+
+                <div
+                  ng-messages="voiceRecordingsForm['userThirdDisposition'].$error"
+                  ng-show="voiceRecordingsForm['userThirdDisposition'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="VOICE.ERRORS.THIRD_LEVEL_DISPOSITION_REQUIRED"
+                      >Third_Level_Disposition field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab ng-if="vm.license.ai">
+        <md-tab-label>
+          <span translate="VOICE.TRANSCRIPTANALYSIS">TRANSCRIPTANALYSIS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="voiceRecording-detail-form-container transcript md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="VOICE.TRANSCRIPT">
+                TRANSCRIPT
+              </div>
+            </div>
+            <form name="transcriptForm" novalidate>
+              <md-input-container
+                ng-if="vm.voiceRecording.transcribeStatus == 'COMPLETED'"
+                class="md-block"
+              >
+                <label translate="VOICE.TEXT">Text</label>
+                <textarea
+                  name="fileText"
+                  ng-model="vm.voiceRecording.fileText"
+                  autofocus
+                  ng-disabled="true"
+                ></textarea>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.voiceRecording.transcribeStatus == 'FAILED'"
+                class="md-block"
+              >
+                <label translate="VOICE.FAILUREREASON">FailureReason</label>
+                <textarea
+                  name="failureReason"
+                  ng-model="vm.voiceRecording.failureReason"
+                  ng-disabled="true"
+                ></textarea>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="voiceRecording-detail-form-container sentimentanalysis md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="VoiceRecordingSentimentStatisticsController as vm_ss"
+              ng-init="vm_ss.init(vm.voiceRecording)"
+            >
+              <md-toolbar class="md-table-toolbar md-default">
+                <div class="md-toolbar-tools">
+                  <span
+                    class="md-subhead"
+                    translate="VOICE.SENTIMENTANALYSIS"
+                    style="width: 50px"
+                    >Sentiment Analysis</span
+                  >
+                  <div flex></div>
+                </div>
+              </md-toolbar>
+
+              <!-- WIDGET GROUP -->
+              <div class="widget-group" layout="row" flex="100" layout-wrap>
+                <!-- WIDGET 1 -->
+                <ms-widget
+                  class="h-140"
+                  layout="column"
+                  flex="100"
+                  flex-gt-xs="50"
+                  flex-gt-md="20"
+                >
+                  <!-- Front -->
+                  <ms-widget-front class="p-16 white-bg" layout="row" flex>
+                    <div
+                      class="pt-8 pb-8"
+                      layout="column"
+                      layout-align="center center"
+                      flex
+                    >
+                      <div
+                        class="md-display-1 pb-8 sentiment"
+                        ng-class="vm_ss.voiceRecording.sentiment"
+                      >
+                        {{vm_ss.voiceRecording.sentiment}}
+                      </div>
+                      <div class="font-weight-500 secondary-text">
+                        {{ 'VOICE.SENTIMENT' | translate | uppercase }}
+                      </div>
+                    </div>
+                  </ms-widget-front>
+                  <!-- / Front -->
+                </ms-widget>
+                <!-- / WIDGET 1 -->
+
+                <!-- WIDGET 2 -->
+                <ms-widget
+                  class="h-140"
+                  layout="column"
+                  flex="100"
+                  flex-gt-xs="50"
+                  flex-gt-md="20"
+                >
+                  <!-- Front -->
+                  <ms-widget-front class="p-16 white-bg" layout="row" flex>
+                    <div
+                      class="pt-8 pb-8"
+                      layout="column"
+                      layout-align="center center"
+                      flex
+                    >
+                      <div class="md-display-1 pb-8">
+                        ({{ (vm_ss.voiceRecording.sPositive || 0) * 100 |
+                        number: 2 }}%)
+                      </div>
+                      <div class="font-weight-500 secondary-text">
+                        {{ 'VOICE.SENTIMENT_POSITIVE' | translate | uppercase }}
+                      </div>
+                    </div>
+                  </ms-widget-front>
+                  <!-- / Front -->
+                </ms-widget>
+                <!-- / WIDGET 2 -->
+
+                <!-- WIDGET 3 -->
+                <ms-widget
+                  class="h-140"
+                  layout="column"
+                  flex="100"
+                  flex-gt-xs="50"
+                  flex-gt-md="20"
+                >
+                  <!-- Front -->
+                  <ms-widget-front class="p-16 white-bg" layout="row" flex>
+                    <div
+                      class="pt-8 pb-8"
+                      layout="column"
+                      layout-align="center center"
+                      flex
+                    >
+                      <div class="md-display-1 pb-8">
+                        ({{ (vm_ss.voiceRecording.sNegative || 0) * 100 |
+                        number: 2 }}%)
+                      </div>
+                      <div class="font-weight-500 secondary-text">
+                        {{ 'VOICE.SENTIMENT_NEGATIVE' | translate | uppercase }}
+                      </div>
+                    </div>
+                  </ms-widget-front>
+                  <!-- / Front -->
+                </ms-widget>
+                <!-- / WIDGET 3 -->
+
+                <!-- WIDGET 4 -->
+                <ms-widget
+                  class="h-140"
+                  layout="column"
+                  flex="100"
+                  flex-gt-xs="50"
+                  flex-gt-md="20"
+                >
+                  <!-- Front -->
+                  <ms-widget-front class="p-16 white-bg" layout="row" flex>
+                    <div
+                      class="pt-8 pb-8"
+                      layout="column"
+                      layout-align="center center"
+                      flex
+                    >
+                      <div class="md-display-1 pb-8">
+                        ({{ (vm_ss.voiceRecording.sNeutral || 0) * 100 | number:
+                        2 }}%)
+                      </div>
+                      <div class="font-weight-500 secondary-text">
+                        {{ 'VOICE.SENTIMENT_NEUTRAL' | translate | uppercase }}
+                      </div>
+                    </div>
+                  </ms-widget-front>
+                  <!-- / Front -->
+                </ms-widget>
+                <!-- / WIDGET 4 -->
+
+                <!-- WIDGET 5 -->
+                <ms-widget
+                  class="h-140"
+                  layout="column"
+                  flex="100"
+                  flex-gt-xs="50"
+                  flex-gt-md="20"
+                >
+                  <!-- Front -->
+                  <ms-widget-front class="p-16 white-bg" layout="row" flex>
+                    <div
+                      class="pt-8 pb-8"
+                      layout="column"
+                      layout-align="center center"
+                      flex
+                    >
+                      <div class="md-display-1 pb-8">
+                        ({{ (vm_ss.voiceRecording.sMixed || 0) * 100 | number: 2
+                        }}%)
+                      </div>
+                      <div class="font-weight-500 secondary-text">
+                        {{ 'VOICE.SENTIMENT_MIXED' | translate | uppercase }}
+                      </div>
+                    </div>
+                  </ms-widget-front>
+                  <!-- / Front -->
+                </ms-widget>
+                <!-- / WIDGET 5 -->
+              </div>
+              <!-- / WIDGET GROUP -->
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/voice/views/voiceRecordings/voiceRecordings.html/voiceRecordings-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/voiceRecordings/voiceRecordings.html/voiceRecordings-[chunkhash].html
deleted file mode 100644
index dc276a8..0000000
--- a/public/src/js/modules/main/apps/voice/views/voiceRecordings/voiceRecordings.html/voiceRecordings-[chunkhash].html
+++ /dev/null
@@ -1,541 +0,0 @@
-<div id="voiceRecordings" class="page-layout simple left-sidenav inner-sidenav">
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-phone" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="VOICE.VOICERECORDINGS"
-          >VoiceRecordings</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="VOICE.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-      <ms-quick-filter
-        filters="vm.quickFilters"
-        query="vm.query"
-        search="vm.getVoiceRecordings()"
-      ></ms-quick-filter>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedVoiceRecordings.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedVoiceRecordings =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="VOICE.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-voiceRecordings-count">
-          <span>{{vm.selectedVoiceRecordings.length}}</span>
-          <span translate="VOICE.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdOpenMenu($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="VOICE.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllVoiceRecordings()"
-                translate="VOICE.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectVoiceRecordings()"
-                translate="VOICE.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedVoiceRecordings"
-          csv-label="true"
-          filename="voiceRecordings.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.license.ai"
-          ng-click="vm.runtranscribesentimentSelectedVoiceRecordings($event)"
-          aria-label="transcribesentiment selected"
-          translate
-          translate-attr-label="VOICERECORDINGS.TRANSCRIBESENTIMENT_SELECTED"
-        >
-          <md-icon md-font-icon="icon-text-to-speech"></md-icon
-          ><md-tooltip
-            >{{'VOICE.RUNTRANSCRIBESENTIMENT_VOICERECORDING' |
-            translate}}</md-tooltip
-          >
-        </md-button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.license.ai"
-          ng-click="vm.runtranscribeSelectedVoiceRecordings($event)"
-          aria-label="transcribe selected"
-          translate
-          translate-attr-label="VOICERECORDINGS.TRANSCRIBE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-format-size"></md-icon
-          ><md-tooltip
-            >{{'VOICE.RUNTRANSCRIBE_VOICERECORDING' | translate}}</md-tooltip
-          >
-        </md-button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.license.ai"
-          ng-click="vm.runsentimentSelectedVoiceRecordings($event)"
-          aria-label="transcribe selected"
-          translate
-          translate-attr-label="VOICERECORDINGS.SENTIMENT_SELECTED"
-        >
-          <md-icon md-font-icon="icon-heart-outline"></md-icon
-          ><md-tooltip
-            >{{'VOICE.RUNSENTIMENT_VOICERECORDING' | translate}}</md-tooltip
-          >
-        </md-button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedVoiceRecordings($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="VOICE.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- VOICERECORDING TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedVoiceRecordings"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getVoiceRecordings"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="type">
-                  {{ 'VOICE.TYPE' | translate }}
-                </th>
-                <th md-column md-order-by="uniqueid">
-                  {{ 'VOICE.UNIQUEID' | translate }}
-                </th>
-                <th md-column md-order-by="calleridnum">
-                  {{ 'VOICE.CALLER' | translate }}
-                </th>
-                <th md-column md-order-by="exten">
-                  {{ 'VOICE.CALLED' | translate }}
-                </th>
-                <th md-column md-order-by="connectedlinenum">
-                  {{ 'VOICE.CONNECTED' | translate }}
-                </th>
-                <th md-column md-order-by="queue">
-                  {{ 'VOICE.QUEUE' | translate }}
-                </th>
-                <th md-column md-order-by="membername">
-                  {{ 'VOICE.AGENT' | translate }}
-                </th>
-                <th md-column md-order-by="rating">
-                  {{ 'VOICE.RATING' | translate }}
-                </th>
-                <th md-column md-order-by="audio">
-                  {{ 'VOICE.AUDIO' | translate }}
-                </th>
-                <th md-column md-order-by="createdAt">
-                  {{ 'VOICE.DATE' | translate }}
-                </th>
-                <th md-column md-order-by="userDisposition">
-                  {{ 'VOICE.DISPOSITION' | translate }}
-                </th>
-                <th md-column md-order-by="userSecondDisposition">
-                  {{ 'VOICE.SECOND_LEVEL_DISPOSITION' | translate }}
-                </th>
-                <th md-column md-order-by="userThirdDisposition">
-                  {{ 'VOICE.THIRD_LEVEL_DISPOSITION' | translate }}
-                </th>
-                <th
-                  md-column
-                  md-order-by="transcribeStatus"
-                  ng-if="vm.license.ai"
-                >
-                  {{ 'VOICE.TRANSCRIBE' | translate }}
-                </th>
-                <th md-column md-order-by="sentiment" ng-if="vm.license.ai">
-                  {{ 'VOICE.SENTIMENTANALYSIS' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.voiceRecordings.rows.length">
-                <td md-cell colspan="16">
-                  <div layout="row" layout-align="center center">
-                    <span translate="VOICE.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="voiceRecording"
-                md-select-id="id"
-                ng-repeat="voiceRecording in vm.voiceRecordings.rows"
-              >
-                <td md-cell ng-if="voiceRecording.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{voiceRecording.name}}"
-                    ng-src="api/users/{{voiceRecording.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!voiceRecording.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{voiceRecording.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceRecording, ev) : vm.createOrEditVoiceRecording($event, voiceRecording)"
-                  md-cell
-                  class="type"
-                >
-                  {{voiceRecording.type}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceRecording, ev) : vm.createOrEditVoiceRecording($event, voiceRecording)"
-                  md-cell
-                  class="uniqueid"
-                >
-                  {{voiceRecording.uniqueid}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceRecording, ev) : vm.createOrEditVoiceRecording($event, voiceRecording)"
-                  md-cell
-                  class="calleridnum"
-                >
-                  {{voiceRecording.calleridnum}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceRecording, ev) : vm.createOrEditVoiceRecording($event, voiceRecording)"
-                  md-cell
-                  class="exten"
-                >
-                  {{voiceRecording.exten}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceRecording, ev) : vm.createOrEditVoiceRecording($event, voiceRecording)"
-                  md-cell
-                  class="connectedlinenum"
-                >
-                  {{voiceRecording.connectedlinenum}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceRecording, ev) : vm.createOrEditVoiceRecording($event, voiceRecording)"
-                  md-cell
-                  class="queue"
-                >
-                  {{voiceRecording.queue}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceRecording, ev) : vm.createOrEditVoiceRecording($event, voiceRecording)"
-                  md-cell
-                  class="membername"
-                >
-                  {{voiceRecording.membername}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceRecording, ev) : vm.createOrEditVoiceRecording($event, voiceRecording)"
-                  md-cell
-                  class="rating"
-                >
-                  <md-icon
-                    md-font-icon="icon-star"
-                    style="color: red"
-                    ng-show="voiceRecording.rating"
-                    ng-repeat="rating in [1,2,3,4,5] | limitTo:voiceRecording.rating"
-                  ></md-icon
-                  ><span
-                    ng-hide="voiceRecording.rating"
-                    translate="VOICE.NO_RATING"
-                    >No rating</span
-                  >
-                </td>
-                <td md-cell class="audio" ng-switch="voiceRecording.format">
-                  <!-- audio recording directive -->
-                  <ms-recording
-                    ng-switch-when=".wav"
-                    id="voiceRecording.id"
-                  ></ms-recording>
-                  <!-- / audio recording directive -->
-                  <span ng-switch-when=".gsm|.WAV" ng-switch-when-separator="|">
-                    <em>{{ 'VOICE.CANT_PLAY_GSM_AUDIO_FILES' | translate }}</em>
-                  </span>
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceRecording, ev) : vm.createOrEditVoiceRecording($event, voiceRecording)"
-                  md-cell
-                  class="createdAt"
-                >
-                  {{voiceRecording.createdAt | date:'medium' }}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceRecording, ev) : vm.createOrEditVoiceRecording($event, voiceRecording)"
-                  md-cell
-                  class="userDisposition"
-                >
-                  {{voiceRecording.userDisposition}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceRecording, ev) : vm.createOrEditVoiceRecording($event, voiceRecording)"
-                  md-cell
-                  class="userSecondDisposition"
-                >
-                  {{voiceRecording.userSecondDisposition}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceRecording, ev) : vm.createOrEditVoiceRecording($event, voiceRecording)"
-                  md-cell
-                  class="userThirdDisposition"
-                >
-                  {{voiceRecording.userThirdDisposition}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceRecording, ev) : vm.createOrEditVoiceRecording($event, voiceRecording)"
-                  md-cell
-                  class="transcribeStatus"
-                  ng-if="vm.license.ai"
-                >
-                  {{ 'VOICE.TRANSCRIBESTATUS_' + voiceRecording.transcribeStatus
-                  | translate}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceRecording, ev) : vm.createOrEditVoiceRecording($event, voiceRecording)"
-                  md-cell
-                  class="sentiment"
-                  ng-if="vm.license.ai"
-                >
-                  {{voiceRecording.sentiment}}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="VOICE.MORE"
-                      ng-click="$mdOpenMenu($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(voiceRecording, $event    )"
-                          translate="VOICE.EDIT_VOICERECORDING"
-                        >
-                          Edit VoiceRecording
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item
-                        ng-if="voiceRecording.transcribeStatus == 'NEW' && vm.license.ai"
-                      >
-                        <md-button
-                          ng-click="vm.runtranscriberuntranscribesentiment(voiceRecording, $event    )"
-                          translate="VOICE.RUNTRANSCRIBE_VOICERECORDING"
-                        >
-                          RunTranscribe VoiceRecording
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item
-                        ng-if="voiceRecording.transcribeStatus == 'NEW' && vm.license.ai"
-                      >
-                        <md-button
-                          ng-click="vm.runtranscribesentimentruntranscribesentiment(voiceRecording, $event    )"
-                          translate="VOICE.RUNTRANSCRIBESENTIMENT_VOICERECORDING"
-                        >
-                          RunTranscribeSentiment VoiceRecording
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item
-                        ng-if="voiceRecording.transcribeStatus == 'COMPLETED' && voiceRecording.sentiment == null && vm.license.ai"
-                      >
-                        <md-button
-                          ng-click="vm.runsentimentruntranscribesentiment(voiceRecording, $event    )"
-                          translate="VOICE.RUNSENTIMENT_VOICERECORDING"
-                        >
-                          RunSentiment VoiceRecording
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item
-                        ng-if="voiceRecording.transcribeStatus == 'COMPLETED' && vm.license.ai"
-                      >
-                        <md-button
-                          ng-click="vm.downloadtranscribefile2(voiceRecording, $event    )"
-                          translate="VOICE.DOWNLOADTRANSCRIBE_VOICERECORDING"
-                        >
-                          DownloadTranscribe VoiceRecording
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.downloadfile2(voiceRecording, $event  , 'voice/recordings'   )"
-                          translate="VOICE.DOWNLOAD_VOICERECORDING"
-                        >
-                          Download VoiceRecording
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(voiceRecording, $event    )"
-                          translate="VOICE.DELETE_VOICERECORDING"
-                        >
-                          Delete VoiceRecording
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.voiceRecordings.count}}"
-          md-on-paginate="vm.getVoiceRecordings"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / VOICERECORDING TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- NO ADD BUTTON BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/voice/views/voiceRecordings/voiceRecordings.html/voiceRecordings.html b/public/src/js/modules/main/apps/voice/views/voiceRecordings/voiceRecordings.html/voiceRecordings.html
new file mode 100644
index 0000000..dc276a8
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/voiceRecordings/voiceRecordings.html/voiceRecordings.html
@@ -0,0 +1,541 @@
+<div id="voiceRecordings" class="page-layout simple left-sidenav inner-sidenav">
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-phone" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="VOICE.VOICERECORDINGS"
+          >VoiceRecordings</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="VOICE.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+      <ms-quick-filter
+        filters="vm.quickFilters"
+        query="vm.query"
+        search="vm.getVoiceRecordings()"
+      ></ms-quick-filter>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedVoiceRecordings.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedVoiceRecordings =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="VOICE.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-voiceRecordings-count">
+          <span>{{vm.selectedVoiceRecordings.length}}</span>
+          <span translate="VOICE.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdOpenMenu($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="VOICE.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllVoiceRecordings()"
+                translate="VOICE.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectVoiceRecordings()"
+                translate="VOICE.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedVoiceRecordings"
+          csv-label="true"
+          filename="voiceRecordings.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.license.ai"
+          ng-click="vm.runtranscribesentimentSelectedVoiceRecordings($event)"
+          aria-label="transcribesentiment selected"
+          translate
+          translate-attr-label="VOICERECORDINGS.TRANSCRIBESENTIMENT_SELECTED"
+        >
+          <md-icon md-font-icon="icon-text-to-speech"></md-icon
+          ><md-tooltip
+            >{{'VOICE.RUNTRANSCRIBESENTIMENT_VOICERECORDING' |
+            translate}}</md-tooltip
+          >
+        </md-button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.license.ai"
+          ng-click="vm.runtranscribeSelectedVoiceRecordings($event)"
+          aria-label="transcribe selected"
+          translate
+          translate-attr-label="VOICERECORDINGS.TRANSCRIBE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-format-size"></md-icon
+          ><md-tooltip
+            >{{'VOICE.RUNTRANSCRIBE_VOICERECORDING' | translate}}</md-tooltip
+          >
+        </md-button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.license.ai"
+          ng-click="vm.runsentimentSelectedVoiceRecordings($event)"
+          aria-label="transcribe selected"
+          translate
+          translate-attr-label="VOICERECORDINGS.SENTIMENT_SELECTED"
+        >
+          <md-icon md-font-icon="icon-heart-outline"></md-icon
+          ><md-tooltip
+            >{{'VOICE.RUNSENTIMENT_VOICERECORDING' | translate}}</md-tooltip
+          >
+        </md-button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedVoiceRecordings($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="VOICE.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- VOICERECORDING TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedVoiceRecordings"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getVoiceRecordings"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="type">
+                  {{ 'VOICE.TYPE' | translate }}
+                </th>
+                <th md-column md-order-by="uniqueid">
+                  {{ 'VOICE.UNIQUEID' | translate }}
+                </th>
+                <th md-column md-order-by="calleridnum">
+                  {{ 'VOICE.CALLER' | translate }}
+                </th>
+                <th md-column md-order-by="exten">
+                  {{ 'VOICE.CALLED' | translate }}
+                </th>
+                <th md-column md-order-by="connectedlinenum">
+                  {{ 'VOICE.CONNECTED' | translate }}
+                </th>
+                <th md-column md-order-by="queue">
+                  {{ 'VOICE.QUEUE' | translate }}
+                </th>
+                <th md-column md-order-by="membername">
+                  {{ 'VOICE.AGENT' | translate }}
+                </th>
+                <th md-column md-order-by="rating">
+                  {{ 'VOICE.RATING' | translate }}
+                </th>
+                <th md-column md-order-by="audio">
+                  {{ 'VOICE.AUDIO' | translate }}
+                </th>
+                <th md-column md-order-by="createdAt">
+                  {{ 'VOICE.DATE' | translate }}
+                </th>
+                <th md-column md-order-by="userDisposition">
+                  {{ 'VOICE.DISPOSITION' | translate }}
+                </th>
+                <th md-column md-order-by="userSecondDisposition">
+                  {{ 'VOICE.SECOND_LEVEL_DISPOSITION' | translate }}
+                </th>
+                <th md-column md-order-by="userThirdDisposition">
+                  {{ 'VOICE.THIRD_LEVEL_DISPOSITION' | translate }}
+                </th>
+                <th
+                  md-column
+                  md-order-by="transcribeStatus"
+                  ng-if="vm.license.ai"
+                >
+                  {{ 'VOICE.TRANSCRIBE' | translate }}
+                </th>
+                <th md-column md-order-by="sentiment" ng-if="vm.license.ai">
+                  {{ 'VOICE.SENTIMENTANALYSIS' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.voiceRecordings.rows.length">
+                <td md-cell colspan="16">
+                  <div layout="row" layout-align="center center">
+                    <span translate="VOICE.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="voiceRecording"
+                md-select-id="id"
+                ng-repeat="voiceRecording in vm.voiceRecordings.rows"
+              >
+                <td md-cell ng-if="voiceRecording.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{voiceRecording.name}}"
+                    ng-src="api/users/{{voiceRecording.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!voiceRecording.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{voiceRecording.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceRecording, ev) : vm.createOrEditVoiceRecording($event, voiceRecording)"
+                  md-cell
+                  class="type"
+                >
+                  {{voiceRecording.type}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceRecording, ev) : vm.createOrEditVoiceRecording($event, voiceRecording)"
+                  md-cell
+                  class="uniqueid"
+                >
+                  {{voiceRecording.uniqueid}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceRecording, ev) : vm.createOrEditVoiceRecording($event, voiceRecording)"
+                  md-cell
+                  class="calleridnum"
+                >
+                  {{voiceRecording.calleridnum}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceRecording, ev) : vm.createOrEditVoiceRecording($event, voiceRecording)"
+                  md-cell
+                  class="exten"
+                >
+                  {{voiceRecording.exten}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceRecording, ev) : vm.createOrEditVoiceRecording($event, voiceRecording)"
+                  md-cell
+                  class="connectedlinenum"
+                >
+                  {{voiceRecording.connectedlinenum}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceRecording, ev) : vm.createOrEditVoiceRecording($event, voiceRecording)"
+                  md-cell
+                  class="queue"
+                >
+                  {{voiceRecording.queue}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceRecording, ev) : vm.createOrEditVoiceRecording($event, voiceRecording)"
+                  md-cell
+                  class="membername"
+                >
+                  {{voiceRecording.membername}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceRecording, ev) : vm.createOrEditVoiceRecording($event, voiceRecording)"
+                  md-cell
+                  class="rating"
+                >
+                  <md-icon
+                    md-font-icon="icon-star"
+                    style="color: red"
+                    ng-show="voiceRecording.rating"
+                    ng-repeat="rating in [1,2,3,4,5] | limitTo:voiceRecording.rating"
+                  ></md-icon
+                  ><span
+                    ng-hide="voiceRecording.rating"
+                    translate="VOICE.NO_RATING"
+                    >No rating</span
+                  >
+                </td>
+                <td md-cell class="audio" ng-switch="voiceRecording.format">
+                  <!-- audio recording directive -->
+                  <ms-recording
+                    ng-switch-when=".wav"
+                    id="voiceRecording.id"
+                  ></ms-recording>
+                  <!-- / audio recording directive -->
+                  <span ng-switch-when=".gsm|.WAV" ng-switch-when-separator="|">
+                    <em>{{ 'VOICE.CANT_PLAY_GSM_AUDIO_FILES' | translate }}</em>
+                  </span>
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceRecording, ev) : vm.createOrEditVoiceRecording($event, voiceRecording)"
+                  md-cell
+                  class="createdAt"
+                >
+                  {{voiceRecording.createdAt | date:'medium' }}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceRecording, ev) : vm.createOrEditVoiceRecording($event, voiceRecording)"
+                  md-cell
+                  class="userDisposition"
+                >
+                  {{voiceRecording.userDisposition}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceRecording, ev) : vm.createOrEditVoiceRecording($event, voiceRecording)"
+                  md-cell
+                  class="userSecondDisposition"
+                >
+                  {{voiceRecording.userSecondDisposition}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceRecording, ev) : vm.createOrEditVoiceRecording($event, voiceRecording)"
+                  md-cell
+                  class="userThirdDisposition"
+                >
+                  {{voiceRecording.userThirdDisposition}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceRecording, ev) : vm.createOrEditVoiceRecording($event, voiceRecording)"
+                  md-cell
+                  class="transcribeStatus"
+                  ng-if="vm.license.ai"
+                >
+                  {{ 'VOICE.TRANSCRIBESTATUS_' + voiceRecording.transcribeStatus
+                  | translate}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voiceRecording, ev) : vm.createOrEditVoiceRecording($event, voiceRecording)"
+                  md-cell
+                  class="sentiment"
+                  ng-if="vm.license.ai"
+                >
+                  {{voiceRecording.sentiment}}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="VOICE.MORE"
+                      ng-click="$mdOpenMenu($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(voiceRecording, $event    )"
+                          translate="VOICE.EDIT_VOICERECORDING"
+                        >
+                          Edit VoiceRecording
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item
+                        ng-if="voiceRecording.transcribeStatus == 'NEW' && vm.license.ai"
+                      >
+                        <md-button
+                          ng-click="vm.runtranscriberuntranscribesentiment(voiceRecording, $event    )"
+                          translate="VOICE.RUNTRANSCRIBE_VOICERECORDING"
+                        >
+                          RunTranscribe VoiceRecording
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item
+                        ng-if="voiceRecording.transcribeStatus == 'NEW' && vm.license.ai"
+                      >
+                        <md-button
+                          ng-click="vm.runtranscribesentimentruntranscribesentiment(voiceRecording, $event    )"
+                          translate="VOICE.RUNTRANSCRIBESENTIMENT_VOICERECORDING"
+                        >
+                          RunTranscribeSentiment VoiceRecording
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item
+                        ng-if="voiceRecording.transcribeStatus == 'COMPLETED' && voiceRecording.sentiment == null && vm.license.ai"
+                      >
+                        <md-button
+                          ng-click="vm.runsentimentruntranscribesentiment(voiceRecording, $event    )"
+                          translate="VOICE.RUNSENTIMENT_VOICERECORDING"
+                        >
+                          RunSentiment VoiceRecording
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item
+                        ng-if="voiceRecording.transcribeStatus == 'COMPLETED' && vm.license.ai"
+                      >
+                        <md-button
+                          ng-click="vm.downloadtranscribefile2(voiceRecording, $event    )"
+                          translate="VOICE.DOWNLOADTRANSCRIBE_VOICERECORDING"
+                        >
+                          DownloadTranscribe VoiceRecording
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.downloadfile2(voiceRecording, $event  , 'voice/recordings'   )"
+                          translate="VOICE.DOWNLOAD_VOICERECORDING"
+                        >
+                          Download VoiceRecording
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(voiceRecording, $event    )"
+                          translate="VOICE.DELETE_VOICERECORDING"
+                        >
+                          Delete VoiceRecording
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.voiceRecordings.count}}"
+          md-on-paginate="vm.getVoiceRecordings"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / VOICERECORDING TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- NO ADD BUTTON BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/voice/views/voicemails/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/voicemails/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index d2a8485..0000000
--- a/public/src/js/modules/main/apps/voice/views/voicemails/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,255 +0,0 @@
-<md-dialog class="voicemail-dialog" aria-label="New Voicemail">
-  <form name="voicemailForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="VOICE.FULLNAME">FullName</label>
-        <input
-          type="text"
-          name="fullname"
-          ng-model="vm.voicemail.fullname"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="voicemailForm['fullname'].$error"
-          ng-show="voicemailForm['fullname'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.FULLNAME_REQUIRED"
-              >FullName field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.EMAIL">Email</label>
-        <input
-          type="email"
-          name="email"
-          ng-model="vm.voicemail.email"
-          ng-required="vm.voicemail.attach === 'yes'"
-        />
-
-        <div
-          ng-messages="voicemailForm['email'].$error"
-          ng-show="voicemailForm['email'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.EMAIL_REQUIRED"
-              >Email field is required</span
-            >
-          </div>
-          <div ng-message="email">
-            <span translate="VOICE.ERRORS.EMAIL_MUST_VALID"
-              >Email must be a valid e-mail address</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.PASSWORD">Password</label>
-        <input
-          type="password"
-          name="password"
-          ng-model="vm.voicemail.password"
-          placeholder="Password"
-          translate
-          translate-attr-placeholder="VOICE.PASSWORD"
-          required
-        />
-        <div ng-messages="voicemailForm['password'].$error" role="alert">
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.PASSWORD_REQUIRED"
-              >Password field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span translate="VOICE.ERRORS.SECURE_PASSWORD_PATTERN"
-              >Must contain at least 8 characters, with a minimum of 1 lowercase
-              letter, 1 uppercase letter, 1 numeric character and 1 special
-              character ~!?*@#$%^&-_=+[{]}.</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <md-input-container class="md-block" ng-if="vm.newVoicemail ">
-        <label translate="VOICE.CONFIRM_PASSWORD">Confirm Password</label>
-        <input
-          type="password"
-          match-password="password"
-          name="confirmPassword"
-          ng-model="confirmPassword"
-          required
-        />
-        <div
-          ng-messages="voicemailForm.confirmPassword.$error"
-          role="alert"
-          multiple
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.CONFIRM_REQUIRED"
-              >Confirm field is required</span
-            >
-          </div>
-          <div ng-message="passwordMatch">
-            <span translate="VOICE.ERRORS.CONFIRM_NOT_MATCH"
-              >Your password did not match</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <md-input-container class="md-block">
-        <label translate="VOICE.MAILBOX">MailBox</label>
-        <input
-          type="text"
-          name="mailbox"
-          ng-model="vm.voicemail.mailbox"
-          ng-required="true"
-          ng-disabled="!vm.newVoicemail"
-        />
-
-        <div
-          ng-messages="voicemailForm['mailbox'].$error"
-          ng-show="voicemailForm['mailbox'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.MAILBOX_REQUIRED"
-              >MailBox field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="VOICE.ATTACH">Attach</label>
-        <md-select name="attach" ng-model="vm.voicemail.attach">
-          <md-option ng-value="'yes'">
-            {{ 'VOICE.YES' | translate }}
-          </md-option>
-
-          <md-option ng-value="'no'"> {{ 'VOICE.NO' | translate }} </md-option>
-        </md-select>
-        <div
-          ng-messages="voicemailForm['attach'].$error"
-          ng-show="voicemailForm['attach'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="VOICE.ERRORS.ATTACH_REQUIRED"
-              >Attach field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newVoicemail"
-          ng-click="vm.saveVoicemail()"
-          class="send-button md-accent md-raised"
-          ng-disabled="voicemailForm.$invalid || voicemailForm.$pristine"
-          aria-label="SAVE"
-          translate="VOICE.SAVE"
-          translate-attr-aria-label="VOICE.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newVoicemail"
-          ng-click="vm.addNewVoicemail()"
-          class="send-button md-accent md-raised"
-          ng-disabled="voicemailForm.$invalid"
-          aria-label="ADD"
-          translate="VOICE.ADD_VOICEMAIL"
-          translate-attr-aria-label="VOICE.ADD_VOICEMAIL"
-        >
-          ADD VOICEMAIL
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newVoicemail"
-          ng-click="vm.deleteVoicemail($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="VOICE.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip><span translate="VOICE.DELETE">DELETE</span></md-tooltip>
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/voicemails/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/voice/views/voicemails/create/dialog.html/dialog.html
new file mode 100644
index 0000000..d2a8485
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/voicemails/create/dialog.html/dialog.html
@@ -0,0 +1,255 @@
+<md-dialog class="voicemail-dialog" aria-label="New Voicemail">
+  <form name="voicemailForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="VOICE.FULLNAME">FullName</label>
+        <input
+          type="text"
+          name="fullname"
+          ng-model="vm.voicemail.fullname"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="voicemailForm['fullname'].$error"
+          ng-show="voicemailForm['fullname'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.FULLNAME_REQUIRED"
+              >FullName field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.EMAIL">Email</label>
+        <input
+          type="email"
+          name="email"
+          ng-model="vm.voicemail.email"
+          ng-required="vm.voicemail.attach === 'yes'"
+        />
+
+        <div
+          ng-messages="voicemailForm['email'].$error"
+          ng-show="voicemailForm['email'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.EMAIL_REQUIRED"
+              >Email field is required</span
+            >
+          </div>
+          <div ng-message="email">
+            <span translate="VOICE.ERRORS.EMAIL_MUST_VALID"
+              >Email must be a valid e-mail address</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.PASSWORD">Password</label>
+        <input
+          type="password"
+          name="password"
+          ng-model="vm.voicemail.password"
+          placeholder="Password"
+          translate
+          translate-attr-placeholder="VOICE.PASSWORD"
+          required
+        />
+        <div ng-messages="voicemailForm['password'].$error" role="alert">
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.PASSWORD_REQUIRED"
+              >Password field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span translate="VOICE.ERRORS.SECURE_PASSWORD_PATTERN"
+              >Must contain at least 8 characters, with a minimum of 1 lowercase
+              letter, 1 uppercase letter, 1 numeric character and 1 special
+              character ~!?*@#$%^&-_=+[{]}.</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <md-input-container class="md-block" ng-if="vm.newVoicemail ">
+        <label translate="VOICE.CONFIRM_PASSWORD">Confirm Password</label>
+        <input
+          type="password"
+          match-password="password"
+          name="confirmPassword"
+          ng-model="confirmPassword"
+          required
+        />
+        <div
+          ng-messages="voicemailForm.confirmPassword.$error"
+          role="alert"
+          multiple
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.CONFIRM_REQUIRED"
+              >Confirm field is required</span
+            >
+          </div>
+          <div ng-message="passwordMatch">
+            <span translate="VOICE.ERRORS.CONFIRM_NOT_MATCH"
+              >Your password did not match</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <md-input-container class="md-block">
+        <label translate="VOICE.MAILBOX">MailBox</label>
+        <input
+          type="text"
+          name="mailbox"
+          ng-model="vm.voicemail.mailbox"
+          ng-required="true"
+          ng-disabled="!vm.newVoicemail"
+        />
+
+        <div
+          ng-messages="voicemailForm['mailbox'].$error"
+          ng-show="voicemailForm['mailbox'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.MAILBOX_REQUIRED"
+              >MailBox field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="VOICE.ATTACH">Attach</label>
+        <md-select name="attach" ng-model="vm.voicemail.attach">
+          <md-option ng-value="'yes'">
+            {{ 'VOICE.YES' | translate }}
+          </md-option>
+
+          <md-option ng-value="'no'"> {{ 'VOICE.NO' | translate }} </md-option>
+        </md-select>
+        <div
+          ng-messages="voicemailForm['attach'].$error"
+          ng-show="voicemailForm['attach'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="VOICE.ERRORS.ATTACH_REQUIRED"
+              >Attach field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newVoicemail"
+          ng-click="vm.saveVoicemail()"
+          class="send-button md-accent md-raised"
+          ng-disabled="voicemailForm.$invalid || voicemailForm.$pristine"
+          aria-label="SAVE"
+          translate="VOICE.SAVE"
+          translate-attr-aria-label="VOICE.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newVoicemail"
+          ng-click="vm.addNewVoicemail()"
+          class="send-button md-accent md-raised"
+          ng-disabled="voicemailForm.$invalid"
+          aria-label="ADD"
+          translate="VOICE.ADD_VOICEMAIL"
+          translate-attr-aria-label="VOICE.ADD_VOICEMAIL"
+        >
+          ADD VOICEMAIL
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newVoicemail"
+          ng-click="vm.deleteVoicemail($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="VOICE.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip><span translate="VOICE.DELETE">DELETE</span></md-tooltip>
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/voice/views/voicemails/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/voicemails/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index f34abeb..0000000
--- a/public/src/js/modules/main/apps/voice/views/voicemails/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,635 +0,0 @@
-<div id="voice-voicemail" class="page-layout simple tabbed" layout="column">
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-voicemails-button md-icon-button"
-        aria-label="Go to voicemails"
-        ng-click="vm.gotoVoicemails()"
-        translate
-        translate-attr-aria-label="VOICE.GO_TO_VOICEMAILS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="voicemail-image" hide-xs>
-          <img ng-src="assets/images/business/voicemails.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.voicemail.id}}
-            <span ng-if="vm.voicemail.name">{{vm.voicemail.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="VOICE.CREATED_AT"></span>
-            <span>{{vm.voicemail.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveVoicemail()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (advancedForm.$invalid) || (messagesForm.$invalid)"
-        translate="VOICE.SAVE"
-        translate-attr-aria-label="VOICE.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="VOICE.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="voicemail-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="VOICE.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="VOICE.FULLNAME">FullName</label>
-                <input
-                  type="text"
-                  name="fullname"
-                  ng-model="vm.voicemail.fullname"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['fullname'].$error"
-                  ng-show="generalForm['fullname'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.FULLNAME_REQUIRED"
-                      >FullName field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.EMAIL">Email</label>
-                <input
-                  type="email"
-                  name="email"
-                  ng-model="vm.voicemail.email"
-                  ng-required="vm.voicemail.attach === 'yes'"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['email'].$error"
-                  ng-show="generalForm['email'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.EMAIL_REQUIRED"
-                      >Email field is required</span
-                    >
-                  </div>
-                  <div ng-message="email">
-                    <span translate="VOICE.ERRORS.EMAIL_MUST_VALID"
-                      >Email must be a valid e-mail address</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.PASSWORD">Password</label>
-                <input
-                  type="password"
-                  name="password"
-                  ng-model="vm.voicemail.password"
-                  placeholder="Password"
-                  translate
-                  translate-attr-placeholder="VOICE.PASSWORD"
-                  required
-                />
-                <div ng-messages="generalForm['password'].$error" role="alert">
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.PASSWORD_REQUIRED"
-                      >Password field is required</span
-                    >
-                  </div>
-                  <div ng-message="pattern">
-                    <span translate="VOICE.ERRORS.SECURE_PASSWORD_PATTERN"
-                      >Must contain at least 8 characters, with a minimum of 1
-                      lowercase letter, 1 uppercase letter, 1 numeric character
-                      and 1 special character ~!?*@#$%^&-_=+[{]}.</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-
-              <md-input-container class="md-block" ng-if="vm.newVoicemail ">
-                <label translate="VOICE.CONFIRM_PASSWORD"
-                  >Confirm Password</label
-                >
-                <input
-                  type="password"
-                  match-password="password"
-                  name="confirmPassword"
-                  ng-model="confirmPassword"
-                  required
-                />
-                <div
-                  ng-messages="generalForm.confirmPassword.$error"
-                  role="alert"
-                  multiple
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.CONFIRM_REQUIRED"
-                      >Confirm field is required</span
-                    >
-                  </div>
-                  <div ng-message="passwordMatch">
-                    <span translate="VOICE.ERRORS.CONFIRM_NOT_MATCH"
-                      >Your password did not match</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-
-              <md-input-container class="md-block">
-                <label translate="VOICE.MAILBOX">MailBox</label>
-                <input
-                  type="text"
-                  name="mailbox"
-                  ng-model="vm.voicemail.mailbox"
-                  ng-required="true"
-                  disabled
-                />
-
-                <div
-                  ng-messages="generalForm['mailbox'].$error"
-                  ng-show="generalForm['mailbox'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.MAILBOX_REQUIRED"
-                      >MailBox field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.VOICEMAIL_CONTEXT"
-                  >Voicemail_Context</label
-                >
-                <md-select
-                  name="context"
-                  ng-model="vm.voicemail.context"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="context.name"
-                    ng-repeat="context in vm.contexts"
-                    ng-disabled="context.canSelect === false"
-                    >{{ context.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span translate="VOICE.HELP.VOICEMAIL_CONTEXT"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['context'].$error"
-                  ng-show="generalForm['context'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.VOICEMAIL_CONTEXT_REQUIRED"
-                      >Voicemail_Context field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="VOICE.ADVANCED">ADVANCED</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="voicemail-detail-form-container advanced md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="VOICE.ADVANCED">
-                ADVANCED
-              </div>
-            </div>
-            <form name="advancedForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="VOICE.TIMEZONE">TimeZone</label>
-                <input
-                  type="text"
-                  name="tz"
-                  ng-model="vm.voicemail.tz"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="advancedForm['tz'].$error"
-                  ng-show="advancedForm['tz'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.TIMEZONE_REQUIRED"
-                      >TimeZone field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.ATTACH">Attach</label>
-                <md-select
-                  name="attach"
-                  ng-model="vm.voicemail.attach"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">
-                    {{ 'VOICE.YES' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'no'">
-                    {{ 'VOICE.NO' | translate }}
-                  </md-option>
-                </md-select>
-                <div
-                  ng-messages="advancedForm['attach'].$error"
-                  ng-show="advancedForm['attach'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.ATTACH_REQUIRED"
-                      >Attach field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.ENVELOPE">Envelope</label>
-                <md-select
-                  name="envelope"
-                  ng-model="vm.voicemail.envelope"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">
-                    {{ 'VOICE.YES' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'no'">
-                    {{ 'VOICE.NO' | translate }}
-                  </md-option>
-                </md-select>
-                <div
-                  ng-messages="advancedForm['envelope'].$error"
-                  ng-show="advancedForm['envelope'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.ENVELOPE_REQUIRED"
-                      >Envelope field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.DELETE">Delete</label>
-                <md-select
-                  name="delete"
-                  ng-model="vm.voicemail.delete"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'yes'">
-                    {{ 'VOICE.YES' | translate }}
-                  </md-option>
-
-                  <md-option ng-value="'no'">
-                    {{ 'VOICE.NO' | translate }}
-                  </md-option>
-                </md-select>
-                <div
-                  ng-messages="advancedForm['delete'].$error"
-                  ng-show="advancedForm['delete'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.DELETE_REQUIRED"
-                      >Delete field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.EMAILBODY">EmailBody</label>
-                <input
-                  type="text"
-                  name="emailbody"
-                  ng-model="vm.voicemail.emailbody"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="advancedForm['emailbody'].$error"
-                  ng-show="advancedForm['emailbody'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.EMAILBODY_REQUIRED"
-                      >EmailBody field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.EMAILSUBJECT">EmailSubject</label>
-                <input
-                  type="text"
-                  name="emailsubject"
-                  ng-model="vm.voicemail.emailsubject"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="advancedForm['emailsubject'].$error"
-                  ng-show="advancedForm['emailsubject'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.EMAILSUBJECT_REQUIRED"
-                      >EmailSubject field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.MAXSECONDS">MaxSeconds</label>
-                <input
-                  type="number"
-                  name="maxsecs"
-                  ng-model="vm.voicemail.maxsecs"
-                  min="0"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="advancedForm['maxsecs'].$error"
-                  ng-show="advancedForm['maxsecs'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.MAXSECONDS_REQUIRED"
-                      >MaxSeconds field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="VOICE.ERRORS.MAXSECONDS_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >MaxSeconds must be a valid greater or equal than</span
-                    >
-                    <span>0</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="VOICE.MAXMESSAGES">MaxMessages</label>
-                <input
-                  type="number"
-                  name="maxmsg"
-                  ng-model="vm.voicemail.maxmsg"
-                  min="0"
-                  max="9999"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="advancedForm['maxmsg'].$error"
-                  ng-show="advancedForm['maxmsg'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="VOICE.ERRORS.MAXMESSAGES_REQUIRED"
-                      >MaxMessages field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="VOICE.ERRORS.MAXMESSAGES_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >MaxMessages must be a valid greater or equal than</span
-                    >
-                    <span>0</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="VOICE.ERRORS.MAXMESSAGES_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >MaxMessages must be a valid greater or equal than</span
-                    >
-                    <span>9999</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="VOICE.MESSAGES">MESSAGES</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="voicemail-detail-form-container messages md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="VoicemailMessagesController as vm_dc"
-              ng-init="vm_dc.init(vm.voicemail, vm.crudPermissions)"
-            >
-              <md-toolbar
-                class="md-table-toolbar md-default"
-                ng-hide="vm_dc.selectedVoicemailMessages.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead" translate="VOICE.MESSAGES"
-                    >Messages</span
-                  >
-                  <ms-search-bar
-                    on-search="vm_dc.query.filter = query"
-                    on-collapse="vm_dc.query.filter = undefined"
-                    debounce="300"
-                    direction="down"
-                  ></ms-search-bar>
-                  <div flex></div>
-                </div>
-              </md-toolbar>
-              <md-toolbar
-                class="md-table-toolbar md-accent"
-                ng-show="vm_dc.selectedVoicemailMessages.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead"
-                    >{{vm_dc.selectedVoicemailMessages.length}}
-                    {{vm_dc.selectedVoicemailMessages.length > 1 ? 'items' :
-                    'item'}} selected</span
-                  >
-                  <div flex></div>
-                  <button
-                    class="md-icon-button"
-                    ng-csv="vm_dc.exportSelectedVoicemailMessages"
-                    csv-label="true"
-                    filename="voicemails.csv"
-                  >
-                    <md-icon md-font-icon="icon-file-excel"></md-icon>
-                  </button>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canDelete"
-                    class="md-icon-button"
-                    ng-click="vm_dc.deleteSelectedVoicemailMessages($event)"
-                    aria-label="delete selected"
-                    translate
-                    translate-attr-label="VOICE.DELETE_SELECTED"
-                  >
-                    <md-icon md-font-icon="icon-delete"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-table-container class="font-size-12">
-                <table
-                  md-table
-                  md-row-select
-                  multiple
-                  ng-model="vm_dc.selectedVoicemailMessages"
-                  md-progress="vm_dc.promise"
-                >
-                  <thead
-                    md-head
-                    md-order="vm_dc.query.sort"
-                    md-on-reorder="vm_dc.getVoicemailMessages"
-                  >
-                    <tr md-row>
-                      <th md-column md-order-by="id">
-                        {{ 'VOICE.ID' | translate }}
-                      </th>
-                      <th md-column md-order-by="callerid">
-                        {{ 'VOICE.CALLER_ID' | translate }}
-                      </th>
-                      <th md-column md-order-by="duration">
-                        {{ 'VOICE.DURATION' | translate }}
-                      </th>
-                      <th md-column md-order-by="audio">
-                        {{ 'VOICE.AUDIO' | translate }}
-                      </th>
-                      <th md-column md-order-by="stamp">
-                        {{ 'VOICE.RECEIVED_AT' | translate }}
-                      </th>
-                      <th md-column width="10px"></th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr
-                      md-row
-                      md-select="message"
-                      md-select-id="id"
-                      ng-repeat="message in vm_dc.voicemailMessages.rows"
-                    >
-                      <td md-cell>{{message.id}}</td>
-                      <td md-cell>{{message.callerid}}</td>
-                      <td md-cell>{{message.duration}}</td>
-                      <td md-cell>
-                        <!-- audio recording directive -->
-                        <ms-recording
-                          id="message.id"
-                          model="'voiceMailMessage'"
-                        ></ms-recording>
-                        <!-- / audio recording directive -->
-                      </td>
-                      <td md-cell>{{ message.stamp | formatdate }}</td>
-                      <td md-cell class="actions">
-                        <md-menu>
-                          <md-button
-                            class="md-icon-button"
-                            aria-label="More"
-                            translate
-                            translate-attr-aria-label="VOICE.MORE"
-                            ng-click="$mdOpenMenu($event)"
-                          >
-                            <md-icon
-                              md-font-icon="icon-dots-vertical"
-                            ></md-icon>
-                          </md-button>
-
-                          <md-menu-content width="3">
-                            <md-menu-item
-                              ng-if="vm_dc.crudPermissions.canDelete"
-                            >
-                              <md-button
-                                ng-click="vm_dc.deleteConfirm(message, $event)"
-                                translate="VOICE.DELETE_MESSAGE"
-                              >
-                                Delete Message
-                              </md-button>
-                            </md-menu-item>
-                          </md-menu-content>
-                        </md-menu>
-                      </td>
-                    </tr>
-                    <tr md-row ng-if="!vm_dc.voicemailMessages.rows.length">
-                      <td md-cell colspan="8">
-                        <div layout="row" layout-align="center center">
-                          <span
-                            class="text-boxed-light"
-                            translate="VOICE.NO_MESSAGE_AVAILABLE"
-                            >No message available</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-              <md-table-pagination
-                md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
-                md-limit="vm_dc.query.limit"
-                md-limit-options="[10, 15, 20, 50, 100, 250]"
-                md-page="vm_dc.query.page"
-                md-total="{{vm_dc.voicemailMessages.count}}"
-                md-on-paginate="vm_dc.getVoicemailMessages"
-                md-page-select
-              ></md-table-pagination>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/voice/views/voicemails/edit/view.html/view.html b/public/src/js/modules/main/apps/voice/views/voicemails/edit/view.html/view.html
new file mode 100644
index 0000000..f34abeb
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/voicemails/edit/view.html/view.html
@@ -0,0 +1,635 @@
+<div id="voice-voicemail" class="page-layout simple tabbed" layout="column">
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-voicemails-button md-icon-button"
+        aria-label="Go to voicemails"
+        ng-click="vm.gotoVoicemails()"
+        translate
+        translate-attr-aria-label="VOICE.GO_TO_VOICEMAILS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="voicemail-image" hide-xs>
+          <img ng-src="assets/images/business/voicemails.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.voicemail.id}}
+            <span ng-if="vm.voicemail.name">{{vm.voicemail.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="VOICE.CREATED_AT"></span>
+            <span>{{vm.voicemail.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveVoicemail()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (advancedForm.$invalid) || (messagesForm.$invalid)"
+        translate="VOICE.SAVE"
+        translate-attr-aria-label="VOICE.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="VOICE.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="voicemail-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="VOICE.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="VOICE.FULLNAME">FullName</label>
+                <input
+                  type="text"
+                  name="fullname"
+                  ng-model="vm.voicemail.fullname"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['fullname'].$error"
+                  ng-show="generalForm['fullname'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.FULLNAME_REQUIRED"
+                      >FullName field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.EMAIL">Email</label>
+                <input
+                  type="email"
+                  name="email"
+                  ng-model="vm.voicemail.email"
+                  ng-required="vm.voicemail.attach === 'yes'"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['email'].$error"
+                  ng-show="generalForm['email'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.EMAIL_REQUIRED"
+                      >Email field is required</span
+                    >
+                  </div>
+                  <div ng-message="email">
+                    <span translate="VOICE.ERRORS.EMAIL_MUST_VALID"
+                      >Email must be a valid e-mail address</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.PASSWORD">Password</label>
+                <input
+                  type="password"
+                  name="password"
+                  ng-model="vm.voicemail.password"
+                  placeholder="Password"
+                  translate
+                  translate-attr-placeholder="VOICE.PASSWORD"
+                  required
+                />
+                <div ng-messages="generalForm['password'].$error" role="alert">
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.PASSWORD_REQUIRED"
+                      >Password field is required</span
+                    >
+                  </div>
+                  <div ng-message="pattern">
+                    <span translate="VOICE.ERRORS.SECURE_PASSWORD_PATTERN"
+                      >Must contain at least 8 characters, with a minimum of 1
+                      lowercase letter, 1 uppercase letter, 1 numeric character
+                      and 1 special character ~!?*@#$%^&-_=+[{]}.</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+
+              <md-input-container class="md-block" ng-if="vm.newVoicemail ">
+                <label translate="VOICE.CONFIRM_PASSWORD"
+                  >Confirm Password</label
+                >
+                <input
+                  type="password"
+                  match-password="password"
+                  name="confirmPassword"
+                  ng-model="confirmPassword"
+                  required
+                />
+                <div
+                  ng-messages="generalForm.confirmPassword.$error"
+                  role="alert"
+                  multiple
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.CONFIRM_REQUIRED"
+                      >Confirm field is required</span
+                    >
+                  </div>
+                  <div ng-message="passwordMatch">
+                    <span translate="VOICE.ERRORS.CONFIRM_NOT_MATCH"
+                      >Your password did not match</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+
+              <md-input-container class="md-block">
+                <label translate="VOICE.MAILBOX">MailBox</label>
+                <input
+                  type="text"
+                  name="mailbox"
+                  ng-model="vm.voicemail.mailbox"
+                  ng-required="true"
+                  disabled
+                />
+
+                <div
+                  ng-messages="generalForm['mailbox'].$error"
+                  ng-show="generalForm['mailbox'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.MAILBOX_REQUIRED"
+                      >MailBox field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.VOICEMAIL_CONTEXT"
+                  >Voicemail_Context</label
+                >
+                <md-select
+                  name="context"
+                  ng-model="vm.voicemail.context"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="context.name"
+                    ng-repeat="context in vm.contexts"
+                    ng-disabled="context.canSelect === false"
+                    >{{ context.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span translate="VOICE.HELP.VOICEMAIL_CONTEXT"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['context'].$error"
+                  ng-show="generalForm['context'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.VOICEMAIL_CONTEXT_REQUIRED"
+                      >Voicemail_Context field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="VOICE.ADVANCED">ADVANCED</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="voicemail-detail-form-container advanced md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="VOICE.ADVANCED">
+                ADVANCED
+              </div>
+            </div>
+            <form name="advancedForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="VOICE.TIMEZONE">TimeZone</label>
+                <input
+                  type="text"
+                  name="tz"
+                  ng-model="vm.voicemail.tz"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="advancedForm['tz'].$error"
+                  ng-show="advancedForm['tz'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.TIMEZONE_REQUIRED"
+                      >TimeZone field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.ATTACH">Attach</label>
+                <md-select
+                  name="attach"
+                  ng-model="vm.voicemail.attach"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">
+                    {{ 'VOICE.YES' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'no'">
+                    {{ 'VOICE.NO' | translate }}
+                  </md-option>
+                </md-select>
+                <div
+                  ng-messages="advancedForm['attach'].$error"
+                  ng-show="advancedForm['attach'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.ATTACH_REQUIRED"
+                      >Attach field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.ENVELOPE">Envelope</label>
+                <md-select
+                  name="envelope"
+                  ng-model="vm.voicemail.envelope"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">
+                    {{ 'VOICE.YES' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'no'">
+                    {{ 'VOICE.NO' | translate }}
+                  </md-option>
+                </md-select>
+                <div
+                  ng-messages="advancedForm['envelope'].$error"
+                  ng-show="advancedForm['envelope'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.ENVELOPE_REQUIRED"
+                      >Envelope field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.DELETE">Delete</label>
+                <md-select
+                  name="delete"
+                  ng-model="vm.voicemail.delete"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'yes'">
+                    {{ 'VOICE.YES' | translate }}
+                  </md-option>
+
+                  <md-option ng-value="'no'">
+                    {{ 'VOICE.NO' | translate }}
+                  </md-option>
+                </md-select>
+                <div
+                  ng-messages="advancedForm['delete'].$error"
+                  ng-show="advancedForm['delete'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.DELETE_REQUIRED"
+                      >Delete field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.EMAILBODY">EmailBody</label>
+                <input
+                  type="text"
+                  name="emailbody"
+                  ng-model="vm.voicemail.emailbody"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="advancedForm['emailbody'].$error"
+                  ng-show="advancedForm['emailbody'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.EMAILBODY_REQUIRED"
+                      >EmailBody field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.EMAILSUBJECT">EmailSubject</label>
+                <input
+                  type="text"
+                  name="emailsubject"
+                  ng-model="vm.voicemail.emailsubject"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="advancedForm['emailsubject'].$error"
+                  ng-show="advancedForm['emailsubject'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.EMAILSUBJECT_REQUIRED"
+                      >EmailSubject field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.MAXSECONDS">MaxSeconds</label>
+                <input
+                  type="number"
+                  name="maxsecs"
+                  ng-model="vm.voicemail.maxsecs"
+                  min="0"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="advancedForm['maxsecs'].$error"
+                  ng-show="advancedForm['maxsecs'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.MAXSECONDS_REQUIRED"
+                      >MaxSeconds field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="VOICE.ERRORS.MAXSECONDS_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >MaxSeconds must be a valid greater or equal than</span
+                    >
+                    <span>0</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="VOICE.MAXMESSAGES">MaxMessages</label>
+                <input
+                  type="number"
+                  name="maxmsg"
+                  ng-model="vm.voicemail.maxmsg"
+                  min="0"
+                  max="9999"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="advancedForm['maxmsg'].$error"
+                  ng-show="advancedForm['maxmsg'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="VOICE.ERRORS.MAXMESSAGES_REQUIRED"
+                      >MaxMessages field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="VOICE.ERRORS.MAXMESSAGES_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >MaxMessages must be a valid greater or equal than</span
+                    >
+                    <span>0</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="VOICE.ERRORS.MAXMESSAGES_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >MaxMessages must be a valid greater or equal than</span
+                    >
+                    <span>9999</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="VOICE.MESSAGES">MESSAGES</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="voicemail-detail-form-container messages md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="VoicemailMessagesController as vm_dc"
+              ng-init="vm_dc.init(vm.voicemail, vm.crudPermissions)"
+            >
+              <md-toolbar
+                class="md-table-toolbar md-default"
+                ng-hide="vm_dc.selectedVoicemailMessages.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead" translate="VOICE.MESSAGES"
+                    >Messages</span
+                  >
+                  <ms-search-bar
+                    on-search="vm_dc.query.filter = query"
+                    on-collapse="vm_dc.query.filter = undefined"
+                    debounce="300"
+                    direction="down"
+                  ></ms-search-bar>
+                  <div flex></div>
+                </div>
+              </md-toolbar>
+              <md-toolbar
+                class="md-table-toolbar md-accent"
+                ng-show="vm_dc.selectedVoicemailMessages.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead"
+                    >{{vm_dc.selectedVoicemailMessages.length}}
+                    {{vm_dc.selectedVoicemailMessages.length > 1 ? 'items' :
+                    'item'}} selected</span
+                  >
+                  <div flex></div>
+                  <button
+                    class="md-icon-button"
+                    ng-csv="vm_dc.exportSelectedVoicemailMessages"
+                    csv-label="true"
+                    filename="voicemails.csv"
+                  >
+                    <md-icon md-font-icon="icon-file-excel"></md-icon>
+                  </button>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canDelete"
+                    class="md-icon-button"
+                    ng-click="vm_dc.deleteSelectedVoicemailMessages($event)"
+                    aria-label="delete selected"
+                    translate
+                    translate-attr-label="VOICE.DELETE_SELECTED"
+                  >
+                    <md-icon md-font-icon="icon-delete"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-table-container class="font-size-12">
+                <table
+                  md-table
+                  md-row-select
+                  multiple
+                  ng-model="vm_dc.selectedVoicemailMessages"
+                  md-progress="vm_dc.promise"
+                >
+                  <thead
+                    md-head
+                    md-order="vm_dc.query.sort"
+                    md-on-reorder="vm_dc.getVoicemailMessages"
+                  >
+                    <tr md-row>
+                      <th md-column md-order-by="id">
+                        {{ 'VOICE.ID' | translate }}
+                      </th>
+                      <th md-column md-order-by="callerid">
+                        {{ 'VOICE.CALLER_ID' | translate }}
+                      </th>
+                      <th md-column md-order-by="duration">
+                        {{ 'VOICE.DURATION' | translate }}
+                      </th>
+                      <th md-column md-order-by="audio">
+                        {{ 'VOICE.AUDIO' | translate }}
+                      </th>
+                      <th md-column md-order-by="stamp">
+                        {{ 'VOICE.RECEIVED_AT' | translate }}
+                      </th>
+                      <th md-column width="10px"></th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr
+                      md-row
+                      md-select="message"
+                      md-select-id="id"
+                      ng-repeat="message in vm_dc.voicemailMessages.rows"
+                    >
+                      <td md-cell>{{message.id}}</td>
+                      <td md-cell>{{message.callerid}}</td>
+                      <td md-cell>{{message.duration}}</td>
+                      <td md-cell>
+                        <!-- audio recording directive -->
+                        <ms-recording
+                          id="message.id"
+                          model="'voiceMailMessage'"
+                        ></ms-recording>
+                        <!-- / audio recording directive -->
+                      </td>
+                      <td md-cell>{{ message.stamp | formatdate }}</td>
+                      <td md-cell class="actions">
+                        <md-menu>
+                          <md-button
+                            class="md-icon-button"
+                            aria-label="More"
+                            translate
+                            translate-attr-aria-label="VOICE.MORE"
+                            ng-click="$mdOpenMenu($event)"
+                          >
+                            <md-icon
+                              md-font-icon="icon-dots-vertical"
+                            ></md-icon>
+                          </md-button>
+
+                          <md-menu-content width="3">
+                            <md-menu-item
+                              ng-if="vm_dc.crudPermissions.canDelete"
+                            >
+                              <md-button
+                                ng-click="vm_dc.deleteConfirm(message, $event)"
+                                translate="VOICE.DELETE_MESSAGE"
+                              >
+                                Delete Message
+                              </md-button>
+                            </md-menu-item>
+                          </md-menu-content>
+                        </md-menu>
+                      </td>
+                    </tr>
+                    <tr md-row ng-if="!vm_dc.voicemailMessages.rows.length">
+                      <td md-cell colspan="8">
+                        <div layout="row" layout-align="center center">
+                          <span
+                            class="text-boxed-light"
+                            translate="VOICE.NO_MESSAGE_AVAILABLE"
+                            >No message available</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+              <md-table-pagination
+                md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
+                md-limit="vm_dc.query.limit"
+                md-limit-options="[10, 15, 20, 50, 100, 250]"
+                md-page="vm_dc.query.page"
+                md-total="{{vm_dc.voicemailMessages.count}}"
+                md-on-paginate="vm_dc.getVoicemailMessages"
+                md-page-select
+              ></md-table-pagination>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/voice/views/voicemails/voicemails.html/voicemails-[chunkhash].html b/public/src/js/modules/main/apps/voice/views/voicemails/voicemails.html/voicemails-[chunkhash].html
deleted file mode 100644
index 4ed75be..0000000
--- a/public/src/js/modules/main/apps/voice/views/voicemails/voicemails.html/voicemails-[chunkhash].html
+++ /dev/null
@@ -1,307 +0,0 @@
-<div
-  id="voicemails"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-phone" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="VOICE.VOICEMAILS">Voicemails</span>
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="VOICE.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedVoicemails.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedVoicemails =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="VOICE.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-voicemails-count">
-          <span>{{vm.selectedVoicemails.length}}</span>
-          <span translate="VOICE.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="VOICE.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllVoicemails()"
-                translate="VOICE.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectVoicemails()"
-                translate="VOICE.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedVoicemails"
-          csv-label="true"
-          filename="voicemails.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedVoicemails($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="VOICE.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- VOICEMAIL TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedVoicemails"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getVoicemails"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">{{ 'VOICE.ID' | translate }}</th>
-                <th md-column md-order-by="fullname">
-                  {{ 'VOICE.FULLNAME' | translate }}
-                </th>
-                <th md-column md-order-by="email">
-                  {{ 'VOICE.EMAIL' | translate }}
-                </th>
-                <th md-column md-order-by="mailbox">
-                  {{ 'VOICE.MAILBOX' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.voicemails.rows.length">
-                <td md-cell colspan="5">
-                  <div layout="row" layout-align="center center">
-                    <span translate="VOICE.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="voicemail"
-                md-select-id="id"
-                ng-repeat="voicemail in vm.voicemails.rows"
-              >
-                <td md-cell ng-if="voicemail.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{voicemail.name}}"
-                    ng-src="api/users/{{voicemail.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!voicemail.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{voicemail.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voicemail, ev) : vm.createOrEditVoicemail($event, voicemail)"
-                  md-cell
-                  class="id"
-                >
-                  {{voicemail.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voicemail, ev) : vm.createOrEditVoicemail($event, voicemail)"
-                  md-cell
-                  class="fullname"
-                >
-                  {{voicemail.fullname}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voicemail, ev) : vm.createOrEditVoicemail($event, voicemail)"
-                  md-cell
-                  class="email"
-                >
-                  {{voicemail.email}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voicemail, ev) : vm.createOrEditVoicemail($event, voicemail)"
-                  md-cell
-                  class="mailbox"
-                >
-                  {{voicemail.mailbox}}
-                </td>
-
-                <td
-                  md-cell
-                  class="actions"
-                  ng-if="!vm.crudPermissions.readOnly"
-                >
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="VOICE.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(voicemail, $event    )"
-                          translate="VOICE.EDIT_VOICEMAIL"
-                        >
-                          Edit Voicemail
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(voicemail, $event    )"
-                          translate="VOICE.DELETE_VOICEMAIL"
-                        >
-                          Delete Voicemail
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.voicemails.count}}"
-          md-on-paginate="vm.getVoicemails"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / VOICEMAIL TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD VOICEMAIL BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-voicemail-button"
-    ng-click="vm.createOrEditVoicemail($event)"
-    aria-label="add voicemail"
-    translate
-    translate-attr-aria-label="VOICE.ADD_VOICEMAIL"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD VOICEMAIL BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/voice/views/voicemails/voicemails.html/voicemails.html b/public/src/js/modules/main/apps/voice/views/voicemails/voicemails.html/voicemails.html
new file mode 100644
index 0000000..4ed75be
--- /dev/null
+++ b/public/src/js/modules/main/apps/voice/views/voicemails/voicemails.html/voicemails.html
@@ -0,0 +1,307 @@
+<div
+  id="voicemails"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-phone" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="VOICE.VOICEMAILS">Voicemails</span>
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="VOICE.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedVoicemails.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedVoicemails =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="VOICE.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-voicemails-count">
+          <span>{{vm.selectedVoicemails.length}}</span>
+          <span translate="VOICE.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="VOICE.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllVoicemails()"
+                translate="VOICE.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectVoicemails()"
+                translate="VOICE.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedVoicemails"
+          csv-label="true"
+          filename="voicemails.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedVoicemails($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="VOICE.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- VOICEMAIL TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedVoicemails"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getVoicemails"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">{{ 'VOICE.ID' | translate }}</th>
+                <th md-column md-order-by="fullname">
+                  {{ 'VOICE.FULLNAME' | translate }}
+                </th>
+                <th md-column md-order-by="email">
+                  {{ 'VOICE.EMAIL' | translate }}
+                </th>
+                <th md-column md-order-by="mailbox">
+                  {{ 'VOICE.MAILBOX' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.voicemails.rows.length">
+                <td md-cell colspan="5">
+                  <div layout="row" layout-align="center center">
+                    <span translate="VOICE.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="voicemail"
+                md-select-id="id"
+                ng-repeat="voicemail in vm.voicemails.rows"
+              >
+                <td md-cell ng-if="voicemail.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{voicemail.name}}"
+                    ng-src="api/users/{{voicemail.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!voicemail.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{voicemail.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voicemail, ev) : vm.createOrEditVoicemail($event, voicemail)"
+                  md-cell
+                  class="id"
+                >
+                  {{voicemail.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voicemail, ev) : vm.createOrEditVoicemail($event, voicemail)"
+                  md-cell
+                  class="fullname"
+                >
+                  {{voicemail.fullname}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voicemail, ev) : vm.createOrEditVoicemail($event, voicemail)"
+                  md-cell
+                  class="email"
+                >
+                  {{voicemail.email}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(voicemail, ev) : vm.createOrEditVoicemail($event, voicemail)"
+                  md-cell
+                  class="mailbox"
+                >
+                  {{voicemail.mailbox}}
+                </td>
+
+                <td
+                  md-cell
+                  class="actions"
+                  ng-if="!vm.crudPermissions.readOnly"
+                >
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="VOICE.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(voicemail, $event    )"
+                          translate="VOICE.EDIT_VOICEMAIL"
+                        >
+                          Edit Voicemail
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(voicemail, $event    )"
+                          translate="VOICE.DELETE_VOICEMAIL"
+                        >
+                          Delete Voicemail
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'VOICE.PAGE' | translate}}:', rowsPerPage: '{{'VOICE.ROWSPERPAGE' | translate}}:', of: '{{'VOICE.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.voicemails.count}}"
+          md-on-paginate="vm.getVoicemails"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / VOICEMAIL TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD VOICEMAIL BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-voicemail-button"
+    ng-click="vm.createOrEditVoicemail($event)"
+    aria-label="add voicemail"
+    translate
+    translate-attr-aria-label="VOICE.ADD_VOICEMAIL"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD VOICEMAIL BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/realtime/agents/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/whatsapp/views/realtime/agents/view.html/view-[chunkhash].html
deleted file mode 100644
index cd98de8..0000000
--- a/public/src/js/modules/main/apps/whatsapp/views/realtime/agents/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,517 +0,0 @@
-<!-- MAIN -->
-<md-toolbar class="md-table-toolbar md-default">
-  <div class="md-toolbar-tools">
-    <span class="md-subhead" translate="WHATSAPP.AGENTS">Agents</span>
-    <div flex></div>
-    <ms-search-bar
-      on-search="vm.query.filter = query; vm.onInit()"
-      on-collapse="vm.query.filter = undefined; vm.onInit()"
-      debounce="300"
-    ></ms-search-bar>
-    <md-select
-      ng-model="vm.query.globalStatusFilter"
-      class="md-caption"
-      ng-change="vm.query.pauseTypeFilter = ''; vm.onInit()"
-    >
-      <md-option ng-value="''">{{ 'WHATSAPP.ALL' | translate }}</md-option>
-      <md-option value="pause">{{ 'WHATSAPP.PAUSE' | translate }}</md-option>
-      <md-option value="*pause"
-        >{{ 'WHATSAPP.PARTIALPAUSE' | translate }}</md-option
-      >
-      <md-option value="busy">{{ 'WHATSAPP.BUSY' | translate }}</md-option>
-      <md-option value="idle">{{ 'WHATSAPP.IDLE' | translate }}</md-option>
-    </md-select>
-
-    <md-select
-      ng-if="vm.isPause(vm.query.globalStatusFilter)"
-      ng-model="vm.query.pauseTypeFilter"
-      class="md-caption"
-      ng-change="vm.onInit()"
-    >
-      <md-option ng-value="''">All</md-option>
-      <md-option value="DEFAULT PAUSE">DEFAULT PAUSE</md-option>
-      <md-option value="ACW">ACW</md-option>
-      <md-option value="LOGININPAUSE">LOGININPAUSE</md-option>
-      <md-option value="Auto-Pause">AUTOPAUSE</md-option>
-      <md-option ng-value="pause.name" ng-repeat="pause in vm.pauses.rows"
-        >{{pause.name}}</md-option
-      >
-    </md-select>
-  </div>
-</md-toolbar>
-
-<!-- AGENT TABLE -->
-<md-table-container>
-  <table md-table multiple md-progress="vm.promise">
-    <thead md-head md-order="vm.query.order" md-on-reorder="vm.onInit">
-      <tr md-row border="1">
-        <th class="bv text-center" colspan="5">
-          {{ 'WHATSAPP.AGENT' | translate }}
-        </th>
-        <th class="bv bl text-center" colspan="2">
-          {{ 'VOICE.VOICE' | translate }}
-        </th>
-        <th ng-if="vm.license.chat" class="bv bl text-center" colspan="2">
-          {{ 'CHAT.CHAT' | translate }}
-        </th>
-        <th ng-if="vm.license.mail" class="bv bl text-center" colspan="2">
-          {{ 'MAIL.MAIL' | translate }}
-        </th>
-        <th ng-if="vm.license.messaging" class="bv bl text-center" colspan="2">
-          {{ 'SMS.SMS' | translate }}
-        </th>
-        <th
-          ng-if="vm.license.openchannel"
-          class="bv bl text-center"
-          colspan="2"
-        >
-          {{ 'OPENCHANNEL.OPENCHANNEL' | translate }}
-        </th>
-        <th ng-if="vm.license.fax" class="bv bl text-center" colspan="2">
-          {{ 'FAX.FAX' | translate }}
-        </th>
-        <th ng-if="vm.license.whatsapp" class="bv bl text-center" colspan="2">
-          {{ 'WHATSAPP.WHATSAPP' | translate }}
-        </th>
-        <th width="10px" class="bt bl" rowspan="2"></th>
-      </tr>
-      <tr md-row>
-        <th class="bl" colspan="2" md-column md-order-by="fullname">
-          {{ 'WHATSAPP.NAME' | translate }}
-        </th>
-        <th class="bl custom-column" md-column md-order-by="globalStatus">
-          {{ 'WHATSAPP.STATUS' | translate }}
-        </th>
-        <th class="bl custom-column" md-column md-order-by="lastLoginAt">
-          {{ 'WHATSAPP.LOGIN_TIME' | translate }}
-        </th>
-        <th class="bl custom-column" md-column md-order-by="lastPauseAt">
-          {{ 'WHATSAPP.PAUSE_TIME' | translate }}
-        </th>
-
-        <th class="bl custom-column">{{ 'VOICE.STATUS' | translate }}</th>
-        <th class="bl custom-column">Info</th>
-
-        <th ng-if="vm.license.chat" class="bl text-center">
-          {{ 'CHAT.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.chat" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'CHAT.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.mail" class="bl text-center">
-          {{ 'MAIL.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.mail" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'MAIL.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.messaging" class="bl text-center">
-          {{ 'SMS.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.messaging" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'SMS.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.openchannel" class="bl text-center">
-          {{ 'OPENCHANNEL.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.openchannel" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'OPENCHANNEL.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.fax" class="bl text-center">
-          {{ 'FAX.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.fax" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'FAX.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-
-        <th ng-if="vm.license.whatsapp" class="bl text-center">
-          {{ 'WHATSAPP.STATUS' | translate }}
-        </th>
-        <th ng-if="vm.license.whatsapp" class="text-center">
-          <md-icon md-font-icon="icon-battery-standard">
-            <md-tooltip>{{ 'WHATSAPP.CAPACITY' | translate }}</md-tooltip>
-          </md-icon>
-        </th>
-      </tr>
-    </thead>
-    <tbody md-body>
-      <tr md-row ng-hide="vm.order.length">
-        <td md-cell colspan="19">
-          <div layout="row" layout-align="center center">
-            <span>{{ 'WHATSAPP.NO_AGENT_ONLINE' | translate }}</span>
-          </div>
-        </td>
-      </tr>
-      <tr
-        md-select="vm.agents[value]"
-        md-select-id="id"
-        ng-repeat="(id, value) in vm.order"
-      >
-        <td class="bt padding-5">
-          <div layout="row" layout-align="start center">
-            <img
-              class="avatar"
-              ng-src="{{vm.agents[value].userpic && 'api/users/'+vm.agents[value].id+'/avatar' || 'assets/images/avatars/profile.png'}}"
-            />
-            <div layout="column">
-              <span>{{vm.agents[value].fullname}}</span>
-              <span>{{vm.agents[value].internal}}</span>
-            </div>
-          </div>
-        </td>
-        <td class="bt padding-5">
-          <div
-            layout="row"
-            layout-align="start center"
-            ng-if="vm.license.screenrecording && (vm.agents[value].phoneBarEnableScreenRecordingByAgent || vm.agents[value].phoneBarEnableAutomaticScreenRecording)"
-          >
-            <div class="column" ng-if="vm.agents[value].screenrecording">
-              <span>
-                <md-icon
-                  md-font-icon="icon-camcorder-box"
-                  style="color: green; font-size: 36px"
-                  aria-label="icon-camcorder-box26"
-                >
-                  <md-tooltip>
-                    {{ 'WHATSAPP.TOOLTIP_SCREENRECORDING_ON' | translate }}
-                  </md-tooltip>
-                </md-icon>
-              </span>
-            </div>
-            <div class="column" ng-if="!vm.agents[value].screenrecording">
-              <span>
-                <md-icon
-                  md-font-icon="icon-camcorder-box"
-                  style="color: gray"
-                  aria-label="icon-camcorder-box26"
-                >
-                  <md-tooltip>
-                    {{ 'WHATSAPP.TOOLTIP_SCREENRECORDING_OFF' | translate }}
-                  </md-tooltip>
-                </md-icon>
-              </span>
-            </div>
-          </div>
-        </td>
-
-        <td class="bt">
-          <span
-            class="text-boxed md-background-bg bl bt padding-5"
-            ng-class="{'idle':'lime-300-bg','busy':'indigo-100-bg','*pause':'amber-50-bg','pause':'amber-200-bg'}[vm.agents[value].globalStatus]"
-            >{{ vm.isPause(vm.agents[value].globalStatus) ? '' :
-            vm.agents[value].globalStatus | uppercase }} {{
-            vm.isPause(vm.agents[value].globalStatus) ?
-            (vm.isPartialPause(vm.agents[value].globalStatus) ?
-            '*'+vm.agents[value].pauseType || 'DEFAULT PAUSE' :
-            vm.agents[value].pauseType || 'DEFAULT PAUSE') : ''}}</span
-          >
-        </td>
-        <td class="bt custom-column">
-          <timer start-time="vm.agents[value].lastLoginAt" interval="1000"
-            >{{ days > 0 ? days + 'd' : '' }}
-            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
-          >
-        </td>
-        <td class="bt custom-column">
-          <timer
-            ng-if="vm.isPause(vm.agents[value].globalStatus) || vm.isPartialPause(vm.agents[value].globalStatus)"
-            start-time="vm.agents[value].lastPauseAt"
-            interval="1000"
-            >{{ days > 0 ? days + 'd' : '' }}
-            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
-          >
-        </td>
-        <td class="bt bl">
-          <div layout="row">
-            <span
-              ng-if="!vm.agents[value].onhold"
-              class="text-boxed md-background-bg bl bt padding-5"
-              ng-class="{'idle':'lime-300-bg','talking':'indigo-100-bg','ringing':'orange-400-bg','pause':'amber-200-bg'}[vm.agents[value].voiceStatus]"
-              >{{ vm.agents[value].voiceStatus | uppercase }}</span
-            >
-            <span
-              ng-if="vm.agents[value].onhold"
-              class="text-boxed md-background-bg bl bt padding-5 orange-400-bg"
-              >ONHOLD</span
-            >
-          </div>
-        </td>
-        <td class="bt bl">
-          <div layout="column">
-            <span
-              ng-if="vm.agents[value].queue"
-              class="padding-5"
-              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
-              >{{ vm.agents[value].queue }}</span
-            >
-            <span
-              ng-if="vm.agents[value].destconnectedlinenum"
-              class="padding-5"
-              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
-              >{{ vm.agents[value].destconnectedlinenum }}</span
-            >
-            <span
-              class="padding-5"
-              ng-if="vm.agents[value].queue || vm.agents[value].destconnectedlinenum"
-            >
-              <timer
-                start-time="vm.agents[value].voiceStatusTime"
-                interval="1000"
-                ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
-              >
-                {{hhours}}:{{mminutes}}:{{sseconds}}</timer
-              >
-            </span>
-          </div>
-        </td>
-
-        <td class="bt bl" ng-if="vm.license.chat">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].chatStatus]"
-                >{{ vm.agents[value].chatStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          md-number
-          class="bt text-center font-size-20"
-          ng-if="vm.license.chat"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].chatStatus]"
-        >
-          {{ vm.agents[value].chatCurrentCapacity }}
-        </td>
-
-        <td class="bl bt" ng-if="vm.license.mail">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].mailStatus]"
-                >{{ vm.agents[value].mailStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.mail"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].mailStatus]"
-        >
-          {{ vm.agents[value].mailCurrentCapacity }}
-        </td>
-
-        <td class="bl bt" ng-if="vm.license.messaging">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].smsStatus]"
-                >{{ vm.agents[value].smsStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.messaging"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].smsStatus]"
-        >
-          {{ vm.agents[value].smsCurrentCapacity }}
-        </td>
-
-        <td class="bt bl" ng-if="vm.license.openchannel">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].openchannelStatus]"
-                >{{ vm.agents[value].openchannelStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.openchannel"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].openchannelStatus]"
-        >
-          {{ vm.agents[value].openchannelCurrentCapacity }}
-        </td>
-
-        <td class="bt bl" ng-if="vm.license.fax">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].faxStatus]"
-                >{{ vm.agents[value].faxStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.fax"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].faxStatus]"
-        >
-          {{ vm.agents[value].faxCurrentCapacity }}
-        </td>
-
-        <td class="bl bt" ng-if="vm.license.whatsapp">
-          <div layout="row">
-            <div layout="column" layout-align="center center">
-              <span
-                class="text-boxed md-background-bg bl bt padding-5"
-                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].whatsappStatus]"
-                >{{ vm.agents[value].whatsappStatus | uppercase }}</span
-              >
-            </div>
-          </div>
-        </td>
-        <td
-          class="bt padding-5 text-center font-size-20"
-          ng-if="vm.license.whatsapp"
-          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].whatsappStatus]"
-        >
-          {{ vm.agents[value].whatsappCurrentCapacity }}
-        </td>
-
-        <td
-          class="bl bt padding-5 text-center"
-          ng-if="vm.crudPermissions.canEdit"
-        >
-          <md-menu>
-            <md-button
-              class="md-icon-button"
-              aria-label="More"
-              translate
-              translate-attr-aria-label="STAFF.MORE"
-              ng-click="$mdMenu.open($event)"
-            >
-              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-            </md-button>
-
-            <md-menu-content width="4">
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.logout(vm.agents[value], $event)"
-                  translate="WHATSAPP.LOGOUT"
-                >
-                  Logout
-                </md-button>
-              </md-menu-item>
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.queueAdd(vm.agents[value], $event)"
-                  translate="WHATSAPP.AGENTADD_QUEUE"
-                >
-                  Add Agent In Queue
-                </md-button>
-              </md-menu-item>
-
-              <md-menu-item
-                ng-if="vm.license.screenrecording && vm.agents[value].phoneBarEnableScreenRecordingByAgent"
-              >
-                <md-menu>
-                  <md-button
-                    ng-click="$mdMenu.open()"
-                    class="text-capitalize"
-                    translate="WHATSAPP.SCREENRECORDING"
-                    >Screen Recording
-                  </md-button>
-                  <md-menu-content>
-                    <md-menu-item ng-if="!vm.agents[value].screenrecording">
-                      <md-button
-                        ng-click="vm.screenRecording(vm.agents[value], true)"
-                        ><em translate="WHATSAPP.START_SCREENRECORDING"
-                          >Start Screen Recording</em
-                        ></md-button
-                      >
-                    </md-menu-item>
-                    <md-menu-item ng-if="vm.agents[value].screenrecording">
-                      <md-button
-                        ng-click="vm.screenRecording(vm.agents[value], false)"
-                        ><em translate="WHATSAPP.STOP_SCREENRECORDING"
-                          >Stop Screen Recording</em
-                        ></md-button
-                      >
-                    </md-menu-item>
-                  </md-menu-content>
-                </md-menu>
-              </md-menu-item>
-
-              <md-menu-item>
-                <md-menu>
-                  <md-button
-                    ng-click="$mdMenu.open()"
-                    class="text-capitalize"
-                    translate="WHATSAPP.PAUSE"
-                    >Pause</md-button
-                  >
-                  <md-menu-content>
-                    <md-menu-item>
-                      <md-button
-                        ng-disabled=" vm.agents[value].voicePause && 'DEFAULT PAUSE' === vm.agents[value].pauseType"
-                        ng-click="vm.pause(vm.agents[value])"
-                        ><em translate="WHATSAPP.DEFAULT_PAUSE"
-                          >Default Pause</em
-                        ></md-button
-                      >
-                    </md-menu-item>
-                    <md-menu-item
-                      ng-if="vm.pauses.rows.length"
-                      ng-repeat="pause in vm.pauses.rows"
-                    >
-                      <md-button
-                        ng-disabled="vm.agents[value].voicePause && pause.name === vm.agents[value].pauseType"
-                        ng-click="vm.pause(vm.agents[value], pause.name)"
-                        >{{pause.name}}
-                      </md-button>
-                    </md-menu-item>
-                  </md-menu-content>
-                </md-menu>
-              </md-menu-item>
-              <md-menu-item ng-if="vm.isPause(vm.agents[value].globalStatus)">
-                <md-button
-                  ng-click="vm.unPause(vm.agents[value])"
-                  translate="WHATSAPP.UNPAUSE"
-                >
-                  Unpause
-                </md-button>
-              </md-menu-item>
-            </md-menu-content>
-          </md-menu>
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</md-table-container>
-
-<md-table-pagination
-  md-label="{page: '{{'WHATSAPP.PAGE' | translate}}:', rowsPerPage: '{{'WHATSAPP.ROWSPERPAGE' | translate}}:', of: '{{'WHATSAPP.OF' | translate}}'}"
-  md-limit="vm.query.limit"
-  md-limit-options="[10, 15, 20, 50, 100, 250]"
-  md-page="vm.query.page"
-  md-total="{{vm.filteredAgents.length}}"
-  md-on-paginate="vm.onInit"
-  md-page-select
-></md-table-pagination>
-<!-- / AGENT TABLE -->
-<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/whatsapp/views/realtime/agents/view.html/view.html b/public/src/js/modules/main/apps/whatsapp/views/realtime/agents/view.html/view.html
new file mode 100644
index 0000000..cd98de8
--- /dev/null
+++ b/public/src/js/modules/main/apps/whatsapp/views/realtime/agents/view.html/view.html
@@ -0,0 +1,517 @@
+<!-- MAIN -->
+<md-toolbar class="md-table-toolbar md-default">
+  <div class="md-toolbar-tools">
+    <span class="md-subhead" translate="WHATSAPP.AGENTS">Agents</span>
+    <div flex></div>
+    <ms-search-bar
+      on-search="vm.query.filter = query; vm.onInit()"
+      on-collapse="vm.query.filter = undefined; vm.onInit()"
+      debounce="300"
+    ></ms-search-bar>
+    <md-select
+      ng-model="vm.query.globalStatusFilter"
+      class="md-caption"
+      ng-change="vm.query.pauseTypeFilter = ''; vm.onInit()"
+    >
+      <md-option ng-value="''">{{ 'WHATSAPP.ALL' | translate }}</md-option>
+      <md-option value="pause">{{ 'WHATSAPP.PAUSE' | translate }}</md-option>
+      <md-option value="*pause"
+        >{{ 'WHATSAPP.PARTIALPAUSE' | translate }}</md-option
+      >
+      <md-option value="busy">{{ 'WHATSAPP.BUSY' | translate }}</md-option>
+      <md-option value="idle">{{ 'WHATSAPP.IDLE' | translate }}</md-option>
+    </md-select>
+
+    <md-select
+      ng-if="vm.isPause(vm.query.globalStatusFilter)"
+      ng-model="vm.query.pauseTypeFilter"
+      class="md-caption"
+      ng-change="vm.onInit()"
+    >
+      <md-option ng-value="''">All</md-option>
+      <md-option value="DEFAULT PAUSE">DEFAULT PAUSE</md-option>
+      <md-option value="ACW">ACW</md-option>
+      <md-option value="LOGININPAUSE">LOGININPAUSE</md-option>
+      <md-option value="Auto-Pause">AUTOPAUSE</md-option>
+      <md-option ng-value="pause.name" ng-repeat="pause in vm.pauses.rows"
+        >{{pause.name}}</md-option
+      >
+    </md-select>
+  </div>
+</md-toolbar>
+
+<!-- AGENT TABLE -->
+<md-table-container>
+  <table md-table multiple md-progress="vm.promise">
+    <thead md-head md-order="vm.query.order" md-on-reorder="vm.onInit">
+      <tr md-row border="1">
+        <th class="bv text-center" colspan="5">
+          {{ 'WHATSAPP.AGENT' | translate }}
+        </th>
+        <th class="bv bl text-center" colspan="2">
+          {{ 'VOICE.VOICE' | translate }}
+        </th>
+        <th ng-if="vm.license.chat" class="bv bl text-center" colspan="2">
+          {{ 'CHAT.CHAT' | translate }}
+        </th>
+        <th ng-if="vm.license.mail" class="bv bl text-center" colspan="2">
+          {{ 'MAIL.MAIL' | translate }}
+        </th>
+        <th ng-if="vm.license.messaging" class="bv bl text-center" colspan="2">
+          {{ 'SMS.SMS' | translate }}
+        </th>
+        <th
+          ng-if="vm.license.openchannel"
+          class="bv bl text-center"
+          colspan="2"
+        >
+          {{ 'OPENCHANNEL.OPENCHANNEL' | translate }}
+        </th>
+        <th ng-if="vm.license.fax" class="bv bl text-center" colspan="2">
+          {{ 'FAX.FAX' | translate }}
+        </th>
+        <th ng-if="vm.license.whatsapp" class="bv bl text-center" colspan="2">
+          {{ 'WHATSAPP.WHATSAPP' | translate }}
+        </th>
+        <th width="10px" class="bt bl" rowspan="2"></th>
+      </tr>
+      <tr md-row>
+        <th class="bl" colspan="2" md-column md-order-by="fullname">
+          {{ 'WHATSAPP.NAME' | translate }}
+        </th>
+        <th class="bl custom-column" md-column md-order-by="globalStatus">
+          {{ 'WHATSAPP.STATUS' | translate }}
+        </th>
+        <th class="bl custom-column" md-column md-order-by="lastLoginAt">
+          {{ 'WHATSAPP.LOGIN_TIME' | translate }}
+        </th>
+        <th class="bl custom-column" md-column md-order-by="lastPauseAt">
+          {{ 'WHATSAPP.PAUSE_TIME' | translate }}
+        </th>
+
+        <th class="bl custom-column">{{ 'VOICE.STATUS' | translate }}</th>
+        <th class="bl custom-column">Info</th>
+
+        <th ng-if="vm.license.chat" class="bl text-center">
+          {{ 'CHAT.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.chat" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'CHAT.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.mail" class="bl text-center">
+          {{ 'MAIL.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.mail" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'MAIL.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.messaging" class="bl text-center">
+          {{ 'SMS.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.messaging" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'SMS.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.openchannel" class="bl text-center">
+          {{ 'OPENCHANNEL.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.openchannel" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'OPENCHANNEL.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.fax" class="bl text-center">
+          {{ 'FAX.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.fax" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'FAX.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+
+        <th ng-if="vm.license.whatsapp" class="bl text-center">
+          {{ 'WHATSAPP.STATUS' | translate }}
+        </th>
+        <th ng-if="vm.license.whatsapp" class="text-center">
+          <md-icon md-font-icon="icon-battery-standard">
+            <md-tooltip>{{ 'WHATSAPP.CAPACITY' | translate }}</md-tooltip>
+          </md-icon>
+        </th>
+      </tr>
+    </thead>
+    <tbody md-body>
+      <tr md-row ng-hide="vm.order.length">
+        <td md-cell colspan="19">
+          <div layout="row" layout-align="center center">
+            <span>{{ 'WHATSAPP.NO_AGENT_ONLINE' | translate }}</span>
+          </div>
+        </td>
+      </tr>
+      <tr
+        md-select="vm.agents[value]"
+        md-select-id="id"
+        ng-repeat="(id, value) in vm.order"
+      >
+        <td class="bt padding-5">
+          <div layout="row" layout-align="start center">
+            <img
+              class="avatar"
+              ng-src="{{vm.agents[value].userpic && 'api/users/'+vm.agents[value].id+'/avatar' || 'assets/images/avatars/profile.png'}}"
+            />
+            <div layout="column">
+              <span>{{vm.agents[value].fullname}}</span>
+              <span>{{vm.agents[value].internal}}</span>
+            </div>
+          </div>
+        </td>
+        <td class="bt padding-5">
+          <div
+            layout="row"
+            layout-align="start center"
+            ng-if="vm.license.screenrecording && (vm.agents[value].phoneBarEnableScreenRecordingByAgent || vm.agents[value].phoneBarEnableAutomaticScreenRecording)"
+          >
+            <div class="column" ng-if="vm.agents[value].screenrecording">
+              <span>
+                <md-icon
+                  md-font-icon="icon-camcorder-box"
+                  style="color: green; font-size: 36px"
+                  aria-label="icon-camcorder-box26"
+                >
+                  <md-tooltip>
+                    {{ 'WHATSAPP.TOOLTIP_SCREENRECORDING_ON' | translate }}
+                  </md-tooltip>
+                </md-icon>
+              </span>
+            </div>
+            <div class="column" ng-if="!vm.agents[value].screenrecording">
+              <span>
+                <md-icon
+                  md-font-icon="icon-camcorder-box"
+                  style="color: gray"
+                  aria-label="icon-camcorder-box26"
+                >
+                  <md-tooltip>
+                    {{ 'WHATSAPP.TOOLTIP_SCREENRECORDING_OFF' | translate }}
+                  </md-tooltip>
+                </md-icon>
+              </span>
+            </div>
+          </div>
+        </td>
+
+        <td class="bt">
+          <span
+            class="text-boxed md-background-bg bl bt padding-5"
+            ng-class="{'idle':'lime-300-bg','busy':'indigo-100-bg','*pause':'amber-50-bg','pause':'amber-200-bg'}[vm.agents[value].globalStatus]"
+            >{{ vm.isPause(vm.agents[value].globalStatus) ? '' :
+            vm.agents[value].globalStatus | uppercase }} {{
+            vm.isPause(vm.agents[value].globalStatus) ?
+            (vm.isPartialPause(vm.agents[value].globalStatus) ?
+            '*'+vm.agents[value].pauseType || 'DEFAULT PAUSE' :
+            vm.agents[value].pauseType || 'DEFAULT PAUSE') : ''}}</span
+          >
+        </td>
+        <td class="bt custom-column">
+          <timer start-time="vm.agents[value].lastLoginAt" interval="1000"
+            >{{ days > 0 ? days + 'd' : '' }}
+            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
+          >
+        </td>
+        <td class="bt custom-column">
+          <timer
+            ng-if="vm.isPause(vm.agents[value].globalStatus) || vm.isPartialPause(vm.agents[value].globalStatus)"
+            start-time="vm.agents[value].lastPauseAt"
+            interval="1000"
+            >{{ days > 0 ? days + 'd' : '' }}
+            {{hhours}}:{{mminutes}}:{{sseconds}}</timer
+          >
+        </td>
+        <td class="bt bl">
+          <div layout="row">
+            <span
+              ng-if="!vm.agents[value].onhold"
+              class="text-boxed md-background-bg bl bt padding-5"
+              ng-class="{'idle':'lime-300-bg','talking':'indigo-100-bg','ringing':'orange-400-bg','pause':'amber-200-bg'}[vm.agents[value].voiceStatus]"
+              >{{ vm.agents[value].voiceStatus | uppercase }}</span
+            >
+            <span
+              ng-if="vm.agents[value].onhold"
+              class="text-boxed md-background-bg bl bt padding-5 orange-400-bg"
+              >ONHOLD</span
+            >
+          </div>
+        </td>
+        <td class="bt bl">
+          <div layout="column">
+            <span
+              ng-if="vm.agents[value].queue"
+              class="padding-5"
+              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
+              >{{ vm.agents[value].queue }}</span
+            >
+            <span
+              ng-if="vm.agents[value].destconnectedlinenum"
+              class="padding-5"
+              ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
+              >{{ vm.agents[value].destconnectedlinenum }}</span
+            >
+            <span
+              class="padding-5"
+              ng-if="vm.agents[value].queue || vm.agents[value].destconnectedlinenum"
+            >
+              <timer
+                start-time="vm.agents[value].voiceStatusTime"
+                interval="1000"
+                ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].voiceStatus]"
+              >
+                {{hhours}}:{{mminutes}}:{{sseconds}}</timer
+              >
+            </span>
+          </div>
+        </td>
+
+        <td class="bt bl" ng-if="vm.license.chat">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].chatStatus]"
+                >{{ vm.agents[value].chatStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          md-number
+          class="bt text-center font-size-20"
+          ng-if="vm.license.chat"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].chatStatus]"
+        >
+          {{ vm.agents[value].chatCurrentCapacity }}
+        </td>
+
+        <td class="bl bt" ng-if="vm.license.mail">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].mailStatus]"
+                >{{ vm.agents[value].mailStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.mail"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].mailStatus]"
+        >
+          {{ vm.agents[value].mailCurrentCapacity }}
+        </td>
+
+        <td class="bl bt" ng-if="vm.license.messaging">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].smsStatus]"
+                >{{ vm.agents[value].smsStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.messaging"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].smsStatus]"
+        >
+          {{ vm.agents[value].smsCurrentCapacity }}
+        </td>
+
+        <td class="bt bl" ng-if="vm.license.openchannel">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].openchannelStatus]"
+                >{{ vm.agents[value].openchannelStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.openchannel"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].openchannelStatus]"
+        >
+          {{ vm.agents[value].openchannelCurrentCapacity }}
+        </td>
+
+        <td class="bt bl" ng-if="vm.license.fax">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].faxStatus]"
+                >{{ vm.agents[value].faxStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.fax"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].faxStatus]"
+        >
+          {{ vm.agents[value].faxCurrentCapacity }}
+        </td>
+
+        <td class="bl bt" ng-if="vm.license.whatsapp">
+          <div layout="row">
+            <div layout="column" layout-align="center center">
+              <span
+                class="text-boxed md-background-bg bl bt padding-5"
+                ng-class="{'idle':'lime-300-bg','maxcapacity':'red-A200-bg','working':'indigo-100-bg','pause':'amber-200-bg'}[vm.agents[value].whatsappStatus]"
+                >{{ vm.agents[value].whatsappStatus | uppercase }}</span
+              >
+            </div>
+          </div>
+        </td>
+        <td
+          class="bt padding-5 text-center font-size-20"
+          ng-if="vm.license.whatsapp"
+          ng-class="{'idle':'lime-300-fg','maxcapacity':'red-A200-fg','working':'indigo-100-fg','pause':'amber-200-fg'}[vm.agents[value].whatsappStatus]"
+        >
+          {{ vm.agents[value].whatsappCurrentCapacity }}
+        </td>
+
+        <td
+          class="bl bt padding-5 text-center"
+          ng-if="vm.crudPermissions.canEdit"
+        >
+          <md-menu>
+            <md-button
+              class="md-icon-button"
+              aria-label="More"
+              translate
+              translate-attr-aria-label="STAFF.MORE"
+              ng-click="$mdMenu.open($event)"
+            >
+              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+            </md-button>
+
+            <md-menu-content width="4">
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.logout(vm.agents[value], $event)"
+                  translate="WHATSAPP.LOGOUT"
+                >
+                  Logout
+                </md-button>
+              </md-menu-item>
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.queueAdd(vm.agents[value], $event)"
+                  translate="WHATSAPP.AGENTADD_QUEUE"
+                >
+                  Add Agent In Queue
+                </md-button>
+              </md-menu-item>
+
+              <md-menu-item
+                ng-if="vm.license.screenrecording && vm.agents[value].phoneBarEnableScreenRecordingByAgent"
+              >
+                <md-menu>
+                  <md-button
+                    ng-click="$mdMenu.open()"
+                    class="text-capitalize"
+                    translate="WHATSAPP.SCREENRECORDING"
+                    >Screen Recording
+                  </md-button>
+                  <md-menu-content>
+                    <md-menu-item ng-if="!vm.agents[value].screenrecording">
+                      <md-button
+                        ng-click="vm.screenRecording(vm.agents[value], true)"
+                        ><em translate="WHATSAPP.START_SCREENRECORDING"
+                          >Start Screen Recording</em
+                        ></md-button
+                      >
+                    </md-menu-item>
+                    <md-menu-item ng-if="vm.agents[value].screenrecording">
+                      <md-button
+                        ng-click="vm.screenRecording(vm.agents[value], false)"
+                        ><em translate="WHATSAPP.STOP_SCREENRECORDING"
+                          >Stop Screen Recording</em
+                        ></md-button
+                      >
+                    </md-menu-item>
+                  </md-menu-content>
+                </md-menu>
+              </md-menu-item>
+
+              <md-menu-item>
+                <md-menu>
+                  <md-button
+                    ng-click="$mdMenu.open()"
+                    class="text-capitalize"
+                    translate="WHATSAPP.PAUSE"
+                    >Pause</md-button
+                  >
+                  <md-menu-content>
+                    <md-menu-item>
+                      <md-button
+                        ng-disabled=" vm.agents[value].voicePause && 'DEFAULT PAUSE' === vm.agents[value].pauseType"
+                        ng-click="vm.pause(vm.agents[value])"
+                        ><em translate="WHATSAPP.DEFAULT_PAUSE"
+                          >Default Pause</em
+                        ></md-button
+                      >
+                    </md-menu-item>
+                    <md-menu-item
+                      ng-if="vm.pauses.rows.length"
+                      ng-repeat="pause in vm.pauses.rows"
+                    >
+                      <md-button
+                        ng-disabled="vm.agents[value].voicePause && pause.name === vm.agents[value].pauseType"
+                        ng-click="vm.pause(vm.agents[value], pause.name)"
+                        >{{pause.name}}
+                      </md-button>
+                    </md-menu-item>
+                  </md-menu-content>
+                </md-menu>
+              </md-menu-item>
+              <md-menu-item ng-if="vm.isPause(vm.agents[value].globalStatus)">
+                <md-button
+                  ng-click="vm.unPause(vm.agents[value])"
+                  translate="WHATSAPP.UNPAUSE"
+                >
+                  Unpause
+                </md-button>
+              </md-menu-item>
+            </md-menu-content>
+          </md-menu>
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</md-table-container>
+
+<md-table-pagination
+  md-label="{page: '{{'WHATSAPP.PAGE' | translate}}:', rowsPerPage: '{{'WHATSAPP.ROWSPERPAGE' | translate}}:', of: '{{'WHATSAPP.OF' | translate}}'}"
+  md-limit="vm.query.limit"
+  md-limit-options="[10, 15, 20, 50, 100, 250]"
+  md-page="vm.query.page"
+  md-total="{{vm.filteredAgents.length}}"
+  md-on-paginate="vm.onInit"
+  md-page-select
+></md-table-pagination>
+<!-- / AGENT TABLE -->
+<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/whatsapp/views/realtime/queues/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/whatsapp/views/realtime/queues/view.html/view-[chunkhash].html
deleted file mode 100644
index bb8a928..0000000
--- a/public/src/js/modules/main/apps/whatsapp/views/realtime/queues/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,112 +0,0 @@
-<!-- MAIN -->
-<md-toolbar class="md-table-toolbar md-default">
-  <div class="md-toolbar-tools">
-    <span class="md-subhead" translate="WHATSAPP.QUEUES">Queues</span>
-    <div flex></div>
-    <ms-search-bar
-      on-search="vm.query.filter = query;"
-      on-collapse="vm.query.filter = undefined;"
-      debounce="300"
-    ></ms-search-bar>
-  </div>
-</md-toolbar>
-
-<!-- QUEUE TABLE -->
-<md-table-container>
-  <table md-table multiple md-progress="vm.promise">
-    <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getQueues">
-      <tr md-row>
-        <th md-column md-order-by="name">{{ 'WHATSAPP.NAME' | translate }}</th>
-        <th md-column>{{ 'WHATSAPP.LOGGED_IN' | translate }}</th>
-        <th md-column>{{ 'WHATSAPP.PAUSED' | translate }}</th>
-        <th md-column>{{ 'WHATSAPP.READY' | translate }}</th>
-        <th md-column>{{ 'WHATSAPP.WAITING' | translate }}</th>
-        <th md-column width="10px"></th>
-      </tr>
-    </thead>
-    <tbody md-body>
-      <tr md-row ng-hide="vm.queues">
-        <td md-cell colspan="7">
-          <div layout="row" layout-align="center center">
-            <span translate="WHATSAPP.NO_AVAILABLE_INFO"
-              >No Available Info</span
-            >
-          </div>
-        </td>
-      </tr>
-      <tr
-        md-row
-        md-select="vm.queues[value]"
-        md-select-id="id"
-        ng-repeat="(id, value) in vm.order"
-      >
-        <td md-cell>{{vm.queues[value].name}}</td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{vm.queues[value].loggedInDb || 0}} ({{vm.queues[value].loggedIn
-            || 0}})</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{vm.queues[value].paused || 0}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-16 grey-fg"
-            >{{vm.queues[value].available || 0}}</span
-          >
-        </td>
-        <td md-cell>
-          <span class="font-size-20 grey-fg"
-            >{{vm.queues[value].waiting || 0}}</span
-          >
-        </td>
-        <td md-cell class="actions" ng-if="vm.crudPermissions.canEdit">
-          <md-menu>
-            <md-button
-              class="md-icon-button"
-              aria-label="More"
-              translate
-              translate-attr-aria-label="WHATSAPP.MORE"
-              ng-click="$mdMenu.open($event)"
-            >
-              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-            </md-button>
-
-            <md-menu-content width="3">
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.createOrEditWhatsappQueue($event, vm.queues[value])"
-                  translate="WHATSAPP.EDIT_QUEUE"
-                >
-                  Edit Queue
-                </md-button>
-              </md-menu-item>
-              <md-menu-item>
-                <md-button
-                  ng-click="vm.agentAdd($event, vm.queues[value])"
-                  translate="WHATSAPP.AGENTSADD_QUEUE"
-                >
-                  Add Agents to queue
-                </md-button>
-              </md-menu-item>
-            </md-menu-content>
-          </md-menu>
-        </td>
-      </tr>
-    </tbody>
-  </table>
-</md-table-container>
-
-<md-table-pagination
-  md-label="{page: '{{'WHATSAPP.PAGE' | translate}}:', rowsPerPage: '{{'WHATSAPP.ROWSPERPAGE' | translate}}:', of: '{{'WHATSAPP.OF' | translate}}'}"
-  md-limit="vm.query.limit"
-  md-limit-options="[10, 15, 20, 50, 100, 250]"
-  md-page="vm.query.page"
-  md-total="{{vm.count}}"
-  md-on-paginate="vm.getQueues"
-  md-page-select
-></md-table-pagination>
-<!-- / QUEUE TABLE -->
-<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/whatsapp/views/realtime/queues/view.html/view.html b/public/src/js/modules/main/apps/whatsapp/views/realtime/queues/view.html/view.html
new file mode 100644
index 0000000..bb8a928
--- /dev/null
+++ b/public/src/js/modules/main/apps/whatsapp/views/realtime/queues/view.html/view.html
@@ -0,0 +1,112 @@
+<!-- MAIN -->
+<md-toolbar class="md-table-toolbar md-default">
+  <div class="md-toolbar-tools">
+    <span class="md-subhead" translate="WHATSAPP.QUEUES">Queues</span>
+    <div flex></div>
+    <ms-search-bar
+      on-search="vm.query.filter = query;"
+      on-collapse="vm.query.filter = undefined;"
+      debounce="300"
+    ></ms-search-bar>
+  </div>
+</md-toolbar>
+
+<!-- QUEUE TABLE -->
+<md-table-container>
+  <table md-table multiple md-progress="vm.promise">
+    <thead md-head md-order="vm.query.sort" md-on-reorder="vm.getQueues">
+      <tr md-row>
+        <th md-column md-order-by="name">{{ 'WHATSAPP.NAME' | translate }}</th>
+        <th md-column>{{ 'WHATSAPP.LOGGED_IN' | translate }}</th>
+        <th md-column>{{ 'WHATSAPP.PAUSED' | translate }}</th>
+        <th md-column>{{ 'WHATSAPP.READY' | translate }}</th>
+        <th md-column>{{ 'WHATSAPP.WAITING' | translate }}</th>
+        <th md-column width="10px"></th>
+      </tr>
+    </thead>
+    <tbody md-body>
+      <tr md-row ng-hide="vm.queues">
+        <td md-cell colspan="7">
+          <div layout="row" layout-align="center center">
+            <span translate="WHATSAPP.NO_AVAILABLE_INFO"
+              >No Available Info</span
+            >
+          </div>
+        </td>
+      </tr>
+      <tr
+        md-row
+        md-select="vm.queues[value]"
+        md-select-id="id"
+        ng-repeat="(id, value) in vm.order"
+      >
+        <td md-cell>{{vm.queues[value].name}}</td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{vm.queues[value].loggedInDb || 0}} ({{vm.queues[value].loggedIn
+            || 0}})</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{vm.queues[value].paused || 0}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-16 grey-fg"
+            >{{vm.queues[value].available || 0}}</span
+          >
+        </td>
+        <td md-cell>
+          <span class="font-size-20 grey-fg"
+            >{{vm.queues[value].waiting || 0}}</span
+          >
+        </td>
+        <td md-cell class="actions" ng-if="vm.crudPermissions.canEdit">
+          <md-menu>
+            <md-button
+              class="md-icon-button"
+              aria-label="More"
+              translate
+              translate-attr-aria-label="WHATSAPP.MORE"
+              ng-click="$mdMenu.open($event)"
+            >
+              <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+            </md-button>
+
+            <md-menu-content width="3">
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.createOrEditWhatsappQueue($event, vm.queues[value])"
+                  translate="WHATSAPP.EDIT_QUEUE"
+                >
+                  Edit Queue
+                </md-button>
+              </md-menu-item>
+              <md-menu-item>
+                <md-button
+                  ng-click="vm.agentAdd($event, vm.queues[value])"
+                  translate="WHATSAPP.AGENTSADD_QUEUE"
+                >
+                  Add Agents to queue
+                </md-button>
+              </md-menu-item>
+            </md-menu-content>
+          </md-menu>
+        </td>
+      </tr>
+    </tbody>
+  </table>
+</md-table-container>
+
+<md-table-pagination
+  md-label="{page: '{{'WHATSAPP.PAGE' | translate}}:', rowsPerPage: '{{'WHATSAPP.ROWSPERPAGE' | translate}}:', of: '{{'WHATSAPP.OF' | translate}}'}"
+  md-limit="vm.query.limit"
+  md-limit-options="[10, 15, 20, 50, 100, 250]"
+  md-page="vm.query.page"
+  md-total="{{vm.count}}"
+  md-on-paginate="vm.getQueues"
+  md-page-select
+></md-table-pagination>
+<!-- / QUEUE TABLE -->
+<!-- / MAIN -->
diff --git a/public/src/js/modules/main/apps/whatsapp/views/realtime/realtime.html/realtime-[chunkhash].html b/public/src/js/modules/main/apps/whatsapp/views/realtime/realtime.html/realtime-[chunkhash].html
deleted file mode 100644
index 5e0e90a..0000000
--- a/public/src/js/modules/main/apps/whatsapp/views/realtime/realtime.html/realtime-[chunkhash].html
+++ /dev/null
@@ -1,26 +0,0 @@
-<div id="realtime" class="page-layout simple tabbed" layout="column" ng-cloak>
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="WHATSAPP.AGENTS">Agents</span>
-        </md-tab-label>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="WHATSAPP.QUEUES">Queues</span>
-        </md-tab-label>
-      </md-tab>
-    </md-tabs>
-
-    <md-card ui-view></md-card>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/realtime/realtime.html/realtime.html b/public/src/js/modules/main/apps/whatsapp/views/realtime/realtime.html/realtime.html
new file mode 100644
index 0000000..5e0e90a
--- /dev/null
+++ b/public/src/js/modules/main/apps/whatsapp/views/realtime/realtime.html/realtime.html
@@ -0,0 +1,26 @@
+<div id="realtime" class="page-layout simple tabbed" layout="column" ng-cloak>
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="WHATSAPP.AGENTS">Agents</span>
+        </md-tab-label>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="WHATSAPP.QUEUES">Queues</span>
+        </md-tab-label>
+      </md-tab>
+    </md-tabs>
+
+    <md-card ui-view></md-card>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 6e08573..0000000
--- a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,331 +0,0 @@
-<md-dialog class="whatsappAccount-dialog" aria-label="New WhatsappAccount">
-  <form name="whatsappAccountForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.whatsappAccount.name"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.newWhatsappAccount"
-        />
-
-        <div class="hint"><span translate="WHATSAPP.HELP.NAME"></span></div>
-        <div
-          ng-messages="whatsappAccountForm['name'].$error"
-          ng-show="whatsappAccountForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.KEY">key</label>
-        <input
-          type="text"
-          name="key"
-          ng-model="vm.whatsappAccount.key"
-          md-maxlength="5"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="whatsappAccountForm['key'].$error"
-          ng-show="whatsappAccountForm['key'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.KEY_REQUIRED"
-              >key field is required</span
-            >
-          </div>
-          <div ng-message="md-maxlength">
-            <span
-              translate="WHATSAPP.ERRORS.KEY_MAX_LENGTH"
-              translate-values="{max: 5}"
-              >key must have a maximum length equal to 5</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.LIST">List</label>
-        <md-select name="ListId" ng-model="vm.whatsappAccount.ListId" required>
-          <md-option
-            ng-value="ListId.id"
-            ng-repeat="ListId in vm.lists"
-            ng-disabled="ListId.canSelect === false"
-            >{{ ListId.name }}</md-option
-          >
-        </md-select>
-        <div class="hint"><span translate="WHATSAPP.HELP.LIST"></span></div>
-        <div
-          ng-messages="whatsappAccountForm['ListId'].$error"
-          ng-show="whatsappAccountForm['ListId'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.LIST_REQUIRED"
-              >List field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.MOTIONPROXY">MotionProxy</label>
-        <input
-          type="url"
-          name="remote"
-          ng-model="vm.whatsappAccount.remote"
-          md-maxlength="255"
-          ng-required="true"
-        />
-
-        <div class="hint">
-          <span translate="WHATSAPP.HELP.MOTIONPROXY"></span>
-        </div>
-        <div
-          ng-messages="whatsappAccountForm['remote'].$error"
-          ng-show="whatsappAccountForm['remote'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.MOTIONPROXY_REQUIRED"
-              >MotionProxy field is required</span
-            >
-          </div>
-          <div ng-message="url">
-            <span translate="WHATSAPP.ERRORS.MOTIONPROXY_MUST_VALID_URL"
-              >MotionProxy must be a valid url http://www.xcally.com</span
-            >
-          </div>
-          <div ng-message="md-maxlength">
-            <span
-              translate="WHATSAPP.ERRORS.MOTIONPROXY_MAX_LENGTH"
-              translate-values="{max: 255}"
-              >MotionProxy must have a maximum length equal to 255</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.TYPE">Type</label>
-        <md-select name="type" ng-model="vm.whatsappAccount.type">
-          <md-option ng-value="'twilio'">Twilio</md-option>
-        </md-select>
-        <div
-          ng-messages="whatsappAccountForm['type'].$error"
-          ng-show="whatsappAccountForm['type'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.TYPE_REQUIRED"
-              >Type field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.whatsappAccount.type == 'twilio'"
-        class="md-block"
-      >
-        <label translate="WHATSAPP.ACCOUNTSID">AccountSID</label>
-        <input
-          type="text"
-          name="accountSid"
-          ng-model="vm.whatsappAccount.accountSid"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="whatsappAccountForm['accountSid'].$error"
-          ng-show="whatsappAccountForm['accountSid'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.ACCOUNTSID_REQUIRED"
-              >AccountSID field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container
-        ng-if="vm.whatsappAccount.type == 'twilio'"
-        class="md-block"
-      >
-        <label translate="WHATSAPP.AUTHTOKEN">AuthToken</label>
-        <input
-          type="text"
-          name="authToken"
-          ng-model="vm.whatsappAccount.authToken"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="whatsappAccountForm['authToken'].$error"
-          ng-show="whatsappAccountForm['authToken'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.AUTHTOKEN_REQUIRED"
-              >AuthToken field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.PHONE">phone</label>
-        <input
-          type="text"
-          name="phone"
-          ng-model="vm.whatsappAccount.phone"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="whatsappAccountForm['phone'].$error"
-          ng-show="whatsappAccountForm['phone'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.PHONE_REQUIRED"
-              >phone field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.whatsappAccount.description"
-        />
-
-        <div
-          ng-messages="whatsappAccountForm['description'].$error"
-          ng-show="whatsappAccountForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newWhatsappAccount"
-          ng-click="vm.saveWhatsappAccount()"
-          class="send-button md-accent md-raised"
-          ng-disabled="whatsappAccountForm.$invalid || whatsappAccountForm.$pristine"
-          aria-label="SAVE"
-          translate="WHATSAPP.SAVE"
-          translate-attr-aria-label="WHATSAPP.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newWhatsappAccount"
-          ng-click="vm.addNewWhatsappAccount()"
-          class="send-button md-accent md-raised"
-          ng-disabled="whatsappAccountForm.$invalid"
-          aria-label="ADD"
-          translate="WHATSAPP.ADD_WHATSAPPACCOUNT"
-          translate-attr-aria-label="WHATSAPP.ADD_WHATSAPPACCOUNT"
-        >
-          ADD WHATSAPPACCOUNT
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newWhatsappAccount"
-          ng-click="vm.deleteWhatsappAccount($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="WHATSAPP.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="WHATSAPP.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/create/dialog.html/dialog.html
new file mode 100644
index 0000000..6e08573
--- /dev/null
+++ b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/create/dialog.html/dialog.html
@@ -0,0 +1,331 @@
+<md-dialog class="whatsappAccount-dialog" aria-label="New WhatsappAccount">
+  <form name="whatsappAccountForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.whatsappAccount.name"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.newWhatsappAccount"
+        />
+
+        <div class="hint"><span translate="WHATSAPP.HELP.NAME"></span></div>
+        <div
+          ng-messages="whatsappAccountForm['name'].$error"
+          ng-show="whatsappAccountForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.KEY">key</label>
+        <input
+          type="text"
+          name="key"
+          ng-model="vm.whatsappAccount.key"
+          md-maxlength="5"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="whatsappAccountForm['key'].$error"
+          ng-show="whatsappAccountForm['key'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.KEY_REQUIRED"
+              >key field is required</span
+            >
+          </div>
+          <div ng-message="md-maxlength">
+            <span
+              translate="WHATSAPP.ERRORS.KEY_MAX_LENGTH"
+              translate-values="{max: 5}"
+              >key must have a maximum length equal to 5</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.LIST">List</label>
+        <md-select name="ListId" ng-model="vm.whatsappAccount.ListId" required>
+          <md-option
+            ng-value="ListId.id"
+            ng-repeat="ListId in vm.lists"
+            ng-disabled="ListId.canSelect === false"
+            >{{ ListId.name }}</md-option
+          >
+        </md-select>
+        <div class="hint"><span translate="WHATSAPP.HELP.LIST"></span></div>
+        <div
+          ng-messages="whatsappAccountForm['ListId'].$error"
+          ng-show="whatsappAccountForm['ListId'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.LIST_REQUIRED"
+              >List field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.MOTIONPROXY">MotionProxy</label>
+        <input
+          type="url"
+          name="remote"
+          ng-model="vm.whatsappAccount.remote"
+          md-maxlength="255"
+          ng-required="true"
+        />
+
+        <div class="hint">
+          <span translate="WHATSAPP.HELP.MOTIONPROXY"></span>
+        </div>
+        <div
+          ng-messages="whatsappAccountForm['remote'].$error"
+          ng-show="whatsappAccountForm['remote'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.MOTIONPROXY_REQUIRED"
+              >MotionProxy field is required</span
+            >
+          </div>
+          <div ng-message="url">
+            <span translate="WHATSAPP.ERRORS.MOTIONPROXY_MUST_VALID_URL"
+              >MotionProxy must be a valid url http://www.xcally.com</span
+            >
+          </div>
+          <div ng-message="md-maxlength">
+            <span
+              translate="WHATSAPP.ERRORS.MOTIONPROXY_MAX_LENGTH"
+              translate-values="{max: 255}"
+              >MotionProxy must have a maximum length equal to 255</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.TYPE">Type</label>
+        <md-select name="type" ng-model="vm.whatsappAccount.type">
+          <md-option ng-value="'twilio'">Twilio</md-option>
+        </md-select>
+        <div
+          ng-messages="whatsappAccountForm['type'].$error"
+          ng-show="whatsappAccountForm['type'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.TYPE_REQUIRED"
+              >Type field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.whatsappAccount.type == 'twilio'"
+        class="md-block"
+      >
+        <label translate="WHATSAPP.ACCOUNTSID">AccountSID</label>
+        <input
+          type="text"
+          name="accountSid"
+          ng-model="vm.whatsappAccount.accountSid"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="whatsappAccountForm['accountSid'].$error"
+          ng-show="whatsappAccountForm['accountSid'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.ACCOUNTSID_REQUIRED"
+              >AccountSID field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container
+        ng-if="vm.whatsappAccount.type == 'twilio'"
+        class="md-block"
+      >
+        <label translate="WHATSAPP.AUTHTOKEN">AuthToken</label>
+        <input
+          type="text"
+          name="authToken"
+          ng-model="vm.whatsappAccount.authToken"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="whatsappAccountForm['authToken'].$error"
+          ng-show="whatsappAccountForm['authToken'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.AUTHTOKEN_REQUIRED"
+              >AuthToken field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.PHONE">phone</label>
+        <input
+          type="text"
+          name="phone"
+          ng-model="vm.whatsappAccount.phone"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="whatsappAccountForm['phone'].$error"
+          ng-show="whatsappAccountForm['phone'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.PHONE_REQUIRED"
+              >phone field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.whatsappAccount.description"
+        />
+
+        <div
+          ng-messages="whatsappAccountForm['description'].$error"
+          ng-show="whatsappAccountForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newWhatsappAccount"
+          ng-click="vm.saveWhatsappAccount()"
+          class="send-button md-accent md-raised"
+          ng-disabled="whatsappAccountForm.$invalid || whatsappAccountForm.$pristine"
+          aria-label="SAVE"
+          translate="WHATSAPP.SAVE"
+          translate-attr-aria-label="WHATSAPP.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newWhatsappAccount"
+          ng-click="vm.addNewWhatsappAccount()"
+          class="send-button md-accent md-raised"
+          ng-disabled="whatsappAccountForm.$invalid"
+          aria-label="ADD"
+          translate="WHATSAPP.ADD_WHATSAPPACCOUNT"
+          translate-attr-aria-label="WHATSAPP.ADD_WHATSAPPACCOUNT"
+        >
+          ADD WHATSAPPACCOUNT
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newWhatsappAccount"
+          ng-click="vm.deleteWhatsappAccount($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="WHATSAPP.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="WHATSAPP.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/agentadd/agentadd.html/agentadd-[chunkhash].html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
deleted file mode 100644
index 375abc4..0000000
--- a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
+++ /dev/null
@@ -1,46 +0,0 @@
-<md-dialog
-  class="whatsappAccount-dialog"
-  aria-label="whatsappAccount"
-  ng-init="vm.onInit()"
->
-  <form name="whatsappAccountForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="WHATSAPP.AGENTADD_WHATSAPPACCOUNT">
-          Add Agent to whatsappAccount
-        </h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <ms-dual-multiselect
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveAgents()"
-        class="send-button md-accent md-raised"
-        ng-disabled="!vm.pendingChanges"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/agentadd/agentadd.html/agentadd.html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/agentadd/agentadd.html/agentadd.html
new file mode 100644
index 0000000..375abc4
--- /dev/null
+++ b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/agentadd/agentadd.html/agentadd.html
@@ -0,0 +1,46 @@
+<md-dialog
+  class="whatsappAccount-dialog"
+  aria-label="whatsappAccount"
+  ng-init="vm.onInit()"
+>
+  <form name="whatsappAccountForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="WHATSAPP.AGENTADD_WHATSAPPACCOUNT">
+          Add Agent to whatsappAccount
+        </h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <ms-dual-multiselect
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveAgents()"
+        class="send-button md-accent md-raised"
+        ng-disabled="!vm.pendingChanges"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/agent/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/agent/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 3592731..0000000
--- a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/agent/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,149 +0,0 @@
-<md-dialog class="whatsappAccount-dialog" aria-label="New WhatsappAccount">
-  <form name="whatsappAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.AGENT">Agent</label>
-        <md-select
-          name="agent"
-          ng-model="vm.agent.agent"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="agent.name"
-            ng-repeat="agent in vm.agents"
-            ng-disabled="agent.canSelect === false"
-            >{{ agent.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="whatsappAccountFormApp['agent'].$error"
-          ng-show="whatsappAccountFormApp['agent'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.AGENT_REQUIRED"
-              >Agent field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.TIMEOUT">Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.agent.timeout"
-          min="0"
-          max="2147483"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="whatsappAccountFormApp['timeout'].$error"
-          ng-show="whatsappAccountFormApp['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.TIMEOUT_REQUIRED"
-              >Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="WHATSAPP.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-          <div ng-message="max">
-            <span
-              translate="WHATSAPP.ERRORS.TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>2147483</span>
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveWhatsappAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="whatsappAccountFormApp.$invalid || whatsappAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="WHATSAPP.SAVE"
-          translate-attr-aria-label="WHATSAPP.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/agent/dialog.html/dialog.html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/agent/dialog.html/dialog.html
new file mode 100644
index 0000000..3592731
--- /dev/null
+++ b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/agent/dialog.html/dialog.html
@@ -0,0 +1,149 @@
+<md-dialog class="whatsappAccount-dialog" aria-label="New WhatsappAccount">
+  <form name="whatsappAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.AGENT">Agent</label>
+        <md-select
+          name="agent"
+          ng-model="vm.agent.agent"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="agent.name"
+            ng-repeat="agent in vm.agents"
+            ng-disabled="agent.canSelect === false"
+            >{{ agent.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="whatsappAccountFormApp['agent'].$error"
+          ng-show="whatsappAccountFormApp['agent'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.AGENT_REQUIRED"
+              >Agent field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.TIMEOUT">Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.agent.timeout"
+          min="0"
+          max="2147483"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="whatsappAccountFormApp['timeout'].$error"
+          ng-show="whatsappAccountFormApp['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.TIMEOUT_REQUIRED"
+              >Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="WHATSAPP.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+          <div ng-message="max">
+            <span
+              translate="WHATSAPP.ERRORS.TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>2147483</span>
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveWhatsappAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="whatsappAccountFormApp.$invalid || whatsappAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="WHATSAPP.SAVE"
+          translate-attr-aria-label="WHATSAPP.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/amazonlex/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/amazonlex/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 9d2a9f8..0000000
--- a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/amazonlex/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,208 +0,0 @@
-<md-dialog class="whatsappAccount-dialog" aria-label="New WhatsappAccount">
-  <form name="whatsappAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.ACCESSKEYID">accesskeyid</label>
-        <input
-          type="text"
-          name="accesskeyid"
-          ng-model="vm.amazonlex.accesskeyid"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="whatsappAccountFormApp['accesskeyid'].$error"
-          ng-show="whatsappAccountFormApp['accesskeyid'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.ACCESSKEYID_REQUIRED"
-              >accesskeyid field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.SECRETACCESSKEY">secretaccesskey</label>
-        <input
-          type="text"
-          name="secretaccesskey"
-          ng-model="vm.amazonlex.secretaccesskey"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="whatsappAccountFormApp['secretaccesskey'].$error"
-          ng-show="whatsappAccountFormApp['secretaccesskey'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.SECRETACCESSKEY_REQUIRED"
-              >secretaccesskey field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.LEXREGION">lexregion</label>
-        <md-select
-          name="lexregion"
-          ng-model="vm.amazonlex.lexregion"
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="'us-east-1'">US East (N. Virginia)</md-option>
-          <md-option ng-value="'us-west-2'">US West (Oregon)</md-option>
-          <md-option ng-value="'eu-west-1'">EU (Ireland)</md-option>
-          <md-option ng-value="'ap-southeast-2'"
-            >Asia Pacific (Sydney)</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="whatsappAccountFormApp['lexregion'].$error"
-          ng-show="whatsappAccountFormApp['lexregion'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.LEXREGION_REQUIRED"
-              >lexregion field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.BOTNAME">botname</label>
-        <input
-          type="text"
-          name="botname"
-          ng-model="vm.amazonlex.botname"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="whatsappAccountFormApp['botname'].$error"
-          ng-show="whatsappAccountFormApp['botname'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.BOTNAME_REQUIRED"
-              >botname field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.WELCOMEMESSAGE">welcomemessage</label>
-        <textarea
-          name="welcomemessage"
-          ng-model="vm.amazonlex.welcomemessage"
-          md-maxlength="255"
-        ></textarea>
-        <div class="hint">
-          <span translate="WHATSAPP.HELP.WELCOMEMESSAGE"></span>
-        </div>
-
-        <div
-          ng-messages="whatsappAccountFormApp['welcomemessage'].$error"
-          ng-show="whatsappAccountFormApp['welcomemessage'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.WELCOMEMESSAGE_REQUIRED"
-              >welcomemessage field is required</span
-            >
-          </div>
-
-          <div ng-message="md-maxlength">
-            <span
-              translate="WHATSAPP.ERRORS.WELCOMEMESSAGE_MAX_LENGTH"
-              translate-values="{max: 255}"
-              >welcomemessage must have a maximum length equal to 255</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveWhatsappAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="whatsappAccountFormApp.$invalid || whatsappAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="WHATSAPP.SAVE"
-          translate-attr-aria-label="WHATSAPP.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/amazonlex/dialog.html/dialog.html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/amazonlex/dialog.html/dialog.html
new file mode 100644
index 0000000..9d2a9f8
--- /dev/null
+++ b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/amazonlex/dialog.html/dialog.html
@@ -0,0 +1,208 @@
+<md-dialog class="whatsappAccount-dialog" aria-label="New WhatsappAccount">
+  <form name="whatsappAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.ACCESSKEYID">accesskeyid</label>
+        <input
+          type="text"
+          name="accesskeyid"
+          ng-model="vm.amazonlex.accesskeyid"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="whatsappAccountFormApp['accesskeyid'].$error"
+          ng-show="whatsappAccountFormApp['accesskeyid'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.ACCESSKEYID_REQUIRED"
+              >accesskeyid field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.SECRETACCESSKEY">secretaccesskey</label>
+        <input
+          type="text"
+          name="secretaccesskey"
+          ng-model="vm.amazonlex.secretaccesskey"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="whatsappAccountFormApp['secretaccesskey'].$error"
+          ng-show="whatsappAccountFormApp['secretaccesskey'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.SECRETACCESSKEY_REQUIRED"
+              >secretaccesskey field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.LEXREGION">lexregion</label>
+        <md-select
+          name="lexregion"
+          ng-model="vm.amazonlex.lexregion"
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="'us-east-1'">US East (N. Virginia)</md-option>
+          <md-option ng-value="'us-west-2'">US West (Oregon)</md-option>
+          <md-option ng-value="'eu-west-1'">EU (Ireland)</md-option>
+          <md-option ng-value="'ap-southeast-2'"
+            >Asia Pacific (Sydney)</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="whatsappAccountFormApp['lexregion'].$error"
+          ng-show="whatsappAccountFormApp['lexregion'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.LEXREGION_REQUIRED"
+              >lexregion field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.BOTNAME">botname</label>
+        <input
+          type="text"
+          name="botname"
+          ng-model="vm.amazonlex.botname"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="whatsappAccountFormApp['botname'].$error"
+          ng-show="whatsappAccountFormApp['botname'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.BOTNAME_REQUIRED"
+              >botname field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.WELCOMEMESSAGE">welcomemessage</label>
+        <textarea
+          name="welcomemessage"
+          ng-model="vm.amazonlex.welcomemessage"
+          md-maxlength="255"
+        ></textarea>
+        <div class="hint">
+          <span translate="WHATSAPP.HELP.WELCOMEMESSAGE"></span>
+        </div>
+
+        <div
+          ng-messages="whatsappAccountFormApp['welcomemessage'].$error"
+          ng-show="whatsappAccountFormApp['welcomemessage'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.WELCOMEMESSAGE_REQUIRED"
+              >welcomemessage field is required</span
+            >
+          </div>
+
+          <div ng-message="md-maxlength">
+            <span
+              translate="WHATSAPP.ERRORS.WELCOMEMESSAGE_MAX_LENGTH"
+              translate-values="{max: 255}"
+              >welcomemessage must have a maximum length equal to 255</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveWhatsappAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="whatsappAccountFormApp.$invalid || whatsappAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="WHATSAPP.SAVE"
+          translate-attr-aria-label="WHATSAPP.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/autoreply/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/autoreply/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 3afc0ed..0000000
--- a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/autoreply/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,123 +0,0 @@
-<md-dialog class="whatsappAccount-dialog" aria-label="New WhatsappAccount">
-  <form name="whatsappAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.TIMES">times</label>
-        <md-select
-          name="times"
-          ng-model="vm.autoreply.times"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="1">One Time</md-option>
-          <md-option ng-value="0">Always</md-option>
-        </md-select>
-        <div
-          ng-messages="whatsappAccountFormApp['times'].$error"
-          ng-show="whatsappAccountFormApp['times'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.TIMES_REQUIRED"
-              >times field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.TEXT">Text</label>
-        <textarea name="text" ng-model="vm.autoreply.text" required></textarea>
-
-        <div
-          ng-messages="whatsappAccountFormApp['text'].$error"
-          ng-show="whatsappAccountFormApp['text'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.TEXT_REQUIRED"
-              >Text field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveWhatsappAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="whatsappAccountFormApp.$invalid || whatsappAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="WHATSAPP.SAVE"
-          translate-attr-aria-label="WHATSAPP.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/autoreply/dialog.html/dialog.html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/autoreply/dialog.html/dialog.html
new file mode 100644
index 0000000..3afc0ed
--- /dev/null
+++ b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/autoreply/dialog.html/dialog.html
@@ -0,0 +1,123 @@
+<md-dialog class="whatsappAccount-dialog" aria-label="New WhatsappAccount">
+  <form name="whatsappAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.TIMES">times</label>
+        <md-select
+          name="times"
+          ng-model="vm.autoreply.times"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="1">One Time</md-option>
+          <md-option ng-value="0">Always</md-option>
+        </md-select>
+        <div
+          ng-messages="whatsappAccountFormApp['times'].$error"
+          ng-show="whatsappAccountFormApp['times'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.TIMES_REQUIRED"
+              >times field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.TEXT">Text</label>
+        <textarea name="text" ng-model="vm.autoreply.text" required></textarea>
+
+        <div
+          ng-messages="whatsappAccountFormApp['text'].$error"
+          ng-show="whatsappAccountFormApp['text'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.TEXT_REQUIRED"
+              >Text field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveWhatsappAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="whatsappAccountFormApp.$invalid || whatsappAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="WHATSAPP.SAVE"
+          translate-attr-aria-label="WHATSAPP.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/close/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/close/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index d9a6df8..0000000
--- a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/close/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,106 +0,0 @@
-<md-dialog class="whatsappAccount-dialog" aria-label="New WhatsappAccount">
-  <form name="whatsappAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.DISPOSITION">Disposition</label>
-        <input
-          type="text"
-          name="disposition"
-          ng-model="vm.close.disposition"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="whatsappAccountFormApp['disposition'].$error"
-          ng-show="whatsappAccountFormApp['disposition'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.DISPOSITION_REQUIRED"
-              >Disposition field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveWhatsappAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="whatsappAccountFormApp.$invalid || whatsappAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="WHATSAPP.SAVE"
-          translate-attr-aria-label="WHATSAPP.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/close/dialog.html/dialog.html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/close/dialog.html/dialog.html
new file mode 100644
index 0000000..d9a6df8
--- /dev/null
+++ b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/close/dialog.html/dialog.html
@@ -0,0 +1,106 @@
+<md-dialog class="whatsappAccount-dialog" aria-label="New WhatsappAccount">
+  <form name="whatsappAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.DISPOSITION">Disposition</label>
+        <input
+          type="text"
+          name="disposition"
+          ng-model="vm.close.disposition"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="whatsappAccountFormApp['disposition'].$error"
+          ng-show="whatsappAccountFormApp['disposition'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.DISPOSITION_REQUIRED"
+              >Disposition field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveWhatsappAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="whatsappAccountFormApp.$invalid || whatsappAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="WHATSAPP.SAVE"
+          translate-attr-aria-label="WHATSAPP.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/dialogflow/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/dialogflow/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 21bd65c..0000000
--- a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/dialogflow/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,178 +0,0 @@
-<md-dialog class="whatsappAccount-dialog" aria-label="New WhatsappAccount">
-  <form name="whatsappAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.KEY">Key</label>
-        <input
-          type="text"
-          name="key"
-          ng-model="vm.dialogflow.key"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="whatsappAccountFormApp['key'].$error"
-          ng-show="whatsappAccountFormApp['key'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.KEY_REQUIRED"
-              >Key field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.LANGUAGE">language</label>
-        <md-select
-          name="language"
-          ng-model="vm.dialogflow.language"
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="'da'">Danish</md-option>
-          <md-option ng-value="'en'">English</md-option>
-          <md-option ng-value="'de'">German</md-option>
-          <md-option ng-value="'it'">Italian</md-option>
-          <md-option ng-value="'es'">Spanish</md-option>
-          <md-option ng-value="'fr'">French</md-option>
-          <md-option ng-value="'id'">Indonesian</md-option>
-          <md-option ng-value="'ja'">Japanese</md-option>
-          <md-option ng-value="'ko'">Korean (South Korea)</md-option>
-          <md-option ng-value="'nl'">Dutch</md-option>
-          <md-option ng-value="'no'">Norwegian</md-option>
-          <md-option ng-value="'pt'">Portuguese (European)</md-option>
-          <md-option ng-value="'pt-br'">Portuguese (Nrazilian)</md-option>
-          <md-option ng-value="'ru'">Russian</md-option>
-          <md-option ng-value="'sv'">Swedish</md-option>
-          <md-option ng-value="'th'">Thai</md-option>
-          <md-option ng-value="'uk'">Ukrainian</md-option>
-          <md-option ng-value="'zh-CN'">Chinese (Simplified)</md-option>
-          <md-option ng-value="'zh-HK'">Chinese (Hong Kong)</md-option>
-          <md-option ng-value="'zh-TW'">Chinese (Traditional)</md-option>
-        </md-select>
-        <div
-          ng-messages="whatsappAccountFormApp['language'].$error"
-          ng-show="whatsappAccountFormApp['language'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.LANGUAGE_REQUIRED"
-              >language field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.WELCOMEMESSAGE">welcomemessage</label>
-        <textarea
-          name="welcomemessage"
-          ng-model="vm.dialogflow.welcomemessage"
-          md-maxlength="255"
-        ></textarea>
-        <div class="hint">
-          <span translate="WHATSAPP.HELP.WELCOMEMESSAGE"></span>
-        </div>
-
-        <div
-          ng-messages="whatsappAccountFormApp['welcomemessage'].$error"
-          ng-show="whatsappAccountFormApp['welcomemessage'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.WELCOMEMESSAGE_REQUIRED"
-              >welcomemessage field is required</span
-            >
-          </div>
-
-          <div ng-message="md-maxlength">
-            <span
-              translate="WHATSAPP.ERRORS.WELCOMEMESSAGE_MAX_LENGTH"
-              translate-values="{max: 255}"
-              >welcomemessage must have a maximum length equal to 255</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveWhatsappAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="whatsappAccountFormApp.$invalid || whatsappAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="WHATSAPP.SAVE"
-          translate-attr-aria-label="WHATSAPP.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/dialogflow/dialog.html/dialog.html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/dialogflow/dialog.html/dialog.html
new file mode 100644
index 0000000..21bd65c
--- /dev/null
+++ b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/dialogflow/dialog.html/dialog.html
@@ -0,0 +1,178 @@
+<md-dialog class="whatsappAccount-dialog" aria-label="New WhatsappAccount">
+  <form name="whatsappAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.KEY">Key</label>
+        <input
+          type="text"
+          name="key"
+          ng-model="vm.dialogflow.key"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="whatsappAccountFormApp['key'].$error"
+          ng-show="whatsappAccountFormApp['key'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.KEY_REQUIRED"
+              >Key field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.LANGUAGE">language</label>
+        <md-select
+          name="language"
+          ng-model="vm.dialogflow.language"
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="'da'">Danish</md-option>
+          <md-option ng-value="'en'">English</md-option>
+          <md-option ng-value="'de'">German</md-option>
+          <md-option ng-value="'it'">Italian</md-option>
+          <md-option ng-value="'es'">Spanish</md-option>
+          <md-option ng-value="'fr'">French</md-option>
+          <md-option ng-value="'id'">Indonesian</md-option>
+          <md-option ng-value="'ja'">Japanese</md-option>
+          <md-option ng-value="'ko'">Korean (South Korea)</md-option>
+          <md-option ng-value="'nl'">Dutch</md-option>
+          <md-option ng-value="'no'">Norwegian</md-option>
+          <md-option ng-value="'pt'">Portuguese (European)</md-option>
+          <md-option ng-value="'pt-br'">Portuguese (Nrazilian)</md-option>
+          <md-option ng-value="'ru'">Russian</md-option>
+          <md-option ng-value="'sv'">Swedish</md-option>
+          <md-option ng-value="'th'">Thai</md-option>
+          <md-option ng-value="'uk'">Ukrainian</md-option>
+          <md-option ng-value="'zh-CN'">Chinese (Simplified)</md-option>
+          <md-option ng-value="'zh-HK'">Chinese (Hong Kong)</md-option>
+          <md-option ng-value="'zh-TW'">Chinese (Traditional)</md-option>
+        </md-select>
+        <div
+          ng-messages="whatsappAccountFormApp['language'].$error"
+          ng-show="whatsappAccountFormApp['language'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.LANGUAGE_REQUIRED"
+              >language field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.WELCOMEMESSAGE">welcomemessage</label>
+        <textarea
+          name="welcomemessage"
+          ng-model="vm.dialogflow.welcomemessage"
+          md-maxlength="255"
+        ></textarea>
+        <div class="hint">
+          <span translate="WHATSAPP.HELP.WELCOMEMESSAGE"></span>
+        </div>
+
+        <div
+          ng-messages="whatsappAccountFormApp['welcomemessage'].$error"
+          ng-show="whatsappAccountFormApp['welcomemessage'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.WELCOMEMESSAGE_REQUIRED"
+              >welcomemessage field is required</span
+            >
+          </div>
+
+          <div ng-message="md-maxlength">
+            <span
+              translate="WHATSAPP.ERRORS.WELCOMEMESSAGE_MAX_LENGTH"
+              translate-values="{max: 255}"
+              >welcomemessage must have a maximum length equal to 255</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveWhatsappAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="whatsappAccountFormApp.$invalid || whatsappAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="WHATSAPP.SAVE"
+          translate-attr-aria-label="WHATSAPP.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/gotoif/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/gotoif/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 3cc83cd..0000000
--- a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/gotoif/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,166 +0,0 @@
-<md-dialog class="whatsappAccount-dialog" aria-label="New WhatsappAccount">
-  <form name="whatsappAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.CONDITION">Condition</label>
-        <input
-          type="text"
-          name="condition"
-          ng-model="vm.gotoif.condition"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="whatsappAccountFormApp['condition'].$error"
-          ng-show="whatsappAccountFormApp['condition'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.CONDITION_REQUIRED"
-              >Condition field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.TRUEPRIORITY">truepriority</label>
-        <input
-          type="number"
-          name="truepriority"
-          ng-model="vm.gotoif.truepriority"
-          min="1"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="whatsappAccountFormApp['truepriority'].$error"
-          ng-show="whatsappAccountFormApp['truepriority'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.TRUEPRIORITY_REQUIRED"
-              >truepriority field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="WHATSAPP.ERRORS.TRUEPRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >truepriority must be a valid greater or equal than</span
-            >
-            <span>1</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.FALSEPRIORITY">falsepriority</label>
-        <input
-          type="number"
-          name="falsepriority"
-          ng-model="vm.gotoif.falsepriority"
-          min="1"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="whatsappAccountFormApp['falsepriority'].$error"
-          ng-show="whatsappAccountFormApp['falsepriority'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.FALSEPRIORITY_REQUIRED"
-              >falsepriority field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="WHATSAPP.ERRORS.FALSEPRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >falsepriority must be a valid greater or equal than</span
-            >
-            <span>1</span>
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveWhatsappAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="whatsappAccountFormApp.$invalid || whatsappAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="WHATSAPP.SAVE"
-          translate-attr-aria-label="WHATSAPP.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/gotoif/dialog.html/dialog.html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/gotoif/dialog.html/dialog.html
new file mode 100644
index 0000000..3cc83cd
--- /dev/null
+++ b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/gotoif/dialog.html/dialog.html
@@ -0,0 +1,166 @@
+<md-dialog class="whatsappAccount-dialog" aria-label="New WhatsappAccount">
+  <form name="whatsappAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.CONDITION">Condition</label>
+        <input
+          type="text"
+          name="condition"
+          ng-model="vm.gotoif.condition"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="whatsappAccountFormApp['condition'].$error"
+          ng-show="whatsappAccountFormApp['condition'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.CONDITION_REQUIRED"
+              >Condition field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.TRUEPRIORITY">truepriority</label>
+        <input
+          type="number"
+          name="truepriority"
+          ng-model="vm.gotoif.truepriority"
+          min="1"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="whatsappAccountFormApp['truepriority'].$error"
+          ng-show="whatsappAccountFormApp['truepriority'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.TRUEPRIORITY_REQUIRED"
+              >truepriority field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="WHATSAPP.ERRORS.TRUEPRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >truepriority must be a valid greater or equal than</span
+            >
+            <span>1</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.FALSEPRIORITY">falsepriority</label>
+        <input
+          type="number"
+          name="falsepriority"
+          ng-model="vm.gotoif.falsepriority"
+          min="1"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="whatsappAccountFormApp['falsepriority'].$error"
+          ng-show="whatsappAccountFormApp['falsepriority'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.FALSEPRIORITY_REQUIRED"
+              >falsepriority field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="WHATSAPP.ERRORS.FALSEPRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >falsepriority must be a valid greater or equal than</span
+            >
+            <span>1</span>
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveWhatsappAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="whatsappAccountFormApp.$invalid || whatsappAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="WHATSAPP.SAVE"
+          translate-attr-aria-label="WHATSAPP.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/gotop/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/gotop/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 996f04b..0000000
--- a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/gotop/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,114 +0,0 @@
-<md-dialog class="whatsappAccount-dialog" aria-label="New WhatsappAccount">
-  <form name="whatsappAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.PRIORITY">Priority</label>
-        <input
-          type="number"
-          name="priority"
-          ng-model="vm.gotop.priority"
-          min="0"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="whatsappAccountFormApp['priority'].$error"
-          ng-show="whatsappAccountFormApp['priority'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.PRIORITY_REQUIRED"
-              >Priority field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="WHATSAPP.ERRORS.PRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Priority must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveWhatsappAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="whatsappAccountFormApp.$invalid || whatsappAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="WHATSAPP.SAVE"
-          translate-attr-aria-label="WHATSAPP.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/gotop/dialog.html/dialog.html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/gotop/dialog.html/dialog.html
new file mode 100644
index 0000000..996f04b
--- /dev/null
+++ b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/gotop/dialog.html/dialog.html
@@ -0,0 +1,114 @@
+<md-dialog class="whatsappAccount-dialog" aria-label="New WhatsappAccount">
+  <form name="whatsappAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.PRIORITY">Priority</label>
+        <input
+          type="number"
+          name="priority"
+          ng-model="vm.gotop.priority"
+          min="0"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="whatsappAccountFormApp['priority'].$error"
+          ng-show="whatsappAccountFormApp['priority'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.PRIORITY_REQUIRED"
+              >Priority field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="WHATSAPP.ERRORS.PRIORITY_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Priority must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveWhatsappAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="whatsappAccountFormApp.$invalid || whatsappAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="WHATSAPP.SAVE"
+          translate-attr-aria-label="WHATSAPP.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/interval/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/interval/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index ca0ed91..0000000
--- a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/interval/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,313 +0,0 @@
-<md-dialog class="inboundroute-dialog" aria-label="New Interval">
-  <form name="intervalForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-
-      <md-input-container class="md-block">
-        <label translate="TOOLS.TYPE">Type</label>
-        <md-select
-          ng-model="vm.type"
-          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="type" ng-repeat="type in vm.types"
-            >{{ type | ucfirst }}</md-option
-          >
-        </md-select>
-      </md-input-container>
-
-      <md-input-container class="md-block" ng-if="vm.type === 'list'">
-        <label translate="TOOLS.INTERVALS">Intervals</label>
-        <md-select
-          ng-model="vm.interval.IntervalId"
-          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="interval.id" ng-repeat="interval in vm.intervals"
-            >{{ interval.name }}</md-option
-          >
-        </md-select>
-      </md-input-container>
-
-      <!-- TIMERANGE START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.TIME_RANGE"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <div class="md-block" flex>
-          <mdp-time-picker
-            name="timeRangeFrom"
-            mdp-placeholder="FROM"
-            ng-model="vm.timeRangeFrom"
-            mdp-format="HH:mm"
-            mdp-auto-switch="true"
-            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <div
-              ng-messages="intervalForm.timeRangeFrom.$error"
-              ng-show="intervalForm.timeRangeFrom.$touched"
-              role="alert"
-            >
-              <div ng-message="format">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_FROM_INVALID"
-                  >Time Range From field is invalid</span
-                >
-              </div>
-            </div>
-          </mdp-time-picker>
-        </div>
-        <div class="md-block" flex ng-if="vm.timeRangeFrom">
-          <mdp-time-picker
-            name="timeRangeTo"
-            mdp-placeholder="TO*"
-            ng-model="vm.timeRangeTo"
-            mdp-format="HH:mm"
-            mdp-auto-switch="true"
-            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-            required
-          >
-            <div
-              ng-messages="intervalForm.timeRangeTo.$error"
-              ng-show="intervalForm.timeRangeTo.$invalid"
-              role="alert"
-            >
-              <div ng-message="format">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_INVALID"
-                  >Time Range To field is invalid</span
-                >
-              </div>
-              <div ng-message="required">
-                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_REQUIRED"
-                  >Time Range To field is required</span
-                >
-              </div>
-            </div>
-          </mdp-time-picker>
-        </div>
-      </div>
-      <!-- TIMERANGE END -->
-
-      <!-- DAYSOFWEEK START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.WEEK_DAYS"
-        >Week Days</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.dayOfWeekFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
-              ><span translate="TOOLS.{{day.value | uppercase}}"
-                >{{ day.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container flex class="md-block" ng-if="vm.dayOfWeekFrom">
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="dayOfWeekTo"
-            ng-model="vm.dayOfWeekTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
-              ><span translate="TOOLS.{{day.value | uppercase}}"
-                >{{ day.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.dayOfWeekTo.$error"
-            ng-show="intervalForm.dayOfWeekTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- DAYSOFWEEK END -->
-
-      <!-- MONTHDAY START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTH_DAYS"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex layout="column" class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.monthDayFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
-              >{{ month }}</md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container
-          flex
-          layout="column"
-          class="md-block"
-          ng-if="vm.monthDayFrom"
-        >
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="monthDayTo"
-            ng-model="vm.monthDayTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
-              >{{ month }}</md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.monthDayTo.$error"
-            ng-show="intervalForm.monthDayTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- MONTHDAY END -->
-
-      <!-- MONTH START -->
-      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTHS"
-        >Time Range</label
-      >
-      <div layout="row" ng-if="vm.type === 'custom'">
-        <md-input-container flex layout="column" class="md-block">
-          <label translate="TOOLS.FROM">From</label>
-          <md-select
-            ng-model="vm.monthFrom"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="null"
-              ><span translate="TOOLS.ALWAYS">Always</span></md-option
-            >
-            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
-              ><span translate="TOOLS.{{month.value | uppercase}}"
-                >{{ month.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-        </md-input-container>
-
-        <md-input-container
-          flex
-          layout="column"
-          class="md-block"
-          ng-if="vm.monthFrom"
-        >
-          <label translate="TOOLS.TO">To</label>
-          <md-select
-            name="monthTo"
-            ng-model="vm.monthTo"
-            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
-          >
-            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
-              ><span translate="TOOLS.{{month.value | uppercase}}"
-                >{{ month.value | ucfirst }}</span
-              ></md-option
-            >
-          </md-select>
-          <div
-            ng-messages="intervalForm.monthTo.$error"
-            ng-show="intervalForm.monthTo.$touched"
-            role="alert"
-          ></div>
-        </md-input-container>
-      </div>
-      <!-- MONTH END -->
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="!vm.newInterval && vm.crudPermissions.canEdit"
-          ng-click="vm.saveInterval()"
-          class="send-button md-accent md-raised"
-          ng-disabled="intervalForm.$invalid || intervalForm.$pristine"
-          aria-label="SAVE"
-          translate="TOOLS.SAVE"
-          translate-attr-aria-label="TOOLS.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.newInterval && vm.crudPermissions.canEdit"
-          ng-click="vm.addNewInterval()"
-          class="send-button md-accent md-raised"
-          ng-disabled="intervalForm.$invalid"
-          aria-label="ADD"
-          translate="TOOLS.ADD_INTERVAL"
-          translate-attr-aria-label="TOOLS.ADD_INTERVAL"
-        >
-          ADD INTERVAL
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/interval/dialog.html/dialog.html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/interval/dialog.html/dialog.html
new file mode 100644
index 0000000..ca0ed91
--- /dev/null
+++ b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/interval/dialog.html/dialog.html
@@ -0,0 +1,313 @@
+<md-dialog class="inboundroute-dialog" aria-label="New Interval">
+  <form name="intervalForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+
+      <md-input-container class="md-block">
+        <label translate="TOOLS.TYPE">Type</label>
+        <md-select
+          ng-model="vm.type"
+          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="type" ng-repeat="type in vm.types"
+            >{{ type | ucfirst }}</md-option
+          >
+        </md-select>
+      </md-input-container>
+
+      <md-input-container class="md-block" ng-if="vm.type === 'list'">
+        <label translate="TOOLS.INTERVALS">Intervals</label>
+        <md-select
+          ng-model="vm.interval.IntervalId"
+          ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="interval.id" ng-repeat="interval in vm.intervals"
+            >{{ interval.name }}</md-option
+          >
+        </md-select>
+      </md-input-container>
+
+      <!-- TIMERANGE START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.TIME_RANGE"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <div class="md-block" flex>
+          <mdp-time-picker
+            name="timeRangeFrom"
+            mdp-placeholder="FROM"
+            ng-model="vm.timeRangeFrom"
+            mdp-format="HH:mm"
+            mdp-auto-switch="true"
+            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <div
+              ng-messages="intervalForm.timeRangeFrom.$error"
+              ng-show="intervalForm.timeRangeFrom.$touched"
+              role="alert"
+            >
+              <div ng-message="format">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_FROM_INVALID"
+                  >Time Range From field is invalid</span
+                >
+              </div>
+            </div>
+          </mdp-time-picker>
+        </div>
+        <div class="md-block" flex ng-if="vm.timeRangeFrom">
+          <mdp-time-picker
+            name="timeRangeTo"
+            mdp-placeholder="TO*"
+            ng-model="vm.timeRangeTo"
+            mdp-format="HH:mm"
+            mdp-auto-switch="true"
+            mdp-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+            required
+          >
+            <div
+              ng-messages="intervalForm.timeRangeTo.$error"
+              ng-show="intervalForm.timeRangeTo.$invalid"
+              role="alert"
+            >
+              <div ng-message="format">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_INVALID"
+                  >Time Range To field is invalid</span
+                >
+              </div>
+              <div ng-message="required">
+                <span translate="TOOLS.ERRORS.TIME_RANGE_TO_REQUIRED"
+                  >Time Range To field is required</span
+                >
+              </div>
+            </div>
+          </mdp-time-picker>
+        </div>
+      </div>
+      <!-- TIMERANGE END -->
+
+      <!-- DAYSOFWEEK START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.WEEK_DAYS"
+        >Week Days</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.dayOfWeekFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
+              ><span translate="TOOLS.{{day.value | uppercase}}"
+                >{{ day.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container flex class="md-block" ng-if="vm.dayOfWeekFrom">
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="dayOfWeekTo"
+            ng-model="vm.dayOfWeekTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="day.value" ng-repeat="day in vm.daysOfWeek"
+              ><span translate="TOOLS.{{day.value | uppercase}}"
+                >{{ day.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.dayOfWeekTo.$error"
+            ng-show="intervalForm.dayOfWeekTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- DAYSOFWEEK END -->
+
+      <!-- MONTHDAY START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTH_DAYS"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex layout="column" class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.monthDayFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
+              >{{ month }}</md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container
+          flex
+          layout="column"
+          class="md-block"
+          ng-if="vm.monthDayFrom"
+        >
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="monthDayTo"
+            ng-model="vm.monthDayTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="month" ng-repeat="month in vm.daysOfMonth"
+              >{{ month }}</md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.monthDayTo.$error"
+            ng-show="intervalForm.monthDayTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- MONTHDAY END -->
+
+      <!-- MONTH START -->
+      <label ng-if="vm.type === 'custom'" translate="TOOLS.MONTHS"
+        >Time Range</label
+      >
+      <div layout="row" ng-if="vm.type === 'custom'">
+        <md-input-container flex layout="column" class="md-block">
+          <label translate="TOOLS.FROM">From</label>
+          <md-select
+            ng-model="vm.monthFrom"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="null"
+              ><span translate="TOOLS.ALWAYS">Always</span></md-option
+            >
+            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
+              ><span translate="TOOLS.{{month.value | uppercase}}"
+                >{{ month.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+        </md-input-container>
+
+        <md-input-container
+          flex
+          layout="column"
+          class="md-block"
+          ng-if="vm.monthFrom"
+        >
+          <label translate="TOOLS.TO">To</label>
+          <md-select
+            name="monthTo"
+            ng-model="vm.monthTo"
+            ng-disabled="!vm.newInterval && !vm.crudPermissions.canEdit"
+          >
+            <md-option ng-value="month.value" ng-repeat="month in vm.monthName"
+              ><span translate="TOOLS.{{month.value | uppercase}}"
+                >{{ month.value | ucfirst }}</span
+              ></md-option
+            >
+          </md-select>
+          <div
+            ng-messages="intervalForm.monthTo.$error"
+            ng-show="intervalForm.monthTo.$touched"
+            role="alert"
+          ></div>
+        </md-input-container>
+      </div>
+      <!-- MONTH END -->
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="!vm.newInterval && vm.crudPermissions.canEdit"
+          ng-click="vm.saveInterval()"
+          class="send-button md-accent md-raised"
+          ng-disabled="intervalForm.$invalid || intervalForm.$pristine"
+          aria-label="SAVE"
+          translate="TOOLS.SAVE"
+          translate-attr-aria-label="TOOLS.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.newInterval && vm.crudPermissions.canEdit"
+          ng-click="vm.addNewInterval()"
+          class="send-button md-accent md-raised"
+          ng-disabled="intervalForm.$invalid"
+          aria-label="ADD"
+          translate="TOOLS.ADD_INTERVAL"
+          translate-attr-aria-label="TOOLS.ADD_INTERVAL"
+        >
+          ADD INTERVAL
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/noop/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/noop/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index e85b7e2..0000000
--- a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/noop/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,105 +0,0 @@
-<md-dialog class="whatsappAccount-dialog" aria-label="New WhatsappAccount">
-  <form name="whatsappAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.VALUE">Value</label>
-        <input
-          type="text"
-          name="value"
-          ng-model="vm.noop.value"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="whatsappAccountFormApp['value'].$error"
-          ng-show="whatsappAccountFormApp['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.VALUE_REQUIRED"
-              >Value field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveWhatsappAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="whatsappAccountFormApp.$invalid || whatsappAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="WHATSAPP.SAVE"
-          translate-attr-aria-label="WHATSAPP.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/noop/dialog.html/dialog.html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/noop/dialog.html/dialog.html
new file mode 100644
index 0000000..e85b7e2
--- /dev/null
+++ b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/noop/dialog.html/dialog.html
@@ -0,0 +1,105 @@
+<md-dialog class="whatsappAccount-dialog" aria-label="New WhatsappAccount">
+  <form name="whatsappAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.VALUE">Value</label>
+        <input
+          type="text"
+          name="value"
+          ng-model="vm.noop.value"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="whatsappAccountFormApp['value'].$error"
+          ng-show="whatsappAccountFormApp['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.VALUE_REQUIRED"
+              >Value field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveWhatsappAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="whatsappAccountFormApp.$invalid || whatsappAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="WHATSAPP.SAVE"
+          translate-attr-aria-label="WHATSAPP.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/queue/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/queue/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index ce8ab15..0000000
--- a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/queue/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,149 +0,0 @@
-<md-dialog class="whatsappAccount-dialog" aria-label="New WhatsappAccount">
-  <form name="whatsappAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.QUEUE">Queue</label>
-        <md-select
-          name="queue"
-          ng-model="vm.queue.queue"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="queue.name"
-            ng-repeat="queue in vm.queues"
-            ng-disabled="queue.canSelect === false"
-            >{{ queue.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="whatsappAccountFormApp['queue'].$error"
-          ng-show="whatsappAccountFormApp['queue'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.QUEUE_REQUIRED"
-              >Queue field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.TIMEOUT">Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.queue.timeout"
-          min="0"
-          max="2147483"
-          ng-required="true"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="whatsappAccountFormApp['timeout'].$error"
-          ng-show="whatsappAccountFormApp['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.TIMEOUT_REQUIRED"
-              >Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="WHATSAPP.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>0</span>
-          </div>
-          <div ng-message="max">
-            <span
-              translate="WHATSAPP.ERRORS.TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-              >Timeout must be a valid greater or equal than</span
-            >
-            <span>2147483</span>
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveWhatsappAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="whatsappAccountFormApp.$invalid || whatsappAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="WHATSAPP.SAVE"
-          translate-attr-aria-label="WHATSAPP.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/queue/dialog.html/dialog.html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/queue/dialog.html/dialog.html
new file mode 100644
index 0000000..ce8ab15
--- /dev/null
+++ b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/queue/dialog.html/dialog.html
@@ -0,0 +1,149 @@
+<md-dialog class="whatsappAccount-dialog" aria-label="New WhatsappAccount">
+  <form name="whatsappAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.QUEUE">Queue</label>
+        <md-select
+          name="queue"
+          ng-model="vm.queue.queue"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="queue.name"
+            ng-repeat="queue in vm.queues"
+            ng-disabled="queue.canSelect === false"
+            >{{ queue.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="whatsappAccountFormApp['queue'].$error"
+          ng-show="whatsappAccountFormApp['queue'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.QUEUE_REQUIRED"
+              >Queue field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.TIMEOUT">Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.queue.timeout"
+          min="0"
+          max="2147483"
+          ng-required="true"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="whatsappAccountFormApp['timeout'].$error"
+          ng-show="whatsappAccountFormApp['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.TIMEOUT_REQUIRED"
+              >Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="WHATSAPP.ERRORS.TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>0</span>
+          </div>
+          <div ng-message="max">
+            <span
+              translate="WHATSAPP.ERRORS.TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+              >Timeout must be a valid greater or equal than</span
+            >
+            <span>2147483</span>
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveWhatsappAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="whatsappAccountFormApp.$invalid || whatsappAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="WHATSAPP.SAVE"
+          translate-attr-aria-label="WHATSAPP.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/system/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/system/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 746c063..0000000
--- a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/system/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,133 +0,0 @@
-<md-dialog class="whatsappAccount-dialog" aria-label="New WhatsappAccount">
-  <form name="whatsappAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.COMMAND">Command</label>
-        <input
-          type="text"
-          name="command"
-          ng-model="vm.system.command"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.crudPermissions.canEdit"
-        />
-
-        <div
-          ng-messages="whatsappAccountFormApp['command'].$error"
-          ng-show="whatsappAccountFormApp['command'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.COMMAND_REQUIRED"
-              >Command field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.VARIABLE">Variable</label>
-        <md-select
-          name="variable"
-          ng-model="vm.system.variable"
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option ng-value="''">None</md-option>
-          <md-option
-            ng-value="variable.name"
-            ng-repeat="variable in vm.variables"
-            ng-disabled="variable.canSelect === false"
-            >{{ variable.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="whatsappAccountFormApp['variable'].$error"
-          ng-show="whatsappAccountFormApp['variable'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.VARIABLE_REQUIRED"
-              >Variable field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveWhatsappAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="whatsappAccountFormApp.$invalid || whatsappAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="WHATSAPP.SAVE"
-          translate-attr-aria-label="WHATSAPP.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/system/dialog.html/dialog.html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/system/dialog.html/dialog.html
new file mode 100644
index 0000000..746c063
--- /dev/null
+++ b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/system/dialog.html/dialog.html
@@ -0,0 +1,133 @@
+<md-dialog class="whatsappAccount-dialog" aria-label="New WhatsappAccount">
+  <form name="whatsappAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.COMMAND">Command</label>
+        <input
+          type="text"
+          name="command"
+          ng-model="vm.system.command"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.crudPermissions.canEdit"
+        />
+
+        <div
+          ng-messages="whatsappAccountFormApp['command'].$error"
+          ng-show="whatsappAccountFormApp['command'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.COMMAND_REQUIRED"
+              >Command field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.VARIABLE">Variable</label>
+        <md-select
+          name="variable"
+          ng-model="vm.system.variable"
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option ng-value="''">None</md-option>
+          <md-option
+            ng-value="variable.name"
+            ng-repeat="variable in vm.variables"
+            ng-disabled="variable.canSelect === false"
+            >{{ variable.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="whatsappAccountFormApp['variable'].$error"
+          ng-show="whatsappAccountFormApp['variable'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.VARIABLE_REQUIRED"
+              >Variable field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveWhatsappAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="whatsappAccountFormApp.$invalid || whatsappAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="WHATSAPP.SAVE"
+          translate-attr-aria-label="WHATSAPP.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/tag/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/tag/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 273f667..0000000
--- a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/tag/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,111 +0,0 @@
-<md-dialog class="whatsappAccount-dialog" aria-label="New WhatsappAccount">
-  <form name="whatsappAccountFormApp" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.TAG">Tag</label>
-        <md-select
-          name="tag"
-          ng-model="vm.tag.tag"
-          autofocus
-          required
-          ng-disabled="!vm.crudPermissions.canEdit"
-        >
-          <md-option
-            ng-value="tag.name"
-            ng-repeat="tag in vm.tags"
-            ng-disabled="tag.canSelect === false"
-            >{{ tag.name }}</md-option
-          >
-        </md-select>
-        <div
-          ng-messages="whatsappAccountFormApp['tag'].$error"
-          ng-show="whatsappAccountFormApp['tag'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.TAG_REQUIRED"
-              >Tag field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div
-        layout="row"
-        layout-align="start center"
-        ng-if="vm.crudPermissions.canEdit"
-      >
-        <md-button
-          type="submit"
-          ng-click="vm.saveWhatsappAccountApp()"
-          class="send-button md-accent md-raised"
-          ng-disabled="whatsappAccountFormApp.$invalid || whatsappAccountFormApp.$pristine"
-          aria-label="SAVE"
-          translate="WHATSAPP.SAVE"
-          translate-attr-aria-label="WHATSAPP.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/tag/dialog.html/dialog.html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/tag/dialog.html/dialog.html
new file mode 100644
index 0000000..273f667
--- /dev/null
+++ b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/apps/tag/dialog.html/dialog.html
@@ -0,0 +1,111 @@
+<md-dialog class="whatsappAccount-dialog" aria-label="New WhatsappAccount">
+  <form name="whatsappAccountFormApp" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.TAG">Tag</label>
+        <md-select
+          name="tag"
+          ng-model="vm.tag.tag"
+          autofocus
+          required
+          ng-disabled="!vm.crudPermissions.canEdit"
+        >
+          <md-option
+            ng-value="tag.name"
+            ng-repeat="tag in vm.tags"
+            ng-disabled="tag.canSelect === false"
+            >{{ tag.name }}</md-option
+          >
+        </md-select>
+        <div
+          ng-messages="whatsappAccountFormApp['tag'].$error"
+          ng-show="whatsappAccountFormApp['tag'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.TAG_REQUIRED"
+              >Tag field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div
+        layout="row"
+        layout-align="start center"
+        ng-if="vm.crudPermissions.canEdit"
+      >
+        <md-button
+          type="submit"
+          ng-click="vm.saveWhatsappAccountApp()"
+          class="send-button md-accent md-raised"
+          ng-disabled="whatsappAccountFormApp.$invalid || whatsappAccountFormApp.$pristine"
+          aria-label="SAVE"
+          translate="WHATSAPP.SAVE"
+          translate-attr-aria-label="WHATSAPP.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index 929f554..0000000
--- a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,1757 +0,0 @@
-<div
-  id="whatsapp-whatsappAccount"
-  class="page-layout simple tabbed"
-  layout="column"
->
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-whatsappAccounts-button md-icon-button"
-        aria-label="Go to whatsappAccounts"
-        ng-click="vm.gotoWhatsappAccounts()"
-        translate
-        translate-attr-aria-label="WHATSAPP.GO_TO_WHATSAPPACCOUNTS"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="whatsappAccount-image" hide-xs>
-          <img ng-src="assets/images/business/whatsappAccounts.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.whatsappAccount.id}}
-            <span ng-if="vm.whatsappAccount.name"
-              >{{vm.whatsappAccount.name}}</span
-            >
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="WHATSAPP.CREATED_AT"></span>
-            <span>{{vm.whatsappAccount.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.agentadddialog(vm.whatsappAccount, $event)"
-        class="md-fab md-warn md-icon-button"
-        aria-label="agentadd"
-      >
-        <md-tooltip
-          ><span translate="WHATSAPP.AGENTADD_WHATSAPPACCOUNT"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
-      </md-button>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveWhatsappAccount()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid) || (notificationForm.$invalid) || (transferForm.$invalid) || (proxyForm.$invalid) || (dispositionForm.$invalid) || (whatsappDispositionsForm.$invalid) || (whatsappCannedAnswersForm.$invalid) || (actionsForm.$invalid) || (interactionsForm.$invalid)"
-        translate="WHATSAPP.SAVE"
-        translate-attr-aria-label="WHATSAPP.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="WHATSAPP.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="whatsappAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="WHATSAPP.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="WHATSAPP.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.whatsappAccount.name"
-                  ng-required="true"
-                  autofocus
-                  disabled
-                />
-
-                <div class="hint">
-                  <span translate="WHATSAPP.HELP.NAME"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="WHATSAPP.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="WHATSAPP.KEY">key</label>
-                <input
-                  type="text"
-                  name="key"
-                  ng-model="vm.whatsappAccount.key"
-                  md-maxlength="5"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['key'].$error"
-                  ng-show="generalForm['key'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="WHATSAPP.ERRORS.KEY_REQUIRED"
-                      >key field is required</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="WHATSAPP.ERRORS.KEY_MAX_LENGTH"
-                      translate-values="{max: 5}"
-                      >key must have a maximum length equal to 5</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="WHATSAPP.LIST">List</label>
-                <md-select
-                  name="ListId"
-                  ng-model="vm.whatsappAccount.ListId"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="ListId.id"
-                    ng-repeat="ListId in vm.lists"
-                    ng-disabled="ListId.canSelect === false"
-                    >{{ ListId.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span translate="WHATSAPP.HELP.LIST"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['ListId'].$error"
-                  ng-show="generalForm['ListId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="WHATSAPP.ERRORS.LIST_REQUIRED"
-                      >List field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.whatsappAccount.type == 'twilio'"
-                class="md-block"
-              >
-                <label translate="WHATSAPP.ACCOUNTSID">AccountSID</label>
-                <input
-                  type="text"
-                  name="accountSid"
-                  ng-model="vm.whatsappAccount.accountSid"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['accountSid'].$error"
-                  ng-show="generalForm['accountSid'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="WHATSAPP.ERRORS.ACCOUNTSID_REQUIRED"
-                      >AccountSID field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.whatsappAccount.type == 'twilio'"
-                class="md-block"
-              >
-                <label translate="WHATSAPP.AUTHTOKEN">AuthToken</label>
-                <input
-                  type="text"
-                  name="authToken"
-                  ng-model="vm.whatsappAccount.authToken"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['authToken'].$error"
-                  ng-show="generalForm['authToken'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="WHATSAPP.ERRORS.AUTHTOKEN_REQUIRED"
-                      >AuthToken field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="WHATSAPP.PHONE">phone</label>
-                <input
-                  type="text"
-                  name="phone"
-                  ng-model="vm.whatsappAccount.phone"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['phone'].$error"
-                  ng-show="generalForm['phone'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="WHATSAPP.ERRORS.PHONE_REQUIRED"
-                      >phone field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="WHATSAPP.RECEIVEURL">receiveUrl</label>
-                <div layout="row" layout-align="center center">
-                  <button
-                    class="md-button md-fab md-mini md-primary"
-                    ngclipboard
-                    data-clipboard-target="#copytoclipboard-receiveUrl"
-                    ngclipboard-success="vm.alert({title: 'copied to clipboard', msg: e.text});"
-                    ngclipboard-error="vm.alert({title: 'error', msg: 'copy to clipboard failed'});"
-                  >
-                    <md-icon md-font-icon="icon-clipboard-text"></md-icon>
-                  </button>
-                  <input
-                    class="md-input"
-                    type="text"
-                    id="copytoclipboard-receiveUrl"
-                    name="receiveUrl"
-                    ng-value="vm.whatsappAccount.remote + '/api/whatsapp/accounts/' + vm.whatsappAccount.id + '/notify?token=' + vm.whatsappAccount.token"
-                    ng-readonly="true"
-                  />
-                </div>
-                <div class="hint">
-                  <span translate="WHATSAPP.HELP.RECEIVEURL"></span>
-                </div>
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.whatsappAccount.type == 'twillo'"
-                class="md-block"
-              >
-                <label translate="WHATSAPP.DELIVERYREPORTURL"
-                  >deliveryReportUrl</label
-                >
-                <div layout="row" layout-align="center center">
-                  <button
-                    class="md-button md-fab md-mini md-primary"
-                    ngclipboard
-                    data-clipboard-target="#copytoclipboard-deliveryReportUrl"
-                    ngclipboard-success="vm.alert({title: 'copied to clipboard', msg: e.text});"
-                    ngclipboard-error="vm.alert({title: 'error', msg: 'copy to clipboard failed'});"
-                  >
-                    <md-icon md-font-icon="icon-clipboard-text"></md-icon>
-                  </button>
-                  <input
-                    class="md-input"
-                    type="text"
-                    id="copytoclipboard-deliveryReportUrl"
-                    name="deliveryReportUrl"
-                    ng-value="vm.whatsappAccount.remote + '/api/whatsapp/accounts/' + vm.whatsappAccount.id + '/status?token=' + vm.whatsappAccount.token + (vm.whatsappAccount.type == 'csc' ? '&message-id={message-id}&state={state}' : '')"
-                    ng-readonly="true"
-                  />
-                </div>
-                <div class="hint">
-                  <span translate="WHATSAPP.HELP.DELIVERYREPORTURL"></span>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="WHATSAPP.WAITFORTHEASSIGNEDAGENT"
-                  >WaitForTheAssignedAgent</label
-                >
-                <input
-                  type="number"
-                  name="waitForTheAssignedAgent"
-                  ng-model="vm.whatsappAccount.waitForTheAssignedAgent"
-                  min="1"
-                  max="2147483"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['waitForTheAssignedAgent'].$error"
-                  ng-show="generalForm['waitForTheAssignedAgent'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="WHATSAPP.ERRORS.WAITFORTHEASSIGNEDAGENT_REQUIRED"
-                      >WaitForTheAssignedAgent field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="WHATSAPP.ERRORS.WAITFORTHEASSIGNEDAGENT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >WaitForTheAssignedAgent must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="WHATSAPP.ERRORS.WAITFORTHEASSIGNEDAGENT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >WaitForTheAssignedAgent must be a valid greater or equal
-                      than</span
-                    >
-                    <span>2147483</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="WHATSAPP.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.whatsappAccount.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="WHATSAPP.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="whatsappAccount-detail-form-container notification md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="WHATSAPP.NOTIFICATION">
-                NOTIFICATION
-              </div>
-            </div>
-            <form name="notificationForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.whatsappAccount.notificationShake"
-                  aria-label="notificationShake"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="WHATSAPP.NOTIFICATIONSHAKE"
-                    >notificationShake</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.whatsappAccount.notificationSound"
-                  aria-label="notificationSound"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="WHATSAPP.NOTIFICATIONSOUND"
-                    >notificationSound</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <div class="md-block">
-                <label
-                  class="md-caption grey-fg"
-                  translate="WHATSAPP.NOTIFICATIONTEMPLATE"
-                  >notificationTemplate</label
-                >
-                <textarea
-                  aria-label="notificationTemplate notificationTemplate"
-                  ckeditor="{ skin: 'office2013', language: 'en', allowedContent: true, extraPlugins: 'font,colorbutton,autoembed,autocorrect,googlethisterm,pastebase64', toolbarGroups: [{ name: 'styles', groups: ['styles'] }, { name: 'clipboard', groups: ['undo'] }, { name: 'colors', groups: ['colors'] }, { name: 'basicstyles', groups: ['basicstyles'] }, { name: 'paragraph', groups: ['list', 'indent', 'align'] }, { name: 'mode' }], autocorrect_enabled: true, disableNativeSpellChecker: false, fontSize_sizes: '8/8pt;9/9pt;10/10pt;11/11pt;12/12pt;14/14pt;16/16pt;18/18pt;20/20pt;22/22pt;24/24pt;26/26pt;28/28pt;36/36pt;48/48pt;72/72pt',  removePlugins: 'magicline' }"
-                  ng-model="vm.whatsappAccount.notificationTemplate"
-                ></textarea>
-              </div>
-            </form>
-          </div>
-          <div
-            class="whatsappAccount-detail-form-container transfer md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="WHATSAPP.TRANSFER">
-                TRANSFER
-              </div>
-            </div>
-            <form name="transferForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.whatsappAccount.queueTransfer"
-                  aria-label="queueTransfer"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="WHATSAPP.QUEUETRANSFER"
-                    >queueTransfer</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.whatsappAccount.queueTransfer == true"
-                class="md-block"
-              >
-                <label translate="WHATSAPP.QUEUETRANSFERTIMEOUT"
-                  >queueTransferTimeout</label
-                >
-                <input
-                  type="number"
-                  name="queueTransferTimeout"
-                  ng-model="vm.whatsappAccount.queueTransferTimeout"
-                  min="1"
-                  max="2147483"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="transferForm['queueTransferTimeout'].$error"
-                  ng-show="transferForm['queueTransferTimeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="WHATSAPP.ERRORS.QUEUETRANSFERTIMEOUT_REQUIRED"
-                      >queueTransferTimeout field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="WHATSAPP.ERRORS.QUEUETRANSFERTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >queueTransferTimeout must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="WHATSAPP.ERRORS.QUEUETRANSFERTIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >queueTransferTimeout must be a valid greater or equal
-                      than</span
-                    >
-                    <span>2147483</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.whatsappAccount.agentTransfer"
-                  aria-label="agentTransfer"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="WHATSAPP.AGENTTRANSFER"
-                    >agentTransfer</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.whatsappAccount.agentTransfer == true"
-                class="md-block"
-              >
-                <label translate="WHATSAPP.AGENTTRANSFERTIMEOUT"
-                  >agentTransferTimeout</label
-                >
-                <input
-                  type="number"
-                  name="agentTransferTimeout"
-                  ng-model="vm.whatsappAccount.agentTransferTimeout"
-                  min="1"
-                  max="2147483"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="transferForm['agentTransferTimeout'].$error"
-                  ng-show="transferForm['agentTransferTimeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="WHATSAPP.ERRORS.AGENTTRANSFERTIMEOUT_REQUIRED"
-                      >agentTransferTimeout field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="WHATSAPP.ERRORS.AGENTTRANSFERTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >agentTransferTimeout must be a valid greater or equal
-                      than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="WHATSAPP.ERRORS.AGENTTRANSFERTIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >agentTransferTimeout must be a valid greater or equal
-                      than</span
-                    >
-                    <span>2147483</span>
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="WHATSAPP.ADVANCED">ADVANCED</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="whatsappAccount-detail-form-container proxy md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="WHATSAPP.PROXY">
-                PROXY
-              </div>
-            </div>
-            <form name="proxyForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="WHATSAPP.MOTIONPROXY">MotionProxy</label>
-                <input
-                  type="url"
-                  name="remote"
-                  ng-model="vm.whatsappAccount.remote"
-                  md-maxlength="255"
-                  ng-required="true"
-                  autofocus
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div class="hint">
-                  <span translate="WHATSAPP.HELP.MOTIONPROXY"></span>
-                </div>
-                <div
-                  ng-messages="proxyForm['remote'].$error"
-                  ng-show="proxyForm['remote'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="WHATSAPP.ERRORS.MOTIONPROXY_REQUIRED"
-                      >MotionProxy field is required</span
-                    >
-                  </div>
-                  <div ng-message="url">
-                    <span translate="WHATSAPP.ERRORS.MOTIONPROXY_MUST_VALID_URL"
-                      >MotionProxy must be a valid url
-                      http://www.xcally.com</span
-                    >
-                  </div>
-                  <div ng-message="md-maxlength">
-                    <span
-                      translate="WHATSAPP.ERRORS.MOTIONPROXY_MAX_LENGTH"
-                      translate-values="{max: 255}"
-                      >MotionProxy must have a maximum length equal to 255</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="WHATSAPP.TOKEN">token</label>
-                <input
-                  type="text"
-                  name="token"
-                  ng-model="vm.whatsappAccount.token"
-                  disabled
-                />
-
-                <div
-                  ng-messages="proxyForm['token'].$error"
-                  ng-show="proxyForm['token'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="WHATSAPP.ERRORS.TOKEN_REQUIRED"
-                      >token field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-          <div
-            class="whatsappAccount-detail-form-container disposition md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="WHATSAPP.DISPOSITION">
-                DISPOSITION
-              </div>
-            </div>
-            <form name="dispositionForm" novalidate>
-              <md-input-container class="md-block">
-                <md-switch
-                  ng-model="vm.whatsappAccount.mandatoryDisposition"
-                  aria-label="MandatoryDisposition"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                  ><span translate="WHATSAPP.MANDATORYDISPOSITION"
-                    >MandatoryDisposition</span
-                  ></md-switch
-                >
-              </md-input-container>
-              <md-input-container
-                ng-if="vm.whatsappAccount.mandatoryDisposition"
-                class="md-block"
-              >
-                <label translate="WHATSAPP.MANDATORYDISPOSITIONPAUSEID"
-                  >MandatoryDispositionPauseId</label
-                >
-                <md-select
-                  name="mandatoryDispositionPauseId"
-                  ng-model="vm.whatsappAccount.mandatoryDispositionPauseId"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option
-                    ng-value="mandatoryDispositionPauseId.id"
-                    ng-repeat="mandatoryDispositionPauseId in vm.pauses"
-                    ng-disabled="mandatoryDispositionPauseId.canSelect === false"
-                    >{{ mandatoryDispositionPauseId.name }}</md-option
-                  >
-                </md-select>
-                <div class="hint">
-                  <span
-                    translate="WHATSAPP.HELP.MANDATORYDISPOSITIONPAUSEID"
-                  ></span>
-                </div>
-                <div
-                  ng-messages="dispositionForm['mandatoryDispositionPauseId'].$error"
-                  ng-show="dispositionForm['mandatoryDispositionPauseId'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span
-                      translate="WHATSAPP.ERRORS.MANDATORYDISPOSITIONPAUSEID_REQUIRED"
-                      >MandatoryDispositionPauseId field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="WHATSAPP.DISPOSITIONS">DISPOSITIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            ng-controller="WhatsappAccountDispositionsController as vm_dc"
-            ng-init="vm_dc.init(vm.whatsappAccount, vm.crudPermissions)"
-          >
-            <div layout="row">
-              <div class="column" flex="20">
-                <md-card class="mt-0">
-                  <md-card-content>
-                    <button
-                      layout-align="center center"
-                      md-mini-fab
-                      ng-click="vm_dc.query.level = null; vm_dc.getDispositions()"
-                    >
-                      <div layout="row" layout-align="start center">
-                        <md-icon md-font-icon="icon-refresh"></md-icon>
-                        <span class="ph-5"
-                          >{{ 'TOOLS.ALL_DISPOSITIONS' | translate }}</span
-                        >
-                      </div>
-                    </button>
-                  </md-card-content>
-                </md-card>
-                <md-card>
-                  <md-card-content>
-                    <md-input-container class="md-block" flex-gt-sm="">
-                      <label translate="TOOLS.SELECT_LEVEL"
-                        >Select a level</label
-                      >
-                      <md-select
-                        placeholder="{{ 'TOOLS.SELECT_LEVEL' | translate }}"
-                        ng-model="vm_dc.query.level"
-                        ng-change="vm_dc.getDispositions()"
-                      >
-                        <md-option ng-value="null"
-                          ><em translate="TOOLS.ALL">All</em></md-option
-                        >
-                        <md-option
-                          ng-value="key"
-                          ng-repeat="(key, value) in vm_dc.levels"
-                          >{{ value }}</md-option
-                        >
-                      </md-select>
-                    </md-input-container>
-                  </md-card-content>
-                </md-card>
-              </div>
-              <div
-                class="whatsappAccount-detail-form-container whatsappdispositions md-background-bg md-whiteframe-1dp"
-                flex="80"
-              >
-                <md-toolbar
-                  class="md-table-toolbar md-default"
-                  ng-hide="vm_dc.selectedWhatsappAccountDispositions.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead" translate="WHATSAPP.DISPOSITIONS"
-                      >Dispositions</span
-                    >
-                    <ms-search-bar
-                      on-search="vm_dc.query.filter = query"
-                      on-collapse="vm_dc.query.filter = undefined"
-                      debounce="300"
-                      direction="down"
-                    ></ms-search-bar>
-                    <div flex></div>
-                    <md-button
-                      ng-if="vm_dc.crudPermissions.canEdit"
-                      class="md-icon-button"
-                      ng-click="vm_dc.createOrEditDisposition($event)"
-                      aria-label="Add whatsapp dispositions"
-                      translate
-                      translate-attr-label="WHATSAPP.ADD_DISPOSITION"
-                    >
-                      <md-icon md-font-icon="icon-plus"></md-icon>
-                    </md-button>
-                  </div>
-                </md-toolbar>
-                <md-toolbar
-                  class="md-table-toolbar md-accent"
-                  ng-show="vm_dc.selectedDispositions.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead"
-                      >{{vm_dc.selectedDispositions.length}}
-                      {{vm_dc.selectedDispositions.length > 1 ? 'items' :
-                      'item'}} selected</span
-                    >
-                    <div flex></div>
-                    <button
-                      class="md-icon-button"
-                      ng-csv="vm_dc.exportSelectedDispositions"
-                      csv-label="true"
-                      filename="whatsappAccounts.csv"
-                    >
-                      <md-icon md-font-icon="icon-file-excel"></md-icon>
-                    </button>
-                    <md-button
-                      ng-if="vm_dc.crudPermissions.canDelete"
-                      class="md-icon-button"
-                      ng-click="vm_dc.deleteSelectedDispositions($event)"
-                      aria-label="delete selected"
-                      translate
-                      translate-attr-label="WHATSAPP.DELETE_SELECTED"
-                    >
-                      <md-icon md-font-icon="icon-delete"></md-icon>
-                    </md-button>
-                  </div>
-                </md-toolbar>
-                <md-table-container>
-                  <table
-                    md-table
-                    md-row-select
-                    multiple
-                    ng-model="vm_dc.selectedDispositions"
-                    md-progress="vm_dc.promise"
-                  >
-                    <thead
-                      md-head
-                      md-order="vm_dc.query.sort"
-                      md-on-reorder="vm_dc.getDispositions"
-                    >
-                      <tr md-row>
-                        <th md-column md-order-by="id">
-                          {{ 'WHATSAPP.ID' | translate }}
-                        </th>
-                        <th md-column md-order-by="level">
-                          {{ 'TOOLS.LEVEL' | translate }}
-                        </th>
-                        <th md-column md-order-by="name">
-                          {{ 'WHATSAPP.NAME' | translate }}
-                        </th>
-                        <th md-column md-order-by="description">
-                          {{ 'WHATSAPP.DESCRIPTION' | translate }}
-                        </th>
-                        <th md-column width="10px"></th>
-                      </tr>
-                    </thead>
-                    <tbody md-body>
-                      <tr md-row ng-hide="vm_dc.dispositions.rows.length">
-                        <td md-cell colspan="5">
-                          <div layout="row" layout-align="center center">
-                            <span translate="WHATSAPP.NO_AVAILABLE_INFO"
-                              >No Available Info</span
-                            >
-                          </div>
-                        </td>
-                      </tr>
-                      <tr
-                        md-row
-                        md-select="disposition"
-                        md-select-id="id"
-                        ng-repeat="disposition in vm_dc.dispositions.rows"
-                      >
-                        <td
-                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                          md-cell
-                          class="id"
-                        >
-                          {{disposition.id}}
-                        </td>
-                        <td
-                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                          md-cell
-                          class="level"
-                        >
-                          {{ vm_dc.levels[disposition.level] }}
-                        </td>
-                        <td
-                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                          md-cell
-                          class="name"
-                        >
-                          {{disposition.name}}
-                        </td>
-                        <td
-                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                          md-cell
-                          class="description"
-                        >
-                          {{disposition.description}}
-                        </td>
-                        <td
-                          md-cell
-                          class="actions"
-                          ng-if="!vm_dc.crudPermissions.readOnly"
-                        >
-                          <md-menu>
-                            <md-button
-                              class="md-icon-button"
-                              aria-label="More"
-                              translate
-                              translate-attr-aria-label="WHATSAPP.MORE"
-                              ng-click="$mdOpenMenu($event)"
-                            >
-                              <md-icon
-                                md-font-icon="icon-dots-vertical"
-                              ></md-icon>
-                            </md-button>
-                            <md-menu-content width="3">
-                              <!-- SUBACTIONS -->
-                              <!-- ACTIONS -->
-                              <md-menu-item
-                                ng-if="vm_dc.crudPermissions.canEdit"
-                              >
-                                <md-button
-                                  ng-click="vm_dc.createOrEditDisposition($event, disposition)"
-                                  translate="TOOLS.EDIT_DISPOSITION"
-                                >
-                                  Edit Disposition
-                                </md-button>
-                              </md-menu-item>
-                              <!-- SUBACTIONS -->
-                              <!-- ACTIONS -->
-                              <md-menu-item
-                                ng-if="vm_dc.crudPermissions.canDelete"
-                              >
-                                <md-button
-                                  ng-click="vm_dc.deleteConfirm(disposition, $event)"
-                                  translate="TOOLS.DELETE_DISPOSITION"
-                                >
-                                  Delete Disposition
-                                </md-button>
-                              </md-menu-item>
-                            </md-menu-content>
-                          </md-menu>
-                        </td>
-                      </tr>
-                    </tbody>
-                  </table>
-                </md-table-container>
-                <md-table-pagination
-                  md-label="{page: '{{'WHATSAPP.PAGE' | translate}}:', rowsPerPage: '{{'WHATSAPP.ROWSPERPAGE' | translate}}:', of: '{{'WHATSAPP.OF' | translate}}'}"
-                  md-limit="vm_dc.query.limit"
-                  md-limit-options="[10, 15, 20, 50, 100, 250]"
-                  md-page="vm_dc.query.page"
-                  md-total="{{vm_dc.dispositions.count}}"
-                  md-on-paginate="vm_dc.getDispositions"
-                  md-page-select
-                >
-                </md-table-pagination>
-              </div>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="WHATSAPP.CANNEDANSWERS">CANNEDANSWERS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="whatsappAccount-detail-form-container whatsappcannedanswers md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="WhatsappAccountWhatsappCannedAnswersController as vm_dc"
-              ng-init="vm_dc.init(vm.whatsappAccount, vm.crudPermissions)"
-            >
-              <md-toolbar
-                class="md-table-toolbar md-default"
-                ng-hide="vm_dc.selectedWhatsappAccountWhatsappCannedAnswers.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span
-                    class="md-subhead"
-                    translate="WHATSAPP.WHATSAPPCANNEDANSWERS"
-                    >WhatsappCannedAnswers</span
-                  >
-                  <ms-search-bar
-                    on-search="vm_dc.query.filter = query"
-                    on-collapse="vm_dc.query.filter = undefined"
-                    debounce="300"
-                    direction="down"
-                  ></ms-search-bar>
-                  <div flex></div>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canEdit"
-                    class="md-icon-button"
-                    ng-click="vm_dc.createOrEditWhatsappAccountWhatsappCannedAnswer($event)"
-                    aria-label="add whatsappCannedAnswer"
-                    translate
-                    translate-attr-label="WHATSAPP.ADD_WHATSAPPCANNEDANSWER"
-                  >
-                    <md-icon md-font-icon="icon-plus"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-toolbar
-                class="md-table-toolbar md-accent"
-                ng-show="vm_dc.selectedWhatsappAccountWhatsappCannedAnswers.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead"
-                    >{{vm_dc.selectedWhatsappAccountWhatsappCannedAnswers.length}}
-                    {{vm_dc.selectedWhatsappAccountWhatsappCannedAnswers.length
-                    > 1 ? 'items' : 'item'}} selected</span
-                  >
-                  <div flex></div>
-                  <button
-                    class="md-icon-button"
-                    ng-csv="vm_dc.exportSelectedWhatsappAccountWhatsappCannedAnswers"
-                    csv-label="true"
-                    filename="whatsappAccounts.csv"
-                  >
-                    <md-icon md-font-icon="icon-file-excel"></md-icon>
-                  </button>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canDelete"
-                    class="md-icon-button"
-                    ng-click="vm_dc.deleteSelectedWhatsappAccountWhatsappCannedAnswers($event)"
-                    aria-label="delete selected"
-                    translate
-                    translate-attr-label="WHATSAPP.DELETE_SELECTED"
-                  >
-                    <md-icon md-font-icon="icon-delete"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-table-container class="font-size-12">
-                <table
-                  md-table
-                  md-row-select
-                  multiple
-                  ng-model="vm_dc.selectedWhatsappAccountWhatsappCannedAnswers"
-                  md-progress="vm_dc.promise"
-                >
-                  <thead
-                    md-head
-                    md-order="vm_dc.query.sort"
-                    md-on-reorder="vm_dc.getWhatsappAccountWhatsappCannedAnswers"
-                  >
-                    <tr md-row>
-                      <th md-column md-order-by="id">
-                        {{ 'WHATSAPP.ID' | translate }}
-                      </th>
-                      <th md-column md-order-by="key">
-                        {{ 'WHATSAPP.KEY' | translate }}
-                      </th>
-                      <th md-column md-order-by="value">
-                        {{ 'WHATSAPP.VALUE' | translate }}
-                      </th>
-                      <th md-column md-order-by="description">
-                        {{ 'WHATSAPP.DESCRIPTION' | translate }}
-                      </th>
-                      <th md-column md-order-by="createdAt">
-                        {{ 'WHATSAPP.CREATED_AT' | translate }}
-                      </th>
-                      <th md-column width="10px"></th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr
-                      md-row
-                      md-select="whatsappCannedAnswer"
-                      md-select-id="id"
-                      ng-repeat="whatsappCannedAnswer in vm_dc.whatsappAccountWhatsappCannedAnswers.rows"
-                    >
-                      <td
-                        ng-click="vm_dc.createOrEditWhatsappAccountWhatsappCannedAnswer($event, whatsappCannedAnswer)"
-                        md-cell
-                      >
-                        {{whatsappCannedAnswer.id}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditWhatsappAccountWhatsappCannedAnswer($event, whatsappCannedAnswer)"
-                        md-cell
-                      >
-                        {{whatsappCannedAnswer.key}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditWhatsappAccountWhatsappCannedAnswer($event, whatsappCannedAnswer)"
-                        md-cell
-                      >
-                        {{whatsappCannedAnswer.value}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditWhatsappAccountWhatsappCannedAnswer($event, whatsappCannedAnswer)"
-                        md-cell
-                      >
-                        {{whatsappCannedAnswer.description}}
-                      </td>
-                      <td
-                        ng-click="vm_dc.createOrEditWhatsappAccountWhatsappCannedAnswer($event, whatsappCannedAnswer)"
-                        md-cell
-                      >
-                        {{ whatsappCannedAnswer.createdAt | formatdate }}
-                      </td>
-                      <td
-                        md-cell
-                        class="actions"
-                        ng-if="!vm_dc.crudPermissions.readOnly"
-                      >
-                        <md-menu>
-                          <md-button
-                            class="md-icon-button"
-                            aria-label="More"
-                            translate
-                            translate-attr-aria-label="WHATSAPP.MORE"
-                            ng-click="$mdOpenMenu($event)"
-                          >
-                            <md-icon
-                              md-font-icon="icon-dots-vertical"
-                            ></md-icon>
-                          </md-button>
-
-                          <md-menu-content width="3">
-                            <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
-                              <md-button
-                                ng-click="vm_dc.createOrEditWhatsappAccountWhatsappCannedAnswer($event, whatsappCannedAnswer)"
-                                translate="WHATSAPP.EDIT_WHATSAPPCANNEDANSWER"
-                              >
-                                Edit WhatsappCannedAnswer
-                              </md-button>
-                            </md-menu-item>
-                            <md-menu-item
-                              ng-if="vm_dc.crudPermissions.canDelete"
-                            >
-                              <md-button
-                                ng-click="vm_dc.deleteConfirm(whatsappCannedAnswer, $event)"
-                                translate="WHATSAPP.DELETE_WHATSAPPCANNEDANSWER"
-                              >
-                                Delete WhatsappCannedAnswer
-                              </md-button>
-                            </md-menu-item>
-                          </md-menu-content>
-                        </md-menu>
-                      </td>
-                    </tr>
-                    <tr
-                      md-row
-                      ng-if="!vm_dc.whatsappAccountWhatsappCannedAnswers.rows.length"
-                    >
-                      <td md-cell colspan="7">
-                        <div layout="row" layout-align="center center">
-                          <span
-                            class="text-boxed-light"
-                            translate="WHATSAPP.NO_WHATSAPPCANNEDANSWER_AVAILABLE"
-                            >No whatsappcannedanswer available</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-              <md-table-pagination
-                md-label="{page: '{{'WHATSAPP.PAGE' | translate}}:', rowsPerPage: '{{'WHATSAPP.ROWSPERPAGE' | translate}}:', of: '{{'WHATSAPP.OF' | translate}}'}"
-                md-limit="vm_dc.query.limit"
-                md-limit-options="[10, 15, 20, 50, 100, 250]"
-                md-page="vm_dc.query.page"
-                md-total="{{vm_dc.whatsappAccountWhatsappCannedAnswers.count}}"
-                md-on-paginate="vm_dc.getWhatsappAccountWhatsappCannedAnswers"
-                md-page-select
-              ></md-table-pagination>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="WHATSAPP.ACTIONS">ACTIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="whatsappAccount-detail-form-container actions md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="WhatsappAccountActionsController as vm_ac"
-              ng-init="vm_ac.init(vm.whatsappAccount, vm.crudPermissions)"
-              class="content"
-              md-background-bg
-              layout="row"
-              layout-align="start start"
-            >
-              <!-- SIDENAV -->
-              <div
-                class="navigation-simple sidenav main-sidenav md-background-bg md-whiteframe-1dp"
-                ms-scroll
-                layout="column"
-                flex="20"
-                ng-if="vm_ac.crudPermissions.canEdit"
-              >
-                <!-- SIDENAV CONTENT -->
-                <md-list class="no-padding">
-                  <md-subheader class="md-no-sticky">
-                    <span translate="VOICE.APPLICATIONS_LIST">
-                      Applications List
-                    </span>
-                  </md-subheader>
-                </md-list>
-                <md-divider></md-divider>
-                <md-list ng-sortable="vm_ac.list">
-                  <md-list-item class="handle" ng-repeat="a in vm_ac.apps">
-                    <md-icon md-font-icon="{{a.icon}}" class="s16"></md-icon>
-                    <p
-                      class="text-truncate"
-                      translate="WHATSAPP.{{(a.alias || a.appType) | uppercase}}"
-                    >
-                      {{a.alias || a.appType}}
-                    </p>
-                  </md-list-item>
-                </md-list>
-                <!-- / SIDENAV CONTENT -->
-              </div>
-              <!-- / SIDENAV -->
-              <div flex></div>
-              <!-- MAIN -->
-              <div
-                class="main scrollable md-background-bg md-whiteframe-1dp"
-                ms-scroll
-                layout="column"
-                flex="{{vm_ac.crudPermissions.canEdit ? 75 : 100}}"
-              >
-                <md-toolbar
-                  class="md-table-toolbar md-default"
-                  ng-hide="vm_ac.selectedWhatsappAccountApps.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead">Drag & Drop Routing</span>
-                    <div flex></div>
-                    <ms-search-bar
-                      on-search="vm_ac.query.filter = query"
-                      on-collapse="vm_ac.query.filter = undefined"
-                      debounce="300"
-                    ></ms-search-bar>
-                  </div>
-                </md-toolbar>
-                <md-toolbar
-                  class="md-table-toolbar md-accent"
-                  ng-show="vm_ac.selectedWhatsappAccountApps.length"
-                >
-                  <div class="md-toolbar-tools">
-                    <span class="md-subhead"
-                      >{{vm_ac.selectedWhatsappAccountApps.length}}
-                      {{vm_ac.selectedWhatsappAccountApps.length > 1 ? 'items' :
-                      'item'}} selected</span
-                    >
-                    <div flex></div>
-                    <md-button
-                      ng-if="vm_ac.crudPermissions.canDelete"
-                      class="md-icon-button"
-                      ng-click="vm_ac.deleteSelectedWhatsappAccountApps($event)"
-                      aria-label="delete selected"
-                      translate
-                      translate-attr-label="WHATSAPP.DELETE_SELECTED"
-                    >
-                      <md-icon md-font-icon="icon-delete"></md-icon>
-                    </md-button>
-                  </div>
-                </md-toolbar>
-
-                <!-- QUEUES TABLE -->
-                <md-table-container>
-                  <table
-                    md-table
-                    md-row-select
-                    multiple
-                    ng-model="vm_ac.selectedWhatsappAccountApps"
-                  >
-                    <thead md-head>
-                      <tr md-row>
-                        <th md-column width="10px"></th>
-                        <th md-column width="10px">
-                          <span translate="VOICE.PRIORITY">Priority</span>
-                        </th>
-                        <th md-column>
-                          <span>Type</span>
-                        </th>
-                        <th md-column>
-                          <span>Appdata</span>
-                        </th>
-                        <th md-column>
-                          <span>Interval</span>
-                        </th>
-                        <th md-column width="10px"></th>
-                        <th md-column width="10px"></th>
-                      </tr>
-                    </thead>
-                    <tbody md-body ng-sortable="vm_ac.applications">
-                      <tr
-                        md-row
-                        md-select="app"
-                        md-select-id="id"
-                        ng-repeat="app in vm_ac.whatsappAccountApps.rows | filter: vm_ac.query.filter"
-                      >
-                        <td md-cell>
-                          <md-icon
-                            md-font-icon="icon-drag-vertical"
-                            class="s16 handle"
-                          ></md-icon>
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editWhatsappAccountApp($event, $index)"
-                        >
-                          <span>{{app.priority}}</span>
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editWhatsappAccountApp($event, $index)"
-                        >
-                          {{app.app.toLowerCase() === 'agi' ? 'Cally-Square' :
-                          app.app | ucfirst}}<span
-                            ng-if="app.appType.toLowerCase() === 'custom'"
-                            >*</span
-                          >
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editWhatsappAccountApp($event, $index)"
-                        >
-                          <span class="text-truncate" style="width: 200px"
-                            >{{app.appdata}}</span
-                          >
-                        </td>
-                        <td
-                          md-cell
-                          ng-click="vm_ac.editInterval($event, $index)"
-                        >
-                          {{app.IntervalId ? 'From List' : app.interval}}
-                        </td>
-                        <td md-cell>
-                          <md-button
-                            ng-click="vm_ac.editInterval($event, $index)"
-                            class="md-icon-button"
-                            aria-label="Interval"
-                          >
-                            <md-icon md-font-icon="icon-timer"></md-icon>
-                            <md-tooltip>
-                              {{app.IntervalId ? 'From List' : (app.interval ===
-                              '*,*,*,*' ? 'Always' : 'Custom')}}
-                            </md-tooltip>
-                          </md-button>
-                        </td>
-                        <td
-                          md-cell
-                          class="actions"
-                          ng-if="!vm_ac.crudPermissions.readOnly"
-                        >
-                          <md-menu>
-                            <md-button
-                              class="md-icon-button"
-                              aria-label="More"
-                              translate
-                              translate-attr-aria-label="VOICE.MORE"
-                              ng-click="$mdOpenMenu($event)"
-                            >
-                              <md-icon
-                                md-font-icon="icon-dots-vertical"
-                              ></md-icon>
-                            </md-button>
-
-                            <md-menu-content width="3">
-                              <md-menu-item
-                                ng-if="vm_ac.crudPermissions.canEdit"
-                              >
-                                <md-button
-                                  ng-click="vm_ac.editWhatsappAccountApp($event, $index)"
-                                  translate="VOICE.EDIT_APP"
-                                >
-                                  Edit App
-                                </md-button>
-                              </md-menu-item>
-                              <md-menu-item
-                                ng-if="vm_ac.crudPermissions.canEdit"
-                              >
-                                <md-button
-                                  ng-click="vm_ac.editInterval($event, $index)"
-                                  translate="VOICE.EDIT_INTERVAL"
-                                >
-                                  Edit Interval
-                                </md-button>
-                              </md-menu-item>
-                              <md-menu-item
-                                ng-if="vm_ac.crudPermissions.canDelete"
-                              >
-                                <md-button
-                                  ng-click="vm_ac.deleteConfirm(app, $index, $event)"
-                                  translate="VOICE.DELETE_APP"
-                                >
-                                  Delete App
-                                </md-button>
-                              </md-menu-item>
-                            </md-menu-content>
-                          </md-menu>
-                        </td>
-                      </tr>
-                      <tr
-                        md-row
-                        ng-hide="vm_ac.whatsappAccountApps.rows.length"
-                      >
-                        <td md-cell colspan="7">
-                          <span
-                            class="text-boxed-light"
-                            translate="VOICE.NO_APPS_AVAILABLE"
-                            >No apps available</span
-                          >
-                        </td>
-                      </tr>
-                    </tbody>
-                  </table>
-                </md-table-container>
-                <!-- / QUEUES TABLE -->
-
-                <!-- NO RESULTS -->
-
-                <!-- / NO RESULTS -->
-              </div>
-              <!-- / MAIN -->
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-      <md-tab>
-        <md-tab-label>
-          <span translate="WHATSAPP.INTERACTIONS">INTERACTIONS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="whatsappAccount-detail-form-container interactions md-background-bg md-whiteframe-1dp"
-          >
-            <div
-              ng-controller="WhatsappAccountInteractionsController as vm_dc"
-              ng-init="vm_dc.init(vm.whatsappAccount, vm.crudPermissions)"
-            >
-              <md-toolbar
-                class="md-table-toolbar md-default"
-                ng-hide="vm_dc.selectedWhatsappAccountInteractions.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead" translate="WHATSAPP.INTERACTIONS"
-                    >Interactions</span
-                  >
-                  <ms-search-bar
-                    on-search="vm_dc.query.filter = query"
-                    on-collapse="vm_dc.query.filter = undefined"
-                    debounce="300"
-                    direction="down"
-                  ></ms-search-bar>
-                  <div flex></div>
-                  <ms-quick-filter
-                    filters="vm_dc.quickFilters"
-                    query="vm_dc.query"
-                    search="vm_dc.getWhatsappAccountInteractions()"
-                  ></ms-quick-filter>
-                  <div layout="column">
-                    <md-button
-                      class="md-icon-button advanced-search"
-                      ng-class="{ 'md-fab md-mini md-accent-bg': vm_dc.query.search }"
-                      aria-label="Filter"
-                      translate
-                      translate-attr-aria-label="DASHBOARDS.FILTER"
-                      ng-click="vm_dc.openAdvancedSearch()"
-                    >
-                      <md-icon
-                        md-font-icon="{{ vm_dc.query.search ? 'icon-filter' : 'icon-filter-outline' }}"
-                        ng-class="{ 'blink': vm_dc.query.search }"
-                      ></md-icon>
-                    </md-button>
-                  </div>
-                  <md-button
-                    class="md-icon-button"
-                    ng-click="vm_dc.getWhatsappAccountInteractions()"
-                    aria-label="refresh Interactions"
-                    translate
-                    translate-attr-label="WHATSAPP.REFRESH_INTERACTIONS"
-                  >
-                    <md-icon md-font-icon="icon-refresh"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-toolbar
-                class="md-table-toolbar md-accent"
-                ng-show="vm_dc.selectedWhatsappAccountInteractions.length"
-              >
-                <div class="md-toolbar-tools">
-                  <span class="md-subhead"
-                    >{{vm_dc.selectedWhatsappAccountInteractions.length}}
-                    {{vm_dc.selectedWhatsappAccountInteractions.length > 1 ?
-                    'items' : 'item'}} selected</span
-                  >
-                  <div flex></div>
-                  <button
-                    class="md-icon-button"
-                    ng-csv="vm_dc.exportSelectedWhatsappAccountInteractions"
-                    csv-label="true"
-                    filename="whatsappAccounts.csv"
-                  >
-                    <md-icon md-font-icon="icon-file-excel"></md-icon>
-                  </button>
-                  <md-button
-                    ng-if="vm_dc.crudPermissions.canDelete"
-                    class="md-icon-button"
-                    ng-click="vm_dc.deleteSelectedWhatsappAccountInteractions($event)"
-                    aria-label="delete selected"
-                    translate
-                    translate-attr-label="WHATSAPP.DELETE_SELECTED"
-                  >
-                    <md-icon md-font-icon="icon-delete"></md-icon>
-                  </md-button>
-                </div>
-              </md-toolbar>
-              <md-table-container class="font-size-12">
-                <table
-                  md-table
-                  md-row-select
-                  multiple
-                  ng-model="vm_dc.selectedWhatsappAccountInteractions"
-                  md-progress="vm_dc.promise"
-                >
-                  <thead
-                    md-head
-                    md-order="vm_dc.query.sort"
-                    md-on-reorder="vm_dc.getWhatsappAccountInteractions"
-                  >
-                    <tr md-row>
-                      <th md-column md-order-by="id">
-                        {{ 'WHATSAPP.ID' | translate }}
-                      </th>
-                      <th md-column class="no-padding">
-                        <md-icon md-font-icon="icon-eye" class="s16"></md-icon>
-                      </th>
-                      <th md-column class="no-padding"></th>
-                      <th md-column class="no-padding"></th>
-                      <th md-column>{{ 'WHATSAPP.CONTACT' | translate }}</th>
-                      <th md-column md-order-by="createdAt">
-                        {{ 'WHATSAPP.STARTEDAT' | translate }}
-                      </th>
-                      <th md-column md-order-by="lastMsgAt">
-                        {{ 'WHATSAPP.LASTMESSAGE' | translate }}
-                      </th>
-                      <th md-column md-order-by="closed">
-                        {{ 'WHATSAPP.STATUS' | translate }}
-                      </th>
-                      <th md-column>{{ 'WHATSAPP.AGENT' | translate }}</th>
-                      <th md-column md-order-by="tag">
-                        {{ 'WHATSAPP.TAGS' | translate }}
-                      </th>
-                      <th md-column width="10px"></th>
-                    </tr>
-                  </thead>
-                  <tbody md-body>
-                    <tr
-                      md-row
-                      md-select="interaction"
-                      md-select-id="id"
-                      ng-repeat="interaction in vm_dc.whatsappAccountInteractions.rows"
-                      ng-class="{'text-bold text-italic': interaction.unreadMessages > 0}"
-                    >
-                      <td md-cell>{{interaction.id}}</td>
-                      <td md-cell class="no-padding">
-                        <div
-                          ng-if="!interaction.closed && interaction.Users.length"
-                        >
-                          <md-icon
-                            md-font-icon="icon-eye"
-                            class="s16"
-                          ></md-icon>
-                          <md-tooltip>
-                            <span ng-repeat="user in interaction.Users"
-                              >{{ user.fullname | translate }}
-                              <span ng-if="!$last">, </span>
-                            </span>
-                          </md-tooltip>
-                        </div>
-                      </td>
-                      <td md-cell class="no-padding">
-                        <div
-                          ng-if="interaction.unreadMessages > 0"
-                          layout="row"
-                          layout-align="start center"
-                        >
-                          <span
-                            class="badge white-fg md-primary-bg"
-                            layout-margin
-                            >{{ interaction.unreadMessages}}</span
-                          >
-                        </div>
-                      </td>
-                      <td md-cell class="no-padding">
-                        <div ng-if="interaction.attach">
-                          <md-icon
-                            md-font-icon="icon-paperclip"
-                            class="s16"
-                          ></md-icon>
-                        </div>
-                      </td>
-                      <td md-cell>
-                        <div layout="column" layout-align="start start">
-                          <span
-                            class="font-size-12 text-truncate contact-text"
-                            ng-class="{'margin-bottom-0' : interaction.contactInfo}"
-                            layout-margin
-                            >{{ interaction.contactName }}</span
-                          >
-                          <span
-                            ng-if="interaction.contactInfo"
-                            class="font-size-12 text-truncate contact-text margin-top-0"
-                            layout-margin
-                            >{{ interaction.contactInfo }}</span
-                          >
-                        </div>
-                      </td>
-                      <td md-cell>{{ interaction.createdAt | formatdate }}</td>
-                      <td md-cell>
-                        <div layout="row">
-                          <span>
-                            <md-icon
-                              md-font-icon="{{interaction.lastMsgDirection == 'in' ? 'icon-arrow-down-bold blue-grey-800-fg' : 'icon-arrow-up-bold blue-grey-300-fg'}}"
-                            ></md-icon>
-                          </span>
-                          <div layout="column" layout-align="center center">
-                            <span class="text-truncate"
-                              >{{ interaction.lastMsgAt | formatdate }}</span
-                            >
-                          </div>
-                        </div>
-                      </td>
-                      <td md-cell>
-                        <span ng-if="interaction.closed === 0" class="green-fg">
-                          {{ 'WHATSAPP.OPENED' | translate }}
-                          <span ng-if="interaction.substatus">
-                            - {{ interaction.substatus }}
-                          </span>
-                        </span>
-                        <span ng-if="interaction.closed === 1" class="red-fg">
-                          {{ 'WHATSAPP.CLOSED' | translate }}
-                          <span ng-if="interaction.disposition">
-                            - {{ interaction.thirdDisposition ||
-                            interaction.secondDisposition ||
-                            interaction.disposition }}
-                          </span>
-                          <md-tooltip class="multiline">
-                            <div layout="column">
-                              <div layout="column">
-                                <span
-                                  >{{ 'DASHBOARDS.CLOSED_AT' |
-                                  translate}}:</span
-                                >
-                                <span class="text-bold"
-                                  >{{ interaction.closedAt | formatdate }}</span
-                                >
-                              </div>
-                              <div
-                                ng-if="interaction.disposition"
-                                layout="column"
-                              >
-                                <span
-                                  >{{ 'DASHBOARDS.DISPOSITION' |
-                                  translate}}:</span
-                                >
-                                <span class="text-bold"
-                                  >{{ interaction.disposition }}</span
-                                >
-                              </div>
-                              <div
-                                ng-if="interaction.secondDisposition"
-                                layout="column"
-                              >
-                                <span
-                                  >{{ 'DASHBOARDS.SECOND_LEVEL_DISPOSITION' |
-                                  translate}}:</span
-                                >
-                                <span class="text-bold"
-                                  >{{ interaction.secondDisposition }}</span
-                                >
-                              </div>
-                              <div
-                                ng-if="interaction.thirdDisposition"
-                                layout="column"
-                              >
-                                <span
-                                  >{{ 'DASHBOARDS.THIRD_LEVEL_DISPOSITION' |
-                                  translate}}:</span
-                                >
-                                <span class="text-bold"
-                                  >{{ interaction.thirdDisposition }}</span
-                                >
-                              </div>
-                            </div>
-                          </md-tooltip>
-                        </span>
-                      </td>
-
-                      <td md-cell>{{interaction.Owner.name}}</td>
-                      <td md-cell>
-                        <div ng-if="interaction.Tags.length">
-                          <md-tooltip md-direction="left" layout="row">
-                            <span ng-repeat="tag in interaction.Tags"
-                              >{{tag.name}}<span ng-if="!$last">, </span></span
-                            >
-                          </md-tooltip>
-                          <md-icon
-                            md-font-icon="icon-tag"
-                            ng-style="{'color': interaction.Tags.length == 1 && interaction.Tags[0].color }"
-                          >
-                          </md-icon>
-                        </div>
-                      </td>
-                      <td md-cell class="actions">
-                        <md-menu>
-                          <md-button
-                            class="md-icon-button"
-                            aria-label="More"
-                            translate
-                            translate-attr-aria-label="WHATSAPP.MORE"
-                            ng-click="$mdOpenMenu($event)"
-                          >
-                            <md-icon
-                              md-font-icon="icon-dots-vertical"
-                            ></md-icon>
-                          </md-button>
-
-                          <md-menu-content width="3">
-                            <md-menu-item>
-                              <md-button
-                                ng-click="vm_dc.spywhatsappInteraction($event, interaction)"
-                                translate="WHATSAPP.SPYINTERACTION"
-                              >
-                                Spy Interaction
-                              </md-button>
-                            </md-menu-item>
-                            <md-menu-item>
-                              <md-button
-                                class="md-primary"
-                                ng-click="vm_dc.whatsappInteractionDownload(interaction, $event)"
-                                translate="WHATSAPP.DOWNLOAD_INTERACTION"
-                              >
-                                Download
-                              </md-button>
-                            </md-menu-item>
-                            <md-menu-item
-                              ng-if="vm_dc.crudPermissions.canDelete"
-                            >
-                              <md-button
-                                ng-click="vm_dc.deleteConfirm(interaction, $event)"
-                                translate="WHATSAPP.DELETE_INTERACTION"
-                              >
-                                Delete Interaction
-                              </md-button>
-                            </md-menu-item>
-                          </md-menu-content>
-                        </md-menu>
-                      </td>
-                    </tr>
-                    <tr
-                      md-row
-                      ng-if="!vm_dc.whatsappAccountInteractions.rows.length"
-                    >
-                      <td md-cell colspan="12">
-                        <div layout="row" layout-align="center center">
-                          <span
-                            class="text-boxed-light"
-                            translate="WHATSAPP.NO_INTERACTION_AVAILABLE"
-                            >No interaction available</span
-                          >
-                        </div>
-                      </td>
-                    </tr>
-                  </tbody>
-                </table>
-              </md-table-container>
-              <md-table-pagination
-                md-label="{page: '{{'WHATSAPP.PAGE' | translate}}:', rowsPerPage: '{{'WHATSAPP.ROWSPERPAGE' | translate}}:', of: '{{'WHATSAPP.OF' | translate}}'}"
-                md-limit="vm_dc.query.limit"
-                md-limit-options="[10, 15, 20, 50, 100, 250]"
-                md-page="vm_dc.query.page"
-                md-total="{{vm_dc.whatsappAccountInteractions.count}}"
-                md-on-paginate="vm_dc.getWhatsappAccountInteractions"
-                md-page-select
-              ></md-table-pagination>
-            </div>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/view.html/view.html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/view.html/view.html
new file mode 100644
index 0000000..929f554
--- /dev/null
+++ b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/view.html/view.html
@@ -0,0 +1,1757 @@
+<div
+  id="whatsapp-whatsappAccount"
+  class="page-layout simple tabbed"
+  layout="column"
+>
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-whatsappAccounts-button md-icon-button"
+        aria-label="Go to whatsappAccounts"
+        ng-click="vm.gotoWhatsappAccounts()"
+        translate
+        translate-attr-aria-label="WHATSAPP.GO_TO_WHATSAPPACCOUNTS"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="whatsappAccount-image" hide-xs>
+          <img ng-src="assets/images/business/whatsappAccounts.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.whatsappAccount.id}}
+            <span ng-if="vm.whatsappAccount.name"
+              >{{vm.whatsappAccount.name}}</span
+            >
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="WHATSAPP.CREATED_AT"></span>
+            <span>{{vm.whatsappAccount.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.agentadddialog(vm.whatsappAccount, $event)"
+        class="md-fab md-warn md-icon-button"
+        aria-label="agentadd"
+      >
+        <md-tooltip
+          ><span translate="WHATSAPP.AGENTADD_WHATSAPPACCOUNT"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
+      </md-button>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveWhatsappAccount()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid) || (notificationForm.$invalid) || (transferForm.$invalid) || (proxyForm.$invalid) || (dispositionForm.$invalid) || (whatsappDispositionsForm.$invalid) || (whatsappCannedAnswersForm.$invalid) || (actionsForm.$invalid) || (interactionsForm.$invalid)"
+        translate="WHATSAPP.SAVE"
+        translate-attr-aria-label="WHATSAPP.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="WHATSAPP.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="whatsappAccount-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="WHATSAPP.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="WHATSAPP.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.whatsappAccount.name"
+                  ng-required="true"
+                  autofocus
+                  disabled
+                />
+
+                <div class="hint">
+                  <span translate="WHATSAPP.HELP.NAME"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="WHATSAPP.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="WHATSAPP.KEY">key</label>
+                <input
+                  type="text"
+                  name="key"
+                  ng-model="vm.whatsappAccount.key"
+                  md-maxlength="5"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['key'].$error"
+                  ng-show="generalForm['key'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="WHATSAPP.ERRORS.KEY_REQUIRED"
+                      >key field is required</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="WHATSAPP.ERRORS.KEY_MAX_LENGTH"
+                      translate-values="{max: 5}"
+                      >key must have a maximum length equal to 5</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="WHATSAPP.LIST">List</label>
+                <md-select
+                  name="ListId"
+                  ng-model="vm.whatsappAccount.ListId"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="ListId.id"
+                    ng-repeat="ListId in vm.lists"
+                    ng-disabled="ListId.canSelect === false"
+                    >{{ ListId.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span translate="WHATSAPP.HELP.LIST"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['ListId'].$error"
+                  ng-show="generalForm['ListId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="WHATSAPP.ERRORS.LIST_REQUIRED"
+                      >List field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.whatsappAccount.type == 'twilio'"
+                class="md-block"
+              >
+                <label translate="WHATSAPP.ACCOUNTSID">AccountSID</label>
+                <input
+                  type="text"
+                  name="accountSid"
+                  ng-model="vm.whatsappAccount.accountSid"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['accountSid'].$error"
+                  ng-show="generalForm['accountSid'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="WHATSAPP.ERRORS.ACCOUNTSID_REQUIRED"
+                      >AccountSID field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.whatsappAccount.type == 'twilio'"
+                class="md-block"
+              >
+                <label translate="WHATSAPP.AUTHTOKEN">AuthToken</label>
+                <input
+                  type="text"
+                  name="authToken"
+                  ng-model="vm.whatsappAccount.authToken"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['authToken'].$error"
+                  ng-show="generalForm['authToken'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="WHATSAPP.ERRORS.AUTHTOKEN_REQUIRED"
+                      >AuthToken field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="WHATSAPP.PHONE">phone</label>
+                <input
+                  type="text"
+                  name="phone"
+                  ng-model="vm.whatsappAccount.phone"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['phone'].$error"
+                  ng-show="generalForm['phone'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="WHATSAPP.ERRORS.PHONE_REQUIRED"
+                      >phone field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="WHATSAPP.RECEIVEURL">receiveUrl</label>
+                <div layout="row" layout-align="center center">
+                  <button
+                    class="md-button md-fab md-mini md-primary"
+                    ngclipboard
+                    data-clipboard-target="#copytoclipboard-receiveUrl"
+                    ngclipboard-success="vm.alert({title: 'copied to clipboard', msg: e.text});"
+                    ngclipboard-error="vm.alert({title: 'error', msg: 'copy to clipboard failed'});"
+                  >
+                    <md-icon md-font-icon="icon-clipboard-text"></md-icon>
+                  </button>
+                  <input
+                    class="md-input"
+                    type="text"
+                    id="copytoclipboard-receiveUrl"
+                    name="receiveUrl"
+                    ng-value="vm.whatsappAccount.remote + '/api/whatsapp/accounts/' + vm.whatsappAccount.id + '/notify?token=' + vm.whatsappAccount.token"
+                    ng-readonly="true"
+                  />
+                </div>
+                <div class="hint">
+                  <span translate="WHATSAPP.HELP.RECEIVEURL"></span>
+                </div>
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.whatsappAccount.type == 'twillo'"
+                class="md-block"
+              >
+                <label translate="WHATSAPP.DELIVERYREPORTURL"
+                  >deliveryReportUrl</label
+                >
+                <div layout="row" layout-align="center center">
+                  <button
+                    class="md-button md-fab md-mini md-primary"
+                    ngclipboard
+                    data-clipboard-target="#copytoclipboard-deliveryReportUrl"
+                    ngclipboard-success="vm.alert({title: 'copied to clipboard', msg: e.text});"
+                    ngclipboard-error="vm.alert({title: 'error', msg: 'copy to clipboard failed'});"
+                  >
+                    <md-icon md-font-icon="icon-clipboard-text"></md-icon>
+                  </button>
+                  <input
+                    class="md-input"
+                    type="text"
+                    id="copytoclipboard-deliveryReportUrl"
+                    name="deliveryReportUrl"
+                    ng-value="vm.whatsappAccount.remote + '/api/whatsapp/accounts/' + vm.whatsappAccount.id + '/status?token=' + vm.whatsappAccount.token + (vm.whatsappAccount.type == 'csc' ? '&message-id={message-id}&state={state}' : '')"
+                    ng-readonly="true"
+                  />
+                </div>
+                <div class="hint">
+                  <span translate="WHATSAPP.HELP.DELIVERYREPORTURL"></span>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="WHATSAPP.WAITFORTHEASSIGNEDAGENT"
+                  >WaitForTheAssignedAgent</label
+                >
+                <input
+                  type="number"
+                  name="waitForTheAssignedAgent"
+                  ng-model="vm.whatsappAccount.waitForTheAssignedAgent"
+                  min="1"
+                  max="2147483"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['waitForTheAssignedAgent'].$error"
+                  ng-show="generalForm['waitForTheAssignedAgent'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="WHATSAPP.ERRORS.WAITFORTHEASSIGNEDAGENT_REQUIRED"
+                      >WaitForTheAssignedAgent field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="WHATSAPP.ERRORS.WAITFORTHEASSIGNEDAGENT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >WaitForTheAssignedAgent must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="WHATSAPP.ERRORS.WAITFORTHEASSIGNEDAGENT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >WaitForTheAssignedAgent must be a valid greater or equal
+                      than</span
+                    >
+                    <span>2147483</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="WHATSAPP.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.whatsappAccount.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="WHATSAPP.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="whatsappAccount-detail-form-container notification md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="WHATSAPP.NOTIFICATION">
+                NOTIFICATION
+              </div>
+            </div>
+            <form name="notificationForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.whatsappAccount.notificationShake"
+                  aria-label="notificationShake"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="WHATSAPP.NOTIFICATIONSHAKE"
+                    >notificationShake</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.whatsappAccount.notificationSound"
+                  aria-label="notificationSound"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="WHATSAPP.NOTIFICATIONSOUND"
+                    >notificationSound</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <div class="md-block">
+                <label
+                  class="md-caption grey-fg"
+                  translate="WHATSAPP.NOTIFICATIONTEMPLATE"
+                  >notificationTemplate</label
+                >
+                <textarea
+                  aria-label="notificationTemplate notificationTemplate"
+                  ckeditor="{ skin: 'office2013', language: 'en', allowedContent: true, extraPlugins: 'font,colorbutton,autoembed,autocorrect,googlethisterm,pastebase64', toolbarGroups: [{ name: 'styles', groups: ['styles'] }, { name: 'clipboard', groups: ['undo'] }, { name: 'colors', groups: ['colors'] }, { name: 'basicstyles', groups: ['basicstyles'] }, { name: 'paragraph', groups: ['list', 'indent', 'align'] }, { name: 'mode' }], autocorrect_enabled: true, disableNativeSpellChecker: false, fontSize_sizes: '8/8pt;9/9pt;10/10pt;11/11pt;12/12pt;14/14pt;16/16pt;18/18pt;20/20pt;22/22pt;24/24pt;26/26pt;28/28pt;36/36pt;48/48pt;72/72pt',  removePlugins: 'magicline' }"
+                  ng-model="vm.whatsappAccount.notificationTemplate"
+                ></textarea>
+              </div>
+            </form>
+          </div>
+          <div
+            class="whatsappAccount-detail-form-container transfer md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="WHATSAPP.TRANSFER">
+                TRANSFER
+              </div>
+            </div>
+            <form name="transferForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.whatsappAccount.queueTransfer"
+                  aria-label="queueTransfer"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="WHATSAPP.QUEUETRANSFER"
+                    >queueTransfer</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.whatsappAccount.queueTransfer == true"
+                class="md-block"
+              >
+                <label translate="WHATSAPP.QUEUETRANSFERTIMEOUT"
+                  >queueTransferTimeout</label
+                >
+                <input
+                  type="number"
+                  name="queueTransferTimeout"
+                  ng-model="vm.whatsappAccount.queueTransferTimeout"
+                  min="1"
+                  max="2147483"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="transferForm['queueTransferTimeout'].$error"
+                  ng-show="transferForm['queueTransferTimeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="WHATSAPP.ERRORS.QUEUETRANSFERTIMEOUT_REQUIRED"
+                      >queueTransferTimeout field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="WHATSAPP.ERRORS.QUEUETRANSFERTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >queueTransferTimeout must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="WHATSAPP.ERRORS.QUEUETRANSFERTIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >queueTransferTimeout must be a valid greater or equal
+                      than</span
+                    >
+                    <span>2147483</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.whatsappAccount.agentTransfer"
+                  aria-label="agentTransfer"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="WHATSAPP.AGENTTRANSFER"
+                    >agentTransfer</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.whatsappAccount.agentTransfer == true"
+                class="md-block"
+              >
+                <label translate="WHATSAPP.AGENTTRANSFERTIMEOUT"
+                  >agentTransferTimeout</label
+                >
+                <input
+                  type="number"
+                  name="agentTransferTimeout"
+                  ng-model="vm.whatsappAccount.agentTransferTimeout"
+                  min="1"
+                  max="2147483"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="transferForm['agentTransferTimeout'].$error"
+                  ng-show="transferForm['agentTransferTimeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="WHATSAPP.ERRORS.AGENTTRANSFERTIMEOUT_REQUIRED"
+                      >agentTransferTimeout field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="WHATSAPP.ERRORS.AGENTTRANSFERTIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >agentTransferTimeout must be a valid greater or equal
+                      than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="WHATSAPP.ERRORS.AGENTTRANSFERTIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >agentTransferTimeout must be a valid greater or equal
+                      than</span
+                    >
+                    <span>2147483</span>
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="WHATSAPP.ADVANCED">ADVANCED</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="whatsappAccount-detail-form-container proxy md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="WHATSAPP.PROXY">
+                PROXY
+              </div>
+            </div>
+            <form name="proxyForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="WHATSAPP.MOTIONPROXY">MotionProxy</label>
+                <input
+                  type="url"
+                  name="remote"
+                  ng-model="vm.whatsappAccount.remote"
+                  md-maxlength="255"
+                  ng-required="true"
+                  autofocus
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div class="hint">
+                  <span translate="WHATSAPP.HELP.MOTIONPROXY"></span>
+                </div>
+                <div
+                  ng-messages="proxyForm['remote'].$error"
+                  ng-show="proxyForm['remote'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="WHATSAPP.ERRORS.MOTIONPROXY_REQUIRED"
+                      >MotionProxy field is required</span
+                    >
+                  </div>
+                  <div ng-message="url">
+                    <span translate="WHATSAPP.ERRORS.MOTIONPROXY_MUST_VALID_URL"
+                      >MotionProxy must be a valid url
+                      http://www.xcally.com</span
+                    >
+                  </div>
+                  <div ng-message="md-maxlength">
+                    <span
+                      translate="WHATSAPP.ERRORS.MOTIONPROXY_MAX_LENGTH"
+                      translate-values="{max: 255}"
+                      >MotionProxy must have a maximum length equal to 255</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="WHATSAPP.TOKEN">token</label>
+                <input
+                  type="text"
+                  name="token"
+                  ng-model="vm.whatsappAccount.token"
+                  disabled
+                />
+
+                <div
+                  ng-messages="proxyForm['token'].$error"
+                  ng-show="proxyForm['token'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="WHATSAPP.ERRORS.TOKEN_REQUIRED"
+                      >token field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+          <div
+            class="whatsappAccount-detail-form-container disposition md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="WHATSAPP.DISPOSITION">
+                DISPOSITION
+              </div>
+            </div>
+            <form name="dispositionForm" novalidate>
+              <md-input-container class="md-block">
+                <md-switch
+                  ng-model="vm.whatsappAccount.mandatoryDisposition"
+                  aria-label="MandatoryDisposition"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                  ><span translate="WHATSAPP.MANDATORYDISPOSITION"
+                    >MandatoryDisposition</span
+                  ></md-switch
+                >
+              </md-input-container>
+              <md-input-container
+                ng-if="vm.whatsappAccount.mandatoryDisposition"
+                class="md-block"
+              >
+                <label translate="WHATSAPP.MANDATORYDISPOSITIONPAUSEID"
+                  >MandatoryDispositionPauseId</label
+                >
+                <md-select
+                  name="mandatoryDispositionPauseId"
+                  ng-model="vm.whatsappAccount.mandatoryDispositionPauseId"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option
+                    ng-value="mandatoryDispositionPauseId.id"
+                    ng-repeat="mandatoryDispositionPauseId in vm.pauses"
+                    ng-disabled="mandatoryDispositionPauseId.canSelect === false"
+                    >{{ mandatoryDispositionPauseId.name }}</md-option
+                  >
+                </md-select>
+                <div class="hint">
+                  <span
+                    translate="WHATSAPP.HELP.MANDATORYDISPOSITIONPAUSEID"
+                  ></span>
+                </div>
+                <div
+                  ng-messages="dispositionForm['mandatoryDispositionPauseId'].$error"
+                  ng-show="dispositionForm['mandatoryDispositionPauseId'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span
+                      translate="WHATSAPP.ERRORS.MANDATORYDISPOSITIONPAUSEID_REQUIRED"
+                      >MandatoryDispositionPauseId field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="WHATSAPP.DISPOSITIONS">DISPOSITIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            ng-controller="WhatsappAccountDispositionsController as vm_dc"
+            ng-init="vm_dc.init(vm.whatsappAccount, vm.crudPermissions)"
+          >
+            <div layout="row">
+              <div class="column" flex="20">
+                <md-card class="mt-0">
+                  <md-card-content>
+                    <button
+                      layout-align="center center"
+                      md-mini-fab
+                      ng-click="vm_dc.query.level = null; vm_dc.getDispositions()"
+                    >
+                      <div layout="row" layout-align="start center">
+                        <md-icon md-font-icon="icon-refresh"></md-icon>
+                        <span class="ph-5"
+                          >{{ 'TOOLS.ALL_DISPOSITIONS' | translate }}</span
+                        >
+                      </div>
+                    </button>
+                  </md-card-content>
+                </md-card>
+                <md-card>
+                  <md-card-content>
+                    <md-input-container class="md-block" flex-gt-sm="">
+                      <label translate="TOOLS.SELECT_LEVEL"
+                        >Select a level</label
+                      >
+                      <md-select
+                        placeholder="{{ 'TOOLS.SELECT_LEVEL' | translate }}"
+                        ng-model="vm_dc.query.level"
+                        ng-change="vm_dc.getDispositions()"
+                      >
+                        <md-option ng-value="null"
+                          ><em translate="TOOLS.ALL">All</em></md-option
+                        >
+                        <md-option
+                          ng-value="key"
+                          ng-repeat="(key, value) in vm_dc.levels"
+                          >{{ value }}</md-option
+                        >
+                      </md-select>
+                    </md-input-container>
+                  </md-card-content>
+                </md-card>
+              </div>
+              <div
+                class="whatsappAccount-detail-form-container whatsappdispositions md-background-bg md-whiteframe-1dp"
+                flex="80"
+              >
+                <md-toolbar
+                  class="md-table-toolbar md-default"
+                  ng-hide="vm_dc.selectedWhatsappAccountDispositions.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead" translate="WHATSAPP.DISPOSITIONS"
+                      >Dispositions</span
+                    >
+                    <ms-search-bar
+                      on-search="vm_dc.query.filter = query"
+                      on-collapse="vm_dc.query.filter = undefined"
+                      debounce="300"
+                      direction="down"
+                    ></ms-search-bar>
+                    <div flex></div>
+                    <md-button
+                      ng-if="vm_dc.crudPermissions.canEdit"
+                      class="md-icon-button"
+                      ng-click="vm_dc.createOrEditDisposition($event)"
+                      aria-label="Add whatsapp dispositions"
+                      translate
+                      translate-attr-label="WHATSAPP.ADD_DISPOSITION"
+                    >
+                      <md-icon md-font-icon="icon-plus"></md-icon>
+                    </md-button>
+                  </div>
+                </md-toolbar>
+                <md-toolbar
+                  class="md-table-toolbar md-accent"
+                  ng-show="vm_dc.selectedDispositions.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead"
+                      >{{vm_dc.selectedDispositions.length}}
+                      {{vm_dc.selectedDispositions.length > 1 ? 'items' :
+                      'item'}} selected</span
+                    >
+                    <div flex></div>
+                    <button
+                      class="md-icon-button"
+                      ng-csv="vm_dc.exportSelectedDispositions"
+                      csv-label="true"
+                      filename="whatsappAccounts.csv"
+                    >
+                      <md-icon md-font-icon="icon-file-excel"></md-icon>
+                    </button>
+                    <md-button
+                      ng-if="vm_dc.crudPermissions.canDelete"
+                      class="md-icon-button"
+                      ng-click="vm_dc.deleteSelectedDispositions($event)"
+                      aria-label="delete selected"
+                      translate
+                      translate-attr-label="WHATSAPP.DELETE_SELECTED"
+                    >
+                      <md-icon md-font-icon="icon-delete"></md-icon>
+                    </md-button>
+                  </div>
+                </md-toolbar>
+                <md-table-container>
+                  <table
+                    md-table
+                    md-row-select
+                    multiple
+                    ng-model="vm_dc.selectedDispositions"
+                    md-progress="vm_dc.promise"
+                  >
+                    <thead
+                      md-head
+                      md-order="vm_dc.query.sort"
+                      md-on-reorder="vm_dc.getDispositions"
+                    >
+                      <tr md-row>
+                        <th md-column md-order-by="id">
+                          {{ 'WHATSAPP.ID' | translate }}
+                        </th>
+                        <th md-column md-order-by="level">
+                          {{ 'TOOLS.LEVEL' | translate }}
+                        </th>
+                        <th md-column md-order-by="name">
+                          {{ 'WHATSAPP.NAME' | translate }}
+                        </th>
+                        <th md-column md-order-by="description">
+                          {{ 'WHATSAPP.DESCRIPTION' | translate }}
+                        </th>
+                        <th md-column width="10px"></th>
+                      </tr>
+                    </thead>
+                    <tbody md-body>
+                      <tr md-row ng-hide="vm_dc.dispositions.rows.length">
+                        <td md-cell colspan="5">
+                          <div layout="row" layout-align="center center">
+                            <span translate="WHATSAPP.NO_AVAILABLE_INFO"
+                              >No Available Info</span
+                            >
+                          </div>
+                        </td>
+                      </tr>
+                      <tr
+                        md-row
+                        md-select="disposition"
+                        md-select-id="id"
+                        ng-repeat="disposition in vm_dc.dispositions.rows"
+                      >
+                        <td
+                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                          md-cell
+                          class="id"
+                        >
+                          {{disposition.id}}
+                        </td>
+                        <td
+                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                          md-cell
+                          class="level"
+                        >
+                          {{ vm_dc.levels[disposition.level] }}
+                        </td>
+                        <td
+                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                          md-cell
+                          class="name"
+                        >
+                          {{disposition.name}}
+                        </td>
+                        <td
+                          ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                          md-cell
+                          class="description"
+                        >
+                          {{disposition.description}}
+                        </td>
+                        <td
+                          md-cell
+                          class="actions"
+                          ng-if="!vm_dc.crudPermissions.readOnly"
+                        >
+                          <md-menu>
+                            <md-button
+                              class="md-icon-button"
+                              aria-label="More"
+                              translate
+                              translate-attr-aria-label="WHATSAPP.MORE"
+                              ng-click="$mdOpenMenu($event)"
+                            >
+                              <md-icon
+                                md-font-icon="icon-dots-vertical"
+                              ></md-icon>
+                            </md-button>
+                            <md-menu-content width="3">
+                              <!-- SUBACTIONS -->
+                              <!-- ACTIONS -->
+                              <md-menu-item
+                                ng-if="vm_dc.crudPermissions.canEdit"
+                              >
+                                <md-button
+                                  ng-click="vm_dc.createOrEditDisposition($event, disposition)"
+                                  translate="TOOLS.EDIT_DISPOSITION"
+                                >
+                                  Edit Disposition
+                                </md-button>
+                              </md-menu-item>
+                              <!-- SUBACTIONS -->
+                              <!-- ACTIONS -->
+                              <md-menu-item
+                                ng-if="vm_dc.crudPermissions.canDelete"
+                              >
+                                <md-button
+                                  ng-click="vm_dc.deleteConfirm(disposition, $event)"
+                                  translate="TOOLS.DELETE_DISPOSITION"
+                                >
+                                  Delete Disposition
+                                </md-button>
+                              </md-menu-item>
+                            </md-menu-content>
+                          </md-menu>
+                        </td>
+                      </tr>
+                    </tbody>
+                  </table>
+                </md-table-container>
+                <md-table-pagination
+                  md-label="{page: '{{'WHATSAPP.PAGE' | translate}}:', rowsPerPage: '{{'WHATSAPP.ROWSPERPAGE' | translate}}:', of: '{{'WHATSAPP.OF' | translate}}'}"
+                  md-limit="vm_dc.query.limit"
+                  md-limit-options="[10, 15, 20, 50, 100, 250]"
+                  md-page="vm_dc.query.page"
+                  md-total="{{vm_dc.dispositions.count}}"
+                  md-on-paginate="vm_dc.getDispositions"
+                  md-page-select
+                >
+                </md-table-pagination>
+              </div>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="WHATSAPP.CANNEDANSWERS">CANNEDANSWERS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="whatsappAccount-detail-form-container whatsappcannedanswers md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="WhatsappAccountWhatsappCannedAnswersController as vm_dc"
+              ng-init="vm_dc.init(vm.whatsappAccount, vm.crudPermissions)"
+            >
+              <md-toolbar
+                class="md-table-toolbar md-default"
+                ng-hide="vm_dc.selectedWhatsappAccountWhatsappCannedAnswers.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span
+                    class="md-subhead"
+                    translate="WHATSAPP.WHATSAPPCANNEDANSWERS"
+                    >WhatsappCannedAnswers</span
+                  >
+                  <ms-search-bar
+                    on-search="vm_dc.query.filter = query"
+                    on-collapse="vm_dc.query.filter = undefined"
+                    debounce="300"
+                    direction="down"
+                  ></ms-search-bar>
+                  <div flex></div>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canEdit"
+                    class="md-icon-button"
+                    ng-click="vm_dc.createOrEditWhatsappAccountWhatsappCannedAnswer($event)"
+                    aria-label="add whatsappCannedAnswer"
+                    translate
+                    translate-attr-label="WHATSAPP.ADD_WHATSAPPCANNEDANSWER"
+                  >
+                    <md-icon md-font-icon="icon-plus"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-toolbar
+                class="md-table-toolbar md-accent"
+                ng-show="vm_dc.selectedWhatsappAccountWhatsappCannedAnswers.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead"
+                    >{{vm_dc.selectedWhatsappAccountWhatsappCannedAnswers.length}}
+                    {{vm_dc.selectedWhatsappAccountWhatsappCannedAnswers.length
+                    > 1 ? 'items' : 'item'}} selected</span
+                  >
+                  <div flex></div>
+                  <button
+                    class="md-icon-button"
+                    ng-csv="vm_dc.exportSelectedWhatsappAccountWhatsappCannedAnswers"
+                    csv-label="true"
+                    filename="whatsappAccounts.csv"
+                  >
+                    <md-icon md-font-icon="icon-file-excel"></md-icon>
+                  </button>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canDelete"
+                    class="md-icon-button"
+                    ng-click="vm_dc.deleteSelectedWhatsappAccountWhatsappCannedAnswers($event)"
+                    aria-label="delete selected"
+                    translate
+                    translate-attr-label="WHATSAPP.DELETE_SELECTED"
+                  >
+                    <md-icon md-font-icon="icon-delete"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-table-container class="font-size-12">
+                <table
+                  md-table
+                  md-row-select
+                  multiple
+                  ng-model="vm_dc.selectedWhatsappAccountWhatsappCannedAnswers"
+                  md-progress="vm_dc.promise"
+                >
+                  <thead
+                    md-head
+                    md-order="vm_dc.query.sort"
+                    md-on-reorder="vm_dc.getWhatsappAccountWhatsappCannedAnswers"
+                  >
+                    <tr md-row>
+                      <th md-column md-order-by="id">
+                        {{ 'WHATSAPP.ID' | translate }}
+                      </th>
+                      <th md-column md-order-by="key">
+                        {{ 'WHATSAPP.KEY' | translate }}
+                      </th>
+                      <th md-column md-order-by="value">
+                        {{ 'WHATSAPP.VALUE' | translate }}
+                      </th>
+                      <th md-column md-order-by="description">
+                        {{ 'WHATSAPP.DESCRIPTION' | translate }}
+                      </th>
+                      <th md-column md-order-by="createdAt">
+                        {{ 'WHATSAPP.CREATED_AT' | translate }}
+                      </th>
+                      <th md-column width="10px"></th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr
+                      md-row
+                      md-select="whatsappCannedAnswer"
+                      md-select-id="id"
+                      ng-repeat="whatsappCannedAnswer in vm_dc.whatsappAccountWhatsappCannedAnswers.rows"
+                    >
+                      <td
+                        ng-click="vm_dc.createOrEditWhatsappAccountWhatsappCannedAnswer($event, whatsappCannedAnswer)"
+                        md-cell
+                      >
+                        {{whatsappCannedAnswer.id}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditWhatsappAccountWhatsappCannedAnswer($event, whatsappCannedAnswer)"
+                        md-cell
+                      >
+                        {{whatsappCannedAnswer.key}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditWhatsappAccountWhatsappCannedAnswer($event, whatsappCannedAnswer)"
+                        md-cell
+                      >
+                        {{whatsappCannedAnswer.value}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditWhatsappAccountWhatsappCannedAnswer($event, whatsappCannedAnswer)"
+                        md-cell
+                      >
+                        {{whatsappCannedAnswer.description}}
+                      </td>
+                      <td
+                        ng-click="vm_dc.createOrEditWhatsappAccountWhatsappCannedAnswer($event, whatsappCannedAnswer)"
+                        md-cell
+                      >
+                        {{ whatsappCannedAnswer.createdAt | formatdate }}
+                      </td>
+                      <td
+                        md-cell
+                        class="actions"
+                        ng-if="!vm_dc.crudPermissions.readOnly"
+                      >
+                        <md-menu>
+                          <md-button
+                            class="md-icon-button"
+                            aria-label="More"
+                            translate
+                            translate-attr-aria-label="WHATSAPP.MORE"
+                            ng-click="$mdOpenMenu($event)"
+                          >
+                            <md-icon
+                              md-font-icon="icon-dots-vertical"
+                            ></md-icon>
+                          </md-button>
+
+                          <md-menu-content width="3">
+                            <md-menu-item ng-if="vm_dc.crudPermissions.canEdit">
+                              <md-button
+                                ng-click="vm_dc.createOrEditWhatsappAccountWhatsappCannedAnswer($event, whatsappCannedAnswer)"
+                                translate="WHATSAPP.EDIT_WHATSAPPCANNEDANSWER"
+                              >
+                                Edit WhatsappCannedAnswer
+                              </md-button>
+                            </md-menu-item>
+                            <md-menu-item
+                              ng-if="vm_dc.crudPermissions.canDelete"
+                            >
+                              <md-button
+                                ng-click="vm_dc.deleteConfirm(whatsappCannedAnswer, $event)"
+                                translate="WHATSAPP.DELETE_WHATSAPPCANNEDANSWER"
+                              >
+                                Delete WhatsappCannedAnswer
+                              </md-button>
+                            </md-menu-item>
+                          </md-menu-content>
+                        </md-menu>
+                      </td>
+                    </tr>
+                    <tr
+                      md-row
+                      ng-if="!vm_dc.whatsappAccountWhatsappCannedAnswers.rows.length"
+                    >
+                      <td md-cell colspan="7">
+                        <div layout="row" layout-align="center center">
+                          <span
+                            class="text-boxed-light"
+                            translate="WHATSAPP.NO_WHATSAPPCANNEDANSWER_AVAILABLE"
+                            >No whatsappcannedanswer available</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+              <md-table-pagination
+                md-label="{page: '{{'WHATSAPP.PAGE' | translate}}:', rowsPerPage: '{{'WHATSAPP.ROWSPERPAGE' | translate}}:', of: '{{'WHATSAPP.OF' | translate}}'}"
+                md-limit="vm_dc.query.limit"
+                md-limit-options="[10, 15, 20, 50, 100, 250]"
+                md-page="vm_dc.query.page"
+                md-total="{{vm_dc.whatsappAccountWhatsappCannedAnswers.count}}"
+                md-on-paginate="vm_dc.getWhatsappAccountWhatsappCannedAnswers"
+                md-page-select
+              ></md-table-pagination>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="WHATSAPP.ACTIONS">ACTIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="whatsappAccount-detail-form-container actions md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="WhatsappAccountActionsController as vm_ac"
+              ng-init="vm_ac.init(vm.whatsappAccount, vm.crudPermissions)"
+              class="content"
+              md-background-bg
+              layout="row"
+              layout-align="start start"
+            >
+              <!-- SIDENAV -->
+              <div
+                class="navigation-simple sidenav main-sidenav md-background-bg md-whiteframe-1dp"
+                ms-scroll
+                layout="column"
+                flex="20"
+                ng-if="vm_ac.crudPermissions.canEdit"
+              >
+                <!-- SIDENAV CONTENT -->
+                <md-list class="no-padding">
+                  <md-subheader class="md-no-sticky">
+                    <span translate="VOICE.APPLICATIONS_LIST">
+                      Applications List
+                    </span>
+                  </md-subheader>
+                </md-list>
+                <md-divider></md-divider>
+                <md-list ng-sortable="vm_ac.list">
+                  <md-list-item class="handle" ng-repeat="a in vm_ac.apps">
+                    <md-icon md-font-icon="{{a.icon}}" class="s16"></md-icon>
+                    <p
+                      class="text-truncate"
+                      translate="WHATSAPP.{{(a.alias || a.appType) | uppercase}}"
+                    >
+                      {{a.alias || a.appType}}
+                    </p>
+                  </md-list-item>
+                </md-list>
+                <!-- / SIDENAV CONTENT -->
+              </div>
+              <!-- / SIDENAV -->
+              <div flex></div>
+              <!-- MAIN -->
+              <div
+                class="main scrollable md-background-bg md-whiteframe-1dp"
+                ms-scroll
+                layout="column"
+                flex="{{vm_ac.crudPermissions.canEdit ? 75 : 100}}"
+              >
+                <md-toolbar
+                  class="md-table-toolbar md-default"
+                  ng-hide="vm_ac.selectedWhatsappAccountApps.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead">Drag & Drop Routing</span>
+                    <div flex></div>
+                    <ms-search-bar
+                      on-search="vm_ac.query.filter = query"
+                      on-collapse="vm_ac.query.filter = undefined"
+                      debounce="300"
+                    ></ms-search-bar>
+                  </div>
+                </md-toolbar>
+                <md-toolbar
+                  class="md-table-toolbar md-accent"
+                  ng-show="vm_ac.selectedWhatsappAccountApps.length"
+                >
+                  <div class="md-toolbar-tools">
+                    <span class="md-subhead"
+                      >{{vm_ac.selectedWhatsappAccountApps.length}}
+                      {{vm_ac.selectedWhatsappAccountApps.length > 1 ? 'items' :
+                      'item'}} selected</span
+                    >
+                    <div flex></div>
+                    <md-button
+                      ng-if="vm_ac.crudPermissions.canDelete"
+                      class="md-icon-button"
+                      ng-click="vm_ac.deleteSelectedWhatsappAccountApps($event)"
+                      aria-label="delete selected"
+                      translate
+                      translate-attr-label="WHATSAPP.DELETE_SELECTED"
+                    >
+                      <md-icon md-font-icon="icon-delete"></md-icon>
+                    </md-button>
+                  </div>
+                </md-toolbar>
+
+                <!-- QUEUES TABLE -->
+                <md-table-container>
+                  <table
+                    md-table
+                    md-row-select
+                    multiple
+                    ng-model="vm_ac.selectedWhatsappAccountApps"
+                  >
+                    <thead md-head>
+                      <tr md-row>
+                        <th md-column width="10px"></th>
+                        <th md-column width="10px">
+                          <span translate="VOICE.PRIORITY">Priority</span>
+                        </th>
+                        <th md-column>
+                          <span>Type</span>
+                        </th>
+                        <th md-column>
+                          <span>Appdata</span>
+                        </th>
+                        <th md-column>
+                          <span>Interval</span>
+                        </th>
+                        <th md-column width="10px"></th>
+                        <th md-column width="10px"></th>
+                      </tr>
+                    </thead>
+                    <tbody md-body ng-sortable="vm_ac.applications">
+                      <tr
+                        md-row
+                        md-select="app"
+                        md-select-id="id"
+                        ng-repeat="app in vm_ac.whatsappAccountApps.rows | filter: vm_ac.query.filter"
+                      >
+                        <td md-cell>
+                          <md-icon
+                            md-font-icon="icon-drag-vertical"
+                            class="s16 handle"
+                          ></md-icon>
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editWhatsappAccountApp($event, $index)"
+                        >
+                          <span>{{app.priority}}</span>
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editWhatsappAccountApp($event, $index)"
+                        >
+                          {{app.app.toLowerCase() === 'agi' ? 'Cally-Square' :
+                          app.app | ucfirst}}<span
+                            ng-if="app.appType.toLowerCase() === 'custom'"
+                            >*</span
+                          >
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editWhatsappAccountApp($event, $index)"
+                        >
+                          <span class="text-truncate" style="width: 200px"
+                            >{{app.appdata}}</span
+                          >
+                        </td>
+                        <td
+                          md-cell
+                          ng-click="vm_ac.editInterval($event, $index)"
+                        >
+                          {{app.IntervalId ? 'From List' : app.interval}}
+                        </td>
+                        <td md-cell>
+                          <md-button
+                            ng-click="vm_ac.editInterval($event, $index)"
+                            class="md-icon-button"
+                            aria-label="Interval"
+                          >
+                            <md-icon md-font-icon="icon-timer"></md-icon>
+                            <md-tooltip>
+                              {{app.IntervalId ? 'From List' : (app.interval ===
+                              '*,*,*,*' ? 'Always' : 'Custom')}}
+                            </md-tooltip>
+                          </md-button>
+                        </td>
+                        <td
+                          md-cell
+                          class="actions"
+                          ng-if="!vm_ac.crudPermissions.readOnly"
+                        >
+                          <md-menu>
+                            <md-button
+                              class="md-icon-button"
+                              aria-label="More"
+                              translate
+                              translate-attr-aria-label="VOICE.MORE"
+                              ng-click="$mdOpenMenu($event)"
+                            >
+                              <md-icon
+                                md-font-icon="icon-dots-vertical"
+                              ></md-icon>
+                            </md-button>
+
+                            <md-menu-content width="3">
+                              <md-menu-item
+                                ng-if="vm_ac.crudPermissions.canEdit"
+                              >
+                                <md-button
+                                  ng-click="vm_ac.editWhatsappAccountApp($event, $index)"
+                                  translate="VOICE.EDIT_APP"
+                                >
+                                  Edit App
+                                </md-button>
+                              </md-menu-item>
+                              <md-menu-item
+                                ng-if="vm_ac.crudPermissions.canEdit"
+                              >
+                                <md-button
+                                  ng-click="vm_ac.editInterval($event, $index)"
+                                  translate="VOICE.EDIT_INTERVAL"
+                                >
+                                  Edit Interval
+                                </md-button>
+                              </md-menu-item>
+                              <md-menu-item
+                                ng-if="vm_ac.crudPermissions.canDelete"
+                              >
+                                <md-button
+                                  ng-click="vm_ac.deleteConfirm(app, $index, $event)"
+                                  translate="VOICE.DELETE_APP"
+                                >
+                                  Delete App
+                                </md-button>
+                              </md-menu-item>
+                            </md-menu-content>
+                          </md-menu>
+                        </td>
+                      </tr>
+                      <tr
+                        md-row
+                        ng-hide="vm_ac.whatsappAccountApps.rows.length"
+                      >
+                        <td md-cell colspan="7">
+                          <span
+                            class="text-boxed-light"
+                            translate="VOICE.NO_APPS_AVAILABLE"
+                            >No apps available</span
+                          >
+                        </td>
+                      </tr>
+                    </tbody>
+                  </table>
+                </md-table-container>
+                <!-- / QUEUES TABLE -->
+
+                <!-- NO RESULTS -->
+
+                <!-- / NO RESULTS -->
+              </div>
+              <!-- / MAIN -->
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+      <md-tab>
+        <md-tab-label>
+          <span translate="WHATSAPP.INTERACTIONS">INTERACTIONS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="whatsappAccount-detail-form-container interactions md-background-bg md-whiteframe-1dp"
+          >
+            <div
+              ng-controller="WhatsappAccountInteractionsController as vm_dc"
+              ng-init="vm_dc.init(vm.whatsappAccount, vm.crudPermissions)"
+            >
+              <md-toolbar
+                class="md-table-toolbar md-default"
+                ng-hide="vm_dc.selectedWhatsappAccountInteractions.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead" translate="WHATSAPP.INTERACTIONS"
+                    >Interactions</span
+                  >
+                  <ms-search-bar
+                    on-search="vm_dc.query.filter = query"
+                    on-collapse="vm_dc.query.filter = undefined"
+                    debounce="300"
+                    direction="down"
+                  ></ms-search-bar>
+                  <div flex></div>
+                  <ms-quick-filter
+                    filters="vm_dc.quickFilters"
+                    query="vm_dc.query"
+                    search="vm_dc.getWhatsappAccountInteractions()"
+                  ></ms-quick-filter>
+                  <div layout="column">
+                    <md-button
+                      class="md-icon-button advanced-search"
+                      ng-class="{ 'md-fab md-mini md-accent-bg': vm_dc.query.search }"
+                      aria-label="Filter"
+                      translate
+                      translate-attr-aria-label="DASHBOARDS.FILTER"
+                      ng-click="vm_dc.openAdvancedSearch()"
+                    >
+                      <md-icon
+                        md-font-icon="{{ vm_dc.query.search ? 'icon-filter' : 'icon-filter-outline' }}"
+                        ng-class="{ 'blink': vm_dc.query.search }"
+                      ></md-icon>
+                    </md-button>
+                  </div>
+                  <md-button
+                    class="md-icon-button"
+                    ng-click="vm_dc.getWhatsappAccountInteractions()"
+                    aria-label="refresh Interactions"
+                    translate
+                    translate-attr-label="WHATSAPP.REFRESH_INTERACTIONS"
+                  >
+                    <md-icon md-font-icon="icon-refresh"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-toolbar
+                class="md-table-toolbar md-accent"
+                ng-show="vm_dc.selectedWhatsappAccountInteractions.length"
+              >
+                <div class="md-toolbar-tools">
+                  <span class="md-subhead"
+                    >{{vm_dc.selectedWhatsappAccountInteractions.length}}
+                    {{vm_dc.selectedWhatsappAccountInteractions.length > 1 ?
+                    'items' : 'item'}} selected</span
+                  >
+                  <div flex></div>
+                  <button
+                    class="md-icon-button"
+                    ng-csv="vm_dc.exportSelectedWhatsappAccountInteractions"
+                    csv-label="true"
+                    filename="whatsappAccounts.csv"
+                  >
+                    <md-icon md-font-icon="icon-file-excel"></md-icon>
+                  </button>
+                  <md-button
+                    ng-if="vm_dc.crudPermissions.canDelete"
+                    class="md-icon-button"
+                    ng-click="vm_dc.deleteSelectedWhatsappAccountInteractions($event)"
+                    aria-label="delete selected"
+                    translate
+                    translate-attr-label="WHATSAPP.DELETE_SELECTED"
+                  >
+                    <md-icon md-font-icon="icon-delete"></md-icon>
+                  </md-button>
+                </div>
+              </md-toolbar>
+              <md-table-container class="font-size-12">
+                <table
+                  md-table
+                  md-row-select
+                  multiple
+                  ng-model="vm_dc.selectedWhatsappAccountInteractions"
+                  md-progress="vm_dc.promise"
+                >
+                  <thead
+                    md-head
+                    md-order="vm_dc.query.sort"
+                    md-on-reorder="vm_dc.getWhatsappAccountInteractions"
+                  >
+                    <tr md-row>
+                      <th md-column md-order-by="id">
+                        {{ 'WHATSAPP.ID' | translate }}
+                      </th>
+                      <th md-column class="no-padding">
+                        <md-icon md-font-icon="icon-eye" class="s16"></md-icon>
+                      </th>
+                      <th md-column class="no-padding"></th>
+                      <th md-column class="no-padding"></th>
+                      <th md-column>{{ 'WHATSAPP.CONTACT' | translate }}</th>
+                      <th md-column md-order-by="createdAt">
+                        {{ 'WHATSAPP.STARTEDAT' | translate }}
+                      </th>
+                      <th md-column md-order-by="lastMsgAt">
+                        {{ 'WHATSAPP.LASTMESSAGE' | translate }}
+                      </th>
+                      <th md-column md-order-by="closed">
+                        {{ 'WHATSAPP.STATUS' | translate }}
+                      </th>
+                      <th md-column>{{ 'WHATSAPP.AGENT' | translate }}</th>
+                      <th md-column md-order-by="tag">
+                        {{ 'WHATSAPP.TAGS' | translate }}
+                      </th>
+                      <th md-column width="10px"></th>
+                    </tr>
+                  </thead>
+                  <tbody md-body>
+                    <tr
+                      md-row
+                      md-select="interaction"
+                      md-select-id="id"
+                      ng-repeat="interaction in vm_dc.whatsappAccountInteractions.rows"
+                      ng-class="{'text-bold text-italic': interaction.unreadMessages > 0}"
+                    >
+                      <td md-cell>{{interaction.id}}</td>
+                      <td md-cell class="no-padding">
+                        <div
+                          ng-if="!interaction.closed && interaction.Users.length"
+                        >
+                          <md-icon
+                            md-font-icon="icon-eye"
+                            class="s16"
+                          ></md-icon>
+                          <md-tooltip>
+                            <span ng-repeat="user in interaction.Users"
+                              >{{ user.fullname | translate }}
+                              <span ng-if="!$last">, </span>
+                            </span>
+                          </md-tooltip>
+                        </div>
+                      </td>
+                      <td md-cell class="no-padding">
+                        <div
+                          ng-if="interaction.unreadMessages > 0"
+                          layout="row"
+                          layout-align="start center"
+                        >
+                          <span
+                            class="badge white-fg md-primary-bg"
+                            layout-margin
+                            >{{ interaction.unreadMessages}}</span
+                          >
+                        </div>
+                      </td>
+                      <td md-cell class="no-padding">
+                        <div ng-if="interaction.attach">
+                          <md-icon
+                            md-font-icon="icon-paperclip"
+                            class="s16"
+                          ></md-icon>
+                        </div>
+                      </td>
+                      <td md-cell>
+                        <div layout="column" layout-align="start start">
+                          <span
+                            class="font-size-12 text-truncate contact-text"
+                            ng-class="{'margin-bottom-0' : interaction.contactInfo}"
+                            layout-margin
+                            >{{ interaction.contactName }}</span
+                          >
+                          <span
+                            ng-if="interaction.contactInfo"
+                            class="font-size-12 text-truncate contact-text margin-top-0"
+                            layout-margin
+                            >{{ interaction.contactInfo }}</span
+                          >
+                        </div>
+                      </td>
+                      <td md-cell>{{ interaction.createdAt | formatdate }}</td>
+                      <td md-cell>
+                        <div layout="row">
+                          <span>
+                            <md-icon
+                              md-font-icon="{{interaction.lastMsgDirection == 'in' ? 'icon-arrow-down-bold blue-grey-800-fg' : 'icon-arrow-up-bold blue-grey-300-fg'}}"
+                            ></md-icon>
+                          </span>
+                          <div layout="column" layout-align="center center">
+                            <span class="text-truncate"
+                              >{{ interaction.lastMsgAt | formatdate }}</span
+                            >
+                          </div>
+                        </div>
+                      </td>
+                      <td md-cell>
+                        <span ng-if="interaction.closed === 0" class="green-fg">
+                          {{ 'WHATSAPP.OPENED' | translate }}
+                          <span ng-if="interaction.substatus">
+                            - {{ interaction.substatus }}
+                          </span>
+                        </span>
+                        <span ng-if="interaction.closed === 1" class="red-fg">
+                          {{ 'WHATSAPP.CLOSED' | translate }}
+                          <span ng-if="interaction.disposition">
+                            - {{ interaction.thirdDisposition ||
+                            interaction.secondDisposition ||
+                            interaction.disposition }}
+                          </span>
+                          <md-tooltip class="multiline">
+                            <div layout="column">
+                              <div layout="column">
+                                <span
+                                  >{{ 'DASHBOARDS.CLOSED_AT' |
+                                  translate}}:</span
+                                >
+                                <span class="text-bold"
+                                  >{{ interaction.closedAt | formatdate }}</span
+                                >
+                              </div>
+                              <div
+                                ng-if="interaction.disposition"
+                                layout="column"
+                              >
+                                <span
+                                  >{{ 'DASHBOARDS.DISPOSITION' |
+                                  translate}}:</span
+                                >
+                                <span class="text-bold"
+                                  >{{ interaction.disposition }}</span
+                                >
+                              </div>
+                              <div
+                                ng-if="interaction.secondDisposition"
+                                layout="column"
+                              >
+                                <span
+                                  >{{ 'DASHBOARDS.SECOND_LEVEL_DISPOSITION' |
+                                  translate}}:</span
+                                >
+                                <span class="text-bold"
+                                  >{{ interaction.secondDisposition }}</span
+                                >
+                              </div>
+                              <div
+                                ng-if="interaction.thirdDisposition"
+                                layout="column"
+                              >
+                                <span
+                                  >{{ 'DASHBOARDS.THIRD_LEVEL_DISPOSITION' |
+                                  translate}}:</span
+                                >
+                                <span class="text-bold"
+                                  >{{ interaction.thirdDisposition }}</span
+                                >
+                              </div>
+                            </div>
+                          </md-tooltip>
+                        </span>
+                      </td>
+
+                      <td md-cell>{{interaction.Owner.name}}</td>
+                      <td md-cell>
+                        <div ng-if="interaction.Tags.length">
+                          <md-tooltip md-direction="left" layout="row">
+                            <span ng-repeat="tag in interaction.Tags"
+                              >{{tag.name}}<span ng-if="!$last">, </span></span
+                            >
+                          </md-tooltip>
+                          <md-icon
+                            md-font-icon="icon-tag"
+                            ng-style="{'color': interaction.Tags.length == 1 && interaction.Tags[0].color }"
+                          >
+                          </md-icon>
+                        </div>
+                      </td>
+                      <td md-cell class="actions">
+                        <md-menu>
+                          <md-button
+                            class="md-icon-button"
+                            aria-label="More"
+                            translate
+                            translate-attr-aria-label="WHATSAPP.MORE"
+                            ng-click="$mdOpenMenu($event)"
+                          >
+                            <md-icon
+                              md-font-icon="icon-dots-vertical"
+                            ></md-icon>
+                          </md-button>
+
+                          <md-menu-content width="3">
+                            <md-menu-item>
+                              <md-button
+                                ng-click="vm_dc.spywhatsappInteraction($event, interaction)"
+                                translate="WHATSAPP.SPYINTERACTION"
+                              >
+                                Spy Interaction
+                              </md-button>
+                            </md-menu-item>
+                            <md-menu-item>
+                              <md-button
+                                class="md-primary"
+                                ng-click="vm_dc.whatsappInteractionDownload(interaction, $event)"
+                                translate="WHATSAPP.DOWNLOAD_INTERACTION"
+                              >
+                                Download
+                              </md-button>
+                            </md-menu-item>
+                            <md-menu-item
+                              ng-if="vm_dc.crudPermissions.canDelete"
+                            >
+                              <md-button
+                                ng-click="vm_dc.deleteConfirm(interaction, $event)"
+                                translate="WHATSAPP.DELETE_INTERACTION"
+                              >
+                                Delete Interaction
+                              </md-button>
+                            </md-menu-item>
+                          </md-menu-content>
+                        </md-menu>
+                      </td>
+                    </tr>
+                    <tr
+                      md-row
+                      ng-if="!vm_dc.whatsappAccountInteractions.rows.length"
+                    >
+                      <td md-cell colspan="12">
+                        <div layout="row" layout-align="center center">
+                          <span
+                            class="text-boxed-light"
+                            translate="WHATSAPP.NO_INTERACTION_AVAILABLE"
+                            >No interaction available</span
+                          >
+                        </div>
+                      </td>
+                    </tr>
+                  </tbody>
+                </table>
+              </md-table-container>
+              <md-table-pagination
+                md-label="{page: '{{'WHATSAPP.PAGE' | translate}}:', rowsPerPage: '{{'WHATSAPP.ROWSPERPAGE' | translate}}:', of: '{{'WHATSAPP.OF' | translate}}'}"
+                md-limit="vm_dc.query.limit"
+                md-limit-options="[10, 15, 20, 50, 100, 250]"
+                md-page="vm_dc.query.page"
+                md-total="{{vm_dc.whatsappAccountInteractions.count}}"
+                md-on-paginate="vm_dc.getWhatsappAccountInteractions"
+                md-page-select
+              ></md-table-pagination>
+            </div>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/whatsappCannedAnswers/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/whatsappCannedAnswers/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 1683531..0000000
--- a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/whatsappCannedAnswers/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,178 +0,0 @@
-<md-dialog
-  class="whatsappCannedAnswer-dialog"
-  aria-label="New WhatsappCannedAnswer"
->
-  <form name="whatsappCannedAnswerForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.KEY">Key</label>
-        <input
-          type=""
-          name="key"
-          ng-model="vm.whatsappCannedAnswer.key"
-          md-maxlength="255"
-          ng-required="true"
-          autofocus
-        />
-
-        <div
-          ng-messages="whatsappCannedAnswerForm['key'].$error"
-          ng-show="whatsappCannedAnswerForm['key'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.KEY_REQUIRED"
-              >Key field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.VALUE">Value</label>
-        <textarea
-          name="value"
-          ng-model="vm.whatsappCannedAnswer.value"
-          required
-        ></textarea>
-
-        <div
-          ng-messages="whatsappCannedAnswerForm['value'].$error"
-          ng-show="whatsappCannedAnswerForm['value'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.VALUE_REQUIRED"
-              >Value field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.whatsappCannedAnswer.description"
-        />
-
-        <div
-          ng-messages="whatsappCannedAnswerForm['description'].$error"
-          ng-show="whatsappCannedAnswerForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newWhatsappCannedAnswer"
-          ng-click="vm.saveWhatsappCannedAnswer()"
-          class="send-button md-accent md-raised"
-          ng-disabled="whatsappCannedAnswerForm.$invalid || whatsappCannedAnswerForm.$pristine"
-          aria-label="SAVE"
-          translate="WHATSAPP.SAVE"
-          translate-attr-aria-label="WHATSAPP.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newWhatsappCannedAnswer"
-          ng-click="vm.addNewWhatsappCannedAnswer()"
-          class="send-button md-accent md-raised"
-          ng-disabled="whatsappCannedAnswerForm.$invalid"
-          aria-label="ADD"
-          translate="WHATSAPP.ADD_WHATSAPPCANNEDANSWER"
-          translate-attr-aria-label="WHATSAPP.ADD_WHATSAPPCANNEDANSWER"
-        >
-          ADD WHATSAPPCANNEDANSWER
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newWhatsappCannedAnswer"
-          ng-click="vm.deleteWhatsappCannedAnswer($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="WHATSAPP.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="WHATSAPP.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/whatsappCannedAnswers/dialog.html/dialog.html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/whatsappCannedAnswers/dialog.html/dialog.html
new file mode 100644
index 0000000..1683531
--- /dev/null
+++ b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/edit/whatsappCannedAnswers/dialog.html/dialog.html
@@ -0,0 +1,178 @@
+<md-dialog
+  class="whatsappCannedAnswer-dialog"
+  aria-label="New WhatsappCannedAnswer"
+>
+  <form name="whatsappCannedAnswerForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.KEY">Key</label>
+        <input
+          type=""
+          name="key"
+          ng-model="vm.whatsappCannedAnswer.key"
+          md-maxlength="255"
+          ng-required="true"
+          autofocus
+        />
+
+        <div
+          ng-messages="whatsappCannedAnswerForm['key'].$error"
+          ng-show="whatsappCannedAnswerForm['key'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.KEY_REQUIRED"
+              >Key field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.VALUE">Value</label>
+        <textarea
+          name="value"
+          ng-model="vm.whatsappCannedAnswer.value"
+          required
+        ></textarea>
+
+        <div
+          ng-messages="whatsappCannedAnswerForm['value'].$error"
+          ng-show="whatsappCannedAnswerForm['value'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.VALUE_REQUIRED"
+              >Value field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.whatsappCannedAnswer.description"
+        />
+
+        <div
+          ng-messages="whatsappCannedAnswerForm['description'].$error"
+          ng-show="whatsappCannedAnswerForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newWhatsappCannedAnswer"
+          ng-click="vm.saveWhatsappCannedAnswer()"
+          class="send-button md-accent md-raised"
+          ng-disabled="whatsappCannedAnswerForm.$invalid || whatsappCannedAnswerForm.$pristine"
+          aria-label="SAVE"
+          translate="WHATSAPP.SAVE"
+          translate-attr-aria-label="WHATSAPP.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newWhatsappCannedAnswer"
+          ng-click="vm.addNewWhatsappCannedAnswer()"
+          class="send-button md-accent md-raised"
+          ng-disabled="whatsappCannedAnswerForm.$invalid"
+          aria-label="ADD"
+          translate="WHATSAPP.ADD_WHATSAPPCANNEDANSWER"
+          translate-attr-aria-label="WHATSAPP.ADD_WHATSAPPCANNEDANSWER"
+        >
+          ADD WHATSAPPCANNEDANSWER
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newWhatsappCannedAnswer"
+          ng-click="vm.deleteWhatsappCannedAnswer($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="WHATSAPP.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="WHATSAPP.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/whatsappAccounts.html/whatsappAccounts-[chunkhash].html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/whatsappAccounts.html/whatsappAccounts-[chunkhash].html
deleted file mode 100644
index 3211cb2..0000000
--- a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/whatsappAccounts.html/whatsappAccounts-[chunkhash].html
+++ /dev/null
@@ -1,367 +0,0 @@
-<div
-  id="whatsappAccounts"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-whatsapp" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="WHATSAPP.WHATSAPPACCOUNTS"
-          >WhatsappAccounts</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="WHATSAPP.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedWhatsappAccounts.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div
-      class="close-button-wrapper"
-      ng-click="vm.selectedWhatsappAccounts =[]"
-    >
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="WHATSAPP.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-whatsappAccounts-count">
-          <span>{{vm.selectedWhatsappAccounts.length}}</span>
-          <span translate="WHATSAPP.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="WHATSAPP.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllWhatsappAccounts()"
-                translate="WHATSAPP.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectWhatsappAccounts()"
-                translate="WHATSAPP.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedWhatsappAccounts"
-          csv-label="true"
-          filename="whatsappAccounts.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedWhatsappAccounts($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="WHATSAPP.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- WHATSAPPACCOUNT TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedWhatsappAccounts"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getWhatsappAccounts"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">
-                  {{ 'WHATSAPP.ID' | translate }}
-                </th>
-                <th md-column md-order-by="name">
-                  {{ 'WHATSAPP.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="key">
-                  {{ 'WHATSAPP.KEY' | translate }}
-                </th>
-                <th md-column md-order-by="ListId">
-                  {{ 'WHATSAPP.LIST' | translate }}
-                </th>
-                <th md-column md-order-by="type">
-                  {{ 'WHATSAPP.TYPE' | translate }}
-                </th>
-                <th md-column md-order-by="phone">
-                  {{ 'WHATSAPP.PHONE' | translate }}
-                </th>
-                <th md-column md-order-by="description">
-                  {{ 'WHATSAPP.DESCRIPTION' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.whatsappAccounts.rows.length">
-                <td md-cell colspan="8">
-                  <div layout="row" layout-align="center center">
-                    <span translate="WHATSAPP.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="whatsappAccount"
-                md-select-id="id"
-                ng-repeat="whatsappAccount in vm.whatsappAccounts.rows"
-              >
-                <td md-cell ng-if="whatsappAccount.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{whatsappAccount.name}}"
-                    ng-src="api/users/{{whatsappAccount.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!whatsappAccount.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{whatsappAccount.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(whatsappAccount, ev) : vm.createOrEditWhatsappAccount($event, whatsappAccount)"
-                  md-cell
-                  class="id"
-                >
-                  {{whatsappAccount.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(whatsappAccount, ev) : vm.createOrEditWhatsappAccount($event, whatsappAccount)"
-                  md-cell
-                  class="name"
-                >
-                  {{whatsappAccount.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(whatsappAccount, ev) : vm.createOrEditWhatsappAccount($event, whatsappAccount)"
-                  md-cell
-                  class="key"
-                >
-                  {{whatsappAccount.key}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(whatsappAccount, ev) : vm.createOrEditWhatsappAccount($event, whatsappAccount)"
-                  md-cell
-                  class="ListId"
-                >
-                  {{ (vm.lists | filter : {'id':whatsappAccount.ListId} :
-                  true)[0].name }}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(whatsappAccount, ev) : vm.createOrEditWhatsappAccount($event, whatsappAccount)"
-                  md-cell
-                  class="type"
-                >
-                  {{ vm.arraytype[whatsappAccount.type].option }}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(whatsappAccount, ev) : vm.createOrEditWhatsappAccount($event, whatsappAccount)"
-                  md-cell
-                  class="phone"
-                >
-                  {{whatsappAccount.phone}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(whatsappAccount, ev) : vm.createOrEditWhatsappAccount($event, whatsappAccount)"
-                  md-cell
-                  class="description"
-                >
-                  {{whatsappAccount.description}}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="WHATSAPP.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(whatsappAccount, $event    )"
-                          translate="WHATSAPP.EDIT_WHATSAPPACCOUNT"
-                        >
-                          Edit WhatsappAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.interactionsgoto(whatsappAccount, $event    )"
-                          translate="WHATSAPP.INTERACTIONS_WHATSAPPACCOUNT"
-                        >
-                          Interactions WhatsappAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.agentadddialog(whatsappAccount, $event    )"
-                          translate="WHATSAPP.AGENTADD_WHATSAPPACCOUNT"
-                        >
-                          AgentAdd WhatsappAccount
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(whatsappAccount, $event    )"
-                          translate="WHATSAPP.DELETE_WHATSAPPACCOUNT"
-                        >
-                          Delete WhatsappAccount
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'WHATSAPP.PAGE' | translate}}:', rowsPerPage: '{{'WHATSAPP.ROWSPERPAGE' | translate}}:', of: '{{'WHATSAPP.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.whatsappAccounts.count}}"
-          md-on-paginate="vm.getWhatsappAccounts"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / WHATSAPPACCOUNT TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD WHATSAPPACCOUNT BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-whatsappAccount-button"
-    ng-click="vm.createOrEditWhatsappAccount($event)"
-    aria-label="add whatsappAccount"
-    translate
-    translate-attr-aria-label="WHATSAPP.ADD_WHATSAPPACCOUNT"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD WHATSAPPACCOUNT BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/whatsappAccounts.html/whatsappAccounts.html b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/whatsappAccounts.html/whatsappAccounts.html
new file mode 100644
index 0000000..3211cb2
--- /dev/null
+++ b/public/src/js/modules/main/apps/whatsapp/views/whatsappAccounts/whatsappAccounts.html/whatsappAccounts.html
@@ -0,0 +1,367 @@
+<div
+  id="whatsappAccounts"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-whatsapp" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="WHATSAPP.WHATSAPPACCOUNTS"
+          >WhatsappAccounts</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="WHATSAPP.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedWhatsappAccounts.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div
+      class="close-button-wrapper"
+      ng-click="vm.selectedWhatsappAccounts =[]"
+    >
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="WHATSAPP.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-whatsappAccounts-count">
+          <span>{{vm.selectedWhatsappAccounts.length}}</span>
+          <span translate="WHATSAPP.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="WHATSAPP.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllWhatsappAccounts()"
+                translate="WHATSAPP.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectWhatsappAccounts()"
+                translate="WHATSAPP.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedWhatsappAccounts"
+          csv-label="true"
+          filename="whatsappAccounts.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedWhatsappAccounts($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="WHATSAPP.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- WHATSAPPACCOUNT TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedWhatsappAccounts"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getWhatsappAccounts"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">
+                  {{ 'WHATSAPP.ID' | translate }}
+                </th>
+                <th md-column md-order-by="name">
+                  {{ 'WHATSAPP.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="key">
+                  {{ 'WHATSAPP.KEY' | translate }}
+                </th>
+                <th md-column md-order-by="ListId">
+                  {{ 'WHATSAPP.LIST' | translate }}
+                </th>
+                <th md-column md-order-by="type">
+                  {{ 'WHATSAPP.TYPE' | translate }}
+                </th>
+                <th md-column md-order-by="phone">
+                  {{ 'WHATSAPP.PHONE' | translate }}
+                </th>
+                <th md-column md-order-by="description">
+                  {{ 'WHATSAPP.DESCRIPTION' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.whatsappAccounts.rows.length">
+                <td md-cell colspan="8">
+                  <div layout="row" layout-align="center center">
+                    <span translate="WHATSAPP.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="whatsappAccount"
+                md-select-id="id"
+                ng-repeat="whatsappAccount in vm.whatsappAccounts.rows"
+              >
+                <td md-cell ng-if="whatsappAccount.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{whatsappAccount.name}}"
+                    ng-src="api/users/{{whatsappAccount.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!whatsappAccount.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{whatsappAccount.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(whatsappAccount, ev) : vm.createOrEditWhatsappAccount($event, whatsappAccount)"
+                  md-cell
+                  class="id"
+                >
+                  {{whatsappAccount.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(whatsappAccount, ev) : vm.createOrEditWhatsappAccount($event, whatsappAccount)"
+                  md-cell
+                  class="name"
+                >
+                  {{whatsappAccount.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(whatsappAccount, ev) : vm.createOrEditWhatsappAccount($event, whatsappAccount)"
+                  md-cell
+                  class="key"
+                >
+                  {{whatsappAccount.key}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(whatsappAccount, ev) : vm.createOrEditWhatsappAccount($event, whatsappAccount)"
+                  md-cell
+                  class="ListId"
+                >
+                  {{ (vm.lists | filter : {'id':whatsappAccount.ListId} :
+                  true)[0].name }}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(whatsappAccount, ev) : vm.createOrEditWhatsappAccount($event, whatsappAccount)"
+                  md-cell
+                  class="type"
+                >
+                  {{ vm.arraytype[whatsappAccount.type].option }}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(whatsappAccount, ev) : vm.createOrEditWhatsappAccount($event, whatsappAccount)"
+                  md-cell
+                  class="phone"
+                >
+                  {{whatsappAccount.phone}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(whatsappAccount, ev) : vm.createOrEditWhatsappAccount($event, whatsappAccount)"
+                  md-cell
+                  class="description"
+                >
+                  {{whatsappAccount.description}}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="WHATSAPP.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(whatsappAccount, $event    )"
+                          translate="WHATSAPP.EDIT_WHATSAPPACCOUNT"
+                        >
+                          Edit WhatsappAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.interactionsgoto(whatsappAccount, $event    )"
+                          translate="WHATSAPP.INTERACTIONS_WHATSAPPACCOUNT"
+                        >
+                          Interactions WhatsappAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.agentadddialog(whatsappAccount, $event    )"
+                          translate="WHATSAPP.AGENTADD_WHATSAPPACCOUNT"
+                        >
+                          AgentAdd WhatsappAccount
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(whatsappAccount, $event    )"
+                          translate="WHATSAPP.DELETE_WHATSAPPACCOUNT"
+                        >
+                          Delete WhatsappAccount
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'WHATSAPP.PAGE' | translate}}:', rowsPerPage: '{{'WHATSAPP.ROWSPERPAGE' | translate}}:', of: '{{'WHATSAPP.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.whatsappAccounts.count}}"
+          md-on-paginate="vm.getWhatsappAccounts"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / WHATSAPPACCOUNT TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD WHATSAPPACCOUNT BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-whatsappAccount-button"
+    ng-click="vm.createOrEditWhatsappAccount($event)"
+    aria-label="add whatsappAccount"
+    translate
+    translate-attr-aria-label="WHATSAPP.ADD_WHATSAPPACCOUNT"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD WHATSAPPACCOUNT BUTTON -->
+</div>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 05de3cd..0000000
--- a/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,223 +0,0 @@
-<md-dialog class="whatsappQueue-dialog" aria-label="New WhatsappQueue">
-  <form name="whatsappQueueForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.whatsappQueue.name"
-          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-          ng-required="true"
-          autofocus
-          ng-disabled="!vm.newWhatsappQueue"
-        />
-
-        <div class="hint"><span translate="WHATSAPP.HELP.NAME"></span></div>
-        <div
-          ng-messages="whatsappQueueForm['name'].$error"
-          ng-show="whatsappQueueForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span
-              translate="WHATSAPP.ERRORS.NAME_MUST_VALID_PATTERN"
-              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-              >Name must be valid pattern
-            </span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.STRATEGY">Strategy</label>
-        <md-select
-          name="strategy"
-          ng-model="vm.whatsappQueue.strategy"
-          required
-        >
-          <md-option ng-value="'beepall'">Beepall</md-option>
-          <md-option ng-value="'rrmemory'">RR Memory</md-option>
-        </md-select>
-        <div
-          ng-messages="whatsappQueueForm['strategy'].$error"
-          ng-show="whatsappQueueForm['strategy'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.STRATEGY_REQUIRED"
-              >Strategy field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.AGENT_TIMEOUT">Agent_Timeout</label>
-        <input
-          type="number"
-          name="timeout"
-          ng-model="vm.whatsappQueue.timeout"
-          min="1"
-          max="2147483"
-          ng-required="true"
-        />
-
-        <div
-          ng-messages="whatsappQueueForm['timeout'].$error"
-          ng-show="whatsappQueueForm['timeout'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.AGENT_TIMEOUT_REQUIRED"
-              >Agent_Timeout field is required</span
-            >
-          </div>
-          <div ng-message="min">
-            <span
-              translate="WHATSAPP.ERRORS.AGENT_TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-              >Agent_Timeout must be a valid greater or equal than</span
-            >
-            <span>1</span>
-          </div>
-          <div ng-message="max">
-            <span
-              translate="WHATSAPP.ERRORS.AGENT_TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-              >Agent_Timeout must be a valid greater or equal than</span
-            >
-            <span>2147483</span>
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="WHATSAPP.DESCRIPTION">Description</label>
-        <input
-          type="text"
-          name="description"
-          ng-model="vm.whatsappQueue.description"
-        />
-
-        <div
-          ng-messages="whatsappQueueForm['description'].$error"
-          ng-show="whatsappQueueForm['description'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="WHATSAPP.ERRORS.DESCRIPTION_REQUIRED"
-              >Description field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions
-      layout="row"
-      layout-align="space-between center"
-      ng-if="!vm.crudPermissions.readOnly"
-    >
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && !vm.newWhatsappQueue"
-          ng-click="vm.saveWhatsappQueue()"
-          class="send-button md-accent md-raised"
-          ng-disabled="whatsappQueueForm.$invalid || whatsappQueueForm.$pristine"
-          aria-label="SAVE"
-          translate="WHATSAPP.SAVE"
-          translate-attr-aria-label="WHATSAPP.SAVE"
-        >
-          SAVE
-        </md-button>
-
-        <md-button
-          type="submit"
-          ng-if="vm.crudPermissions.canEdit && vm.newWhatsappQueue"
-          ng-click="vm.addNewWhatsappQueue()"
-          class="send-button md-accent md-raised"
-          ng-disabled="whatsappQueueForm.$invalid"
-          aria-label="ADD"
-          translate="WHATSAPP.ADD_WHATSAPPQUEUE"
-          translate-attr-aria-label="WHATSAPP.ADD_WHATSAPPQUEUE"
-        >
-          ADD WHATSAPPQUEUE
-        </md-button>
-      </div>
-      <div layout="row">
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete && !vm.newWhatsappQueue"
-          ng-click="vm.deleteWhatsappQueue($event)"
-          aria-label="DELETE"
-          translate
-          translate-attr-aria-label="WHATSAPP.DELETE"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-          <md-tooltip
-            ><span translate="WHATSAPP.DELETE">DELETE</span></md-tooltip
-          >
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/create/dialog.html/dialog.html b/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/create/dialog.html/dialog.html
new file mode 100644
index 0000000..05de3cd
--- /dev/null
+++ b/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/create/dialog.html/dialog.html
@@ -0,0 +1,223 @@
+<md-dialog class="whatsappQueue-dialog" aria-label="New WhatsappQueue">
+  <form name="whatsappQueueForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.whatsappQueue.name"
+          ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+          ng-required="true"
+          autofocus
+          ng-disabled="!vm.newWhatsappQueue"
+        />
+
+        <div class="hint"><span translate="WHATSAPP.HELP.NAME"></span></div>
+        <div
+          ng-messages="whatsappQueueForm['name'].$error"
+          ng-show="whatsappQueueForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span
+              translate="WHATSAPP.ERRORS.NAME_MUST_VALID_PATTERN"
+              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+              >Name must be valid pattern
+            </span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.STRATEGY">Strategy</label>
+        <md-select
+          name="strategy"
+          ng-model="vm.whatsappQueue.strategy"
+          required
+        >
+          <md-option ng-value="'beepall'">Beepall</md-option>
+          <md-option ng-value="'rrmemory'">RR Memory</md-option>
+        </md-select>
+        <div
+          ng-messages="whatsappQueueForm['strategy'].$error"
+          ng-show="whatsappQueueForm['strategy'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.STRATEGY_REQUIRED"
+              >Strategy field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.AGENT_TIMEOUT">Agent_Timeout</label>
+        <input
+          type="number"
+          name="timeout"
+          ng-model="vm.whatsappQueue.timeout"
+          min="1"
+          max="2147483"
+          ng-required="true"
+        />
+
+        <div
+          ng-messages="whatsappQueueForm['timeout'].$error"
+          ng-show="whatsappQueueForm['timeout'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.AGENT_TIMEOUT_REQUIRED"
+              >Agent_Timeout field is required</span
+            >
+          </div>
+          <div ng-message="min">
+            <span
+              translate="WHATSAPP.ERRORS.AGENT_TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+              >Agent_Timeout must be a valid greater or equal than</span
+            >
+            <span>1</span>
+          </div>
+          <div ng-message="max">
+            <span
+              translate="WHATSAPP.ERRORS.AGENT_TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+              >Agent_Timeout must be a valid greater or equal than</span
+            >
+            <span>2147483</span>
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="WHATSAPP.DESCRIPTION">Description</label>
+        <input
+          type="text"
+          name="description"
+          ng-model="vm.whatsappQueue.description"
+        />
+
+        <div
+          ng-messages="whatsappQueueForm['description'].$error"
+          ng-show="whatsappQueueForm['description'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="WHATSAPP.ERRORS.DESCRIPTION_REQUIRED"
+              >Description field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions
+      layout="row"
+      layout-align="space-between center"
+      ng-if="!vm.crudPermissions.readOnly"
+    >
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && !vm.newWhatsappQueue"
+          ng-click="vm.saveWhatsappQueue()"
+          class="send-button md-accent md-raised"
+          ng-disabled="whatsappQueueForm.$invalid || whatsappQueueForm.$pristine"
+          aria-label="SAVE"
+          translate="WHATSAPP.SAVE"
+          translate-attr-aria-label="WHATSAPP.SAVE"
+        >
+          SAVE
+        </md-button>
+
+        <md-button
+          type="submit"
+          ng-if="vm.crudPermissions.canEdit && vm.newWhatsappQueue"
+          ng-click="vm.addNewWhatsappQueue()"
+          class="send-button md-accent md-raised"
+          ng-disabled="whatsappQueueForm.$invalid"
+          aria-label="ADD"
+          translate="WHATSAPP.ADD_WHATSAPPQUEUE"
+          translate-attr-aria-label="WHATSAPP.ADD_WHATSAPPQUEUE"
+        >
+          ADD WHATSAPPQUEUE
+        </md-button>
+      </div>
+      <div layout="row">
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete && !vm.newWhatsappQueue"
+          ng-click="vm.deleteWhatsappQueue($event)"
+          aria-label="DELETE"
+          translate
+          translate-attr-aria-label="WHATSAPP.DELETE"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+          <md-tooltip
+            ><span translate="WHATSAPP.DELETE">DELETE</span></md-tooltip
+          >
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/edit/agentadd/agentadd.html/agentadd-[chunkhash].html b/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
deleted file mode 100644
index 4992c68..0000000
--- a/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/edit/agentadd/agentadd.html/agentadd-[chunkhash].html
+++ /dev/null
@@ -1,46 +0,0 @@
-<md-dialog
-  class="whatsappQueue-dialog"
-  aria-label="whatsappQueue"
-  ng-init="vm.onInit()"
->
-  <form name="whatsappQueueForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="WHATSAPP.AGENTADD_WHATSAPPQUEUE">
-          Add Agent to whatsappQueue
-        </h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <ms-dual-multiselect
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveAgents()"
-        class="send-button md-accent md-raised"
-        ng-disabled="!vm.pendingChanges"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/edit/agentadd/agentadd.html/agentadd.html b/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/edit/agentadd/agentadd.html/agentadd.html
new file mode 100644
index 0000000..4992c68
--- /dev/null
+++ b/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/edit/agentadd/agentadd.html/agentadd.html
@@ -0,0 +1,46 @@
+<md-dialog
+  class="whatsappQueue-dialog"
+  aria-label="whatsappQueue"
+  ng-init="vm.onInit()"
+>
+  <form name="whatsappQueueForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="WHATSAPP.AGENTADD_WHATSAPPQUEUE">
+          Add Agent to whatsappQueue
+        </h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <ms-dual-multiselect
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveAgents()"
+        class="send-button md-accent md-raised"
+        ng-disabled="!vm.pendingChanges"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/edit/teamadd/teamadd.html/teamadd-[chunkhash].html b/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/edit/teamadd/teamadd.html/teamadd-[chunkhash].html
deleted file mode 100644
index 3b52a7c..0000000
--- a/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/edit/teamadd/teamadd.html/teamadd-[chunkhash].html
+++ /dev/null
@@ -1,44 +0,0 @@
-<md-dialog
-  class="whatsappQueue-dialog"
-  aria-label="whatsappQueue"
-  ng-init="vm.onInit()"
->
-  <form name="whatsappQueueForm" ng-cloak>
-    <md-toolbar>
-      <div class="md-toolbar-tools">
-        <h2 translate="WHATSAPP.TEAMS_ASSOCIATION">Teams Association</h2>
-        <span flex></span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content>
-      <ms-dual-multiselect
-        options="vm.dualMultiselectOptions"
-      ></ms-dual-multiselect>
-    </md-dialog-content>
-    <md-dialog-actions
-      layout="row"
-      layout-align="end center"
-      ng-if="vm.crudPermissions.canEdit"
-    >
-      <span></span>
-      <md-button
-        layout-align="end center"
-        type="submit"
-        ng-click="vm.saveTeams()"
-        ng-disabled="!vm.pendingChanges"
-        class="send-button md-accent md-raised"
-        aria-label="SAVE"
-        translate="STAFF.SAVE"
-        translate-attr-aria-label="STAFF.SAVE"
-      >
-        SAVE
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/edit/teamadd/teamadd.html/teamadd.html b/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/edit/teamadd/teamadd.html/teamadd.html
new file mode 100644
index 0000000..3b52a7c
--- /dev/null
+++ b/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/edit/teamadd/teamadd.html/teamadd.html
@@ -0,0 +1,44 @@
+<md-dialog
+  class="whatsappQueue-dialog"
+  aria-label="whatsappQueue"
+  ng-init="vm.onInit()"
+>
+  <form name="whatsappQueueForm" ng-cloak>
+    <md-toolbar>
+      <div class="md-toolbar-tools">
+        <h2 translate="WHATSAPP.TEAMS_ASSOCIATION">Teams Association</h2>
+        <span flex></span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content>
+      <ms-dual-multiselect
+        options="vm.dualMultiselectOptions"
+      ></ms-dual-multiselect>
+    </md-dialog-content>
+    <md-dialog-actions
+      layout="row"
+      layout-align="end center"
+      ng-if="vm.crudPermissions.canEdit"
+    >
+      <span></span>
+      <md-button
+        layout-align="end center"
+        type="submit"
+        ng-click="vm.saveTeams()"
+        ng-disabled="!vm.pendingChanges"
+        class="send-button md-accent md-raised"
+        aria-label="SAVE"
+        translate="STAFF.SAVE"
+        translate-attr-aria-label="STAFF.SAVE"
+      >
+        SAVE
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/edit/view.html/view-[chunkhash].html b/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/edit/view.html/view-[chunkhash].html
deleted file mode 100644
index 1dff660..0000000
--- a/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/edit/view.html/view-[chunkhash].html
+++ /dev/null
@@ -1,224 +0,0 @@
-<div
-  id="whatsapp-whatsappQueue"
-  class="page-layout simple tabbed"
-  layout="column"
->
-  <!-- HEADER -->
-  <div class="header md-accent-bg" layout="row" layout-align="start center">
-    <div class="white-fg" layout="row" layout-align="start center" flex>
-      <md-button
-        class="goto-whatsappQueues-button md-icon-button"
-        aria-label="Go to whatsappQueues"
-        ng-click="vm.gotoWhatsappQueues()"
-        translate
-        translate-attr-aria-label="WHATSAPP.GO_TO_WHATSAPPQUEUES"
-      >
-        <md-icon md-font-icon="icon-arrow-left"></md-icon>
-      </md-button>
-
-      <div layout="row" layout-align="start center">
-        <div class="whatsappQueue-image" hide-xs>
-          <img ng-src="assets/images/business/whatsappQueues.jpg" />
-        </div>
-
-        <div layout="column" layout-align="start start">
-          <div class="h2">
-            #{{vm.whatsappQueue.id}}
-            <span ng-if="vm.whatsappQueue.name">{{vm.whatsappQueue.name}}</span>
-          </div>
-          <div class="subtitle secondary-text">
-            <span translate="WHATSAPP.CREATED_AT"></span>
-            <span>{{vm.whatsappQueue.createdAt | date:'medium'}}</span>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.teamadddialog(vm.whatsappQueue, $event)"
-        class="md-fab md-orange-500-bg md-icon-button"
-        aria-label="teamadd"
-      >
-        <md-tooltip
-          ><span translate="WHATSAPP.TEAMADD_WHATSAPPQUEUE"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
-      </md-button>
-    </div>
-
-    <div ng-cloak>
-      <md-button
-        ng-click="vm.agentadddialog(vm.whatsappQueue, $event)"
-        class="md-fab md-purple-500-bg md-icon-button"
-        aria-label="agentadd"
-      >
-        <md-tooltip
-          ><span translate="WHATSAPP.AGENTADD_WHATSAPPQUEUE"></span
-        ></md-tooltip>
-        <md-icon md-font-icon="icon-account-plus"></md-icon>
-      </md-button>
-    </div>
-    <div>
-      <md-button
-        type="submit"
-        ng-click="vm.saveWhatsappQueue()"
-        ng-if="vm.crudPermissions.canEdit"
-        class="send-button md-accent md-raised"
-        ng-disabled="(generalForm.$invalid)"
-        translate="WHATSAPP.SAVE"
-        translate-attr-aria-label="WHATSAPP.SAVE"
-      >
-        SAVE
-      </md-button>
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- CONTENT -->
-  <div class="content">
-    <md-tabs
-      md-selected="vm.selectedTab"
-      md-stretch-tabs="always"
-      flex
-      layout-fill
-      md-dynamic-height
-    >
-      <md-tab>
-        <md-tab-label>
-          <span translate="WHATSAPP.SETTINGS">SETTINGS</span>
-        </md-tab-label>
-        <md-tab-body>
-          <div
-            class="whatsappQueue-detail-form-container general md-background-bg md-whiteframe-1dp"
-          >
-            <div class="pb-16" layout="row" layout-align="start center">
-              <div class="h2 secondary-text" translate="WHATSAPP.GENERAL">
-                GENERAL
-              </div>
-            </div>
-            <form name="generalForm" novalidate>
-              <md-input-container class="md-block">
-                <label translate="WHATSAPP.NAME">Name</label>
-                <input
-                  type="text"
-                  name="name"
-                  ng-model="vm.whatsappQueue.name"
-                  ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
-                  ng-required="true"
-                  autofocus
-                  disabled
-                />
-
-                <div class="hint">
-                  <span translate="WHATSAPP.HELP.NAME"></span>
-                </div>
-                <div
-                  ng-messages="generalForm['name'].$error"
-                  ng-show="generalForm['name'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="WHATSAPP.ERRORS.NAME_REQUIRED"
-                      >Name field is required</span
-                    >
-                  </div>
-                  <div ng-message="pattern">
-                    <span
-                      translate="WHATSAPP.ERRORS.NAME_MUST_VALID_PATTERN"
-                      translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-                      >Name must be valid pattern
-                    </span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="WHATSAPP.STRATEGY">Strategy</label>
-                <md-select
-                  name="strategy"
-                  ng-model="vm.whatsappQueue.strategy"
-                  required
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                >
-                  <md-option ng-value="'beepall'">Beepall</md-option>
-                  <md-option ng-value="'rrmemory'">RR Memory</md-option>
-                </md-select>
-                <div
-                  ng-messages="generalForm['strategy'].$error"
-                  ng-show="generalForm['strategy'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="WHATSAPP.ERRORS.STRATEGY_REQUIRED"
-                      >Strategy field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="WHATSAPP.AGENT_TIMEOUT">Agent_Timeout</label>
-                <input
-                  type="number"
-                  name="timeout"
-                  ng-model="vm.whatsappQueue.timeout"
-                  min="1"
-                  max="2147483"
-                  ng-required="true"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['timeout'].$error"
-                  ng-show="generalForm['timeout'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="WHATSAPP.ERRORS.AGENT_TIMEOUT_REQUIRED"
-                      >Agent_Timeout field is required</span
-                    >
-                  </div>
-                  <div ng-message="min">
-                    <span
-                      translate="WHATSAPP.ERRORS.AGENT_TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
-                      >Agent_Timeout must be a valid greater or equal than</span
-                    >
-                    <span>1</span>
-                  </div>
-                  <div ng-message="max">
-                    <span
-                      translate="WHATSAPP.ERRORS.AGENT_TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
-                      >Agent_Timeout must be a valid greater or equal than</span
-                    >
-                    <span>2147483</span>
-                  </div>
-                </div>
-              </md-input-container>
-              <md-input-container class="md-block">
-                <label translate="WHATSAPP.DESCRIPTION">Description</label>
-                <input
-                  type="text"
-                  name="description"
-                  ng-model="vm.whatsappQueue.description"
-                  ng-disabled="!vm.crudPermissions.canEdit"
-                />
-
-                <div
-                  ng-messages="generalForm['description'].$error"
-                  ng-show="generalForm['description'].$touched"
-                  role="alert"
-                >
-                  <div ng-message="required">
-                    <span translate="WHATSAPP.ERRORS.DESCRIPTION_REQUIRED"
-                      >Description field is required</span
-                    >
-                  </div>
-                </div>
-              </md-input-container>
-            </form>
-          </div>
-        </md-tab-body>
-      </md-tab>
-    </md-tabs>
-  </div>
-  <!-- / CONTENT -->
-</div>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/edit/view.html/view.html b/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/edit/view.html/view.html
new file mode 100644
index 0000000..1dff660
--- /dev/null
+++ b/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/edit/view.html/view.html
@@ -0,0 +1,224 @@
+<div
+  id="whatsapp-whatsappQueue"
+  class="page-layout simple tabbed"
+  layout="column"
+>
+  <!-- HEADER -->
+  <div class="header md-accent-bg" layout="row" layout-align="start center">
+    <div class="white-fg" layout="row" layout-align="start center" flex>
+      <md-button
+        class="goto-whatsappQueues-button md-icon-button"
+        aria-label="Go to whatsappQueues"
+        ng-click="vm.gotoWhatsappQueues()"
+        translate
+        translate-attr-aria-label="WHATSAPP.GO_TO_WHATSAPPQUEUES"
+      >
+        <md-icon md-font-icon="icon-arrow-left"></md-icon>
+      </md-button>
+
+      <div layout="row" layout-align="start center">
+        <div class="whatsappQueue-image" hide-xs>
+          <img ng-src="assets/images/business/whatsappQueues.jpg" />
+        </div>
+
+        <div layout="column" layout-align="start start">
+          <div class="h2">
+            #{{vm.whatsappQueue.id}}
+            <span ng-if="vm.whatsappQueue.name">{{vm.whatsappQueue.name}}</span>
+          </div>
+          <div class="subtitle secondary-text">
+            <span translate="WHATSAPP.CREATED_AT"></span>
+            <span>{{vm.whatsappQueue.createdAt | date:'medium'}}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.teamadddialog(vm.whatsappQueue, $event)"
+        class="md-fab md-orange-500-bg md-icon-button"
+        aria-label="teamadd"
+      >
+        <md-tooltip
+          ><span translate="WHATSAPP.TEAMADD_WHATSAPPQUEUE"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-account-multiple-plus"></md-icon>
+      </md-button>
+    </div>
+
+    <div ng-cloak>
+      <md-button
+        ng-click="vm.agentadddialog(vm.whatsappQueue, $event)"
+        class="md-fab md-purple-500-bg md-icon-button"
+        aria-label="agentadd"
+      >
+        <md-tooltip
+          ><span translate="WHATSAPP.AGENTADD_WHATSAPPQUEUE"></span
+        ></md-tooltip>
+        <md-icon md-font-icon="icon-account-plus"></md-icon>
+      </md-button>
+    </div>
+    <div>
+      <md-button
+        type="submit"
+        ng-click="vm.saveWhatsappQueue()"
+        ng-if="vm.crudPermissions.canEdit"
+        class="send-button md-accent md-raised"
+        ng-disabled="(generalForm.$invalid)"
+        translate="WHATSAPP.SAVE"
+        translate-attr-aria-label="WHATSAPP.SAVE"
+      >
+        SAVE
+      </md-button>
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- CONTENT -->
+  <div class="content">
+    <md-tabs
+      md-selected="vm.selectedTab"
+      md-stretch-tabs="always"
+      flex
+      layout-fill
+      md-dynamic-height
+    >
+      <md-tab>
+        <md-tab-label>
+          <span translate="WHATSAPP.SETTINGS">SETTINGS</span>
+        </md-tab-label>
+        <md-tab-body>
+          <div
+            class="whatsappQueue-detail-form-container general md-background-bg md-whiteframe-1dp"
+          >
+            <div class="pb-16" layout="row" layout-align="start center">
+              <div class="h2 secondary-text" translate="WHATSAPP.GENERAL">
+                GENERAL
+              </div>
+            </div>
+            <form name="generalForm" novalidate>
+              <md-input-container class="md-block">
+                <label translate="WHATSAPP.NAME">Name</label>
+                <input
+                  type="text"
+                  name="name"
+                  ng-model="vm.whatsappQueue.name"
+                  ng-pattern="/^[A-Za-z0-9\.\_]+$/i"
+                  ng-required="true"
+                  autofocus
+                  disabled
+                />
+
+                <div class="hint">
+                  <span translate="WHATSAPP.HELP.NAME"></span>
+                </div>
+                <div
+                  ng-messages="generalForm['name'].$error"
+                  ng-show="generalForm['name'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="WHATSAPP.ERRORS.NAME_REQUIRED"
+                      >Name field is required</span
+                    >
+                  </div>
+                  <div ng-message="pattern">
+                    <span
+                      translate="WHATSAPP.ERRORS.NAME_MUST_VALID_PATTERN"
+                      translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+                      >Name must be valid pattern
+                    </span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="WHATSAPP.STRATEGY">Strategy</label>
+                <md-select
+                  name="strategy"
+                  ng-model="vm.whatsappQueue.strategy"
+                  required
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                >
+                  <md-option ng-value="'beepall'">Beepall</md-option>
+                  <md-option ng-value="'rrmemory'">RR Memory</md-option>
+                </md-select>
+                <div
+                  ng-messages="generalForm['strategy'].$error"
+                  ng-show="generalForm['strategy'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="WHATSAPP.ERRORS.STRATEGY_REQUIRED"
+                      >Strategy field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="WHATSAPP.AGENT_TIMEOUT">Agent_Timeout</label>
+                <input
+                  type="number"
+                  name="timeout"
+                  ng-model="vm.whatsappQueue.timeout"
+                  min="1"
+                  max="2147483"
+                  ng-required="true"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['timeout'].$error"
+                  ng-show="generalForm['timeout'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="WHATSAPP.ERRORS.AGENT_TIMEOUT_REQUIRED"
+                      >Agent_Timeout field is required</span
+                    >
+                  </div>
+                  <div ng-message="min">
+                    <span
+                      translate="WHATSAPP.ERRORS.AGENT_TIMEOUT_MUST_BE_GREATER_THAN_OR_EQUAL_TO"
+                      >Agent_Timeout must be a valid greater or equal than</span
+                    >
+                    <span>1</span>
+                  </div>
+                  <div ng-message="max">
+                    <span
+                      translate="WHATSAPP.ERRORS.AGENT_TIMEOUT_MUST_BE_LESS_THAN_OR_EQUAL_TO"
+                      >Agent_Timeout must be a valid greater or equal than</span
+                    >
+                    <span>2147483</span>
+                  </div>
+                </div>
+              </md-input-container>
+              <md-input-container class="md-block">
+                <label translate="WHATSAPP.DESCRIPTION">Description</label>
+                <input
+                  type="text"
+                  name="description"
+                  ng-model="vm.whatsappQueue.description"
+                  ng-disabled="!vm.crudPermissions.canEdit"
+                />
+
+                <div
+                  ng-messages="generalForm['description'].$error"
+                  ng-show="generalForm['description'].$touched"
+                  role="alert"
+                >
+                  <div ng-message="required">
+                    <span translate="WHATSAPP.ERRORS.DESCRIPTION_REQUIRED"
+                      >Description field is required</span
+                    >
+                  </div>
+                </div>
+              </md-input-container>
+            </form>
+          </div>
+        </md-tab-body>
+      </md-tab>
+    </md-tabs>
+  </div>
+  <!-- / CONTENT -->
+</div>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/whatsappQueues.html/whatsappQueues-[chunkhash].html b/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/whatsappQueues.html/whatsappQueues-[chunkhash].html
deleted file mode 100644
index 3614c8d..0000000
--- a/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/whatsappQueues.html/whatsappQueues-[chunkhash].html
+++ /dev/null
@@ -1,336 +0,0 @@
-<div
-  id="whatsappQueues"
-  class="page-layout simple left-sidenav inner-sidenav motion-list"
->
-  <!-- HEADER -->
-  <div
-    class="header md-accent-bg"
-    layout="row"
-    layout-align="space-between center"
-  >
-    <!-- APP TITLE -->
-    <div layout="row" layout-align="start center">
-      <div class="logo" layout="row" layout-align="start center">
-        <span class="logo-icon">
-          <md-icon md-font-icon="icon-whatsapp" class="s24"></md-icon>
-        </span>
-        <span class="logo-text" translate="WHATSAPP.WHATSAPPQUEUES"
-          >WhatsappQueues</span
-        >
-      </div>
-    </div>
-    <!-- / APP TITLE -->
-
-    <div layout="row">
-      <!-- SEARCH -->
-      <div
-        class="search-input-wrapper"
-        layout="row"
-        layout-align="start center"
-      >
-        <label for="search">
-          <md-icon md-font-icon="icon-magnify"></md-icon>
-        </label>
-        <md-input-container md-no-float class="m-0">
-          <input
-            id="search"
-            placeholder="Search for anyone"
-            type="text"
-            ng-model="vm.query.filter"
-            ng-model-options="{ debounce: 1000 }"
-            translate
-            translate-attr-placeholder="WHATSAPP.SEARCH_FOR_ANYONE"
-          />
-        </md-input-container>
-      </div>
-      <!-- / SEARCH -->
-    </div>
-  </div>
-  <!-- / HEADER -->
-
-  <!-- SELECTED BAR -->
-  <div
-    ng-show="vm.selectedWhatsappQueues.length > 0"
-    class="selected-bar header animate-slide-down md-accent-bg"
-    layout="row"
-    layout-align="start center"
-  >
-    <div class="close-button-wrapper" ng-click="vm.selectedWhatsappQueues =[]">
-      <md-button layout="row" layout-align="start center">
-        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
-        <span translate="WHATSAPP.BACK">Back</span>
-      </md-button>
-    </div>
-
-    <div flex layout="row" layout-align="space-between center">
-      <div>
-        <span class="selected-whatsappQueues-count">
-          <span>{{vm.selectedWhatsappQueues.length}}</span>
-          <span translate="WHATSAPP.SELECTED">selected</span>
-        </span>
-
-        <md-menu class="select-menu" ng-if="!vm.currentThread">
-          <md-button
-            class="md-icon-button"
-            ng-click="$mdMenu.open($event)"
-            aria-label="multi select toggle"
-            translate
-            translate-attr-aria-label="WHATSAPP.MULTI_SELECT_TOGGLE"
-          >
-            <md-icon md-font-icon="icon-menu-down"></md-icon>
-          </md-button>
-          <md-menu-content width="3">
-            <md-menu-item>
-              <md-button
-                ng-click="vm.selectAllWhatsappQueues()"
-                translate="WHATSAPP.SELECT_ALL"
-              >
-                Select all
-              </md-button>
-            </md-menu-item>
-            <md-menu-item>
-              <md-button
-                ng-click="vm.deselectWhatsappQueues()"
-                translate="WHATSAPP.SELECT_NONE"
-              >
-                Select none
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-
-      <div class="multi-select-actions">
-        <button
-          class="md-icon-button"
-          ng-csv="vm.exportSelectedWhatsappQueues"
-          csv-label="true"
-          filename="whatsappQueues.csv"
-        >
-          <md-icon md-font-icon="icon-file-excel"></md-icon>
-        </button>
-        <md-button
-          class="md-icon-button"
-          ng-if="vm.crudPermissions.canDelete"
-          ng-click="vm.deleteSelectedWhatsappQueues($event)"
-          aria-label="delete selected"
-          translate
-          translate-attr-label="WHATSAPP.DELETE_SELECTED"
-        >
-          <md-icon md-font-icon="icon-delete"></md-icon>
-        </md-button>
-      </div>
-    </div>
-  </div>
-  <!-- / SELECTED BAR -->
-
-  <!-- CONTENT -->
-  <div class="content" md-background-bg layout="row" layout-align="start start">
-    <!-- MAIN -->
-    <div class="main scrollable" ms-scroll>
-      <!-- WHATSAPPQUEUE TABLE -->
-      <md-card>
-        <md-table-container>
-          <table
-            md-table
-            md-row-select
-            multiple
-            ng-model="vm.selectedWhatsappQueues"
-            md-progress="vm.promise"
-          >
-            <thead
-              md-head
-              md-order="vm.query.sort"
-              md-on-reorder="vm.getWhatsappQueues"
-            >
-              <tr md-row>
-                <th
-                  md-column
-                  ng-if="vm.table == 'users' || vm.table == 'agents'"
-                  width="20px"
-                ></th>
-                <th md-column md-order-by="id">
-                  {{ 'WHATSAPP.ID' | translate }}
-                </th>
-                <th md-column md-order-by="name">
-                  {{ 'WHATSAPP.NAME' | translate }}
-                </th>
-                <th md-column md-order-by="strategy">
-                  {{ 'WHATSAPP.STRATEGY' | translate }}
-                </th>
-                <th md-column width="10px"></th>
-              </tr>
-            </thead>
-            <tbody md-body>
-              <tr md-row ng-hide="vm.whatsappQueues.rows.length">
-                <td md-cell colspan="4">
-                  <div layout="row" layout-align="center center">
-                    <span translate="WHATSAPP.NO_AVAILABLE_INFO"
-                      >No Available Info</span
-                    >
-                  </div>
-                </td>
-              </tr>
-              <tr
-                md-row
-                md-select="whatsappQueue"
-                md-select-id="id"
-                ng-repeat="whatsappQueue in vm.whatsappQueues.rows"
-              >
-                <td md-cell ng-if="whatsappQueue.userpic">
-                  <img
-                    class="avatar"
-                    alt="{{whatsappQueue.name}}"
-                    ng-src="api/users/{{whatsappQueue.id}}/avatar"
-                  />
-                </td>
-                <td
-                  md-cell
-                  ng-if="!whatsappQueue.userpic && (vm.table == 'users' || vm.table == 'agents')"
-                >
-                  <img
-                    class="avatar"
-                    alt="{{whatsappQueue.name}}"
-                    ng-src="assets/images/avatars/profile.png"
-                  />
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(whatsappQueue, ev) : vm.createOrEditWhatsappQueue($event, whatsappQueue)"
-                  md-cell
-                  class="id"
-                >
-                  {{whatsappQueue.id}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(whatsappQueue, ev) : vm.createOrEditWhatsappQueue($event, whatsappQueue)"
-                  md-cell
-                  class="name"
-                >
-                  {{whatsappQueue.name}}
-                </td>
-                <td
-                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(whatsappQueue, ev) : vm.createOrEditWhatsappQueue($event, whatsappQueue)"
-                  md-cell
-                  class="strategy"
-                >
-                  {{ vm.arraystrategy[whatsappQueue.strategy].option }}
-                </td>
-
-                <td md-cell class="actions">
-                  <md-menu>
-                    <md-button
-                      class="md-icon-button"
-                      aria-label="More"
-                      translate
-                      translate-attr-aria-label="WHATSAPP.MORE"
-                      ng-click="$mdMenu.open($event)"
-                    >
-                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
-                    </md-button>
-
-                    <md-menu-content width="3">
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
-                        <md-button
-                          ng-click="vm.editstate(whatsappQueue, $event    )"
-                          translate="WHATSAPP.EDIT_WHATSAPPQUEUE"
-                        >
-                          Edit WhatsappQueue
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.teamadddialog(whatsappQueue, $event    )"
-                          translate="WHATSAPP.TEAMADD_WHATSAPPQUEUE"
-                        >
-                          teamadd WhatsappQueue
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.agentadddialog(whatsappQueue, $event    )"
-                          translate="WHATSAPP.AGENTADD_WHATSAPPQUEUE"
-                        >
-                          agentadd WhatsappQueue
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
-                        <md-button
-                          ng-click="vm.deleteconfirm(whatsappQueue, $event    )"
-                          translate="WHATSAPP.DELETE_WHATSAPPQUEUE"
-                        >
-                          Delete WhatsappQueue
-                        </md-button>
-                      </md-menu-item>
-
-                      <!-- SUBACTIONS -->
-
-                      <!-- ACTIONS -->
-
-                      <md-menu-item>
-                        <md-button
-                          ng-click="vm.gotorealtimegoto(whatsappQueue, $event    )"
-                          translate="WHATSAPP.GOTOREALTIME_WHATSAPPQUEUE"
-                        >
-                          goToRealtime WhatsappQueue
-                        </md-button>
-                      </md-menu-item>
-                    </md-menu-content>
-                  </md-menu>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </md-table-container>
-
-        <md-table-pagination
-          md-label="{page: '{{'WHATSAPP.PAGE' | translate}}:', rowsPerPage: '{{'WHATSAPP.ROWSPERPAGE' | translate}}:', of: '{{'WHATSAPP.OF' | translate}}'}"
-          md-limit="vm.query.limit"
-          md-limit-options="[10, 15, 20, 50, 100, 250]"
-          md-page="vm.query.page"
-          md-total="{{vm.whatsappQueues.count}}"
-          md-on-paginate="vm.getWhatsappQueues"
-          md-page-select
-        ></md-table-pagination>
-      </md-card>
-      <!-- / WHATSAPPQUEUE TABLE -->
-      <!-- NO RESULTS -->
-
-      <!-- / NO RESULTS -->
-    </div>
-    <!-- / MAIN -->
-  </div>
-  <!-- / CONTENT -->
-
-  <!-- ADD WHATSAPPQUEUE BUTTON -->
-  <md-button
-    ng-if="vm.crudPermissions.canEdit"
-    class="md-fab md-accent add-item-button"
-    id="add-whatsappQueue-button"
-    ng-click="vm.createOrEditWhatsappQueue($event)"
-    aria-label="add whatsappQueue"
-    translate
-    translate-attr-aria-label="WHATSAPP.ADD_WHATSAPPQUEUE"
-  >
-    <md-icon md-font-icon="icon-plus"></md-icon>
-  </md-button>
-  <!-- / ADD WHATSAPPQUEUE BUTTON -->
-</div>
diff --git a/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/whatsappQueues.html/whatsappQueues.html b/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/whatsappQueues.html/whatsappQueues.html
new file mode 100644
index 0000000..3614c8d
--- /dev/null
+++ b/public/src/js/modules/main/apps/whatsapp/views/whatsappQueues/whatsappQueues.html/whatsappQueues.html
@@ -0,0 +1,336 @@
+<div
+  id="whatsappQueues"
+  class="page-layout simple left-sidenav inner-sidenav motion-list"
+>
+  <!-- HEADER -->
+  <div
+    class="header md-accent-bg"
+    layout="row"
+    layout-align="space-between center"
+  >
+    <!-- APP TITLE -->
+    <div layout="row" layout-align="start center">
+      <div class="logo" layout="row" layout-align="start center">
+        <span class="logo-icon">
+          <md-icon md-font-icon="icon-whatsapp" class="s24"></md-icon>
+        </span>
+        <span class="logo-text" translate="WHATSAPP.WHATSAPPQUEUES"
+          >WhatsappQueues</span
+        >
+      </div>
+    </div>
+    <!-- / APP TITLE -->
+
+    <div layout="row">
+      <!-- SEARCH -->
+      <div
+        class="search-input-wrapper"
+        layout="row"
+        layout-align="start center"
+      >
+        <label for="search">
+          <md-icon md-font-icon="icon-magnify"></md-icon>
+        </label>
+        <md-input-container md-no-float class="m-0">
+          <input
+            id="search"
+            placeholder="Search for anyone"
+            type="text"
+            ng-model="vm.query.filter"
+            ng-model-options="{ debounce: 1000 }"
+            translate
+            translate-attr-placeholder="WHATSAPP.SEARCH_FOR_ANYONE"
+          />
+        </md-input-container>
+      </div>
+      <!-- / SEARCH -->
+    </div>
+  </div>
+  <!-- / HEADER -->
+
+  <!-- SELECTED BAR -->
+  <div
+    ng-show="vm.selectedWhatsappQueues.length > 0"
+    class="selected-bar header animate-slide-down md-accent-bg"
+    layout="row"
+    layout-align="start center"
+  >
+    <div class="close-button-wrapper" ng-click="vm.selectedWhatsappQueues =[]">
+      <md-button layout="row" layout-align="start center">
+        <md-icon md-font-icon="icon-arrow-left" class="mr-8"></md-icon>
+        <span translate="WHATSAPP.BACK">Back</span>
+      </md-button>
+    </div>
+
+    <div flex layout="row" layout-align="space-between center">
+      <div>
+        <span class="selected-whatsappQueues-count">
+          <span>{{vm.selectedWhatsappQueues.length}}</span>
+          <span translate="WHATSAPP.SELECTED">selected</span>
+        </span>
+
+        <md-menu class="select-menu" ng-if="!vm.currentThread">
+          <md-button
+            class="md-icon-button"
+            ng-click="$mdMenu.open($event)"
+            aria-label="multi select toggle"
+            translate
+            translate-attr-aria-label="WHATSAPP.MULTI_SELECT_TOGGLE"
+          >
+            <md-icon md-font-icon="icon-menu-down"></md-icon>
+          </md-button>
+          <md-menu-content width="3">
+            <md-menu-item>
+              <md-button
+                ng-click="vm.selectAllWhatsappQueues()"
+                translate="WHATSAPP.SELECT_ALL"
+              >
+                Select all
+              </md-button>
+            </md-menu-item>
+            <md-menu-item>
+              <md-button
+                ng-click="vm.deselectWhatsappQueues()"
+                translate="WHATSAPP.SELECT_NONE"
+              >
+                Select none
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+
+      <div class="multi-select-actions">
+        <button
+          class="md-icon-button"
+          ng-csv="vm.exportSelectedWhatsappQueues"
+          csv-label="true"
+          filename="whatsappQueues.csv"
+        >
+          <md-icon md-font-icon="icon-file-excel"></md-icon>
+        </button>
+        <md-button
+          class="md-icon-button"
+          ng-if="vm.crudPermissions.canDelete"
+          ng-click="vm.deleteSelectedWhatsappQueues($event)"
+          aria-label="delete selected"
+          translate
+          translate-attr-label="WHATSAPP.DELETE_SELECTED"
+        >
+          <md-icon md-font-icon="icon-delete"></md-icon>
+        </md-button>
+      </div>
+    </div>
+  </div>
+  <!-- / SELECTED BAR -->
+
+  <!-- CONTENT -->
+  <div class="content" md-background-bg layout="row" layout-align="start start">
+    <!-- MAIN -->
+    <div class="main scrollable" ms-scroll>
+      <!-- WHATSAPPQUEUE TABLE -->
+      <md-card>
+        <md-table-container>
+          <table
+            md-table
+            md-row-select
+            multiple
+            ng-model="vm.selectedWhatsappQueues"
+            md-progress="vm.promise"
+          >
+            <thead
+              md-head
+              md-order="vm.query.sort"
+              md-on-reorder="vm.getWhatsappQueues"
+            >
+              <tr md-row>
+                <th
+                  md-column
+                  ng-if="vm.table == 'users' || vm.table == 'agents'"
+                  width="20px"
+                ></th>
+                <th md-column md-order-by="id">
+                  {{ 'WHATSAPP.ID' | translate }}
+                </th>
+                <th md-column md-order-by="name">
+                  {{ 'WHATSAPP.NAME' | translate }}
+                </th>
+                <th md-column md-order-by="strategy">
+                  {{ 'WHATSAPP.STRATEGY' | translate }}
+                </th>
+                <th md-column width="10px"></th>
+              </tr>
+            </thead>
+            <tbody md-body>
+              <tr md-row ng-hide="vm.whatsappQueues.rows.length">
+                <td md-cell colspan="4">
+                  <div layout="row" layout-align="center center">
+                    <span translate="WHATSAPP.NO_AVAILABLE_INFO"
+                      >No Available Info</span
+                    >
+                  </div>
+                </td>
+              </tr>
+              <tr
+                md-row
+                md-select="whatsappQueue"
+                md-select-id="id"
+                ng-repeat="whatsappQueue in vm.whatsappQueues.rows"
+              >
+                <td md-cell ng-if="whatsappQueue.userpic">
+                  <img
+                    class="avatar"
+                    alt="{{whatsappQueue.name}}"
+                    ng-src="api/users/{{whatsappQueue.id}}/avatar"
+                  />
+                </td>
+                <td
+                  md-cell
+                  ng-if="!whatsappQueue.userpic && (vm.table == 'users' || vm.table == 'agents')"
+                >
+                  <img
+                    class="avatar"
+                    alt="{{whatsappQueue.name}}"
+                    ng-src="assets/images/avatars/profile.png"
+                  />
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(whatsappQueue, ev) : vm.createOrEditWhatsappQueue($event, whatsappQueue)"
+                  md-cell
+                  class="id"
+                >
+                  {{whatsappQueue.id}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(whatsappQueue, ev) : vm.createOrEditWhatsappQueue($event, whatsappQueue)"
+                  md-cell
+                  class="name"
+                >
+                  {{whatsappQueue.name}}
+                </td>
+                <td
+                  ng-click="vm.crudPermissions.readOnly || (vm.crudPermissions.canDelete && !vm.crudPermissions.canEdit) ? vm.editstate(whatsappQueue, ev) : vm.createOrEditWhatsappQueue($event, whatsappQueue)"
+                  md-cell
+                  class="strategy"
+                >
+                  {{ vm.arraystrategy[whatsappQueue.strategy].option }}
+                </td>
+
+                <td md-cell class="actions">
+                  <md-menu>
+                    <md-button
+                      class="md-icon-button"
+                      aria-label="More"
+                      translate
+                      translate-attr-aria-label="WHATSAPP.MORE"
+                      ng-click="$mdMenu.open($event)"
+                    >
+                      <md-icon md-font-icon="icon-dots-vertical"></md-icon>
+                    </md-button>
+
+                    <md-menu-content width="3">
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canEdit">
+                        <md-button
+                          ng-click="vm.editstate(whatsappQueue, $event    )"
+                          translate="WHATSAPP.EDIT_WHATSAPPQUEUE"
+                        >
+                          Edit WhatsappQueue
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.teamadddialog(whatsappQueue, $event    )"
+                          translate="WHATSAPP.TEAMADD_WHATSAPPQUEUE"
+                        >
+                          teamadd WhatsappQueue
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.agentadddialog(whatsappQueue, $event    )"
+                          translate="WHATSAPP.AGENTADD_WHATSAPPQUEUE"
+                        >
+                          agentadd WhatsappQueue
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item ng-if="vm.crudPermissions.canDelete">
+                        <md-button
+                          ng-click="vm.deleteconfirm(whatsappQueue, $event    )"
+                          translate="WHATSAPP.DELETE_WHATSAPPQUEUE"
+                        >
+                          Delete WhatsappQueue
+                        </md-button>
+                      </md-menu-item>
+
+                      <!-- SUBACTIONS -->
+
+                      <!-- ACTIONS -->
+
+                      <md-menu-item>
+                        <md-button
+                          ng-click="vm.gotorealtimegoto(whatsappQueue, $event    )"
+                          translate="WHATSAPP.GOTOREALTIME_WHATSAPPQUEUE"
+                        >
+                          goToRealtime WhatsappQueue
+                        </md-button>
+                      </md-menu-item>
+                    </md-menu-content>
+                  </md-menu>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </md-table-container>
+
+        <md-table-pagination
+          md-label="{page: '{{'WHATSAPP.PAGE' | translate}}:', rowsPerPage: '{{'WHATSAPP.ROWSPERPAGE' | translate}}:', of: '{{'WHATSAPP.OF' | translate}}'}"
+          md-limit="vm.query.limit"
+          md-limit-options="[10, 15, 20, 50, 100, 250]"
+          md-page="vm.query.page"
+          md-total="{{vm.whatsappQueues.count}}"
+          md-on-paginate="vm.getWhatsappQueues"
+          md-page-select
+        ></md-table-pagination>
+      </md-card>
+      <!-- / WHATSAPPQUEUE TABLE -->
+      <!-- NO RESULTS -->
+
+      <!-- / NO RESULTS -->
+    </div>
+    <!-- / MAIN -->
+  </div>
+  <!-- / CONTENT -->
+
+  <!-- ADD WHATSAPPQUEUE BUTTON -->
+  <md-button
+    ng-if="vm.crudPermissions.canEdit"
+    class="md-fab md-accent add-item-button"
+    id="add-whatsappQueue-button"
+    ng-click="vm.createOrEditWhatsappQueue($event)"
+    aria-label="add whatsappQueue"
+    translate
+    translate-attr-aria-label="WHATSAPP.ADD_WHATSAPPQUEUE"
+  >
+    <md-icon md-font-icon="icon-plus"></md-icon>
+  </md-button>
+  <!-- / ADD WHATSAPPQUEUE BUTTON -->
+</div>
diff --git a/public/src/js/modules/navigation/layouts/horizontal-navigation/navigation.html/navigation-[chunkhash].html b/public/src/js/modules/navigation/layouts/horizontal-navigation/navigation.html/navigation-[chunkhash].html
deleted file mode 100644
index 97b5528..0000000
--- a/public/src/js/modules/navigation/layouts/horizontal-navigation/navigation.html/navigation-[chunkhash].html
+++ /dev/null
@@ -1,3 +0,0 @@
-<div layout="row" layout-align="start center">
-  <ms-navigation-horizontal></ms-navigation-horizontal>
-</div>
diff --git a/public/src/js/modules/navigation/layouts/horizontal-navigation/navigation.html/navigation.html b/public/src/js/modules/navigation/layouts/horizontal-navigation/navigation.html/navigation.html
new file mode 100644
index 0000000..97b5528
--- /dev/null
+++ b/public/src/js/modules/navigation/layouts/horizontal-navigation/navigation.html/navigation.html
@@ -0,0 +1,3 @@
+<div layout="row" layout-align="start center">
+  <ms-navigation-horizontal></ms-navigation-horizontal>
+</div>
diff --git a/public/src/js/modules/navigation/layouts/vertical-navigation-fullwidth-toolbar-2/navigation.html/navigation-[chunkhash].html b/public/src/js/modules/navigation/layouts/vertical-navigation-fullwidth-toolbar-2/navigation.html/navigation-[chunkhash].html
deleted file mode 100644
index becc718..0000000
--- a/public/src/js/modules/navigation/layouts/vertical-navigation-fullwidth-toolbar-2/navigation.html/navigation-[chunkhash].html
+++ /dev/null
@@ -1,5 +0,0 @@
-<ms-navigation
-  class="scrollable"
-  folded="vm.folded"
-  ms-scroll="vm.msScrollOptions"
-></ms-navigation>
diff --git a/public/src/js/modules/navigation/layouts/vertical-navigation-fullwidth-toolbar-2/navigation.html/navigation.html b/public/src/js/modules/navigation/layouts/vertical-navigation-fullwidth-toolbar-2/navigation.html/navigation.html
new file mode 100644
index 0000000..becc718
--- /dev/null
+++ b/public/src/js/modules/navigation/layouts/vertical-navigation-fullwidth-toolbar-2/navigation.html/navigation.html
@@ -0,0 +1,5 @@
+<ms-navigation
+  class="scrollable"
+  folded="vm.folded"
+  ms-scroll="vm.msScrollOptions"
+></ms-navigation>
diff --git a/public/src/js/modules/navigation/layouts/vertical-navigation/navigation.html/navigation-[chunkhash].html b/public/src/js/modules/navigation/layouts/vertical-navigation/navigation.html/navigation-[chunkhash].html
deleted file mode 100644
index 7d2443e..0000000
--- a/public/src/js/modules/navigation/layouts/vertical-navigation/navigation.html/navigation-[chunkhash].html
+++ /dev/null
@@ -1,26 +0,0 @@
-<md-toolbar
-  class="navigation-header md-whiteframe-1dp"
-  layout="row"
-  layout-align="space-between center"
->
-  <div class="logo" layout="row" layout-align="start center">
-    <span class="logo-image"
-      ><img ng-src="{{vm.baseUrl}}settings/1/logo" alt="logo"
-    /></span>
-    <!-- <span class="logo-image"><img src="assets/images/logos/whisker_32x32.png" alt="motion_whisker_32x32" /></span> -->
-    <span class="logo-text text-truncate">{{vm.getLogo() | uppercase}}</span>
-  </div>
-  <md-icon
-    class="fold-toggle s18"
-    md-font-icon="icon-backburger"
-    hide
-    show-gt-sm
-    ng-click="vm.toggleMsNavigationFolded()"
-  ></md-icon>
-</md-toolbar>
-
-<ms-navigation
-  class="scrollable"
-  folded="vm.folded"
-  ms-scroll="vm.msScrollOptions"
-></ms-navigation>
diff --git a/public/src/js/modules/navigation/layouts/vertical-navigation/navigation.html/navigation.html b/public/src/js/modules/navigation/layouts/vertical-navigation/navigation.html/navigation.html
new file mode 100644
index 0000000..7d2443e
--- /dev/null
+++ b/public/src/js/modules/navigation/layouts/vertical-navigation/navigation.html/navigation.html
@@ -0,0 +1,26 @@
+<md-toolbar
+  class="navigation-header md-whiteframe-1dp"
+  layout="row"
+  layout-align="space-between center"
+>
+  <div class="logo" layout="row" layout-align="start center">
+    <span class="logo-image"
+      ><img ng-src="{{vm.baseUrl}}settings/1/logo" alt="logo"
+    /></span>
+    <!-- <span class="logo-image"><img src="assets/images/logos/whisker_32x32.png" alt="motion_whisker_32x32" /></span> -->
+    <span class="logo-text text-truncate">{{vm.getLogo() | uppercase}}</span>
+  </div>
+  <md-icon
+    class="fold-toggle s18"
+    md-font-icon="icon-backburger"
+    hide
+    show-gt-sm
+    ng-click="vm.toggleMsNavigationFolded()"
+  ></md-icon>
+</md-toolbar>
+
+<ms-navigation
+  class="scrollable"
+  folded="vm.folded"
+  ms-scroll="vm.msScrollOptions"
+></ms-navigation>
diff --git a/public/src/js/modules/quick-panel/quick-panel.html/quick-panel-[chunkhash].html b/public/src/js/modules/quick-panel/quick-panel.html/quick-panel-[chunkhash].html
deleted file mode 100644
index 9d0c814..0000000
--- a/public/src/js/modules/quick-panel/quick-panel.html/quick-panel-[chunkhash].html
+++ /dev/null
@@ -1,64 +0,0 @@
-<md-content>
-  <md-tabs md-no-pagination md-swipe-content md-stretch-tabs="always">
-    <md-tab>
-      <md-tab-label>
-        <span translate="QUICKPANEL.TODAY">TODAY</span>
-      </md-tab-label>
-      <md-tab-body>
-        <md-content
-          class="today-tab scrollable"
-          ms-scroll
-          ng-include="'app/quick-panel/tabs/today/today-tab.html'"
-        ></md-content>
-      </md-tab-body>
-    </md-tab>
-    <md-tab
-      ng-if="vm.currentUser.allowmessenger || vm.currentUser.role !== 'agent'"
-      ng-include="'app/quick-panel/tabs/chat/chat-tab.html'"
-      ng-controller="ChatInternalController as vm_ct"
-      ng-init="vm_ct.init(vm.license)"
-      md-on-deselect="vm_ct.user = undefined"
-    >
-      <md-tab-label>
-        <div
-          ng-if="vm.unreadTotalMessages"
-          class="md-accent-bg unread-message-count-chat"
-        >
-          {{vm.unreadTotalMessages}}
-        </div>
-        <span>MESSENGER</span>
-      </md-tab-label>
-      <md-tab-body>
-        <md-content
-          class="chat-tab scrollable"
-          ms-scroll
-          ng-include="'app/quick-panel/tabs/chat/chat-tab.html'"
-        ></md-content>
-      </md-tab-body>
-    </md-tab>
-    <md-tab
-      ng-if="vm.currentUser.allowmessenger || vm.currentUser.role !== 'agent'"
-      ng-include="'app/quick-panel/tabs/groups/group-tab.html'"
-      ng-controller="ChatGroupController as vm_cg"
-      ng-init="vm_cg.init(vm.license)"
-      md-on-deselect="vm_cg.group = undefined"
-    >
-      <md-tab-label>
-        <div
-          ng-if="vm.unreadTotalGroupMessages"
-          class="md-accent-bg unread-message-count-chat"
-        >
-          {{vm.unreadTotalGroupMessages}}
-        </div>
-        <span translate="QUICKPANEL.GROUPS">GROUPS</span>
-      </md-tab-label>
-      <md-tab-body>
-        <md-content
-          class="group-tab scrollable"
-          ms-scroll
-          ng-include="'app/quick-panel/tabs/groups/group-tab.html'"
-        ></md-content>
-      </md-tab-body>
-    </md-tab>
-  </md-tabs>
-</md-content>
diff --git a/public/src/js/modules/quick-panel/quick-panel.html/quick-panel.html b/public/src/js/modules/quick-panel/quick-panel.html/quick-panel.html
new file mode 100644
index 0000000..9d0c814
--- /dev/null
+++ b/public/src/js/modules/quick-panel/quick-panel.html/quick-panel.html
@@ -0,0 +1,64 @@
+<md-content>
+  <md-tabs md-no-pagination md-swipe-content md-stretch-tabs="always">
+    <md-tab>
+      <md-tab-label>
+        <span translate="QUICKPANEL.TODAY">TODAY</span>
+      </md-tab-label>
+      <md-tab-body>
+        <md-content
+          class="today-tab scrollable"
+          ms-scroll
+          ng-include="'app/quick-panel/tabs/today/today-tab.html'"
+        ></md-content>
+      </md-tab-body>
+    </md-tab>
+    <md-tab
+      ng-if="vm.currentUser.allowmessenger || vm.currentUser.role !== 'agent'"
+      ng-include="'app/quick-panel/tabs/chat/chat-tab.html'"
+      ng-controller="ChatInternalController as vm_ct"
+      ng-init="vm_ct.init(vm.license)"
+      md-on-deselect="vm_ct.user = undefined"
+    >
+      <md-tab-label>
+        <div
+          ng-if="vm.unreadTotalMessages"
+          class="md-accent-bg unread-message-count-chat"
+        >
+          {{vm.unreadTotalMessages}}
+        </div>
+        <span>MESSENGER</span>
+      </md-tab-label>
+      <md-tab-body>
+        <md-content
+          class="chat-tab scrollable"
+          ms-scroll
+          ng-include="'app/quick-panel/tabs/chat/chat-tab.html'"
+        ></md-content>
+      </md-tab-body>
+    </md-tab>
+    <md-tab
+      ng-if="vm.currentUser.allowmessenger || vm.currentUser.role !== 'agent'"
+      ng-include="'app/quick-panel/tabs/groups/group-tab.html'"
+      ng-controller="ChatGroupController as vm_cg"
+      ng-init="vm_cg.init(vm.license)"
+      md-on-deselect="vm_cg.group = undefined"
+    >
+      <md-tab-label>
+        <div
+          ng-if="vm.unreadTotalGroupMessages"
+          class="md-accent-bg unread-message-count-chat"
+        >
+          {{vm.unreadTotalGroupMessages}}
+        </div>
+        <span translate="QUICKPANEL.GROUPS">GROUPS</span>
+      </md-tab-label>
+      <md-tab-body>
+        <md-content
+          class="group-tab scrollable"
+          ms-scroll
+          ng-include="'app/quick-panel/tabs/groups/group-tab.html'"
+        ></md-content>
+      </md-tab-body>
+    </md-tab>
+  </md-tabs>
+</md-content>
diff --git a/public/src/js/modules/quick-panel/tabs/groups/create/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/quick-panel/tabs/groups/create/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index 988633f..0000000
--- a/public/src/js/modules/quick-panel/tabs/groups/create/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,148 +0,0 @@
-<md-dialog class="group-dialog" aria-label="New ChatGroup">
-  <form name="groupForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog(null)">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <!--START Error-->
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <!--END Error-->
-
-      <!--START NAME-->
-      <md-input-container class="md-block">
-        <label translate="QUICKPANEL.NAME">Name</label>
-        <input
-          type="text"
-          name="name"
-          ng-model="vm.group.name"
-          required
-          autofocus
-        />
-        <div
-          ng-messages="groupForm['name'].$error"
-          ng-show="groupForm['name'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="QUICKPANEL.ERRORS.NAME_REQUIRED"
-              >Name field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span
-              translate="QUICKPANEL.ERRORS.NAME_MUST_VALID_PATTERN"
-              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
-              >Name must be valid pattern
-            </span>
-          </div>
-        </div>
-      </md-input-container>
-      <!--END NAME-->
-
-      <!--START Members-->
-      <md-input-container class="md-block">
-        <label translate="QUICKPANEL.MEMBERS">Members</label>
-        <md-contact-chips
-          ng-model="vm.group.members"
-          md-contacts="vm.querySearch($query)"
-          md-contact-name="name"
-          md-contact-image="image"
-          md-require-match="true"
-          md-highlight-flags="i"
-          placeholder="{{'QUICKPANEL.MEMBERS' | translate}}"
-        >
-        </md-contact-chips>
-        <div
-          ng-messages="groupForm['strategy'].$error"
-          ng-show="groupForm['strategy'].$touched"
-          role="alert"
-        >
-          <div ng-message="required">
-            <span translate="QUICKPANEL.ERRORS.MEMBERS_REQUIRED"
-              >Members field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <!--END Members-->
-
-      <!--START Writing-->
-      <md-input-container class="md-block">
-        <md-switch ng-model="vm.group.write" aria-label="Write">
-          {{'QUICKPANEL.ENABLE_WRITING' | translate}}
-        </md-switch>
-      </md-input-container>
-      <!--END Writing-->
-
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-if="vm.newChatGroup"
-          ng-click="vm.saveChatGroup()"
-          class="send-button md-accent md-raised"
-          ng-disabled="groupForm.$invalid || groupForm.$pristine || (vm.group.members.length < 1)"
-          aria-label="SAVE"
-          translate="QUICKPANEL.SAVE"
-          translate-attr-aria-label="QUICKPANEL.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/quick-panel/tabs/groups/create/dialog.html/dialog.html b/public/src/js/modules/quick-panel/tabs/groups/create/dialog.html/dialog.html
new file mode 100644
index 0000000..988633f
--- /dev/null
+++ b/public/src/js/modules/quick-panel/tabs/groups/create/dialog.html/dialog.html
@@ -0,0 +1,148 @@
+<md-dialog class="group-dialog" aria-label="New ChatGroup">
+  <form name="groupForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog(null)">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <!--START Error-->
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <!--END Error-->
+
+      <!--START NAME-->
+      <md-input-container class="md-block">
+        <label translate="QUICKPANEL.NAME">Name</label>
+        <input
+          type="text"
+          name="name"
+          ng-model="vm.group.name"
+          required
+          autofocus
+        />
+        <div
+          ng-messages="groupForm['name'].$error"
+          ng-show="groupForm['name'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="QUICKPANEL.ERRORS.NAME_REQUIRED"
+              >Name field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span
+              translate="QUICKPANEL.ERRORS.NAME_MUST_VALID_PATTERN"
+              translate-values="{ regex: '/^[A-Za-z0-9\.\_]+$/i' }"
+              >Name must be valid pattern
+            </span>
+          </div>
+        </div>
+      </md-input-container>
+      <!--END NAME-->
+
+      <!--START Members-->
+      <md-input-container class="md-block">
+        <label translate="QUICKPANEL.MEMBERS">Members</label>
+        <md-contact-chips
+          ng-model="vm.group.members"
+          md-contacts="vm.querySearch($query)"
+          md-contact-name="name"
+          md-contact-image="image"
+          md-require-match="true"
+          md-highlight-flags="i"
+          placeholder="{{'QUICKPANEL.MEMBERS' | translate}}"
+        >
+        </md-contact-chips>
+        <div
+          ng-messages="groupForm['strategy'].$error"
+          ng-show="groupForm['strategy'].$touched"
+          role="alert"
+        >
+          <div ng-message="required">
+            <span translate="QUICKPANEL.ERRORS.MEMBERS_REQUIRED"
+              >Members field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <!--END Members-->
+
+      <!--START Writing-->
+      <md-input-container class="md-block">
+        <md-switch ng-model="vm.group.write" aria-label="Write">
+          {{'QUICKPANEL.ENABLE_WRITING' | translate}}
+        </md-switch>
+      </md-input-container>
+      <!--END Writing-->
+
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-if="vm.newChatGroup"
+          ng-click="vm.saveChatGroup()"
+          class="send-button md-accent md-raised"
+          ng-disabled="groupForm.$invalid || groupForm.$pristine || (vm.group.members.length < 1)"
+          aria-label="SAVE"
+          translate="QUICKPANEL.SAVE"
+          translate-attr-aria-label="QUICKPANEL.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/quick-panel/tabs/groups/info/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/quick-panel/tabs/groups/info/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index dc1cb8a..0000000
--- a/public/src/js/modules/quick-panel/tabs/groups/info/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,50 +0,0 @@
-<md-dialog class="group-dialog" aria-label="New ChatGroup">
-  <form name="groupForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">{{ vm.title | translate }}</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog(null)">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div
-        ng-if="vm.data.messages[$index].FromId !== vm.data.messages[$index].ToId"
-        ng-repeat="user in vm.data.users"
-        layout-margin
-      >
-        <div layout="row">
-          <div layout="row" layout-align="start center">
-            <img
-              ng-src="{{user.userpic ? 'api/users/' + user.id + '/avatar' : 'assets/images/avatars/profile.png'}}"
-              class="avatar"
-              alt="{{user.fullname}}"
-            />
-            <span>{{user.fullname}}</span>
-          </div>
-          <div layout="row" layout-align="end center" flex>
-            <md-icon
-              class="s16 margin-5"
-              md-font-icon="{{vm.data.messages[$index].read ? 'icon-check-all md-accent' : 'icon-check'}}"
-            ></md-icon>
-            <span class="time secondary-text"
-              >{{vm.data.messages[$index].updatedAt | formatdate }}</span
-            >
-          </div>
-        </div>
-        <div>
-          <md-divider ng-if="!$last"></md-divider>
-        </div>
-      </div>
-    </md-dialog-content>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/quick-panel/tabs/groups/info/dialog.html/dialog.html b/public/src/js/modules/quick-panel/tabs/groups/info/dialog.html/dialog.html
new file mode 100644
index 0000000..dc1cb8a
--- /dev/null
+++ b/public/src/js/modules/quick-panel/tabs/groups/info/dialog.html/dialog.html
@@ -0,0 +1,50 @@
+<md-dialog class="group-dialog" aria-label="New ChatGroup">
+  <form name="groupForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">{{ vm.title | translate }}</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog(null)">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div
+        ng-if="vm.data.messages[$index].FromId !== vm.data.messages[$index].ToId"
+        ng-repeat="user in vm.data.users"
+        layout-margin
+      >
+        <div layout="row">
+          <div layout="row" layout-align="start center">
+            <img
+              ng-src="{{user.userpic ? 'api/users/' + user.id + '/avatar' : 'assets/images/avatars/profile.png'}}"
+              class="avatar"
+              alt="{{user.fullname}}"
+            />
+            <span>{{user.fullname}}</span>
+          </div>
+          <div layout="row" layout-align="end center" flex>
+            <md-icon
+              class="s16 margin-5"
+              md-font-icon="{{vm.data.messages[$index].read ? 'icon-check-all md-accent' : 'icon-check'}}"
+            ></md-icon>
+            <span class="time secondary-text"
+              >{{vm.data.messages[$index].updatedAt | formatdate }}</span
+            >
+          </div>
+        </div>
+        <div>
+          <md-divider ng-if="!$last"></md-divider>
+        </div>
+      </div>
+    </md-dialog-content>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/reset/reset.html/reset-[chunkhash].html b/public/src/js/modules/reset/reset.html/reset-[chunkhash].html
deleted file mode 100644
index ef2c1fc..0000000
--- a/public/src/js/modules/reset/reset.html/reset-[chunkhash].html
+++ /dev/null
@@ -1,88 +0,0 @@
-<div
-  id="reset-password"
-  class="flex-scrollable"
-  layout="column"
-  ng-init="vm.onInit()"
-  ms-scroll
->
-  <div
-    id="reset-password-form-wrapper"
-    layout="column"
-    layout-align="center center"
-  >
-    <div id="reset-password-form" class="md-whiteframe-8dp">
-      <img
-        ng-src="{{vm.baseUrl}}settings/1/logo_login"
-        alt="logo_login"
-        class="logo_login"
-      />
-
-      <div class="title" translate="RESETPASSWORD.TITLE">
-        Reset your password
-      </div>
-
-      <form name="resetPasswordForm" novalidate>
-        <md-input-container class="md-block" md-no-float>
-          <input
-            type="password"
-            name="password"
-            ng-model="vm.form.password"
-            ng-pattern="vm.passwordPattern"
-            placeholder="Password"
-            translate
-            translate-attr-placeholder="RESETPASSWORD.PASSWORD"
-            required
-          />
-          <div ng-messages="resetPasswordForm.password.$error" role="alert">
-            <div ng-message="required">
-              <span translate="RESETPASSWORD.ERRORS.PASSWORD_REQUIRED"
-                >Password field is required</span
-              >
-            </div>
-            <div ng-message="pattern">
-              <span translate="RESETPASSWORD.ERRORS.SECURE_PASSWORD_PATTERN"
-                >Must contain at least 8 characters, with a minimum of 1
-                lowercase letter, 1 uppercase letter, 1 numeric character and 1
-                special character ~!?*@#$%^&-_=+[{]}.</span
-              >
-            </div>
-          </div>
-        </md-input-container>
-
-        <md-input-container class="md-block" md-no-float>
-          <input
-            type="password"
-            name="passwordConfirm"
-            ng-model="vm.form.passwordConfirm"
-            placeholder="Password (Confirm)"
-            match-password="password"
-            translate
-            translate-attr-placeholder="RESETPASSWORD.PASSWORD_CONFIRM"
-          />
-          <div
-            ng-messages="resetPasswordForm.passwordConfirm.$error"
-            role="alert"
-          >
-            <div ng-message="passwordMatch">
-              <span translate="TOOLBAR.ERRORS.CONFIRM_NOT_MATCH"
-                >Your password did not match</span
-              >
-            </div>
-          </div>
-        </md-input-container>
-
-        <md-button
-          type="button"
-          ng-click="vm.resetPassword()"
-          class="md-raised md-accent submit-button"
-          aria-label="UPDATE MY PASSWORD"
-          ng-disabled="resetPasswordForm.$invalid || resetPasswordForm.$pristine"
-          translate="RESETPASSWORD.UPDATE_PASSWORD"
-          translate-attr-aria-label="RESETPASSWORD.UPDATE_PASSWORD"
-        >
-          RESET MY PASSWORD
-        </md-button>
-      </form>
-    </div>
-  </div>
-</div>
diff --git a/public/src/js/modules/reset/reset.html/reset.html b/public/src/js/modules/reset/reset.html/reset.html
new file mode 100644
index 0000000..ef2c1fc
--- /dev/null
+++ b/public/src/js/modules/reset/reset.html/reset.html
@@ -0,0 +1,88 @@
+<div
+  id="reset-password"
+  class="flex-scrollable"
+  layout="column"
+  ng-init="vm.onInit()"
+  ms-scroll
+>
+  <div
+    id="reset-password-form-wrapper"
+    layout="column"
+    layout-align="center center"
+  >
+    <div id="reset-password-form" class="md-whiteframe-8dp">
+      <img
+        ng-src="{{vm.baseUrl}}settings/1/logo_login"
+        alt="logo_login"
+        class="logo_login"
+      />
+
+      <div class="title" translate="RESETPASSWORD.TITLE">
+        Reset your password
+      </div>
+
+      <form name="resetPasswordForm" novalidate>
+        <md-input-container class="md-block" md-no-float>
+          <input
+            type="password"
+            name="password"
+            ng-model="vm.form.password"
+            ng-pattern="vm.passwordPattern"
+            placeholder="Password"
+            translate
+            translate-attr-placeholder="RESETPASSWORD.PASSWORD"
+            required
+          />
+          <div ng-messages="resetPasswordForm.password.$error" role="alert">
+            <div ng-message="required">
+              <span translate="RESETPASSWORD.ERRORS.PASSWORD_REQUIRED"
+                >Password field is required</span
+              >
+            </div>
+            <div ng-message="pattern">
+              <span translate="RESETPASSWORD.ERRORS.SECURE_PASSWORD_PATTERN"
+                >Must contain at least 8 characters, with a minimum of 1
+                lowercase letter, 1 uppercase letter, 1 numeric character and 1
+                special character ~!?*@#$%^&-_=+[{]}.</span
+              >
+            </div>
+          </div>
+        </md-input-container>
+
+        <md-input-container class="md-block" md-no-float>
+          <input
+            type="password"
+            name="passwordConfirm"
+            ng-model="vm.form.passwordConfirm"
+            placeholder="Password (Confirm)"
+            match-password="password"
+            translate
+            translate-attr-placeholder="RESETPASSWORD.PASSWORD_CONFIRM"
+          />
+          <div
+            ng-messages="resetPasswordForm.passwordConfirm.$error"
+            role="alert"
+          >
+            <div ng-message="passwordMatch">
+              <span translate="TOOLBAR.ERRORS.CONFIRM_NOT_MATCH"
+                >Your password did not match</span
+              >
+            </div>
+          </div>
+        </md-input-container>
+
+        <md-button
+          type="button"
+          ng-click="vm.resetPassword()"
+          class="md-raised md-accent submit-button"
+          aria-label="UPDATE MY PASSWORD"
+          ng-disabled="resetPasswordForm.$invalid || resetPasswordForm.$pristine"
+          translate="RESETPASSWORD.UPDATE_PASSWORD"
+          translate-attr-aria-label="RESETPASSWORD.UPDATE_PASSWORD"
+        >
+          RESET MY PASSWORD
+        </md-button>
+      </form>
+    </div>
+  </div>
+</div>
diff --git a/public/src/js/modules/toolbar/changepassword/changepassword.html/changepassword-[chunkhash].html b/public/src/js/modules/toolbar/changepassword/changepassword.html/changepassword-[chunkhash].html
deleted file mode 100644
index 755e98c..0000000
--- a/public/src/js/modules/toolbar/changepassword/changepassword.html/changepassword-[chunkhash].html
+++ /dev/null
@@ -1,162 +0,0 @@
-<md-dialog class="user-dialog" aria-label="{{vm.name}}">
-  <form name="changePasswordForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-accent md-hue-2">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span ng-if="vm.reset" class="title" translate="TOOLBAR.RESETPASSWORD"
-          >Reset Password</span
-        >
-        <span ng-if="!vm.reset" class="title" translate="TOOLBAR.CHANGEPASSWORD"
-          >Change Password</span
-        >
-        <md-button
-          ng-if="!vm.reset"
-          class="md-icon-button"
-          ng-click="vm.closeDialog()"
-        >
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-    <md-dialog-content ms-scroll>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-      <md-input-container class="md-block">
-        <label translate="TOOLBAR.OLD_PASSWORD">Old Password</label>
-        <input
-          type="password"
-          name="oldPassword"
-          ng-model="vm.oldPassword"
-          placeholder="Password"
-          translate
-          translate-attr-placeholder="TOOLBAR.OLD_PASSWORD"
-          required
-        />
-        <div ng-messages="changePasswordForm.oldPassword.$error" role="alert">
-          <div ng-message="required">
-            <span translate="TOOLBAR.ERRORS.PASSWORD_REQUIRED"
-              >Password field is required</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="TOOLBAR.NEW_PASSWORD">New Password</label>
-        <input
-          type="password"
-          name="password"
-          ng-model="vm.password"
-          placeholder="Password"
-          ng-pattern="vm.passwordPattern"
-          translate
-          translate-attr-placeholder="TOOLBAR.NEW_PASSWORD"
-          required
-        />
-        <div ng-messages="changePasswordForm.password.$error" role="alert">
-          <div ng-message="required">
-            <span translate="TOOLBAR.ERRORS.PASSWORD_REQUIRED"
-              >Password field is required</span
-            >
-          </div>
-          <div ng-message="pattern">
-            <span translate="TOOLBAR.ERRORS.SECURE_PASSWORD_PATTERN"
-              >Must contain at least 8 characters, with a minimum of 1 lowercase
-              letter, 1 uppercase letter, 1 numeric character and 1 special
-              character ~!?*@#$%^&-_=+[{]}.</span
-            >
-          </div>
-          <div ng-message="oldPasswordMatch">
-            <span translate="TOOLBAR.ERRORS.PASSWORD_OLDPASSWORD_MATCH"
-              >New password must be different from old one</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <md-input-container class="md-block">
-        <label translate="TOOLBAR.CONFIRM_PASSWORD">Confirm Password</label>
-        <input
-          type="password"
-          match-password="password"
-          name="confirmPassword"
-          ng-model="confirmPassword"
-        />
-        <div
-          ng-messages="changePasswordForm.confirmPassword.$error"
-          role="alert"
-          multiple
-        >
-          <div ng-message="required">
-            <span translate="TOOLBAR.ERRORS.CONFIRM_REQUIRED"
-              >Confirm field is required</span
-            >
-          </div>
-          <div ng-message="passwordMatch">
-            <span translate="TOOLBAR.ERRORS.CONFIRM_NOT_MATCH"
-              >Your password did not match</span
-            >
-          </div>
-        </div>
-      </md-input-container>
-      <div class="error-list">
-        <div
-          ng-repeat="error in vm.errors"
-          class="error"
-          layout="row"
-          layout-align="space-between center"
-        >
-          <div>
-            <span class="message">{{error.message}}</span>
-            <span class="type">({{error.type}})</span>
-          </div>
-          <md-button class="md-icon-button">
-            <md-icon
-              md-font-icon="icon-alert-box"
-              aria-label="alert error"
-              class="s16"
-            ></md-icon>
-          </md-button>
-        </div>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions layout="row" layout-align="space-between center">
-      <div layout="row" layout-align="start center">
-        <md-button
-          type="submit"
-          ng-click="vm.savePassword()"
-          class="send-button md-accent md-raised"
-          ng-disabled="changePasswordForm.$invalid || changePasswordForm.$pristine"
-          aria-label="SAVE"
-          translate="TOOLBAR.SAVE"
-          translate-attr-aria-label="TOOLBAR.SAVE"
-        >
-          SAVE
-        </md-button>
-      </div>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/toolbar/changepassword/changepassword.html/changepassword.html b/public/src/js/modules/toolbar/changepassword/changepassword.html/changepassword.html
new file mode 100644
index 0000000..755e98c
--- /dev/null
+++ b/public/src/js/modules/toolbar/changepassword/changepassword.html/changepassword.html
@@ -0,0 +1,162 @@
+<md-dialog class="user-dialog" aria-label="{{vm.name}}">
+  <form name="changePasswordForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-accent md-hue-2">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span ng-if="vm.reset" class="title" translate="TOOLBAR.RESETPASSWORD"
+          >Reset Password</span
+        >
+        <span ng-if="!vm.reset" class="title" translate="TOOLBAR.CHANGEPASSWORD"
+          >Change Password</span
+        >
+        <md-button
+          ng-if="!vm.reset"
+          class="md-icon-button"
+          ng-click="vm.closeDialog()"
+        >
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+    <md-dialog-content ms-scroll>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+      <md-input-container class="md-block">
+        <label translate="TOOLBAR.OLD_PASSWORD">Old Password</label>
+        <input
+          type="password"
+          name="oldPassword"
+          ng-model="vm.oldPassword"
+          placeholder="Password"
+          translate
+          translate-attr-placeholder="TOOLBAR.OLD_PASSWORD"
+          required
+        />
+        <div ng-messages="changePasswordForm.oldPassword.$error" role="alert">
+          <div ng-message="required">
+            <span translate="TOOLBAR.ERRORS.PASSWORD_REQUIRED"
+              >Password field is required</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="TOOLBAR.NEW_PASSWORD">New Password</label>
+        <input
+          type="password"
+          name="password"
+          ng-model="vm.password"
+          placeholder="Password"
+          ng-pattern="vm.passwordPattern"
+          translate
+          translate-attr-placeholder="TOOLBAR.NEW_PASSWORD"
+          required
+        />
+        <div ng-messages="changePasswordForm.password.$error" role="alert">
+          <div ng-message="required">
+            <span translate="TOOLBAR.ERRORS.PASSWORD_REQUIRED"
+              >Password field is required</span
+            >
+          </div>
+          <div ng-message="pattern">
+            <span translate="TOOLBAR.ERRORS.SECURE_PASSWORD_PATTERN"
+              >Must contain at least 8 characters, with a minimum of 1 lowercase
+              letter, 1 uppercase letter, 1 numeric character and 1 special
+              character ~!?*@#$%^&-_=+[{]}.</span
+            >
+          </div>
+          <div ng-message="oldPasswordMatch">
+            <span translate="TOOLBAR.ERRORS.PASSWORD_OLDPASSWORD_MATCH"
+              >New password must be different from old one</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <md-input-container class="md-block">
+        <label translate="TOOLBAR.CONFIRM_PASSWORD">Confirm Password</label>
+        <input
+          type="password"
+          match-password="password"
+          name="confirmPassword"
+          ng-model="confirmPassword"
+        />
+        <div
+          ng-messages="changePasswordForm.confirmPassword.$error"
+          role="alert"
+          multiple
+        >
+          <div ng-message="required">
+            <span translate="TOOLBAR.ERRORS.CONFIRM_REQUIRED"
+              >Confirm field is required</span
+            >
+          </div>
+          <div ng-message="passwordMatch">
+            <span translate="TOOLBAR.ERRORS.CONFIRM_NOT_MATCH"
+              >Your password did not match</span
+            >
+          </div>
+        </div>
+      </md-input-container>
+      <div class="error-list">
+        <div
+          ng-repeat="error in vm.errors"
+          class="error"
+          layout="row"
+          layout-align="space-between center"
+        >
+          <div>
+            <span class="message">{{error.message}}</span>
+            <span class="type">({{error.type}})</span>
+          </div>
+          <md-button class="md-icon-button">
+            <md-icon
+              md-font-icon="icon-alert-box"
+              aria-label="alert error"
+              class="s16"
+            ></md-icon>
+          </md-button>
+        </div>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions layout="row" layout-align="space-between center">
+      <div layout="row" layout-align="start center">
+        <md-button
+          type="submit"
+          ng-click="vm.savePassword()"
+          class="send-button md-accent md-raised"
+          ng-disabled="changePasswordForm.$invalid || changePasswordForm.$pristine"
+          aria-label="SAVE"
+          translate="TOOLBAR.SAVE"
+          translate-attr-aria-label="TOOLBAR.SAVE"
+        >
+          SAVE
+        </md-button>
+      </div>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/public/src/js/modules/toolbar/layouts/vertical-navigation/toolbar.html/toolbar-[chunkhash].html b/public/src/js/modules/toolbar/layouts/vertical-navigation/toolbar.html/toolbar-[chunkhash].html
deleted file mode 100644
index 222b835..0000000
--- a/public/src/js/modules/toolbar/layouts/vertical-navigation/toolbar.html/toolbar-[chunkhash].html
+++ /dev/null
@@ -1,357 +0,0 @@
-<div layout="row" layout-align="start center">
-  <div layout="row" layout-align="start center" flex>
-    <md-button
-      id="navigation-toggle"
-      class="md-icon-button"
-      ng-click="vm.toggleSidenav('navigation')"
-      ng-if="!vm.isAgent()"
-      hide-gt-sm
-      aria-label="Toggle navigation"
-      translate
-      translate-attr-aria-label="TOOLBAR.TOGGLE_NAVIGATION"
-    >
-      <md-icon md-font-icon="icon-menu" class="icon"></md-icon>
-    </md-button>
-
-    <ms-shortcuts ng-if="!vm.isAgent()"></ms-shortcuts>
-
-    <div class="toolbar-separator"></div>
-
-    <div ng-if="vm.license.demo" class="blink md-padding">
-      <span class="md-warn-fg" translate="TOOLBAR.TRIAL_VERSION"
-        >Trial Version</span
-      >
-    </div>
-
-    <div
-      ng-if="vm.isAgent()"
-      class="logo"
-      layout-padding-left-8
-      layout="row"
-      layout-align="start center"
-    >
-      <span class="logo-image"
-        ><img ng-src="{{vm.baseUrl}}settings/1/logo" alt="logo"
-      /></span>
-      <span
-        ng-show="vm.isAgent() && (vm.user.showWebBar != 2)"
-        class="logo-text text-truncate"
-        >{{ vm.getLogo() | uppercase }}</span
-      >
-    </div>
-
-    <!-- phonebar directive WebRtc type-->
-    <ms-phonebar
-      class="ms-phonebar"
-      ng-if="vm.isAgent() && (vm.user.showWebBar == 2)"
-      conf="vm.conf"
-      flex
-    ></ms-phonebar>
-    <!-- phonebar directive -->
-  </div>
-
-  <div layout="row" layout-align="start center">
-    <md-progress-circular
-      id="toolbar-progress"
-      ng-if="$root.loadingProgress"
-      class="md-accent"
-      md-diameter="32"
-    ></md-progress-circular>
-
-    <!-- Pause Management -->
-    <div
-      ng-if="vm.isAgent() && (vm.user.showWebBar != 0)"
-      layout="row"
-      layout-align="end center"
-    >
-      <div class="toolbar-separator"></div>
-
-      <div
-        class="border brad-5"
-        layout="row"
-        layout-align="center center"
-        layout-margin
-      >
-        <md-button
-          ng-if="vm.user.voicePause"
-          class="md-icon-button no-margin"
-          ng-click="vm.unpause()"
-        >
-          <md-icon
-            md-font-icon="icon-play-circle-outline"
-            class="icon s24"
-          ></md-icon>
-          <md-tooltip md-direction="bottom"
-            >{{'TOOLBAR.RESUME' | translate}}</md-tooltip
-          >
-        </md-button>
-
-        <md-button
-          ng-disabled="vm.user.voicePause && 'DEFAULT PAUSE' === vm.user.pauseType"
-          class="md-icon-button no-margin"
-          ng-click="vm.pause()"
-        >
-          <md-icon
-            md-font-icon="icon-pause-circle-outline"
-            class="icon s24"
-          ></md-icon>
-          <md-tooltip md-direction="bottom"
-            >{{'TOOLBAR.PAUSE' | translate}}</md-tooltip
-          >
-        </md-button>
-
-        <md-menu>
-          <md-button
-            aria-label="Pauses"
-            class="md-icon-button no-margin"
-            ng-click="$mdMenu.open($event)"
-          >
-            <md-icon md-menu-origin md-font-icon="icon-dots-vertical"></md-icon>
-          </md-button>
-          <md-menu-content width="4">
-            <md-menu-item ng-if="!vm.pauses.length">
-              <md-button disabled="disabled">
-                <md-icon
-                  md-font-icon="icon-pause-octagon"
-                  md-menu-align-target
-                ></md-icon>
-                {{'TOOLBAR.NO_PAUSES_AVAILABLE' | translate}}
-              </md-button>
-            </md-menu-item>
-            <md-menu-item ng-repeat="pause in vm.pauses">
-              <md-button
-                ng-disabled="vm.user.voicePause && pause.name === vm.user.pauseType"
-                ng-click="vm.pause(pause.name)"
-              >
-                <md-icon
-                  md-font-icon="icon-pause-circle"
-                  md-menu-align-target
-                ></md-icon>
-                {{pause.name}}
-              </md-button>
-            </md-menu-item>
-          </md-menu-content>
-        </md-menu>
-      </div>
-    </div>
-    <!-- Pause Management -->
-
-    <div
-      class="h5 padding-10"
-      ng-if="vm.isAgent() && (vm.user.showWebBar != 0)"
-    >
-      <div layout="row" layout-align="space-between center">
-        <timer ng-if="vm.user.lastLoginAt" start-time="vm.user.lastLoginAt"
-          >{{ days > 0 ? days + 'd' : '' }}
-          {{hhours}}:{{mminutes}}:{{sseconds}}</timer
-        >
-        <md-tooltip>{{'TOOLBAR.LOGIN_TIME' | translate}}</md-tooltip>
-        <md-icon md-font-icon="icon-timelapse" class="icon s16"></md-icon>
-      </div>
-      <div layout="row" layout-align="center center" ng-if="vm.user.voicePause">
-        <timer start-time="vm.user.lastPauseAt"
-          >{{ days > 0 ? days + 'd' : '' }}
-          {{hhours}}:{{mminutes}}:{{sseconds}}</timer
-        >
-        <md-tooltip>{{'TOOLBAR.PAUSE_TIME' | translate}}</md-tooltip>
-        <md-icon md-font-icon="icon-coffee" class="icon s16"></md-icon>
-      </div>
-      <div ng-if="vm.user.voicePause">
-        <span class="blink red-fg"
-          >{{vm.user.pauseType || 'default' | uppercase}}</span
-        >
-      </div>
-    </div>
-
-    <div
-      class="toolbar-separator"
-      ng-if="vm.isAgent() && (vm.user.showWebBar != 0)"
-    ></div>
-
-    <md-menu-bar id="user-menu">
-      <md-menu md-position-mode="left bottom">
-        <md-button
-          class="user-button"
-          ng-click="$mdMenu.open()"
-          aria-label="User settings"
-          translate
-          translate-attr-aria-label="TOOLBAR.USER_SETTINGS"
-        >
-          <div layout="row" layout-align="space-between center">
-            <div class="avatar-wrapper">
-              <img
-                md-menu-align-target
-                class="avatar"
-                src="assets/images/avatars/profile.png"
-                ng-if="!vm.user.userpic"
-              />
-              <img
-                md-menu-align-target
-                class="avatar"
-                ng-src="api/users/{{vm.user.id}}/avatar"
-                ng-if="vm.user.userpic"
-              />
-              <md-icon
-                md-font-icon
-                ng-class="vm.userStatus.icon"
-                ng-style="{'color': vm.userStatus.color }"
-                class="icon status s16"
-              ></md-icon>
-            </div>
-            <div
-              layout="column"
-              layout-align="center center"
-              class="padding-horizontal-5"
-            >
-              <span class="font-size-14 md-subhead">{{vm.user.fullname}}</span>
-              <span class="font-size-12 md-subhead"
-                >{{vm.user.name}} &#60;{{vm.user.internal}}&#62;</span
-              >
-            </div>
-
-            <md-icon
-              md-font-icon="icon-chevron-down"
-              class="icon s16"
-              hide-xs
-            ></md-icon>
-          </div>
-        </md-button>
-
-        <md-menu-content width="3">
-          <md-menu-item
-            ng-if="vm.user.showWebBar == 2 && vm.user.phoneBarEnableSettings"
-            class="md-indent"
-          >
-            <md-icon md-font-icon="icon-cog" class="icon"></md-icon>
-            <md-button
-              ng-click="vm.openSettings($event)"
-              ng-disabled="!vm.license.webrtc"
-              ><span translate="TOOLBAR.SETTINGS">SETTINGS</span></md-button
-            >
-          </md-menu-item>
-
-          <md-menu-item class="md-indent">
-            <md-icon md-font-icon="icon-key-variant" class="icon"></md-icon>
-            <md-button ng-click="vm.changePassword($event)"
-              ><span translate="TOOLBAR.CHANGEPASSWORD"
-                >Change Password</span
-              ></md-button
-            >
-          </md-menu-item>
-
-          <md-menu-divider></md-menu-divider>
-
-          <md-menu-item class="md-indent">
-            <md-icon md-font-icon="icon-logout" class="icon"></md-icon>
-            <md-button ng-click="vm.logout()">Logout</md-button>
-          </md-menu-item>
-        </md-menu-content>
-      </md-menu>
-    </md-menu-bar>
-
-    <div class="toolbar-separator"></div>
-
-    <md-button
-      ng-if="vm.user.role === 'agent' && vm.license.dialer"
-      class="preview-button no-margin"
-      ng-disabled="vm.disable"
-      ng-click="vm.preview($event)"
-      aria-label="Language"
-      md-menu-origin
-      md-menu-align-target
-    >
-      <div ng-if="vm.contacts" class="md-accent-bg open-contact-count">
-        {{vm.contacts > 99 ? '99+' : vm.contacts}}
-      </div>
-      <md-icon md-font-icon="icon-fire" class="icon red-900-fg"></md-icon>
-      <md-tooltip><span translate="TOOLBAR.PREVIEW">Preview</span></md-tooltip>
-    </md-button>
-
-    <ms-search-bar
-      ng-if="vm.user.role !== 'agent'"
-      on-search="vm.search(query)"
-      on-result-click="vm.searchResultClick(item)"
-      debounce="300"
-      collapse-on-blur="true"
-    ></ms-search-bar>
-
-    <md-menu
-      id="language-menu"
-      md-offset="0 72"
-      md-position-mode="target-right target"
-      layout="column"
-      layout-align="center center"
-    >
-      <md-button
-        class="md-icon-button no-margin"
-        ng-click="$mdMenu.open()"
-        aria-label="Language"
-        md-menu-origin
-        md-menu-align-target
-      >
-        <div layout="row" layout-align="center center">
-          <img
-            class="flag"
-            ng-src="assets/images/flags/{{vm.selectedLanguage.flag}}.png"
-          />
-        </div>
-      </md-button>
-
-      <md-menu-content width="3" id="language-menu-content">
-        <md-menu-item ng-repeat="(iso, lang) in vm.languages">
-          <md-button
-            ng-click="vm.changeLanguage(lang)"
-            aria-label="{{lang.title}}"
-            translate
-            translate-attr-aria-label="{{lang.title}}"
-          >
-            <span layout="row" layout-align="start center">
-              <img
-                class="flag flag-24"
-                ng-src="assets/images/flags/{{lang.flag}}.png"
-              />
-              <span translate="{{lang.translation}}">{{lang.title}}</span>
-            </span>
-          </md-button>
-        </md-menu-item>
-      </md-menu-content>
-    </md-menu>
-
-    <div class="toolbar-separator"></div>
-
-    <md-button
-      ng-if="vm.license.gray && vm.user.role !== 'agent'"
-      class="md-icon-button"
-      ui-sref="app.settings.license"
-      aria-label="Toggle quick panel"
-    >
-      <md-icon md-font-icon="icon-alert" class="icon md-warn blink"></md-icon>
-    </md-button>
-    <md-button
-      ng-if="vm.license.gray && vm.user.role === 'agent'"
-      class="md-icon-button"
-      aria-label="Toggle quick panel"
-    >
-      <md-icon md-font-icon="icon-alert" class="icon md-warn blink"></md-icon>
-    </md-button>
-
-    <div ng-if="vm.license.gray" class="toolbar-separator"></div>
-
-    <md-button
-      id="quick-panel-toggle"
-      class="md-icon-button"
-      ng-click="vm.toggleSidenav('quick-panel')"
-      aria-label="Toggle quick panel"
-      translate
-      translate-attr-aria-label="TOOLBAR.TOGGLE_QUICK_PANEL"
-    >
-      <div
-        ng-if="(vm.unreadTotalMessages + vm.unreadTotalGroupMessages)"
-        class="md-accent-bg unread-message-count"
-      >
-        {{vm.unreadTotalMessages + vm.unreadTotalGroupMessages}}
-      </div>
-      <md-icon md-font-icon="icon-format-list-bulleted" class="icon"></md-icon>
-    </md-button>
-  </div>
-</div>
diff --git a/public/src/js/modules/toolbar/layouts/vertical-navigation/toolbar.html/toolbar.html b/public/src/js/modules/toolbar/layouts/vertical-navigation/toolbar.html/toolbar.html
new file mode 100644
index 0000000..222b835
--- /dev/null
+++ b/public/src/js/modules/toolbar/layouts/vertical-navigation/toolbar.html/toolbar.html
@@ -0,0 +1,357 @@
+<div layout="row" layout-align="start center">
+  <div layout="row" layout-align="start center" flex>
+    <md-button
+      id="navigation-toggle"
+      class="md-icon-button"
+      ng-click="vm.toggleSidenav('navigation')"
+      ng-if="!vm.isAgent()"
+      hide-gt-sm
+      aria-label="Toggle navigation"
+      translate
+      translate-attr-aria-label="TOOLBAR.TOGGLE_NAVIGATION"
+    >
+      <md-icon md-font-icon="icon-menu" class="icon"></md-icon>
+    </md-button>
+
+    <ms-shortcuts ng-if="!vm.isAgent()"></ms-shortcuts>
+
+    <div class="toolbar-separator"></div>
+
+    <div ng-if="vm.license.demo" class="blink md-padding">
+      <span class="md-warn-fg" translate="TOOLBAR.TRIAL_VERSION"
+        >Trial Version</span
+      >
+    </div>
+
+    <div
+      ng-if="vm.isAgent()"
+      class="logo"
+      layout-padding-left-8
+      layout="row"
+      layout-align="start center"
+    >
+      <span class="logo-image"
+        ><img ng-src="{{vm.baseUrl}}settings/1/logo" alt="logo"
+      /></span>
+      <span
+        ng-show="vm.isAgent() && (vm.user.showWebBar != 2)"
+        class="logo-text text-truncate"
+        >{{ vm.getLogo() | uppercase }}</span
+      >
+    </div>
+
+    <!-- phonebar directive WebRtc type-->
+    <ms-phonebar
+      class="ms-phonebar"
+      ng-if="vm.isAgent() && (vm.user.showWebBar == 2)"
+      conf="vm.conf"
+      flex
+    ></ms-phonebar>
+    <!-- phonebar directive -->
+  </div>
+
+  <div layout="row" layout-align="start center">
+    <md-progress-circular
+      id="toolbar-progress"
+      ng-if="$root.loadingProgress"
+      class="md-accent"
+      md-diameter="32"
+    ></md-progress-circular>
+
+    <!-- Pause Management -->
+    <div
+      ng-if="vm.isAgent() && (vm.user.showWebBar != 0)"
+      layout="row"
+      layout-align="end center"
+    >
+      <div class="toolbar-separator"></div>
+
+      <div
+        class="border brad-5"
+        layout="row"
+        layout-align="center center"
+        layout-margin
+      >
+        <md-button
+          ng-if="vm.user.voicePause"
+          class="md-icon-button no-margin"
+          ng-click="vm.unpause()"
+        >
+          <md-icon
+            md-font-icon="icon-play-circle-outline"
+            class="icon s24"
+          ></md-icon>
+          <md-tooltip md-direction="bottom"
+            >{{'TOOLBAR.RESUME' | translate}}</md-tooltip
+          >
+        </md-button>
+
+        <md-button
+          ng-disabled="vm.user.voicePause && 'DEFAULT PAUSE' === vm.user.pauseType"
+          class="md-icon-button no-margin"
+          ng-click="vm.pause()"
+        >
+          <md-icon
+            md-font-icon="icon-pause-circle-outline"
+            class="icon s24"
+          ></md-icon>
+          <md-tooltip md-direction="bottom"
+            >{{'TOOLBAR.PAUSE' | translate}}</md-tooltip
+          >
+        </md-button>
+
+        <md-menu>
+          <md-button
+            aria-label="Pauses"
+            class="md-icon-button no-margin"
+            ng-click="$mdMenu.open($event)"
+          >
+            <md-icon md-menu-origin md-font-icon="icon-dots-vertical"></md-icon>
+          </md-button>
+          <md-menu-content width="4">
+            <md-menu-item ng-if="!vm.pauses.length">
+              <md-button disabled="disabled">
+                <md-icon
+                  md-font-icon="icon-pause-octagon"
+                  md-menu-align-target
+                ></md-icon>
+                {{'TOOLBAR.NO_PAUSES_AVAILABLE' | translate}}
+              </md-button>
+            </md-menu-item>
+            <md-menu-item ng-repeat="pause in vm.pauses">
+              <md-button
+                ng-disabled="vm.user.voicePause && pause.name === vm.user.pauseType"
+                ng-click="vm.pause(pause.name)"
+              >
+                <md-icon
+                  md-font-icon="icon-pause-circle"
+                  md-menu-align-target
+                ></md-icon>
+                {{pause.name}}
+              </md-button>
+            </md-menu-item>
+          </md-menu-content>
+        </md-menu>
+      </div>
+    </div>
+    <!-- Pause Management -->
+
+    <div
+      class="h5 padding-10"
+      ng-if="vm.isAgent() && (vm.user.showWebBar != 0)"
+    >
+      <div layout="row" layout-align="space-between center">
+        <timer ng-if="vm.user.lastLoginAt" start-time="vm.user.lastLoginAt"
+          >{{ days > 0 ? days + 'd' : '' }}
+          {{hhours}}:{{mminutes}}:{{sseconds}}</timer
+        >
+        <md-tooltip>{{'TOOLBAR.LOGIN_TIME' | translate}}</md-tooltip>
+        <md-icon md-font-icon="icon-timelapse" class="icon s16"></md-icon>
+      </div>
+      <div layout="row" layout-align="center center" ng-if="vm.user.voicePause">
+        <timer start-time="vm.user.lastPauseAt"
+          >{{ days > 0 ? days + 'd' : '' }}
+          {{hhours}}:{{mminutes}}:{{sseconds}}</timer
+        >
+        <md-tooltip>{{'TOOLBAR.PAUSE_TIME' | translate}}</md-tooltip>
+        <md-icon md-font-icon="icon-coffee" class="icon s16"></md-icon>
+      </div>
+      <div ng-if="vm.user.voicePause">
+        <span class="blink red-fg"
+          >{{vm.user.pauseType || 'default' | uppercase}}</span
+        >
+      </div>
+    </div>
+
+    <div
+      class="toolbar-separator"
+      ng-if="vm.isAgent() && (vm.user.showWebBar != 0)"
+    ></div>
+
+    <md-menu-bar id="user-menu">
+      <md-menu md-position-mode="left bottom">
+        <md-button
+          class="user-button"
+          ng-click="$mdMenu.open()"
+          aria-label="User settings"
+          translate
+          translate-attr-aria-label="TOOLBAR.USER_SETTINGS"
+        >
+          <div layout="row" layout-align="space-between center">
+            <div class="avatar-wrapper">
+              <img
+                md-menu-align-target
+                class="avatar"
+                src="assets/images/avatars/profile.png"
+                ng-if="!vm.user.userpic"
+              />
+              <img
+                md-menu-align-target
+                class="avatar"
+                ng-src="api/users/{{vm.user.id}}/avatar"
+                ng-if="vm.user.userpic"
+              />
+              <md-icon
+                md-font-icon
+                ng-class="vm.userStatus.icon"
+                ng-style="{'color': vm.userStatus.color }"
+                class="icon status s16"
+              ></md-icon>
+            </div>
+            <div
+              layout="column"
+              layout-align="center center"
+              class="padding-horizontal-5"
+            >
+              <span class="font-size-14 md-subhead">{{vm.user.fullname}}</span>
+              <span class="font-size-12 md-subhead"
+                >{{vm.user.name}} &#60;{{vm.user.internal}}&#62;</span
+              >
+            </div>
+
+            <md-icon
+              md-font-icon="icon-chevron-down"
+              class="icon s16"
+              hide-xs
+            ></md-icon>
+          </div>
+        </md-button>
+
+        <md-menu-content width="3">
+          <md-menu-item
+            ng-if="vm.user.showWebBar == 2 && vm.user.phoneBarEnableSettings"
+            class="md-indent"
+          >
+            <md-icon md-font-icon="icon-cog" class="icon"></md-icon>
+            <md-button
+              ng-click="vm.openSettings($event)"
+              ng-disabled="!vm.license.webrtc"
+              ><span translate="TOOLBAR.SETTINGS">SETTINGS</span></md-button
+            >
+          </md-menu-item>
+
+          <md-menu-item class="md-indent">
+            <md-icon md-font-icon="icon-key-variant" class="icon"></md-icon>
+            <md-button ng-click="vm.changePassword($event)"
+              ><span translate="TOOLBAR.CHANGEPASSWORD"
+                >Change Password</span
+              ></md-button
+            >
+          </md-menu-item>
+
+          <md-menu-divider></md-menu-divider>
+
+          <md-menu-item class="md-indent">
+            <md-icon md-font-icon="icon-logout" class="icon"></md-icon>
+            <md-button ng-click="vm.logout()">Logout</md-button>
+          </md-menu-item>
+        </md-menu-content>
+      </md-menu>
+    </md-menu-bar>
+
+    <div class="toolbar-separator"></div>
+
+    <md-button
+      ng-if="vm.user.role === 'agent' && vm.license.dialer"
+      class="preview-button no-margin"
+      ng-disabled="vm.disable"
+      ng-click="vm.preview($event)"
+      aria-label="Language"
+      md-menu-origin
+      md-menu-align-target
+    >
+      <div ng-if="vm.contacts" class="md-accent-bg open-contact-count">
+        {{vm.contacts > 99 ? '99+' : vm.contacts}}
+      </div>
+      <md-icon md-font-icon="icon-fire" class="icon red-900-fg"></md-icon>
+      <md-tooltip><span translate="TOOLBAR.PREVIEW">Preview</span></md-tooltip>
+    </md-button>
+
+    <ms-search-bar
+      ng-if="vm.user.role !== 'agent'"
+      on-search="vm.search(query)"
+      on-result-click="vm.searchResultClick(item)"
+      debounce="300"
+      collapse-on-blur="true"
+    ></ms-search-bar>
+
+    <md-menu
+      id="language-menu"
+      md-offset="0 72"
+      md-position-mode="target-right target"
+      layout="column"
+      layout-align="center center"
+    >
+      <md-button
+        class="md-icon-button no-margin"
+        ng-click="$mdMenu.open()"
+        aria-label="Language"
+        md-menu-origin
+        md-menu-align-target
+      >
+        <div layout="row" layout-align="center center">
+          <img
+            class="flag"
+            ng-src="assets/images/flags/{{vm.selectedLanguage.flag}}.png"
+          />
+        </div>
+      </md-button>
+
+      <md-menu-content width="3" id="language-menu-content">
+        <md-menu-item ng-repeat="(iso, lang) in vm.languages">
+          <md-button
+            ng-click="vm.changeLanguage(lang)"
+            aria-label="{{lang.title}}"
+            translate
+            translate-attr-aria-label="{{lang.title}}"
+          >
+            <span layout="row" layout-align="start center">
+              <img
+                class="flag flag-24"
+                ng-src="assets/images/flags/{{lang.flag}}.png"
+              />
+              <span translate="{{lang.translation}}">{{lang.title}}</span>
+            </span>
+          </md-button>
+        </md-menu-item>
+      </md-menu-content>
+    </md-menu>
+
+    <div class="toolbar-separator"></div>
+
+    <md-button
+      ng-if="vm.license.gray && vm.user.role !== 'agent'"
+      class="md-icon-button"
+      ui-sref="app.settings.license"
+      aria-label="Toggle quick panel"
+    >
+      <md-icon md-font-icon="icon-alert" class="icon md-warn blink"></md-icon>
+    </md-button>
+    <md-button
+      ng-if="vm.license.gray && vm.user.role === 'agent'"
+      class="md-icon-button"
+      aria-label="Toggle quick panel"
+    >
+      <md-icon md-font-icon="icon-alert" class="icon md-warn blink"></md-icon>
+    </md-button>
+
+    <div ng-if="vm.license.gray" class="toolbar-separator"></div>
+
+    <md-button
+      id="quick-panel-toggle"
+      class="md-icon-button"
+      ng-click="vm.toggleSidenav('quick-panel')"
+      aria-label="Toggle quick panel"
+      translate
+      translate-attr-aria-label="TOOLBAR.TOGGLE_QUICK_PANEL"
+    >
+      <div
+        ng-if="(vm.unreadTotalMessages + vm.unreadTotalGroupMessages)"
+        class="md-accent-bg unread-message-count"
+      >
+        {{vm.unreadTotalMessages + vm.unreadTotalGroupMessages}}
+      </div>
+      <md-icon md-font-icon="icon-format-list-bulleted" class="icon"></md-icon>
+    </md-button>
+  </div>
+</div>
diff --git a/public/src/js/modules/toolbar/preview/dialog.html/dialog-[chunkhash].html b/public/src/js/modules/toolbar/preview/dialog.html/dialog-[chunkhash].html
deleted file mode 100644
index df276a8..0000000
--- a/public/src/js/modules/toolbar/preview/dialog.html/dialog-[chunkhash].html
+++ /dev/null
@@ -1,138 +0,0 @@
-<md-dialog class="preview-dialog" aria-label="preview">
-  <form name="previewForm" class="md-inline-form" novalidate>
-    <md-toolbar class="md-background-bg">
-      <div
-        class="md-toolbar-tools"
-        layout="row"
-        layout-align="space-between center"
-      >
-        <span class="title">Preview</span>
-        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
-          <md-icon
-            md-font-icon="icon-close"
-            aria-label="Close dialog"
-          ></md-icon>
-        </md-button>
-      </div>
-    </md-toolbar>
-
-    <md-dialog-content ms-scroll>
-      <div layout="row" ng-if="vm.preview">
-        <div class="md-padding md-margin" layout="column" flex="30">
-          <md-input-container
-            ng-if="vm.preview.Contact.id"
-            class="md-block no-margin"
-          >
-            <label translate="CONTACTMANAGER.ID">ID</label>
-            <input
-              type="text"
-              ng-model="vm.preview.Contact.id"
-              disabled="true"
-            />
-          </md-input-container>
-          <md-input-container
-            ng-if="vm.preview.Queue.name"
-            class="md-block no-margin"
-          >
-            <label translate="VOICE.QUEUE">Queue</label>
-            <input
-              type="text"
-              ng-model="vm.preview.Queue.name"
-              disabled="true"
-            />
-          </md-input-container>
-          <md-input-container
-            ng-if="vm.preview.List.name"
-            class="md-block no-margin"
-          >
-            <label translate="CONTACTMANAGER.LIST">List</label>
-            <input
-              type="text"
-              ng-model="vm.preview.List.name"
-              disabled="true"
-            />
-          </md-input-container>
-          <md-input-container
-            ng-if="vm.preview.Contact.tags && vm.preview.Contact.tags.length"
-            class="md-block no-margin"
-          >
-            <label translate="CONTACTMANAGER.TAGS">Tags</label>
-            <input
-              type="text"
-              ng-model="vm.preview.Contact.tags"
-              disabled="true"
-            />
-          </md-input-container>
-          <md-input-container
-            ng-if="vm.preview.Contact.Company && vm.preview.Contact.Company.name"
-            class="md-block no-margin"
-          >
-            <label translate="CONTACTMANAGER.COMPANY">Company</label>
-            <input
-              type="text"
-              ng-model="vm.preview.Contact.Company.name"
-              disabled="true"
-            />
-          </md-input-container>
-        </div>
-        <md-divider></md-divider>
-        <div class="md-padding md-margin" layout="column" flex="35">
-          <md-input-container
-            ng-repeat="(key, value) in vm.preview.Contact"
-            ng-if="!vm.isNil(value) && !vm.isCustomField(key) && !vm.isHiddenField(key)"
-            class="md-block no-margin"
-          >
-            <label
-              >{{ 'CONTACTMANAGER.' + key.toUpperCase() | translate}}</label
-            >
-            <input type="text" ng-model="value" disabled="true" />
-          </md-input-container>
-        </div>
-        <div class="md-padding md-margin" layout="column" flex="35">
-          <md-input-container
-            ng-repeat="(key, value) in vm.preview.Contact"
-            ng-if="!vm.isNil(value) && vm.isCustomField(key) && !vm.isHiddenField(key)"
-            class="md-block no-margin"
-          >
-            <label>{{ vm.customFieldsMap[key] || key }}</label>
-            <input type="text" ng-model="value" disabled="true" />
-          </md-input-container>
-        </div>
-      </div>
-      <div layout="row" ng-if="!vm.preview">
-        <span>no contacts available</span>
-      </div>
-    </md-dialog-content>
-
-    <md-dialog-actions class="md-dialog-action-center padding-rigth-15">
-      <md-button
-        class="md-icon-button md-primary"
-        ng-hide="vm.hopperIds.length <= 1"
-        ng-disabled="vm.disableGetContact"
-        ng-click="vm.previousContact()"
-        aria-label="PREVIOUSCONTACT"
-        translate-attr-aria-label="TOOLS.PREVIOUSCONTACT"
-      >
-        <md-icon md-font-icon="icon-chevron-left"></md-icon>
-      </md-button>
-      <md-button
-        class="md-fab green-bg"
-        aria-label="CALL"
-        translate-attr-aria-label="TOOLS.CALL"
-        ng-disabled="vm.disable"
-        ng-click="vm.originatePreview($event)"
-      >
-        <md-icon md-font-icon="icon-phone"></md-icon>
-      </md-button>
-      <md-button
-        class="md-icon-button md-primary"
-        ng-disabled="vm.disableGetContact"
-        ng-click="vm.nextContact()"
-        aria-label="NEXTCONTACT"
-        translate-attr-aria-label="TOOLS.NEXTCONTACT"
-      >
-        <md-icon md-font-icon="icon-chevron-right"></md-icon>
-      </md-button>
-    </md-dialog-actions>
-  </form>
-</md-dialog>
diff --git a/public/src/js/modules/toolbar/preview/dialog.html/dialog.html b/public/src/js/modules/toolbar/preview/dialog.html/dialog.html
new file mode 100644
index 0000000..df276a8
--- /dev/null
+++ b/public/src/js/modules/toolbar/preview/dialog.html/dialog.html
@@ -0,0 +1,138 @@
+<md-dialog class="preview-dialog" aria-label="preview">
+  <form name="previewForm" class="md-inline-form" novalidate>
+    <md-toolbar class="md-background-bg">
+      <div
+        class="md-toolbar-tools"
+        layout="row"
+        layout-align="space-between center"
+      >
+        <span class="title">Preview</span>
+        <md-button class="md-icon-button" ng-click="vm.closeDialog()">
+          <md-icon
+            md-font-icon="icon-close"
+            aria-label="Close dialog"
+          ></md-icon>
+        </md-button>
+      </div>
+    </md-toolbar>
+
+    <md-dialog-content ms-scroll>
+      <div layout="row" ng-if="vm.preview">
+        <div class="md-padding md-margin" layout="column" flex="30">
+          <md-input-container
+            ng-if="vm.preview.Contact.id"
+            class="md-block no-margin"
+          >
+            <label translate="CONTACTMANAGER.ID">ID</label>
+            <input
+              type="text"
+              ng-model="vm.preview.Contact.id"
+              disabled="true"
+            />
+          </md-input-container>
+          <md-input-container
+            ng-if="vm.preview.Queue.name"
+            class="md-block no-margin"
+          >
+            <label translate="VOICE.QUEUE">Queue</label>
+            <input
+              type="text"
+              ng-model="vm.preview.Queue.name"
+              disabled="true"
+            />
+          </md-input-container>
+          <md-input-container
+            ng-if="vm.preview.List.name"
+            class="md-block no-margin"
+          >
+            <label translate="CONTACTMANAGER.LIST">List</label>
+            <input
+              type="text"
+              ng-model="vm.preview.List.name"
+              disabled="true"
+            />
+          </md-input-container>
+          <md-input-container
+            ng-if="vm.preview.Contact.tags && vm.preview.Contact.tags.length"
+            class="md-block no-margin"
+          >
+            <label translate="CONTACTMANAGER.TAGS">Tags</label>
+            <input
+              type="text"
+              ng-model="vm.preview.Contact.tags"
+              disabled="true"
+            />
+          </md-input-container>
+          <md-input-container
+            ng-if="vm.preview.Contact.Company && vm.preview.Contact.Company.name"
+            class="md-block no-margin"
+          >
+            <label translate="CONTACTMANAGER.COMPANY">Company</label>
+            <input
+              type="text"
+              ng-model="vm.preview.Contact.Company.name"
+              disabled="true"
+            />
+          </md-input-container>
+        </div>
+        <md-divider></md-divider>
+        <div class="md-padding md-margin" layout="column" flex="35">
+          <md-input-container
+            ng-repeat="(key, value) in vm.preview.Contact"
+            ng-if="!vm.isNil(value) && !vm.isCustomField(key) && !vm.isHiddenField(key)"
+            class="md-block no-margin"
+          >
+            <label
+              >{{ 'CONTACTMANAGER.' + key.toUpperCase() | translate}}</label
+            >
+            <input type="text" ng-model="value" disabled="true" />
+          </md-input-container>
+        </div>
+        <div class="md-padding md-margin" layout="column" flex="35">
+          <md-input-container
+            ng-repeat="(key, value) in vm.preview.Contact"
+            ng-if="!vm.isNil(value) && vm.isCustomField(key) && !vm.isHiddenField(key)"
+            class="md-block no-margin"
+          >
+            <label>{{ vm.customFieldsMap[key] || key }}</label>
+            <input type="text" ng-model="value" disabled="true" />
+          </md-input-container>
+        </div>
+      </div>
+      <div layout="row" ng-if="!vm.preview">
+        <span>no contacts available</span>
+      </div>
+    </md-dialog-content>
+
+    <md-dialog-actions class="md-dialog-action-center padding-rigth-15">
+      <md-button
+        class="md-icon-button md-primary"
+        ng-hide="vm.hopperIds.length <= 1"
+        ng-disabled="vm.disableGetContact"
+        ng-click="vm.previousContact()"
+        aria-label="PREVIOUSCONTACT"
+        translate-attr-aria-label="TOOLS.PREVIOUSCONTACT"
+      >
+        <md-icon md-font-icon="icon-chevron-left"></md-icon>
+      </md-button>
+      <md-button
+        class="md-fab green-bg"
+        aria-label="CALL"
+        translate-attr-aria-label="TOOLS.CALL"
+        ng-disabled="vm.disable"
+        ng-click="vm.originatePreview($event)"
+      >
+        <md-icon md-font-icon="icon-phone"></md-icon>
+      </md-button>
+      <md-button
+        class="md-icon-button md-primary"
+        ng-disabled="vm.disableGetContact"
+        ng-click="vm.nextContact()"
+        aria-label="NEXTCONTACT"
+        translate-attr-aria-label="TOOLS.NEXTCONTACT"
+      >
+        <md-icon md-font-icon="icon-chevron-right"></md-icon>
+      </md-button>
+    </md-dialog-actions>
+  </form>
+</md-dialog>
diff --git a/server/api/action/action.attributes.js b/server/api/action/action.attributes.js
index 0b09303..5f699f4 100644
--- a/server/api/action/action.attributes.js
+++ b/server/api/action/action.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/action/action.controller.js b/server/api/action/action.controller.js
index bed0348..7ee8225 100644
--- a/server/api/action/action.controller.js
+++ b/server/api/action/action.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/action/action.model.js b/server/api/action/action.model.js
index 97a0687..fd69518 100644
--- a/server/api/action/action.model.js
+++ b/server/api/action/action.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/action/index.js b/server/api/action/index.js
index 03c8301..206453a 100644
--- a/server/api/action/index.js
+++ b/server/api/action/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/analyticCustomReport/analyticCustomReport.attributes.js b/server/api/analyticCustomReport/analyticCustomReport.attributes.js
index 98f48d8..2934dfe 100644
--- a/server/api/analyticCustomReport/analyticCustomReport.attributes.js
+++ b/server/api/analyticCustomReport/analyticCustomReport.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/analyticCustomReport/analyticCustomReport.controller.js b/server/api/analyticCustomReport/analyticCustomReport.controller.js
index 334c518..1d637c1 100644
--- a/server/api/analyticCustomReport/analyticCustomReport.controller.js
+++ b/server/api/analyticCustomReport/analyticCustomReport.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/analyticCustomReport/analyticCustomReport.model.js b/server/api/analyticCustomReport/analyticCustomReport.model.js
index c93bba5..afb9e15 100644
--- a/server/api/analyticCustomReport/analyticCustomReport.model.js
+++ b/server/api/analyticCustomReport/analyticCustomReport.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/analyticCustomReport/index.js b/server/api/analyticCustomReport/index.js
index 73d7e4b..b346a65 100644
--- a/server/api/analyticCustomReport/index.js
+++ b/server/api/analyticCustomReport/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/analyticDefaultReport/analyticDefaultReport.attributes.js b/server/api/analyticDefaultReport/analyticDefaultReport.attributes.js
index e30bf33..caf1e68 100644
--- a/server/api/analyticDefaultReport/analyticDefaultReport.attributes.js
+++ b/server/api/analyticDefaultReport/analyticDefaultReport.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/analyticDefaultReport/analyticDefaultReport.controller.js b/server/api/analyticDefaultReport/analyticDefaultReport.controller.js
index d0c1fc9..e47d756 100644
--- a/server/api/analyticDefaultReport/analyticDefaultReport.controller.js
+++ b/server/api/analyticDefaultReport/analyticDefaultReport.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/analyticDefaultReport/analyticDefaultReport.model.js b/server/api/analyticDefaultReport/analyticDefaultReport.model.js
index eafa0b6..5410151 100644
--- a/server/api/analyticDefaultReport/analyticDefaultReport.model.js
+++ b/server/api/analyticDefaultReport/analyticDefaultReport.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/analyticDefaultReport/index.js b/server/api/analyticDefaultReport/index.js
index 9cdf45a..c12e92c 100644
--- a/server/api/analyticDefaultReport/index.js
+++ b/server/api/analyticDefaultReport/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/analyticExtractedReport/analyticExtractedReport.attributes.js b/server/api/analyticExtractedReport/analyticExtractedReport.attributes.js
index 76bb58f..f74d44b 100644
--- a/server/api/analyticExtractedReport/analyticExtractedReport.attributes.js
+++ b/server/api/analyticExtractedReport/analyticExtractedReport.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/analyticExtractedReport/analyticExtractedReport.controller.js b/server/api/analyticExtractedReport/analyticExtractedReport.controller.js
index c0b389c..e8a0d91 100644
--- a/server/api/analyticExtractedReport/analyticExtractedReport.controller.js
+++ b/server/api/analyticExtractedReport/analyticExtractedReport.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/analyticExtractedReport/analyticExtractedReport.model.js b/server/api/analyticExtractedReport/analyticExtractedReport.model.js
index 48dd546..9f1f2f7 100644
--- a/server/api/analyticExtractedReport/analyticExtractedReport.model.js
+++ b/server/api/analyticExtractedReport/analyticExtractedReport.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/analyticExtractedReport/index.js b/server/api/analyticExtractedReport/index.js
index 16c8277..d71ee46 100644
--- a/server/api/analyticExtractedReport/index.js
+++ b/server/api/analyticExtractedReport/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/analyticFieldReport/analyticFieldReport.attributes.js b/server/api/analyticFieldReport/analyticFieldReport.attributes.js
index 24e3104..de3d341 100644
--- a/server/api/analyticFieldReport/analyticFieldReport.attributes.js
+++ b/server/api/analyticFieldReport/analyticFieldReport.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/analyticFieldReport/analyticFieldReport.controller.js b/server/api/analyticFieldReport/analyticFieldReport.controller.js
index e23f01b..2e7ba0c 100644
--- a/server/api/analyticFieldReport/analyticFieldReport.controller.js
+++ b/server/api/analyticFieldReport/analyticFieldReport.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/analyticFieldReport/analyticFieldReport.model.js b/server/api/analyticFieldReport/analyticFieldReport.model.js
index 772aa19..5f3dc79 100644
--- a/server/api/analyticFieldReport/analyticFieldReport.model.js
+++ b/server/api/analyticFieldReport/analyticFieldReport.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/analyticFieldReport/index.js b/server/api/analyticFieldReport/index.js
index 87f464b..544fdbf 100644
--- a/server/api/analyticFieldReport/index.js
+++ b/server/api/analyticFieldReport/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/analyticMetric/analyticMetric.attributes.js b/server/api/analyticMetric/analyticMetric.attributes.js
index 159a4af..0c84d6f 100644
--- a/server/api/analyticMetric/analyticMetric.attributes.js
+++ b/server/api/analyticMetric/analyticMetric.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/analyticMetric/analyticMetric.controller.js b/server/api/analyticMetric/analyticMetric.controller.js
index 4312d96..732bf99 100644
--- a/server/api/analyticMetric/analyticMetric.controller.js
+++ b/server/api/analyticMetric/analyticMetric.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/analyticMetric/analyticMetric.model.js b/server/api/analyticMetric/analyticMetric.model.js
index 3443c3c..718e6ca 100644
--- a/server/api/analyticMetric/analyticMetric.model.js
+++ b/server/api/analyticMetric/analyticMetric.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/analyticMetric/index.js b/server/api/analyticMetric/index.js
index 8e53270..00380ae 100644
--- a/server/api/analyticMetric/index.js
+++ b/server/api/analyticMetric/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/analyticTreeReport/analyticTreeReport.attributes.js b/server/api/analyticTreeReport/analyticTreeReport.attributes.js
index 3635ff4..57f8fab 100644
--- a/server/api/analyticTreeReport/analyticTreeReport.attributes.js
+++ b/server/api/analyticTreeReport/analyticTreeReport.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/analyticTreeReport/analyticTreeReport.controller.js b/server/api/analyticTreeReport/analyticTreeReport.controller.js
index d538af1..1a350d8 100644
--- a/server/api/analyticTreeReport/analyticTreeReport.controller.js
+++ b/server/api/analyticTreeReport/analyticTreeReport.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/analyticTreeReport/analyticTreeReport.model.js b/server/api/analyticTreeReport/analyticTreeReport.model.js
index a3fbee3..94d7689 100644
--- a/server/api/analyticTreeReport/analyticTreeReport.model.js
+++ b/server/api/analyticTreeReport/analyticTreeReport.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/analyticTreeReport/index.js b/server/api/analyticTreeReport/index.js
index fe62657..20c5d79 100644
--- a/server/api/analyticTreeReport/index.js
+++ b/server/api/analyticTreeReport/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/attachment/attachment.attributes.js b/server/api/attachment/attachment.attributes.js
index b69dae0..0b9cad3 100644
--- a/server/api/attachment/attachment.attributes.js
+++ b/server/api/attachment/attachment.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/attachment/attachment.controller.js b/server/api/attachment/attachment.controller.js
index 1948007..cc59c75 100644
--- a/server/api/attachment/attachment.controller.js
+++ b/server/api/attachment/attachment.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/attachment/attachment.model.js b/server/api/attachment/attachment.model.js
index 9647750..2bbad8f 100644
--- a/server/api/attachment/attachment.model.js
+++ b/server/api/attachment/attachment.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/attachment/attachment.rpc.js b/server/api/attachment/attachment.rpc.js
index 30b2db9..8f0a789 100644
--- a/server/api/attachment/attachment.rpc.js
+++ b/server/api/attachment/attachment.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/attachment/index.js b/server/api/attachment/index.js
index 3355f23..3cddd20 100644
--- a/server/api/attachment/index.js
+++ b/server/api/attachment/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/authGoogle/authGoogle.controller.js b/server/api/authGoogle/authGoogle.controller.js
index bf92581..25740ea 100644
--- a/server/api/authGoogle/authGoogle.controller.js
+++ b/server/api/authGoogle/authGoogle.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/authGoogle/index.js b/server/api/authGoogle/index.js
index 0493b60..33b87be 100644
--- a/server/api/authGoogle/index.js
+++ b/server/api/authGoogle/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/authLocal/authLocal.controller.js b/server/api/authLocal/authLocal.controller.js
index aa80e4c..1f7e9e4 100644
--- a/server/api/authLocal/authLocal.controller.js
+++ b/server/api/authLocal/authLocal.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/authLocal/index.js b/server/api/authLocal/index.js
index 1a2542f..516aecf 100644
--- a/server/api/authLocal/index.js
+++ b/server/api/authLocal/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/automation/automation.attributes.js b/server/api/automation/automation.attributes.js
index 2d1de08..7f9ad32 100644
--- a/server/api/automation/automation.attributes.js
+++ b/server/api/automation/automation.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/automation/automation.controller.js b/server/api/automation/automation.controller.js
index 2fc7a46..3b555b0 100644
--- a/server/api/automation/automation.controller.js
+++ b/server/api/automation/automation.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/automation/automation.model.js b/server/api/automation/automation.model.js
index ecea57f..8d71515 100644
--- a/server/api/automation/automation.model.js
+++ b/server/api/automation/automation.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/automation/index.js b/server/api/automation/index.js
index 5068c73..f7492b0 100644
--- a/server/api/automation/index.js
+++ b/server/api/automation/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/campaign/campaign.attributes.js b/server/api/campaign/campaign.attributes.js
index bb837e0..c1787d0 100644
--- a/server/api/campaign/campaign.attributes.js
+++ b/server/api/campaign/campaign.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/campaign/campaign.controller.js b/server/api/campaign/campaign.controller.js
index 58f5d1c..cd2d482 100644
--- a/server/api/campaign/campaign.controller.js
+++ b/server/api/campaign/campaign.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/campaign/campaign.model.js b/server/api/campaign/campaign.model.js
index 7a257be..cde11ad 100644
--- a/server/api/campaign/campaign.model.js
+++ b/server/api/campaign/campaign.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/campaign/campaign.rpc.js b/server/api/campaign/campaign.rpc.js
index f377d63..d318fdf 100644
--- a/server/api/campaign/campaign.rpc.js
+++ b/server/api/campaign/campaign.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/campaign/index.js b/server/api/campaign/index.js
index 519ad78..4d6c5d9 100644
--- a/server/api/campaign/index.js
+++ b/server/api/campaign/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cannedAnswer/cannedAnswer.attributes.js b/server/api/cannedAnswer/cannedAnswer.attributes.js
index 63d3364..b115259 100644
--- a/server/api/cannedAnswer/cannedAnswer.attributes.js
+++ b/server/api/cannedAnswer/cannedAnswer.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cannedAnswer/cannedAnswer.controller.js b/server/api/cannedAnswer/cannedAnswer.controller.js
index d4beb88..de9c468 100644
--- a/server/api/cannedAnswer/cannedAnswer.controller.js
+++ b/server/api/cannedAnswer/cannedAnswer.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cannedAnswer/cannedAnswer.model.js b/server/api/cannedAnswer/cannedAnswer.model.js
index 817ddd9..bb922c4 100644
--- a/server/api/cannedAnswer/cannedAnswer.model.js
+++ b/server/api/cannedAnswer/cannedAnswer.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cannedAnswer/index.js b/server/api/cannedAnswer/index.js
index 1328709..d3ffc2c 100644
--- a/server/api/cannedAnswer/index.js
+++ b/server/api/cannedAnswer/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cdr/cdr.attributes.js b/server/api/cdr/cdr.attributes.js
index e1e1db9..8f40700 100644
--- a/server/api/cdr/cdr.attributes.js
+++ b/server/api/cdr/cdr.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cdr/cdr.controller.js b/server/api/cdr/cdr.controller.js
index a69dce9..4e7ab79 100644
--- a/server/api/cdr/cdr.controller.js
+++ b/server/api/cdr/cdr.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cdr/cdr.model.js b/server/api/cdr/cdr.model.js
index 490a5a8..76f201f 100644
--- a/server/api/cdr/cdr.model.js
+++ b/server/api/cdr/cdr.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cdr/index.js b/server/api/cdr/index.js
index 1034c0c..8d83bad 100644
--- a/server/api/cdr/index.js
+++ b/server/api/cdr/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatApplication/chatApplication.attributes.js b/server/api/chatApplication/chatApplication.attributes.js
index 1143807..946c57e 100644
--- a/server/api/chatApplication/chatApplication.attributes.js
+++ b/server/api/chatApplication/chatApplication.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatApplication/chatApplication.controller.js b/server/api/chatApplication/chatApplication.controller.js
index ee99541..91c176d 100644
--- a/server/api/chatApplication/chatApplication.controller.js
+++ b/server/api/chatApplication/chatApplication.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatApplication/chatApplication.model.js b/server/api/chatApplication/chatApplication.model.js
index 3a45d80..51c5602 100644
--- a/server/api/chatApplication/chatApplication.model.js
+++ b/server/api/chatApplication/chatApplication.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatApplication/index.js b/server/api/chatApplication/index.js
index 671cbe8..7d9908e 100644
--- a/server/api/chatApplication/index.js
+++ b/server/api/chatApplication/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatGroup/chatGroup.attributes.js b/server/api/chatGroup/chatGroup.attributes.js
index 516eade..e7ff57c 100644
--- a/server/api/chatGroup/chatGroup.attributes.js
+++ b/server/api/chatGroup/chatGroup.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatGroup/chatGroup.controller.js b/server/api/chatGroup/chatGroup.controller.js
index d3b88e6..525d0ef 100644
--- a/server/api/chatGroup/chatGroup.controller.js
+++ b/server/api/chatGroup/chatGroup.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatGroup/chatGroup.events.js b/server/api/chatGroup/chatGroup.events.js
index 600c49f..dedb5f2 100644
--- a/server/api/chatGroup/chatGroup.events.js
+++ b/server/api/chatGroup/chatGroup.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatGroup/chatGroup.model.js b/server/api/chatGroup/chatGroup.model.js
index a3ae232..e92af34 100644
--- a/server/api/chatGroup/chatGroup.model.js
+++ b/server/api/chatGroup/chatGroup.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatGroup/chatGroup.rpc.js b/server/api/chatGroup/chatGroup.rpc.js
index e76fb02..146fbc1 100644
--- a/server/api/chatGroup/chatGroup.rpc.js
+++ b/server/api/chatGroup/chatGroup.rpc.js
@@ -1 +1 @@
-const a62_0x1de4=['register'];(function(_0x211e87,_0x1de49c){const _0xb2e86d=function(_0x4f411b){while(--_0x4f411b){_0x211e87['push'](_0x211e87['shift']());}};_0xb2e86d(++_0x1de49c);}(a62_0x1de4,0xdf));const a62_0xb2e8=function(_0x211e87,_0x1de49c){_0x211e87=_0x211e87-0x0;let _0xb2e86d=a62_0x1de4[_0x211e87];return _0xb2e86d;};const _0xf15ded=a62_0xb2e8;'use strict';const {getSocket}=require('../../rediscache'),socket=getSocket();require('./chatGroup.socket')[_0xf15ded('0x0')](socket);
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatGroup/chatGroup.socket.js b/server/api/chatGroup/chatGroup.socket.js
index 2ec601c..fba9780 100644
--- a/server/api/chatGroup/chatGroup.socket.js
+++ b/server/api/chatGroup/chatGroup.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatGroup/index.js b/server/api/chatGroup/index.js
index 6b6d971..681cd31 100644
--- a/server/api/chatGroup/index.js
+++ b/server/api/chatGroup/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatInteraction/chatInteraction.attributes.js b/server/api/chatInteraction/chatInteraction.attributes.js
index 0035168..d03187f 100644
--- a/server/api/chatInteraction/chatInteraction.attributes.js
+++ b/server/api/chatInteraction/chatInteraction.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatInteraction/chatInteraction.controller.js b/server/api/chatInteraction/chatInteraction.controller.js
index 5eaf9b9..b6d323d 100644
--- a/server/api/chatInteraction/chatInteraction.controller.js
+++ b/server/api/chatInteraction/chatInteraction.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatInteraction/chatInteraction.events.js b/server/api/chatInteraction/chatInteraction.events.js
index 93372d9..ac59a46 100644
--- a/server/api/chatInteraction/chatInteraction.events.js
+++ b/server/api/chatInteraction/chatInteraction.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatInteraction/chatInteraction.model.js b/server/api/chatInteraction/chatInteraction.model.js
index c31b500..2831375 100644
--- a/server/api/chatInteraction/chatInteraction.model.js
+++ b/server/api/chatInteraction/chatInteraction.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatInteraction/chatInteraction.rpc.js b/server/api/chatInteraction/chatInteraction.rpc.js
index 1732c40..c64980a 100644
--- a/server/api/chatInteraction/chatInteraction.rpc.js
+++ b/server/api/chatInteraction/chatInteraction.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatInteraction/chatInteraction.socket.js b/server/api/chatInteraction/chatInteraction.socket.js
index e24ff7a..9470b19 100644
--- a/server/api/chatInteraction/chatInteraction.socket.js
+++ b/server/api/chatInteraction/chatInteraction.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatInteraction/index.js b/server/api/chatInteraction/index.js
index 1aafbb2..f90618c 100644
--- a/server/api/chatInteraction/index.js
+++ b/server/api/chatInteraction/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatInternalMessage/chatInternalMessage.attributes.js b/server/api/chatInternalMessage/chatInternalMessage.attributes.js
index 464b17d..ecb2291 100644
--- a/server/api/chatInternalMessage/chatInternalMessage.attributes.js
+++ b/server/api/chatInternalMessage/chatInternalMessage.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatInternalMessage/chatInternalMessage.controller.js b/server/api/chatInternalMessage/chatInternalMessage.controller.js
index 9d43e64..6fde609 100644
--- a/server/api/chatInternalMessage/chatInternalMessage.controller.js
+++ b/server/api/chatInternalMessage/chatInternalMessage.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatInternalMessage/chatInternalMessage.events.js b/server/api/chatInternalMessage/chatInternalMessage.events.js
index f78661b..dda0035 100644
--- a/server/api/chatInternalMessage/chatInternalMessage.events.js
+++ b/server/api/chatInternalMessage/chatInternalMessage.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatInternalMessage/chatInternalMessage.model.js b/server/api/chatInternalMessage/chatInternalMessage.model.js
index de9c065..bcfb9c4 100644
--- a/server/api/chatInternalMessage/chatInternalMessage.model.js
+++ b/server/api/chatInternalMessage/chatInternalMessage.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatInternalMessage/chatInternalMessage.rpc.js b/server/api/chatInternalMessage/chatInternalMessage.rpc.js
index d529391..1419bf8 100644
--- a/server/api/chatInternalMessage/chatInternalMessage.rpc.js
+++ b/server/api/chatInternalMessage/chatInternalMessage.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatInternalMessage/chatInternalMessage.socket.js b/server/api/chatInternalMessage/chatInternalMessage.socket.js
index f4c55cc..8394f29 100644
--- a/server/api/chatInternalMessage/chatInternalMessage.socket.js
+++ b/server/api/chatInternalMessage/chatInternalMessage.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatInternalMessage/index.js b/server/api/chatInternalMessage/index.js
index 0e14593..1ffe445 100644
--- a/server/api/chatInternalMessage/index.js
+++ b/server/api/chatInternalMessage/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatMessage/chatMessage.attributes.js b/server/api/chatMessage/chatMessage.attributes.js
index f89884f..35eb847 100644
--- a/server/api/chatMessage/chatMessage.attributes.js
+++ b/server/api/chatMessage/chatMessage.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatMessage/chatMessage.controller.js b/server/api/chatMessage/chatMessage.controller.js
index c157c14..997db00 100644
--- a/server/api/chatMessage/chatMessage.controller.js
+++ b/server/api/chatMessage/chatMessage.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatMessage/chatMessage.events.js b/server/api/chatMessage/chatMessage.events.js
index d86213d..b60ef6b 100644
--- a/server/api/chatMessage/chatMessage.events.js
+++ b/server/api/chatMessage/chatMessage.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatMessage/chatMessage.model.js b/server/api/chatMessage/chatMessage.model.js
index 3fe5bcf..0781728 100644
--- a/server/api/chatMessage/chatMessage.model.js
+++ b/server/api/chatMessage/chatMessage.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatMessage/chatMessage.rpc.js b/server/api/chatMessage/chatMessage.rpc.js
index c363417..578f84a 100644
--- a/server/api/chatMessage/chatMessage.rpc.js
+++ b/server/api/chatMessage/chatMessage.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatMessage/chatMessage.socket.js b/server/api/chatMessage/chatMessage.socket.js
index c056721..73a5638 100644
--- a/server/api/chatMessage/chatMessage.socket.js
+++ b/server/api/chatMessage/chatMessage.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatMessage/index.js b/server/api/chatMessage/index.js
index 41ff3f0..79cf374 100644
--- a/server/api/chatMessage/index.js
+++ b/server/api/chatMessage/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatOfflineMessage/chatOfflineMessage.attributes.js b/server/api/chatOfflineMessage/chatOfflineMessage.attributes.js
index d523074..3bb7b85 100644
--- a/server/api/chatOfflineMessage/chatOfflineMessage.attributes.js
+++ b/server/api/chatOfflineMessage/chatOfflineMessage.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatOfflineMessage/chatOfflineMessage.controller.js b/server/api/chatOfflineMessage/chatOfflineMessage.controller.js
index e2b4b40..1ff6d79 100644
--- a/server/api/chatOfflineMessage/chatOfflineMessage.controller.js
+++ b/server/api/chatOfflineMessage/chatOfflineMessage.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatOfflineMessage/chatOfflineMessage.model.js b/server/api/chatOfflineMessage/chatOfflineMessage.model.js
index 0ad55e6..148144f 100644
--- a/server/api/chatOfflineMessage/chatOfflineMessage.model.js
+++ b/server/api/chatOfflineMessage/chatOfflineMessage.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatOfflineMessage/index.js b/server/api/chatOfflineMessage/index.js
index 5e09ac1..fc55da5 100644
--- a/server/api/chatOfflineMessage/index.js
+++ b/server/api/chatOfflineMessage/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatProactiveAction/chatProactiveAction.attributes.js b/server/api/chatProactiveAction/chatProactiveAction.attributes.js
index c10a5e9..123745f 100644
--- a/server/api/chatProactiveAction/chatProactiveAction.attributes.js
+++ b/server/api/chatProactiveAction/chatProactiveAction.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatProactiveAction/chatProactiveAction.controller.js b/server/api/chatProactiveAction/chatProactiveAction.controller.js
index b984bde..ff59f16 100644
--- a/server/api/chatProactiveAction/chatProactiveAction.controller.js
+++ b/server/api/chatProactiveAction/chatProactiveAction.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatProactiveAction/chatProactiveAction.model.js b/server/api/chatProactiveAction/chatProactiveAction.model.js
index fa40b79..c3e8da6 100644
--- a/server/api/chatProactiveAction/chatProactiveAction.model.js
+++ b/server/api/chatProactiveAction/chatProactiveAction.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatProactiveAction/index.js b/server/api/chatProactiveAction/index.js
index 4acbcc0..df1cc82 100644
--- a/server/api/chatProactiveAction/index.js
+++ b/server/api/chatProactiveAction/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatQueue/chatQueue.attributes.js b/server/api/chatQueue/chatQueue.attributes.js
index 9acbdde..b8b198b 100644
--- a/server/api/chatQueue/chatQueue.attributes.js
+++ b/server/api/chatQueue/chatQueue.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatQueue/chatQueue.controller.js b/server/api/chatQueue/chatQueue.controller.js
index c028e57..33d0800 100644
--- a/server/api/chatQueue/chatQueue.controller.js
+++ b/server/api/chatQueue/chatQueue.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatQueue/chatQueue.events.js b/server/api/chatQueue/chatQueue.events.js
index 3ccb5df..0fbdc71 100644
--- a/server/api/chatQueue/chatQueue.events.js
+++ b/server/api/chatQueue/chatQueue.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatQueue/chatQueue.model.js b/server/api/chatQueue/chatQueue.model.js
index 3129c36..536bada 100644
--- a/server/api/chatQueue/chatQueue.model.js
+++ b/server/api/chatQueue/chatQueue.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatQueue/chatQueue.rpc.js b/server/api/chatQueue/chatQueue.rpc.js
index deddc18..01b281b 100644
--- a/server/api/chatQueue/chatQueue.rpc.js
+++ b/server/api/chatQueue/chatQueue.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatQueue/chatQueue.socket.js b/server/api/chatQueue/chatQueue.socket.js
index b6c9329..e1682c1 100644
--- a/server/api/chatQueue/chatQueue.socket.js
+++ b/server/api/chatQueue/chatQueue.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatQueue/index.js b/server/api/chatQueue/index.js
index f57f0d9..482a001 100644
--- a/server/api/chatQueue/index.js
+++ b/server/api/chatQueue/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatQueueReport/chatQueueReport.attributes.js b/server/api/chatQueueReport/chatQueueReport.attributes.js
index 01f5382..63541c4 100644
--- a/server/api/chatQueueReport/chatQueueReport.attributes.js
+++ b/server/api/chatQueueReport/chatQueueReport.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatQueueReport/chatQueueReport.controller.js b/server/api/chatQueueReport/chatQueueReport.controller.js
index 698c329..aa4401a 100644
--- a/server/api/chatQueueReport/chatQueueReport.controller.js
+++ b/server/api/chatQueueReport/chatQueueReport.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatQueueReport/chatQueueReport.model.js b/server/api/chatQueueReport/chatQueueReport.model.js
index ff91121..c5986ea 100644
--- a/server/api/chatQueueReport/chatQueueReport.model.js
+++ b/server/api/chatQueueReport/chatQueueReport.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatQueueReport/chatQueueReport.rpc.js b/server/api/chatQueueReport/chatQueueReport.rpc.js
index f2b6056..00c5cc7 100644
--- a/server/api/chatQueueReport/chatQueueReport.rpc.js
+++ b/server/api/chatQueueReport/chatQueueReport.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatQueueReport/index.js b/server/api/chatQueueReport/index.js
index 58c015e..9f663a5 100644
--- a/server/api/chatQueueReport/index.js
+++ b/server/api/chatQueueReport/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatTransferReport/chatTransferReport.attributes.js b/server/api/chatTransferReport/chatTransferReport.attributes.js
index 8318fc7..be9068c 100644
--- a/server/api/chatTransferReport/chatTransferReport.attributes.js
+++ b/server/api/chatTransferReport/chatTransferReport.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatTransferReport/chatTransferReport.controller.js b/server/api/chatTransferReport/chatTransferReport.controller.js
index c73a8d2..72baa14 100644
--- a/server/api/chatTransferReport/chatTransferReport.controller.js
+++ b/server/api/chatTransferReport/chatTransferReport.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatTransferReport/chatTransferReport.model.js b/server/api/chatTransferReport/chatTransferReport.model.js
index d665fc3..9ac2d15 100644
--- a/server/api/chatTransferReport/chatTransferReport.model.js
+++ b/server/api/chatTransferReport/chatTransferReport.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatTransferReport/index.js b/server/api/chatTransferReport/index.js
index fda51a1..5d0c84e 100644
--- a/server/api/chatTransferReport/index.js
+++ b/server/api/chatTransferReport/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatWebsite/chatWebsite.attributes.js b/server/api/chatWebsite/chatWebsite.attributes.js
index 4babf63..c44e5a1 100644
--- a/server/api/chatWebsite/chatWebsite.attributes.js
+++ b/server/api/chatWebsite/chatWebsite.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatWebsite/chatWebsite.controller.js b/server/api/chatWebsite/chatWebsite.controller.js
index d063b10..dd0276f 100644
--- a/server/api/chatWebsite/chatWebsite.controller.js
+++ b/server/api/chatWebsite/chatWebsite.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatWebsite/chatWebsite.events.js b/server/api/chatWebsite/chatWebsite.events.js
index e04379f..f751ea4 100644
--- a/server/api/chatWebsite/chatWebsite.events.js
+++ b/server/api/chatWebsite/chatWebsite.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatWebsite/chatWebsite.model.js b/server/api/chatWebsite/chatWebsite.model.js
index fbfb9cf..3331b38 100644
--- a/server/api/chatWebsite/chatWebsite.model.js
+++ b/server/api/chatWebsite/chatWebsite.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatWebsite/chatWebsite.rpc.js b/server/api/chatWebsite/chatWebsite.rpc.js
index c83cf1f..f731336 100644
--- a/server/api/chatWebsite/chatWebsite.rpc.js
+++ b/server/api/chatWebsite/chatWebsite.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatWebsite/chatWebsite.socket.js b/server/api/chatWebsite/chatWebsite.socket.js
index bfa1887..b79aaa4 100644
--- a/server/api/chatWebsite/chatWebsite.socket.js
+++ b/server/api/chatWebsite/chatWebsite.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/chatWebsite/index.js b/server/api/chatWebsite/index.js
index 470371f..7009848 100644
--- a/server/api/chatWebsite/index.js
+++ b/server/api/chatWebsite/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cloudProvider/cloudProvider.attributes.js b/server/api/cloudProvider/cloudProvider.attributes.js
index 1d8852b..3b713d5 100644
--- a/server/api/cloudProvider/cloudProvider.attributes.js
+++ b/server/api/cloudProvider/cloudProvider.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cloudProvider/cloudProvider.controller.js b/server/api/cloudProvider/cloudProvider.controller.js
index 516d397..a266551 100644
--- a/server/api/cloudProvider/cloudProvider.controller.js
+++ b/server/api/cloudProvider/cloudProvider.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cloudProvider/cloudProvider.model.js b/server/api/cloudProvider/cloudProvider.model.js
index c2c6ec7..03afbcc 100644
--- a/server/api/cloudProvider/cloudProvider.model.js
+++ b/server/api/cloudProvider/cloudProvider.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cloudProvider/index.js b/server/api/cloudProvider/index.js
index e88fb56..4fa85bd 100644
--- a/server/api/cloudProvider/index.js
+++ b/server/api/cloudProvider/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmCompany/cmCompany.attributes.js b/server/api/cmCompany/cmCompany.attributes.js
index b0069f4..d32f5c4 100644
--- a/server/api/cmCompany/cmCompany.attributes.js
+++ b/server/api/cmCompany/cmCompany.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmCompany/cmCompany.controller.js b/server/api/cmCompany/cmCompany.controller.js
index 11d1b5c..bf6c91c 100644
--- a/server/api/cmCompany/cmCompany.controller.js
+++ b/server/api/cmCompany/cmCompany.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmCompany/cmCompany.model.js b/server/api/cmCompany/cmCompany.model.js
index 08e646d..1ebf391 100644
--- a/server/api/cmCompany/cmCompany.model.js
+++ b/server/api/cmCompany/cmCompany.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmCompany/index.js b/server/api/cmCompany/index.js
index f2a9e17..0846b8d 100644
--- a/server/api/cmCompany/index.js
+++ b/server/api/cmCompany/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmContact/cmContact.attributes.js b/server/api/cmContact/cmContact.attributes.js
index 02d78a3..8a71041 100644
--- a/server/api/cmContact/cmContact.attributes.js
+++ b/server/api/cmContact/cmContact.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmContact/cmContact.controller.js b/server/api/cmContact/cmContact.controller.js
index 44edf3d..88c0865 100644
--- a/server/api/cmContact/cmContact.controller.js
+++ b/server/api/cmContact/cmContact.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmContact/cmContact.events.js b/server/api/cmContact/cmContact.events.js
index e9ddf52..2eb7faa 100644
--- a/server/api/cmContact/cmContact.events.js
+++ b/server/api/cmContact/cmContact.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmContact/cmContact.model.js b/server/api/cmContact/cmContact.model.js
index 3b7d352..a641a17 100644
--- a/server/api/cmContact/cmContact.model.js
+++ b/server/api/cmContact/cmContact.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmContact/cmContact.rpc.js b/server/api/cmContact/cmContact.rpc.js
index 5d9bef7..9c1ba71 100644
--- a/server/api/cmContact/cmContact.rpc.js
+++ b/server/api/cmContact/cmContact.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmContact/cmContact.socket.js b/server/api/cmContact/cmContact.socket.js
index a3339dc..4c4b31d 100644
--- a/server/api/cmContact/cmContact.socket.js
+++ b/server/api/cmContact/cmContact.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmContact/index.js b/server/api/cmContact/index.js
index 1b4697c..57b0d27 100644
--- a/server/api/cmContact/index.js
+++ b/server/api/cmContact/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmCustomField/cmCustomField.attributes.js b/server/api/cmCustomField/cmCustomField.attributes.js
index 57c23e4..92ec46e 100644
--- a/server/api/cmCustomField/cmCustomField.attributes.js
+++ b/server/api/cmCustomField/cmCustomField.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmCustomField/cmCustomField.controller.js b/server/api/cmCustomField/cmCustomField.controller.js
index ce8ae03..558accd 100644
--- a/server/api/cmCustomField/cmCustomField.controller.js
+++ b/server/api/cmCustomField/cmCustomField.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmCustomField/cmCustomField.model.js b/server/api/cmCustomField/cmCustomField.model.js
index bd641e1..9bd89ee 100644
--- a/server/api/cmCustomField/cmCustomField.model.js
+++ b/server/api/cmCustomField/cmCustomField.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmCustomField/index.js b/server/api/cmCustomField/index.js
index 0af7b2b..faae282 100644
--- a/server/api/cmCustomField/index.js
+++ b/server/api/cmCustomField/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmHopper/cmHopper.attributes.js b/server/api/cmHopper/cmHopper.attributes.js
index 06420fa..84953b3 100644
--- a/server/api/cmHopper/cmHopper.attributes.js
+++ b/server/api/cmHopper/cmHopper.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmHopper/cmHopper.controller.js b/server/api/cmHopper/cmHopper.controller.js
index 58ccd9c..380c008 100644
--- a/server/api/cmHopper/cmHopper.controller.js
+++ b/server/api/cmHopper/cmHopper.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmHopper/cmHopper.model.js b/server/api/cmHopper/cmHopper.model.js
index c0eae2a..fc899d8 100644
--- a/server/api/cmHopper/cmHopper.model.js
+++ b/server/api/cmHopper/cmHopper.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmHopper/cmHopper.rpc.js b/server/api/cmHopper/cmHopper.rpc.js
index f102a86..4155e88 100644
--- a/server/api/cmHopper/cmHopper.rpc.js
+++ b/server/api/cmHopper/cmHopper.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmHopper/index.js b/server/api/cmHopper/index.js
index 2636b9a..69a835f 100644
--- a/server/api/cmHopper/index.js
+++ b/server/api/cmHopper/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmHopperBlack/cmHopperBlack.attributes.js b/server/api/cmHopperBlack/cmHopperBlack.attributes.js
index 99ffa09..c757629 100644
--- a/server/api/cmHopperBlack/cmHopperBlack.attributes.js
+++ b/server/api/cmHopperBlack/cmHopperBlack.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmHopperBlack/cmHopperBlack.controller.js b/server/api/cmHopperBlack/cmHopperBlack.controller.js
index 51cb72c..c7918a4 100644
--- a/server/api/cmHopperBlack/cmHopperBlack.controller.js
+++ b/server/api/cmHopperBlack/cmHopperBlack.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmHopperBlack/cmHopperBlack.model.js b/server/api/cmHopperBlack/cmHopperBlack.model.js
index ff7e069..dfe327d 100644
--- a/server/api/cmHopperBlack/cmHopperBlack.model.js
+++ b/server/api/cmHopperBlack/cmHopperBlack.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmHopperBlack/cmHopperBlack.rpc.js b/server/api/cmHopperBlack/cmHopperBlack.rpc.js
index 8caa510..3aa326c 100644
--- a/server/api/cmHopperBlack/cmHopperBlack.rpc.js
+++ b/server/api/cmHopperBlack/cmHopperBlack.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmHopperBlack/index.js b/server/api/cmHopperBlack/index.js
index 2b1d584..0e0c1fa 100644
--- a/server/api/cmHopperBlack/index.js
+++ b/server/api/cmHopperBlack/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmHopperFinal/cmHopperFinal.attributes.js b/server/api/cmHopperFinal/cmHopperFinal.attributes.js
index a8ac0d8..5fdc341 100644
--- a/server/api/cmHopperFinal/cmHopperFinal.attributes.js
+++ b/server/api/cmHopperFinal/cmHopperFinal.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmHopperFinal/cmHopperFinal.controller.js b/server/api/cmHopperFinal/cmHopperFinal.controller.js
index f450683..2d0584a 100644
--- a/server/api/cmHopperFinal/cmHopperFinal.controller.js
+++ b/server/api/cmHopperFinal/cmHopperFinal.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmHopperFinal/cmHopperFinal.model.js b/server/api/cmHopperFinal/cmHopperFinal.model.js
index 5765116..3f2c19b 100644
--- a/server/api/cmHopperFinal/cmHopperFinal.model.js
+++ b/server/api/cmHopperFinal/cmHopperFinal.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmHopperFinal/cmHopperFinal.rpc.js b/server/api/cmHopperFinal/cmHopperFinal.rpc.js
index 85a4bbf..3cecffc 100644
--- a/server/api/cmHopperFinal/cmHopperFinal.rpc.js
+++ b/server/api/cmHopperFinal/cmHopperFinal.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmHopperFinal/index.js b/server/api/cmHopperFinal/index.js
index 8b7cc80..530a998 100644
--- a/server/api/cmHopperFinal/index.js
+++ b/server/api/cmHopperFinal/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmHopperHistory/cmHopperHistory.attributes.js b/server/api/cmHopperHistory/cmHopperHistory.attributes.js
index f34648e..d0137d7 100644
--- a/server/api/cmHopperHistory/cmHopperHistory.attributes.js
+++ b/server/api/cmHopperHistory/cmHopperHistory.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmHopperHistory/cmHopperHistory.controller.js b/server/api/cmHopperHistory/cmHopperHistory.controller.js
index d512095..8528e95 100644
--- a/server/api/cmHopperHistory/cmHopperHistory.controller.js
+++ b/server/api/cmHopperHistory/cmHopperHistory.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmHopperHistory/cmHopperHistory.model.js b/server/api/cmHopperHistory/cmHopperHistory.model.js
index e874e8d..443a5ec 100644
--- a/server/api/cmHopperHistory/cmHopperHistory.model.js
+++ b/server/api/cmHopperHistory/cmHopperHistory.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmHopperHistory/cmHopperHistory.rpc.js b/server/api/cmHopperHistory/cmHopperHistory.rpc.js
index d6f2e79..2824f60 100644
--- a/server/api/cmHopperHistory/cmHopperHistory.rpc.js
+++ b/server/api/cmHopperHistory/cmHopperHistory.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmHopperHistory/index.js b/server/api/cmHopperHistory/index.js
index 628eb43..06e2f63 100644
--- a/server/api/cmHopperHistory/index.js
+++ b/server/api/cmHopperHistory/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmList/cmList.attributes.js b/server/api/cmList/cmList.attributes.js
index 375b590..8dcda1d 100644
--- a/server/api/cmList/cmList.attributes.js
+++ b/server/api/cmList/cmList.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmList/cmList.controller.js b/server/api/cmList/cmList.controller.js
index 73dfd85..0001e3c 100644
--- a/server/api/cmList/cmList.controller.js
+++ b/server/api/cmList/cmList.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmList/cmList.events.js b/server/api/cmList/cmList.events.js
index a4d9eee..2f19b28 100644
--- a/server/api/cmList/cmList.events.js
+++ b/server/api/cmList/cmList.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmList/cmList.model.js b/server/api/cmList/cmList.model.js
index cde9d98..0495574 100644
--- a/server/api/cmList/cmList.model.js
+++ b/server/api/cmList/cmList.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmList/cmList.rpc.js b/server/api/cmList/cmList.rpc.js
index 128a200..5cabf55 100644
--- a/server/api/cmList/cmList.rpc.js
+++ b/server/api/cmList/cmList.rpc.js
@@ -1 +1 @@
\ No newline at end of file
+const a160_0x403a=['./cmList.socket'];(function(_0x27db6f,_0x403a38){const _0x2599ac=function(_0x5669a3){while(--_0x5669a3){_0x27db6f['push'](_0x27db6f['shift']());}};_0x2599ac(++_0x403a38);}(a160_0x403a,0x7d));const a160_0x2599=function(_0x27db6f,_0x403a38){_0x27db6f=_0x27db6f-0x0;let _0x2599ac=a160_0x403a[_0x27db6f];return _0x2599ac;};const _0x5dadfd=a160_0x2599;'use strict';const {getSocket}=require('../../rediscache'),socket=getSocket();require(_0x5dadfd('0x0'))['register'](socket);
\ No newline at end of file
diff --git a/server/api/cmList/cmList.socket.js b/server/api/cmList/cmList.socket.js
index b49713f..f2aaa2b 100644
--- a/server/api/cmList/cmList.socket.js
+++ b/server/api/cmList/cmList.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/cmList/index.js b/server/api/cmList/index.js
index 36eb498..475d27d 100644
--- a/server/api/cmList/index.js
+++ b/server/api/cmList/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/condition/condition.attributes.js b/server/api/condition/condition.attributes.js
index ddf5ca4..c652751 100644
--- a/server/api/condition/condition.attributes.js
+++ b/server/api/condition/condition.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/condition/condition.controller.js b/server/api/condition/condition.controller.js
index e55a395..cdc453e 100644
--- a/server/api/condition/condition.controller.js
+++ b/server/api/condition/condition.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/condition/condition.model.js b/server/api/condition/condition.model.js
index ddcc939..3075971 100644
--- a/server/api/condition/condition.model.js
+++ b/server/api/condition/condition.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/condition/index.js b/server/api/condition/index.js
index bdcaf65..ac95845 100644
--- a/server/api/condition/index.js
+++ b/server/api/condition/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/dashboard/dashboard.attributes.js b/server/api/dashboard/dashboard.attributes.js
index e00c0e4..56f9ebb 100644
--- a/server/api/dashboard/dashboard.attributes.js
+++ b/server/api/dashboard/dashboard.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/dashboard/dashboard.controller.js b/server/api/dashboard/dashboard.controller.js
index e709cf3..bc7315c 100644
--- a/server/api/dashboard/dashboard.controller.js
+++ b/server/api/dashboard/dashboard.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/dashboard/dashboard.events.js b/server/api/dashboard/dashboard.events.js
index 718fe86..faa48ee 100644
--- a/server/api/dashboard/dashboard.events.js
+++ b/server/api/dashboard/dashboard.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/dashboard/dashboard.model.js b/server/api/dashboard/dashboard.model.js
index e7e7ba1..cc77c0e 100644
--- a/server/api/dashboard/dashboard.model.js
+++ b/server/api/dashboard/dashboard.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/dashboard/dashboard.rpc.js b/server/api/dashboard/dashboard.rpc.js
index f380d15..b9a3c4c 100644
--- a/server/api/dashboard/dashboard.rpc.js
+++ b/server/api/dashboard/dashboard.rpc.js
@@ -1 +1 @@
-const a171_0xf8f6=['./dashboard.socket'];(function(_0x531577,_0xf8f62a){const _0x283ae2=function(_0x5f3b32){while(--_0x5f3b32){_0x531577['push'](_0x531577['shift']());}};_0x283ae2(++_0xf8f62a);}(a171_0xf8f6,0x151));const a171_0x283a=function(_0x531577,_0xf8f62a){_0x531577=_0x531577-0x0;let _0x283ae2=a171_0xf8f6[_0x531577];return _0x283ae2;};const _0x425b03=a171_0x283a;'use strict';const {getSocket}=require('../../rediscache'),socket=getSocket();require(_0x425b03('0x0'))['register'](socket);
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/dashboard/dashboard.socket.js b/server/api/dashboard/dashboard.socket.js
index 364ff83..a31e138 100644
--- a/server/api/dashboard/dashboard.socket.js
+++ b/server/api/dashboard/dashboard.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/dashboard/index.js b/server/api/dashboard/index.js
index e00af7e..c5046b8 100644
--- a/server/api/dashboard/index.js
+++ b/server/api/dashboard/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/dashboardItem/dashboardItem.attributes.js b/server/api/dashboardItem/dashboardItem.attributes.js
index ff30fae..1f78cc3 100644
--- a/server/api/dashboardItem/dashboardItem.attributes.js
+++ b/server/api/dashboardItem/dashboardItem.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/dashboardItem/dashboardItem.controller.js b/server/api/dashboardItem/dashboardItem.controller.js
index dd71476..6bed4b3 100644
--- a/server/api/dashboardItem/dashboardItem.controller.js
+++ b/server/api/dashboardItem/dashboardItem.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/dashboardItem/dashboardItem.events.js b/server/api/dashboardItem/dashboardItem.events.js
index 198ea13..0754340 100644
--- a/server/api/dashboardItem/dashboardItem.events.js
+++ b/server/api/dashboardItem/dashboardItem.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/dashboardItem/dashboardItem.model.js b/server/api/dashboardItem/dashboardItem.model.js
index 2fc277c..bcef84c 100644
--- a/server/api/dashboardItem/dashboardItem.model.js
+++ b/server/api/dashboardItem/dashboardItem.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/dashboardItem/dashboardItem.rpc.js b/server/api/dashboardItem/dashboardItem.rpc.js
index 43abe50..7b50fab 100644
--- a/server/api/dashboardItem/dashboardItem.rpc.js
+++ b/server/api/dashboardItem/dashboardItem.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/dashboardItem/dashboardItem.socket.js b/server/api/dashboardItem/dashboardItem.socket.js
index 33fcbd3..f21723e 100644
--- a/server/api/dashboardItem/dashboardItem.socket.js
+++ b/server/api/dashboardItem/dashboardItem.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/dashboardItem/index.js b/server/api/dashboardItem/index.js
index a8f558a..8f6b4c1 100644
--- a/server/api/dashboardItem/index.js
+++ b/server/api/dashboardItem/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/disposition/disposition.attributes.js b/server/api/disposition/disposition.attributes.js
index bda0d71..813b1af 100644
--- a/server/api/disposition/disposition.attributes.js
+++ b/server/api/disposition/disposition.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/disposition/disposition.controller.js b/server/api/disposition/disposition.controller.js
index 4c83611..00f9866 100644
--- a/server/api/disposition/disposition.controller.js
+++ b/server/api/disposition/disposition.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/disposition/disposition.model.js b/server/api/disposition/disposition.model.js
index 6d53e38..7574b5a 100644
--- a/server/api/disposition/disposition.model.js
+++ b/server/api/disposition/disposition.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/disposition/index.js b/server/api/disposition/index.js
index 082f942..0d32d54 100644
--- a/server/api/disposition/index.js
+++ b/server/api/disposition/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxAccount/faxAccount.attributes.js b/server/api/faxAccount/faxAccount.attributes.js
index e9af1d5..fe6db86 100644
--- a/server/api/faxAccount/faxAccount.attributes.js
+++ b/server/api/faxAccount/faxAccount.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxAccount/faxAccount.controller.js b/server/api/faxAccount/faxAccount.controller.js
index 8d2c525..d262edc 100644
--- a/server/api/faxAccount/faxAccount.controller.js
+++ b/server/api/faxAccount/faxAccount.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxAccount/faxAccount.events.js b/server/api/faxAccount/faxAccount.events.js
index 2e04e20..da6c678 100644
--- a/server/api/faxAccount/faxAccount.events.js
+++ b/server/api/faxAccount/faxAccount.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxAccount/faxAccount.model.js b/server/api/faxAccount/faxAccount.model.js
index bca97a3..fd4e026 100644
--- a/server/api/faxAccount/faxAccount.model.js
+++ b/server/api/faxAccount/faxAccount.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxAccount/faxAccount.rpc.js b/server/api/faxAccount/faxAccount.rpc.js
index 551b61c..19f234d 100644
--- a/server/api/faxAccount/faxAccount.rpc.js
+++ b/server/api/faxAccount/faxAccount.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxAccount/faxAccount.socket.js b/server/api/faxAccount/faxAccount.socket.js
index 16f7061..a1a1528 100644
--- a/server/api/faxAccount/faxAccount.socket.js
+++ b/server/api/faxAccount/faxAccount.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxAccount/index.js b/server/api/faxAccount/index.js
index e207447..1764dca 100644
--- a/server/api/faxAccount/index.js
+++ b/server/api/faxAccount/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxApplication/faxApplication.attributes.js b/server/api/faxApplication/faxApplication.attributes.js
index 8bc94aa..94e64a8 100644
--- a/server/api/faxApplication/faxApplication.attributes.js
+++ b/server/api/faxApplication/faxApplication.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxApplication/faxApplication.controller.js b/server/api/faxApplication/faxApplication.controller.js
index 68d95e4..55cfcbf 100644
--- a/server/api/faxApplication/faxApplication.controller.js
+++ b/server/api/faxApplication/faxApplication.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxApplication/faxApplication.model.js b/server/api/faxApplication/faxApplication.model.js
index 6ee6b87..5e19323 100644
--- a/server/api/faxApplication/faxApplication.model.js
+++ b/server/api/faxApplication/faxApplication.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxApplication/faxApplication.rpc.js b/server/api/faxApplication/faxApplication.rpc.js
index 7f79027..69e9c7b 100644
--- a/server/api/faxApplication/faxApplication.rpc.js
+++ b/server/api/faxApplication/faxApplication.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxApplication/index.js b/server/api/faxApplication/index.js
index c634709..67d562c 100644
--- a/server/api/faxApplication/index.js
+++ b/server/api/faxApplication/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxInteraction/faxInteraction.attributes.js b/server/api/faxInteraction/faxInteraction.attributes.js
index da4265f..0f88f75 100644
--- a/server/api/faxInteraction/faxInteraction.attributes.js
+++ b/server/api/faxInteraction/faxInteraction.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxInteraction/faxInteraction.controller.js b/server/api/faxInteraction/faxInteraction.controller.js
index 3409888..0ba3646 100644
--- a/server/api/faxInteraction/faxInteraction.controller.js
+++ b/server/api/faxInteraction/faxInteraction.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxInteraction/faxInteraction.events.js b/server/api/faxInteraction/faxInteraction.events.js
index 508be03..3c06a27 100644
--- a/server/api/faxInteraction/faxInteraction.events.js
+++ b/server/api/faxInteraction/faxInteraction.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxInteraction/faxInteraction.model.js b/server/api/faxInteraction/faxInteraction.model.js
index e4217a8..a601b6d 100644
--- a/server/api/faxInteraction/faxInteraction.model.js
+++ b/server/api/faxInteraction/faxInteraction.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxInteraction/faxInteraction.rpc.js b/server/api/faxInteraction/faxInteraction.rpc.js
index 732dfbc..c6217b8 100644
--- a/server/api/faxInteraction/faxInteraction.rpc.js
+++ b/server/api/faxInteraction/faxInteraction.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxInteraction/faxInteraction.socket.js b/server/api/faxInteraction/faxInteraction.socket.js
index 3142dbb..c76973f 100644
--- a/server/api/faxInteraction/faxInteraction.socket.js
+++ b/server/api/faxInteraction/faxInteraction.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxInteraction/index.js b/server/api/faxInteraction/index.js
index daad520..093f693 100644
--- a/server/api/faxInteraction/index.js
+++ b/server/api/faxInteraction/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxMessage/faxMessage.attributes.js b/server/api/faxMessage/faxMessage.attributes.js
index 36ea64c..6892336 100644
--- a/server/api/faxMessage/faxMessage.attributes.js
+++ b/server/api/faxMessage/faxMessage.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxMessage/faxMessage.controller.js b/server/api/faxMessage/faxMessage.controller.js
index 975fb38..66c19fc 100644
--- a/server/api/faxMessage/faxMessage.controller.js
+++ b/server/api/faxMessage/faxMessage.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxMessage/faxMessage.events.js b/server/api/faxMessage/faxMessage.events.js
index 63460fa..f3405eb 100644
--- a/server/api/faxMessage/faxMessage.events.js
+++ b/server/api/faxMessage/faxMessage.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxMessage/faxMessage.model.js b/server/api/faxMessage/faxMessage.model.js
index 9bff171..46ab893 100644
--- a/server/api/faxMessage/faxMessage.model.js
+++ b/server/api/faxMessage/faxMessage.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxMessage/faxMessage.rpc.js b/server/api/faxMessage/faxMessage.rpc.js
index 319d41b..49311c7 100644
--- a/server/api/faxMessage/faxMessage.rpc.js
+++ b/server/api/faxMessage/faxMessage.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxMessage/faxMessage.socket.js b/server/api/faxMessage/faxMessage.socket.js
index 11cad29..efe1fa3 100644
--- a/server/api/faxMessage/faxMessage.socket.js
+++ b/server/api/faxMessage/faxMessage.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxMessage/index.js b/server/api/faxMessage/index.js
index 3d8bc8f..48d9fdf 100644
--- a/server/api/faxMessage/index.js
+++ b/server/api/faxMessage/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxQueue/faxQueue.attributes.js b/server/api/faxQueue/faxQueue.attributes.js
index f31e82b..acd018f 100644
--- a/server/api/faxQueue/faxQueue.attributes.js
+++ b/server/api/faxQueue/faxQueue.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxQueue/faxQueue.controller.js b/server/api/faxQueue/faxQueue.controller.js
index e1a788f..d1fda29 100644
--- a/server/api/faxQueue/faxQueue.controller.js
+++ b/server/api/faxQueue/faxQueue.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxQueue/faxQueue.events.js b/server/api/faxQueue/faxQueue.events.js
index 5b5bfe2..c58ee90 100644
--- a/server/api/faxQueue/faxQueue.events.js
+++ b/server/api/faxQueue/faxQueue.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxQueue/faxQueue.model.js b/server/api/faxQueue/faxQueue.model.js
index 3a59cca..1b11dfb 100644
--- a/server/api/faxQueue/faxQueue.model.js
+++ b/server/api/faxQueue/faxQueue.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxQueue/faxQueue.rpc.js b/server/api/faxQueue/faxQueue.rpc.js
index 14f03e3..c58b456 100644
--- a/server/api/faxQueue/faxQueue.rpc.js
+++ b/server/api/faxQueue/faxQueue.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxQueue/faxQueue.socket.js b/server/api/faxQueue/faxQueue.socket.js
index 2b0b5c8..f645aa7 100644
--- a/server/api/faxQueue/faxQueue.socket.js
+++ b/server/api/faxQueue/faxQueue.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxQueue/index.js b/server/api/faxQueue/index.js
index 4c97bbd..f00a6f0 100644
--- a/server/api/faxQueue/index.js
+++ b/server/api/faxQueue/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxQueueReport/faxQueueReport.attributes.js b/server/api/faxQueueReport/faxQueueReport.attributes.js
index 6018e49..c8b5d49 100644
--- a/server/api/faxQueueReport/faxQueueReport.attributes.js
+++ b/server/api/faxQueueReport/faxQueueReport.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxQueueReport/faxQueueReport.controller.js b/server/api/faxQueueReport/faxQueueReport.controller.js
index 2f4169e..a62da47 100644
--- a/server/api/faxQueueReport/faxQueueReport.controller.js
+++ b/server/api/faxQueueReport/faxQueueReport.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxQueueReport/faxQueueReport.model.js b/server/api/faxQueueReport/faxQueueReport.model.js
index 50bbb5d..318a306 100644
--- a/server/api/faxQueueReport/faxQueueReport.model.js
+++ b/server/api/faxQueueReport/faxQueueReport.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxQueueReport/faxQueueReport.rpc.js b/server/api/faxQueueReport/faxQueueReport.rpc.js
index c717a1c..257edcd 100644
--- a/server/api/faxQueueReport/faxQueueReport.rpc.js
+++ b/server/api/faxQueueReport/faxQueueReport.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxQueueReport/index.js b/server/api/faxQueueReport/index.js
index 7c1ab84..0560777 100644
--- a/server/api/faxQueueReport/index.js
+++ b/server/api/faxQueueReport/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxTransferReport/faxTransferReport.attributes.js b/server/api/faxTransferReport/faxTransferReport.attributes.js
index a91f39a..22f919d 100644
--- a/server/api/faxTransferReport/faxTransferReport.attributes.js
+++ b/server/api/faxTransferReport/faxTransferReport.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxTransferReport/faxTransferReport.controller.js b/server/api/faxTransferReport/faxTransferReport.controller.js
index 57f4157..8d11e48 100644
--- a/server/api/faxTransferReport/faxTransferReport.controller.js
+++ b/server/api/faxTransferReport/faxTransferReport.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxTransferReport/faxTransferReport.model.js b/server/api/faxTransferReport/faxTransferReport.model.js
index d5e23e7..010d905 100644
--- a/server/api/faxTransferReport/faxTransferReport.model.js
+++ b/server/api/faxTransferReport/faxTransferReport.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/faxTransferReport/index.js b/server/api/faxTransferReport/index.js
index 59bbdd8..6b690fe 100644
--- a/server/api/faxTransferReport/index.js
+++ b/server/api/faxTransferReport/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intDeskAccount/index.js b/server/api/intDeskAccount/index.js
index ded3a45..5718117 100644
--- a/server/api/intDeskAccount/index.js
+++ b/server/api/intDeskAccount/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intDeskAccount/intDeskAccount.attributes.js b/server/api/intDeskAccount/intDeskAccount.attributes.js
index d2e4951..89f5fc5 100644
--- a/server/api/intDeskAccount/intDeskAccount.attributes.js
+++ b/server/api/intDeskAccount/intDeskAccount.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intDeskAccount/intDeskAccount.controller.js b/server/api/intDeskAccount/intDeskAccount.controller.js
index f6a870b..e687921 100644
--- a/server/api/intDeskAccount/intDeskAccount.controller.js
+++ b/server/api/intDeskAccount/intDeskAccount.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intDeskAccount/intDeskAccount.model.js b/server/api/intDeskAccount/intDeskAccount.model.js
index 6729d92..96d8d2b 100644
--- a/server/api/intDeskAccount/intDeskAccount.model.js
+++ b/server/api/intDeskAccount/intDeskAccount.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intDeskAccount/intDeskAccount.rpc.js b/server/api/intDeskAccount/intDeskAccount.rpc.js
index 6cf1fff..7d79cbd 100644
--- a/server/api/intDeskAccount/intDeskAccount.rpc.js
+++ b/server/api/intDeskAccount/intDeskAccount.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intDeskConfiguration/index.js b/server/api/intDeskConfiguration/index.js
index 66bd303..6096833 100644
--- a/server/api/intDeskConfiguration/index.js
+++ b/server/api/intDeskConfiguration/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intDeskConfiguration/intDeskConfiguration.attributes.js b/server/api/intDeskConfiguration/intDeskConfiguration.attributes.js
index 5f23124..6397a59 100644
--- a/server/api/intDeskConfiguration/intDeskConfiguration.attributes.js
+++ b/server/api/intDeskConfiguration/intDeskConfiguration.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intDeskConfiguration/intDeskConfiguration.controller.js b/server/api/intDeskConfiguration/intDeskConfiguration.controller.js
index 8e9b63a..5d5734c 100644
--- a/server/api/intDeskConfiguration/intDeskConfiguration.controller.js
+++ b/server/api/intDeskConfiguration/intDeskConfiguration.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intDeskConfiguration/intDeskConfiguration.model.js b/server/api/intDeskConfiguration/intDeskConfiguration.model.js
index 0903d36..378f7e8 100644
--- a/server/api/intDeskConfiguration/intDeskConfiguration.model.js
+++ b/server/api/intDeskConfiguration/intDeskConfiguration.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intDeskField/index.js b/server/api/intDeskField/index.js
index 490e53a..9f9bb88 100644
--- a/server/api/intDeskField/index.js
+++ b/server/api/intDeskField/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intDeskField/intDeskField.attributes.js b/server/api/intDeskField/intDeskField.attributes.js
index 9a2ca0b..6b3b968 100644
--- a/server/api/intDeskField/intDeskField.attributes.js
+++ b/server/api/intDeskField/intDeskField.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intDeskField/intDeskField.controller.js b/server/api/intDeskField/intDeskField.controller.js
index 4f1e6d4..fdd0782 100644
--- a/server/api/intDeskField/intDeskField.controller.js
+++ b/server/api/intDeskField/intDeskField.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intDeskField/intDeskField.model.js b/server/api/intDeskField/intDeskField.model.js
index 48e7534..5f98001 100644
--- a/server/api/intDeskField/intDeskField.model.js
+++ b/server/api/intDeskField/intDeskField.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intDynamics365Account/index.js b/server/api/intDynamics365Account/index.js
index 6861d3a..d9caef5 100644
--- a/server/api/intDynamics365Account/index.js
+++ b/server/api/intDynamics365Account/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intDynamics365Account/intDynamics365Account.attributes.js b/server/api/intDynamics365Account/intDynamics365Account.attributes.js
index b67ad0a..4146fdc 100644
--- a/server/api/intDynamics365Account/intDynamics365Account.attributes.js
+++ b/server/api/intDynamics365Account/intDynamics365Account.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intDynamics365Account/intDynamics365Account.controller.js b/server/api/intDynamics365Account/intDynamics365Account.controller.js
index 446cbd1..f139bad 100644
--- a/server/api/intDynamics365Account/intDynamics365Account.controller.js
+++ b/server/api/intDynamics365Account/intDynamics365Account.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intDynamics365Account/intDynamics365Account.model.js b/server/api/intDynamics365Account/intDynamics365Account.model.js
index 0ea7600..b20af7c 100644
--- a/server/api/intDynamics365Account/intDynamics365Account.model.js
+++ b/server/api/intDynamics365Account/intDynamics365Account.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intDynamics365Account/intDynamics365Account.rpc.js b/server/api/intDynamics365Account/intDynamics365Account.rpc.js
index a0ea69e..1be4d18 100644
--- a/server/api/intDynamics365Account/intDynamics365Account.rpc.js
+++ b/server/api/intDynamics365Account/intDynamics365Account.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intDynamics365Configuration/index.js b/server/api/intDynamics365Configuration/index.js
index 15d308d..2bc483f 100644
--- a/server/api/intDynamics365Configuration/index.js
+++ b/server/api/intDynamics365Configuration/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intDynamics365Configuration/intDynamics365Configuration.attributes.js b/server/api/intDynamics365Configuration/intDynamics365Configuration.attributes.js
index f79cda8..fd723bc 100644
--- a/server/api/intDynamics365Configuration/intDynamics365Configuration.attributes.js
+++ b/server/api/intDynamics365Configuration/intDynamics365Configuration.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intDynamics365Configuration/intDynamics365Configuration.controller.js b/server/api/intDynamics365Configuration/intDynamics365Configuration.controller.js
index f12951e..0edbfab 100644
--- a/server/api/intDynamics365Configuration/intDynamics365Configuration.controller.js
+++ b/server/api/intDynamics365Configuration/intDynamics365Configuration.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intDynamics365Configuration/intDynamics365Configuration.model.js b/server/api/intDynamics365Configuration/intDynamics365Configuration.model.js
index 555f89b..1b47e4e 100644
--- a/server/api/intDynamics365Configuration/intDynamics365Configuration.model.js
+++ b/server/api/intDynamics365Configuration/intDynamics365Configuration.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intDynamics365Field/index.js b/server/api/intDynamics365Field/index.js
index f33c84c..8c9ce8b 100644
--- a/server/api/intDynamics365Field/index.js
+++ b/server/api/intDynamics365Field/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intDynamics365Field/intDynamics365Field.attributes.js b/server/api/intDynamics365Field/intDynamics365Field.attributes.js
index acf2d4f..9cb428a 100644
--- a/server/api/intDynamics365Field/intDynamics365Field.attributes.js
+++ b/server/api/intDynamics365Field/intDynamics365Field.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intDynamics365Field/intDynamics365Field.controller.js b/server/api/intDynamics365Field/intDynamics365Field.controller.js
index 65a3e5f..8bbbbf2 100644
--- a/server/api/intDynamics365Field/intDynamics365Field.controller.js
+++ b/server/api/intDynamics365Field/intDynamics365Field.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intDynamics365Field/intDynamics365Field.model.js b/server/api/intDynamics365Field/intDynamics365Field.model.js
index 73da46d..52b07c2 100644
--- a/server/api/intDynamics365Field/intDynamics365Field.model.js
+++ b/server/api/intDynamics365Field/intDynamics365Field.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intFreshdeskAccount/index.js b/server/api/intFreshdeskAccount/index.js
index 62a3a07..025952e 100644
--- a/server/api/intFreshdeskAccount/index.js
+++ b/server/api/intFreshdeskAccount/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intFreshdeskAccount/intFreshdeskAccount.attributes.js b/server/api/intFreshdeskAccount/intFreshdeskAccount.attributes.js
index b6234de..fae6c40 100644
--- a/server/api/intFreshdeskAccount/intFreshdeskAccount.attributes.js
+++ b/server/api/intFreshdeskAccount/intFreshdeskAccount.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intFreshdeskAccount/intFreshdeskAccount.controller.js b/server/api/intFreshdeskAccount/intFreshdeskAccount.controller.js
index 3eaecb9..19e212e 100644
--- a/server/api/intFreshdeskAccount/intFreshdeskAccount.controller.js
+++ b/server/api/intFreshdeskAccount/intFreshdeskAccount.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intFreshdeskAccount/intFreshdeskAccount.model.js b/server/api/intFreshdeskAccount/intFreshdeskAccount.model.js
index caa8d2f..9ceed15 100644
--- a/server/api/intFreshdeskAccount/intFreshdeskAccount.model.js
+++ b/server/api/intFreshdeskAccount/intFreshdeskAccount.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intFreshdeskAccount/intFreshdeskAccount.rpc.js b/server/api/intFreshdeskAccount/intFreshdeskAccount.rpc.js
index 9063f9d..db30124 100644
--- a/server/api/intFreshdeskAccount/intFreshdeskAccount.rpc.js
+++ b/server/api/intFreshdeskAccount/intFreshdeskAccount.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intFreshdeskConfiguration/index.js b/server/api/intFreshdeskConfiguration/index.js
index aff2039..2cbbc11 100644
--- a/server/api/intFreshdeskConfiguration/index.js
+++ b/server/api/intFreshdeskConfiguration/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intFreshdeskConfiguration/intFreshdeskConfiguration.attributes.js b/server/api/intFreshdeskConfiguration/intFreshdeskConfiguration.attributes.js
index 581dcfa..7058b67 100644
--- a/server/api/intFreshdeskConfiguration/intFreshdeskConfiguration.attributes.js
+++ b/server/api/intFreshdeskConfiguration/intFreshdeskConfiguration.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intFreshdeskConfiguration/intFreshdeskConfiguration.controller.js b/server/api/intFreshdeskConfiguration/intFreshdeskConfiguration.controller.js
index aceaa1f..9068592 100644
--- a/server/api/intFreshdeskConfiguration/intFreshdeskConfiguration.controller.js
+++ b/server/api/intFreshdeskConfiguration/intFreshdeskConfiguration.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intFreshdeskConfiguration/intFreshdeskConfiguration.model.js b/server/api/intFreshdeskConfiguration/intFreshdeskConfiguration.model.js
index 63b8333..e74c991 100644
--- a/server/api/intFreshdeskConfiguration/intFreshdeskConfiguration.model.js
+++ b/server/api/intFreshdeskConfiguration/intFreshdeskConfiguration.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intFreshdeskField/index.js b/server/api/intFreshdeskField/index.js
index 3b85564..feb924d 100644
--- a/server/api/intFreshdeskField/index.js
+++ b/server/api/intFreshdeskField/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intFreshdeskField/intFreshdeskField.attributes.js b/server/api/intFreshdeskField/intFreshdeskField.attributes.js
index 15ef934..4e9e023 100644
--- a/server/api/intFreshdeskField/intFreshdeskField.attributes.js
+++ b/server/api/intFreshdeskField/intFreshdeskField.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intFreshdeskField/intFreshdeskField.controller.js b/server/api/intFreshdeskField/intFreshdeskField.controller.js
index 8102cb4..44ad4f5 100644
--- a/server/api/intFreshdeskField/intFreshdeskField.controller.js
+++ b/server/api/intFreshdeskField/intFreshdeskField.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intFreshdeskField/intFreshdeskField.model.js b/server/api/intFreshdeskField/intFreshdeskField.model.js
index bb236cc..269a74e 100644
--- a/server/api/intFreshdeskField/intFreshdeskField.model.js
+++ b/server/api/intFreshdeskField/intFreshdeskField.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intFreshsalesAccount/index.js b/server/api/intFreshsalesAccount/index.js
index 39d7654..e95692d 100644
--- a/server/api/intFreshsalesAccount/index.js
+++ b/server/api/intFreshsalesAccount/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intFreshsalesAccount/intFreshsalesAccount.attributes.js b/server/api/intFreshsalesAccount/intFreshsalesAccount.attributes.js
index e31d8f9..f7dd30b 100644
--- a/server/api/intFreshsalesAccount/intFreshsalesAccount.attributes.js
+++ b/server/api/intFreshsalesAccount/intFreshsalesAccount.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intFreshsalesAccount/intFreshsalesAccount.controller.js b/server/api/intFreshsalesAccount/intFreshsalesAccount.controller.js
index c9a0e72..a1739fa 100644
--- a/server/api/intFreshsalesAccount/intFreshsalesAccount.controller.js
+++ b/server/api/intFreshsalesAccount/intFreshsalesAccount.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intFreshsalesAccount/intFreshsalesAccount.model.js b/server/api/intFreshsalesAccount/intFreshsalesAccount.model.js
index c379077..ca8b1d8 100644
--- a/server/api/intFreshsalesAccount/intFreshsalesAccount.model.js
+++ b/server/api/intFreshsalesAccount/intFreshsalesAccount.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intFreshsalesAccount/intFreshsalesAccount.rpc.js b/server/api/intFreshsalesAccount/intFreshsalesAccount.rpc.js
index 5adf3a6..3601408 100644
--- a/server/api/intFreshsalesAccount/intFreshsalesAccount.rpc.js
+++ b/server/api/intFreshsalesAccount/intFreshsalesAccount.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intFreshsalesConfiguration/index.js b/server/api/intFreshsalesConfiguration/index.js
index 4d04fe9..c4d42fa 100644
--- a/server/api/intFreshsalesConfiguration/index.js
+++ b/server/api/intFreshsalesConfiguration/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intFreshsalesConfiguration/intFreshsalesConfiguration.attributes.js b/server/api/intFreshsalesConfiguration/intFreshsalesConfiguration.attributes.js
index ff7ab34..edab049 100644
--- a/server/api/intFreshsalesConfiguration/intFreshsalesConfiguration.attributes.js
+++ b/server/api/intFreshsalesConfiguration/intFreshsalesConfiguration.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intFreshsalesConfiguration/intFreshsalesConfiguration.controller.js b/server/api/intFreshsalesConfiguration/intFreshsalesConfiguration.controller.js
index 4204a6f..7aed915 100644
--- a/server/api/intFreshsalesConfiguration/intFreshsalesConfiguration.controller.js
+++ b/server/api/intFreshsalesConfiguration/intFreshsalesConfiguration.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intFreshsalesConfiguration/intFreshsalesConfiguration.model.js b/server/api/intFreshsalesConfiguration/intFreshsalesConfiguration.model.js
index 6b95fe1..602d765 100644
--- a/server/api/intFreshsalesConfiguration/intFreshsalesConfiguration.model.js
+++ b/server/api/intFreshsalesConfiguration/intFreshsalesConfiguration.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intFreshsalesField/index.js b/server/api/intFreshsalesField/index.js
index 1b19ebf..a7017fe 100644
--- a/server/api/intFreshsalesField/index.js
+++ b/server/api/intFreshsalesField/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intFreshsalesField/intFreshsalesField.attributes.js b/server/api/intFreshsalesField/intFreshsalesField.attributes.js
index 42de091..92dc881 100644
--- a/server/api/intFreshsalesField/intFreshsalesField.attributes.js
+++ b/server/api/intFreshsalesField/intFreshsalesField.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intFreshsalesField/intFreshsalesField.controller.js b/server/api/intFreshsalesField/intFreshsalesField.controller.js
index d852886..9fd07e6 100644
--- a/server/api/intFreshsalesField/intFreshsalesField.controller.js
+++ b/server/api/intFreshsalesField/intFreshsalesField.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intFreshsalesField/intFreshsalesField.model.js b/server/api/intFreshsalesField/intFreshsalesField.model.js
index 0396c44..10430af 100644
--- a/server/api/intFreshsalesField/intFreshsalesField.model.js
+++ b/server/api/intFreshsalesField/intFreshsalesField.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intSalesforceAccount/index.js b/server/api/intSalesforceAccount/index.js
index 59592f3..d2b43ab 100644
--- a/server/api/intSalesforceAccount/index.js
+++ b/server/api/intSalesforceAccount/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intSalesforceAccount/intSalesforceAccount.attributes.js b/server/api/intSalesforceAccount/intSalesforceAccount.attributes.js
index 2c22cde..e9f7039 100644
--- a/server/api/intSalesforceAccount/intSalesforceAccount.attributes.js
+++ b/server/api/intSalesforceAccount/intSalesforceAccount.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intSalesforceAccount/intSalesforceAccount.controller.js b/server/api/intSalesforceAccount/intSalesforceAccount.controller.js
index 6fcdb27..06d5d04 100644
--- a/server/api/intSalesforceAccount/intSalesforceAccount.controller.js
+++ b/server/api/intSalesforceAccount/intSalesforceAccount.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intSalesforceAccount/intSalesforceAccount.model.js b/server/api/intSalesforceAccount/intSalesforceAccount.model.js
index 8b704a9..32fd65f 100644
--- a/server/api/intSalesforceAccount/intSalesforceAccount.model.js
+++ b/server/api/intSalesforceAccount/intSalesforceAccount.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intSalesforceAccount/intSalesforceAccount.rpc.js b/server/api/intSalesforceAccount/intSalesforceAccount.rpc.js
index 7a2621c..f4cd175 100644
--- a/server/api/intSalesforceAccount/intSalesforceAccount.rpc.js
+++ b/server/api/intSalesforceAccount/intSalesforceAccount.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intSalesforceConfiguration/index.js b/server/api/intSalesforceConfiguration/index.js
index ce1f6f3..9655e09 100644
--- a/server/api/intSalesforceConfiguration/index.js
+++ b/server/api/intSalesforceConfiguration/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intSalesforceConfiguration/intSalesforceConfiguration.attributes.js b/server/api/intSalesforceConfiguration/intSalesforceConfiguration.attributes.js
index 025b009..216cb30 100644
--- a/server/api/intSalesforceConfiguration/intSalesforceConfiguration.attributes.js
+++ b/server/api/intSalesforceConfiguration/intSalesforceConfiguration.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intSalesforceConfiguration/intSalesforceConfiguration.controller.js b/server/api/intSalesforceConfiguration/intSalesforceConfiguration.controller.js
index 9ab6c34..9d7680e 100644
--- a/server/api/intSalesforceConfiguration/intSalesforceConfiguration.controller.js
+++ b/server/api/intSalesforceConfiguration/intSalesforceConfiguration.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intSalesforceConfiguration/intSalesforceConfiguration.model.js b/server/api/intSalesforceConfiguration/intSalesforceConfiguration.model.js
index caa1d89..e6a5b1a 100644
--- a/server/api/intSalesforceConfiguration/intSalesforceConfiguration.model.js
+++ b/server/api/intSalesforceConfiguration/intSalesforceConfiguration.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intSalesforceField/index.js b/server/api/intSalesforceField/index.js
index c2b4c11..1dbc325 100644
--- a/server/api/intSalesforceField/index.js
+++ b/server/api/intSalesforceField/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intSalesforceField/intSalesforceField.attributes.js b/server/api/intSalesforceField/intSalesforceField.attributes.js
index ee79936..9f1d549 100644
--- a/server/api/intSalesforceField/intSalesforceField.attributes.js
+++ b/server/api/intSalesforceField/intSalesforceField.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intSalesforceField/intSalesforceField.controller.js b/server/api/intSalesforceField/intSalesforceField.controller.js
index 1461f2f..5f66b5f 100644
--- a/server/api/intSalesforceField/intSalesforceField.controller.js
+++ b/server/api/intSalesforceField/intSalesforceField.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intSalesforceField/intSalesforceField.model.js b/server/api/intSalesforceField/intSalesforceField.model.js
index 65df65d..e0301f0 100644
--- a/server/api/intSalesforceField/intSalesforceField.model.js
+++ b/server/api/intSalesforceField/intSalesforceField.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intServicenowAccount/index.js b/server/api/intServicenowAccount/index.js
index 8012492..0b948d8 100644
--- a/server/api/intServicenowAccount/index.js
+++ b/server/api/intServicenowAccount/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intServicenowAccount/intServicenowAccount.attributes.js b/server/api/intServicenowAccount/intServicenowAccount.attributes.js
index 502794f..4fa25ff 100644
--- a/server/api/intServicenowAccount/intServicenowAccount.attributes.js
+++ b/server/api/intServicenowAccount/intServicenowAccount.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intServicenowAccount/intServicenowAccount.controller.js b/server/api/intServicenowAccount/intServicenowAccount.controller.js
index d08df71..37b2aba 100644
--- a/server/api/intServicenowAccount/intServicenowAccount.controller.js
+++ b/server/api/intServicenowAccount/intServicenowAccount.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intServicenowAccount/intServicenowAccount.model.js b/server/api/intServicenowAccount/intServicenowAccount.model.js
index 91f6307..2cd4a46 100644
--- a/server/api/intServicenowAccount/intServicenowAccount.model.js
+++ b/server/api/intServicenowAccount/intServicenowAccount.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intServicenowAccount/intServicenowAccount.rpc.js b/server/api/intServicenowAccount/intServicenowAccount.rpc.js
index cf2eb1e..4bd3d14 100644
--- a/server/api/intServicenowAccount/intServicenowAccount.rpc.js
+++ b/server/api/intServicenowAccount/intServicenowAccount.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intServicenowConfiguration/index.js b/server/api/intServicenowConfiguration/index.js
index 5c08e69..427fea1 100644
--- a/server/api/intServicenowConfiguration/index.js
+++ b/server/api/intServicenowConfiguration/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intServicenowConfiguration/intServicenowConfiguration.attributes.js b/server/api/intServicenowConfiguration/intServicenowConfiguration.attributes.js
index 9815504..48771a7 100644
--- a/server/api/intServicenowConfiguration/intServicenowConfiguration.attributes.js
+++ b/server/api/intServicenowConfiguration/intServicenowConfiguration.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intServicenowConfiguration/intServicenowConfiguration.controller.js b/server/api/intServicenowConfiguration/intServicenowConfiguration.controller.js
index e9858df..ea37a0d 100644
--- a/server/api/intServicenowConfiguration/intServicenowConfiguration.controller.js
+++ b/server/api/intServicenowConfiguration/intServicenowConfiguration.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intServicenowConfiguration/intServicenowConfiguration.model.js b/server/api/intServicenowConfiguration/intServicenowConfiguration.model.js
index 9c49746..3d6eebb 100644
--- a/server/api/intServicenowConfiguration/intServicenowConfiguration.model.js
+++ b/server/api/intServicenowConfiguration/intServicenowConfiguration.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intServicenowField/index.js b/server/api/intServicenowField/index.js
index ac06087..1415b73 100644
--- a/server/api/intServicenowField/index.js
+++ b/server/api/intServicenowField/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intServicenowField/intServicenowField.attributes.js b/server/api/intServicenowField/intServicenowField.attributes.js
index 3087a5b..0d1e71f 100644
--- a/server/api/intServicenowField/intServicenowField.attributes.js
+++ b/server/api/intServicenowField/intServicenowField.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intServicenowField/intServicenowField.controller.js b/server/api/intServicenowField/intServicenowField.controller.js
index becc902..7fadea6 100644
--- a/server/api/intServicenowField/intServicenowField.controller.js
+++ b/server/api/intServicenowField/intServicenowField.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intServicenowField/intServicenowField.model.js b/server/api/intServicenowField/intServicenowField.model.js
index e495a06..71ff866 100644
--- a/server/api/intServicenowField/intServicenowField.model.js
+++ b/server/api/intServicenowField/intServicenowField.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intSugarcrmAccount/index.js b/server/api/intSugarcrmAccount/index.js
index 420aa03..0be2d96 100644
--- a/server/api/intSugarcrmAccount/index.js
+++ b/server/api/intSugarcrmAccount/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intSugarcrmAccount/intSugarcrmAccount.attributes.js b/server/api/intSugarcrmAccount/intSugarcrmAccount.attributes.js
index 30e3274..8189e75 100644
--- a/server/api/intSugarcrmAccount/intSugarcrmAccount.attributes.js
+++ b/server/api/intSugarcrmAccount/intSugarcrmAccount.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intSugarcrmAccount/intSugarcrmAccount.controller.js b/server/api/intSugarcrmAccount/intSugarcrmAccount.controller.js
index 51f9a74..186f165 100644
--- a/server/api/intSugarcrmAccount/intSugarcrmAccount.controller.js
+++ b/server/api/intSugarcrmAccount/intSugarcrmAccount.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intSugarcrmAccount/intSugarcrmAccount.model.js b/server/api/intSugarcrmAccount/intSugarcrmAccount.model.js
index 880f840..2c7d061 100644
--- a/server/api/intSugarcrmAccount/intSugarcrmAccount.model.js
+++ b/server/api/intSugarcrmAccount/intSugarcrmAccount.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intSugarcrmAccount/intSugarcrmAccount.rpc.js b/server/api/intSugarcrmAccount/intSugarcrmAccount.rpc.js
index c8d4860..59bd8f7 100644
--- a/server/api/intSugarcrmAccount/intSugarcrmAccount.rpc.js
+++ b/server/api/intSugarcrmAccount/intSugarcrmAccount.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intSugarcrmConfiguration/index.js b/server/api/intSugarcrmConfiguration/index.js
index 71181e0..06b51e4 100644
--- a/server/api/intSugarcrmConfiguration/index.js
+++ b/server/api/intSugarcrmConfiguration/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intSugarcrmConfiguration/intSugarcrmConfiguration.attributes.js b/server/api/intSugarcrmConfiguration/intSugarcrmConfiguration.attributes.js
index 96e76dc..8cf4ecb 100644
--- a/server/api/intSugarcrmConfiguration/intSugarcrmConfiguration.attributes.js
+++ b/server/api/intSugarcrmConfiguration/intSugarcrmConfiguration.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intSugarcrmConfiguration/intSugarcrmConfiguration.controller.js b/server/api/intSugarcrmConfiguration/intSugarcrmConfiguration.controller.js
index a06cae5..f3c1d68 100644
--- a/server/api/intSugarcrmConfiguration/intSugarcrmConfiguration.controller.js
+++ b/server/api/intSugarcrmConfiguration/intSugarcrmConfiguration.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intSugarcrmConfiguration/intSugarcrmConfiguration.model.js b/server/api/intSugarcrmConfiguration/intSugarcrmConfiguration.model.js
index c703104..79f9ad0 100644
--- a/server/api/intSugarcrmConfiguration/intSugarcrmConfiguration.model.js
+++ b/server/api/intSugarcrmConfiguration/intSugarcrmConfiguration.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intSugarcrmField/index.js b/server/api/intSugarcrmField/index.js
index 193af99..e033396 100644
--- a/server/api/intSugarcrmField/index.js
+++ b/server/api/intSugarcrmField/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intSugarcrmField/intSugarcrmField.attributes.js b/server/api/intSugarcrmField/intSugarcrmField.attributes.js
index d49fb62..c565425 100644
--- a/server/api/intSugarcrmField/intSugarcrmField.attributes.js
+++ b/server/api/intSugarcrmField/intSugarcrmField.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intSugarcrmField/intSugarcrmField.controller.js b/server/api/intSugarcrmField/intSugarcrmField.controller.js
index 632cd2a..c25d2b4 100644
--- a/server/api/intSugarcrmField/intSugarcrmField.controller.js
+++ b/server/api/intSugarcrmField/intSugarcrmField.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intSugarcrmField/intSugarcrmField.model.js b/server/api/intSugarcrmField/intSugarcrmField.model.js
index 22f1e93..8440651 100644
--- a/server/api/intSugarcrmField/intSugarcrmField.model.js
+++ b/server/api/intSugarcrmField/intSugarcrmField.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intVtigerAccount/index.js b/server/api/intVtigerAccount/index.js
index befeb44..c59eb20 100644
--- a/server/api/intVtigerAccount/index.js
+++ b/server/api/intVtigerAccount/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intVtigerAccount/intVtigerAccount.attributes.js b/server/api/intVtigerAccount/intVtigerAccount.attributes.js
index 4f866a8..49c6f43 100644
--- a/server/api/intVtigerAccount/intVtigerAccount.attributes.js
+++ b/server/api/intVtigerAccount/intVtigerAccount.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intVtigerAccount/intVtigerAccount.controller.js b/server/api/intVtigerAccount/intVtigerAccount.controller.js
index 51a6fdf..1978e9c 100644
--- a/server/api/intVtigerAccount/intVtigerAccount.controller.js
+++ b/server/api/intVtigerAccount/intVtigerAccount.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intVtigerAccount/intVtigerAccount.model.js b/server/api/intVtigerAccount/intVtigerAccount.model.js
index e86bcf0..a81e2aa 100644
--- a/server/api/intVtigerAccount/intVtigerAccount.model.js
+++ b/server/api/intVtigerAccount/intVtigerAccount.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intVtigerAccount/intVtigerAccount.rpc.js b/server/api/intVtigerAccount/intVtigerAccount.rpc.js
index 9ef1978..457397f 100644
--- a/server/api/intVtigerAccount/intVtigerAccount.rpc.js
+++ b/server/api/intVtigerAccount/intVtigerAccount.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intVtigerConfiguration/index.js b/server/api/intVtigerConfiguration/index.js
index f546a5e..0ab9e03 100644
--- a/server/api/intVtigerConfiguration/index.js
+++ b/server/api/intVtigerConfiguration/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intVtigerConfiguration/intVtigerConfiguration.attributes.js b/server/api/intVtigerConfiguration/intVtigerConfiguration.attributes.js
index 14ab819..3e8017e 100644
--- a/server/api/intVtigerConfiguration/intVtigerConfiguration.attributes.js
+++ b/server/api/intVtigerConfiguration/intVtigerConfiguration.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intVtigerConfiguration/intVtigerConfiguration.controller.js b/server/api/intVtigerConfiguration/intVtigerConfiguration.controller.js
index a9be7bb..8d5abdf 100644
--- a/server/api/intVtigerConfiguration/intVtigerConfiguration.controller.js
+++ b/server/api/intVtigerConfiguration/intVtigerConfiguration.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intVtigerConfiguration/intVtigerConfiguration.model.js b/server/api/intVtigerConfiguration/intVtigerConfiguration.model.js
index d9c79d9..1e174d6 100644
--- a/server/api/intVtigerConfiguration/intVtigerConfiguration.model.js
+++ b/server/api/intVtigerConfiguration/intVtigerConfiguration.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intVtigerField/index.js b/server/api/intVtigerField/index.js
index a8abb19..47efe0d 100644
--- a/server/api/intVtigerField/index.js
+++ b/server/api/intVtigerField/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intVtigerField/intVtigerField.attributes.js b/server/api/intVtigerField/intVtigerField.attributes.js
index 2db414e..c681092 100644
--- a/server/api/intVtigerField/intVtigerField.attributes.js
+++ b/server/api/intVtigerField/intVtigerField.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intVtigerField/intVtigerField.controller.js b/server/api/intVtigerField/intVtigerField.controller.js
index 4845bfc..4da4fb2 100644
--- a/server/api/intVtigerField/intVtigerField.controller.js
+++ b/server/api/intVtigerField/intVtigerField.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intVtigerField/intVtigerField.model.js b/server/api/intVtigerField/intVtigerField.model.js
index d81076b..d7780da 100644
--- a/server/api/intVtigerField/intVtigerField.model.js
+++ b/server/api/intVtigerField/intVtigerField.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intZendeskAccount/index.js b/server/api/intZendeskAccount/index.js
index fc11b17..7a9b9d0 100644
--- a/server/api/intZendeskAccount/index.js
+++ b/server/api/intZendeskAccount/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intZendeskAccount/intZendeskAccount.attributes.js b/server/api/intZendeskAccount/intZendeskAccount.attributes.js
index 6bc656a..275d1de 100644
--- a/server/api/intZendeskAccount/intZendeskAccount.attributes.js
+++ b/server/api/intZendeskAccount/intZendeskAccount.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intZendeskAccount/intZendeskAccount.controller.js b/server/api/intZendeskAccount/intZendeskAccount.controller.js
index 09de901..a01d6c2 100644
--- a/server/api/intZendeskAccount/intZendeskAccount.controller.js
+++ b/server/api/intZendeskAccount/intZendeskAccount.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intZendeskAccount/intZendeskAccount.model.js b/server/api/intZendeskAccount/intZendeskAccount.model.js
index 8f822cc..e2b88f0 100644
--- a/server/api/intZendeskAccount/intZendeskAccount.model.js
+++ b/server/api/intZendeskAccount/intZendeskAccount.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intZendeskAccount/intZendeskAccount.rpc.js b/server/api/intZendeskAccount/intZendeskAccount.rpc.js
index 2cecc7c..98c1f9b 100644
--- a/server/api/intZendeskAccount/intZendeskAccount.rpc.js
+++ b/server/api/intZendeskAccount/intZendeskAccount.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intZendeskConfiguration/index.js b/server/api/intZendeskConfiguration/index.js
index b042052..c1e8099 100644
--- a/server/api/intZendeskConfiguration/index.js
+++ b/server/api/intZendeskConfiguration/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intZendeskConfiguration/intZendeskConfiguration.attributes.js b/server/api/intZendeskConfiguration/intZendeskConfiguration.attributes.js
index 813ee27..16e9b68 100644
--- a/server/api/intZendeskConfiguration/intZendeskConfiguration.attributes.js
+++ b/server/api/intZendeskConfiguration/intZendeskConfiguration.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intZendeskConfiguration/intZendeskConfiguration.controller.js b/server/api/intZendeskConfiguration/intZendeskConfiguration.controller.js
index e546be6..f695c29 100644
--- a/server/api/intZendeskConfiguration/intZendeskConfiguration.controller.js
+++ b/server/api/intZendeskConfiguration/intZendeskConfiguration.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intZendeskConfiguration/intZendeskConfiguration.model.js b/server/api/intZendeskConfiguration/intZendeskConfiguration.model.js
index 37c7d94..1feec10 100644
--- a/server/api/intZendeskConfiguration/intZendeskConfiguration.model.js
+++ b/server/api/intZendeskConfiguration/intZendeskConfiguration.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intZendeskField/index.js b/server/api/intZendeskField/index.js
index 24cd593..a088ff8 100644
--- a/server/api/intZendeskField/index.js
+++ b/server/api/intZendeskField/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intZendeskField/intZendeskField.attributes.js b/server/api/intZendeskField/intZendeskField.attributes.js
index fa415c4..4ca4aa1 100644
--- a/server/api/intZendeskField/intZendeskField.attributes.js
+++ b/server/api/intZendeskField/intZendeskField.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intZendeskField/intZendeskField.controller.js b/server/api/intZendeskField/intZendeskField.controller.js
index f21a0f4..6878d56 100644
--- a/server/api/intZendeskField/intZendeskField.controller.js
+++ b/server/api/intZendeskField/intZendeskField.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intZendeskField/intZendeskField.model.js b/server/api/intZendeskField/intZendeskField.model.js
index 488ce0b..e59e851 100644
--- a/server/api/intZendeskField/intZendeskField.model.js
+++ b/server/api/intZendeskField/intZendeskField.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intZohoAccount/index.js b/server/api/intZohoAccount/index.js
index 6d87cbe..f4131c3 100644
--- a/server/api/intZohoAccount/index.js
+++ b/server/api/intZohoAccount/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intZohoAccount/intZohoAccount.attributes.js b/server/api/intZohoAccount/intZohoAccount.attributes.js
index 1d5456a..48b20e2 100644
--- a/server/api/intZohoAccount/intZohoAccount.attributes.js
+++ b/server/api/intZohoAccount/intZohoAccount.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intZohoAccount/intZohoAccount.controller.js b/server/api/intZohoAccount/intZohoAccount.controller.js
index b52f242..2b1adeb 100644
--- a/server/api/intZohoAccount/intZohoAccount.controller.js
+++ b/server/api/intZohoAccount/intZohoAccount.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intZohoAccount/intZohoAccount.model.js b/server/api/intZohoAccount/intZohoAccount.model.js
index 9993c9f..8d02554 100644
--- a/server/api/intZohoAccount/intZohoAccount.model.js
+++ b/server/api/intZohoAccount/intZohoAccount.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intZohoAccount/intZohoAccount.rpc.js b/server/api/intZohoAccount/intZohoAccount.rpc.js
index 75bd690..f28bbfd 100644
--- a/server/api/intZohoAccount/intZohoAccount.rpc.js
+++ b/server/api/intZohoAccount/intZohoAccount.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intZohoConfiguration/index.js b/server/api/intZohoConfiguration/index.js
index 7cf11e0..f2a004e 100644
--- a/server/api/intZohoConfiguration/index.js
+++ b/server/api/intZohoConfiguration/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intZohoConfiguration/intZohoConfiguration.attributes.js b/server/api/intZohoConfiguration/intZohoConfiguration.attributes.js
index 501f193..345c605 100644
--- a/server/api/intZohoConfiguration/intZohoConfiguration.attributes.js
+++ b/server/api/intZohoConfiguration/intZohoConfiguration.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intZohoConfiguration/intZohoConfiguration.controller.js b/server/api/intZohoConfiguration/intZohoConfiguration.controller.js
index 01560dc..cdd2545 100644
--- a/server/api/intZohoConfiguration/intZohoConfiguration.controller.js
+++ b/server/api/intZohoConfiguration/intZohoConfiguration.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intZohoConfiguration/intZohoConfiguration.model.js b/server/api/intZohoConfiguration/intZohoConfiguration.model.js
index af3a71c..f562f93 100644
--- a/server/api/intZohoConfiguration/intZohoConfiguration.model.js
+++ b/server/api/intZohoConfiguration/intZohoConfiguration.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intZohoField/index.js b/server/api/intZohoField/index.js
index d8b6af1..705fd06 100644
--- a/server/api/intZohoField/index.js
+++ b/server/api/intZohoField/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intZohoField/intZohoField.attributes.js b/server/api/intZohoField/intZohoField.attributes.js
index cdd9370..ef59b44 100644
--- a/server/api/intZohoField/intZohoField.attributes.js
+++ b/server/api/intZohoField/intZohoField.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intZohoField/intZohoField.controller.js b/server/api/intZohoField/intZohoField.controller.js
index e1424b1..885da58 100644
--- a/server/api/intZohoField/intZohoField.controller.js
+++ b/server/api/intZohoField/intZohoField.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/intZohoField/intZohoField.model.js b/server/api/intZohoField/intZohoField.model.js
index aa15f4f..0476487 100644
--- a/server/api/intZohoField/intZohoField.model.js
+++ b/server/api/intZohoField/intZohoField.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/integration/index.js b/server/api/integration/index.js
index 43c3c9f..f8cecf9 100644
--- a/server/api/integration/index.js
+++ b/server/api/integration/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/integration/integration.attributes.js b/server/api/integration/integration.attributes.js
index 99e8bff..c8581d5 100644
--- a/server/api/integration/integration.attributes.js
+++ b/server/api/integration/integration.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/integration/integration.controller.js b/server/api/integration/integration.controller.js
index b3bbde4..3f6a4f5 100644
--- a/server/api/integration/integration.controller.js
+++ b/server/api/integration/integration.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/integration/integration.model.js b/server/api/integration/integration.model.js
index 381362b..cabdfa9 100644
--- a/server/api/integration/integration.model.js
+++ b/server/api/integration/integration.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/integrationReport/index.js b/server/api/integrationReport/index.js
index 9efa5bd..dfc5b4d 100644
--- a/server/api/integrationReport/index.js
+++ b/server/api/integrationReport/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/integrationReport/integrationReport.attributes.js b/server/api/integrationReport/integrationReport.attributes.js
index f17d033..09babb8 100644
--- a/server/api/integrationReport/integrationReport.attributes.js
+++ b/server/api/integrationReport/integrationReport.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/integrationReport/integrationReport.controller.js b/server/api/integrationReport/integrationReport.controller.js
index 560f270..0e16f30 100644
--- a/server/api/integrationReport/integrationReport.controller.js
+++ b/server/api/integrationReport/integrationReport.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/integrationReport/integrationReport.model.js b/server/api/integrationReport/integrationReport.model.js
index d6f0cf6..9d88267 100644
--- a/server/api/integrationReport/integrationReport.model.js
+++ b/server/api/integrationReport/integrationReport.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/interval/index.js b/server/api/interval/index.js
index 3f3d013..0a30aad 100644
--- a/server/api/interval/index.js
+++ b/server/api/interval/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/interval/interval.attributes.js b/server/api/interval/interval.attributes.js
index db9fad7..1b383a7 100644
--- a/server/api/interval/interval.attributes.js
+++ b/server/api/interval/interval.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/interval/interval.controller.js b/server/api/interval/interval.controller.js
index 992ecff..e3a394e 100644
--- a/server/api/interval/interval.controller.js
+++ b/server/api/interval/interval.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/interval/interval.model.js b/server/api/interval/interval.model.js
index d7bdf25..700b85c 100644
--- a/server/api/interval/interval.model.js
+++ b/server/api/interval/interval.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/interval/interval.rpc.js b/server/api/interval/interval.rpc.js
index 73ee8da..72ccf18 100644
--- a/server/api/interval/interval.rpc.js
+++ b/server/api/interval/interval.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/jira/index.js b/server/api/jira/index.js
index dd211df..8dbf179 100644
--- a/server/api/jira/index.js
+++ b/server/api/jira/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/jira/jira.controller.js b/server/api/jira/jira.controller.js
index 4b017f5..7a65cb9 100644
--- a/server/api/jira/jira.controller.js
+++ b/server/api/jira/jira.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/jscriptyAnswerReport/index.js b/server/api/jscriptyAnswerReport/index.js
index 434ab11..13b25c6 100644
--- a/server/api/jscriptyAnswerReport/index.js
+++ b/server/api/jscriptyAnswerReport/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/jscriptyAnswerReport/jscriptyAnswerReport.attributes.js b/server/api/jscriptyAnswerReport/jscriptyAnswerReport.attributes.js
index 4f8579e..4f624e9 100644
--- a/server/api/jscriptyAnswerReport/jscriptyAnswerReport.attributes.js
+++ b/server/api/jscriptyAnswerReport/jscriptyAnswerReport.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/jscriptyAnswerReport/jscriptyAnswerReport.controller.js b/server/api/jscriptyAnswerReport/jscriptyAnswerReport.controller.js
index 9b4018a..0aa8db1 100644
--- a/server/api/jscriptyAnswerReport/jscriptyAnswerReport.controller.js
+++ b/server/api/jscriptyAnswerReport/jscriptyAnswerReport.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/jscriptyAnswerReport/jscriptyAnswerReport.model.js b/server/api/jscriptyAnswerReport/jscriptyAnswerReport.model.js
index 066d225..269aa0b 100644
--- a/server/api/jscriptyAnswerReport/jscriptyAnswerReport.model.js
+++ b/server/api/jscriptyAnswerReport/jscriptyAnswerReport.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/jscriptyProject/index.js b/server/api/jscriptyProject/index.js
index 2b126c9..dd2003f 100644
--- a/server/api/jscriptyProject/index.js
+++ b/server/api/jscriptyProject/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/jscriptyProject/jscriptyProject.attributes.js b/server/api/jscriptyProject/jscriptyProject.attributes.js
index 4b81cfc..c0b5e30 100644
--- a/server/api/jscriptyProject/jscriptyProject.attributes.js
+++ b/server/api/jscriptyProject/jscriptyProject.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/jscriptyProject/jscriptyProject.controller.js b/server/api/jscriptyProject/jscriptyProject.controller.js
index 93387e5..f9ff80c 100644
--- a/server/api/jscriptyProject/jscriptyProject.controller.js
+++ b/server/api/jscriptyProject/jscriptyProject.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/jscriptyProject/jscriptyProject.model.js b/server/api/jscriptyProject/jscriptyProject.model.js
index 7ce4845..a6774bd 100644
--- a/server/api/jscriptyProject/jscriptyProject.model.js
+++ b/server/api/jscriptyProject/jscriptyProject.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/jscriptyQuestionReport/index.js b/server/api/jscriptyQuestionReport/index.js
index 1a8fb65..d0cda31 100644
--- a/server/api/jscriptyQuestionReport/index.js
+++ b/server/api/jscriptyQuestionReport/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/jscriptyQuestionReport/jscriptyQuestionReport.attributes.js b/server/api/jscriptyQuestionReport/jscriptyQuestionReport.attributes.js
index 214fb25..03eb2a0 100644
--- a/server/api/jscriptyQuestionReport/jscriptyQuestionReport.attributes.js
+++ b/server/api/jscriptyQuestionReport/jscriptyQuestionReport.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/jscriptyQuestionReport/jscriptyQuestionReport.controller.js b/server/api/jscriptyQuestionReport/jscriptyQuestionReport.controller.js
index 587374d..6c58a21 100644
--- a/server/api/jscriptyQuestionReport/jscriptyQuestionReport.controller.js
+++ b/server/api/jscriptyQuestionReport/jscriptyQuestionReport.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/jscriptyQuestionReport/jscriptyQuestionReport.model.js b/server/api/jscriptyQuestionReport/jscriptyQuestionReport.model.js
index 2ce1f96..cf5ce2a 100644
--- a/server/api/jscriptyQuestionReport/jscriptyQuestionReport.model.js
+++ b/server/api/jscriptyQuestionReport/jscriptyQuestionReport.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/jscriptySessionReport/index.js b/server/api/jscriptySessionReport/index.js
index 4bd9f29..cafd72e 100644
--- a/server/api/jscriptySessionReport/index.js
+++ b/server/api/jscriptySessionReport/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/jscriptySessionReport/jscriptySessionReport.attributes.js b/server/api/jscriptySessionReport/jscriptySessionReport.attributes.js
index 115850f..0ab7b74 100644
--- a/server/api/jscriptySessionReport/jscriptySessionReport.attributes.js
+++ b/server/api/jscriptySessionReport/jscriptySessionReport.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/jscriptySessionReport/jscriptySessionReport.controller.js b/server/api/jscriptySessionReport/jscriptySessionReport.controller.js
index 5be950b..98c9152 100644
--- a/server/api/jscriptySessionReport/jscriptySessionReport.controller.js
+++ b/server/api/jscriptySessionReport/jscriptySessionReport.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/jscriptySessionReport/jscriptySessionReport.model.js b/server/api/jscriptySessionReport/jscriptySessionReport.model.js
index 5881ea9..437a8a9 100644
--- a/server/api/jscriptySessionReport/jscriptySessionReport.model.js
+++ b/server/api/jscriptySessionReport/jscriptySessionReport.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/license/index.js b/server/api/license/index.js
index 9464c08..c011045 100644
--- a/server/api/license/index.js
+++ b/server/api/license/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/license/license.attributes.js b/server/api/license/license.attributes.js
index 7084222..62b15ae 100644
--- a/server/api/license/license.attributes.js
+++ b/server/api/license/license.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/license/license.controller.js b/server/api/license/license.controller.js
index 3818ad0..bd36389 100644
--- a/server/api/license/license.controller.js
+++ b/server/api/license/license.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/license/license.model.js b/server/api/license/license.model.js
index 6c60052..9be7745 100644
--- a/server/api/license/license.model.js
+++ b/server/api/license/license.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailAccount/index.js b/server/api/mailAccount/index.js
index 8094569..a0f4a87 100644
--- a/server/api/mailAccount/index.js
+++ b/server/api/mailAccount/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailAccount/mailAccount.attributes.js b/server/api/mailAccount/mailAccount.attributes.js
index 2ebeecf..933b553 100644
--- a/server/api/mailAccount/mailAccount.attributes.js
+++ b/server/api/mailAccount/mailAccount.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailAccount/mailAccount.controller.js b/server/api/mailAccount/mailAccount.controller.js
index 3bf56bc..674e94d 100644
--- a/server/api/mailAccount/mailAccount.controller.js
+++ b/server/api/mailAccount/mailAccount.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailAccount/mailAccount.events.js b/server/api/mailAccount/mailAccount.events.js
index 249f2b5..b4eb16c 100644
--- a/server/api/mailAccount/mailAccount.events.js
+++ b/server/api/mailAccount/mailAccount.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailAccount/mailAccount.model.js b/server/api/mailAccount/mailAccount.model.js
index 75d1aed..1859881 100644
--- a/server/api/mailAccount/mailAccount.model.js
+++ b/server/api/mailAccount/mailAccount.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailAccount/mailAccount.rpc.js b/server/api/mailAccount/mailAccount.rpc.js
index 65382d3..0cea148 100644
--- a/server/api/mailAccount/mailAccount.rpc.js
+++ b/server/api/mailAccount/mailAccount.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailAccount/mailAccount.socket.js b/server/api/mailAccount/mailAccount.socket.js
index 91c6c64..836119f 100644
--- a/server/api/mailAccount/mailAccount.socket.js
+++ b/server/api/mailAccount/mailAccount.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailApplication/index.js b/server/api/mailApplication/index.js
index fb616ea..fe08063 100644
--- a/server/api/mailApplication/index.js
+++ b/server/api/mailApplication/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailApplication/mailApplication.attributes.js b/server/api/mailApplication/mailApplication.attributes.js
index 3fce263..e8b2fc0 100644
--- a/server/api/mailApplication/mailApplication.attributes.js
+++ b/server/api/mailApplication/mailApplication.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailApplication/mailApplication.controller.js b/server/api/mailApplication/mailApplication.controller.js
index e359a8a..3de608e 100644
--- a/server/api/mailApplication/mailApplication.controller.js
+++ b/server/api/mailApplication/mailApplication.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailApplication/mailApplication.model.js b/server/api/mailApplication/mailApplication.model.js
index 5f2f44a..0899501 100644
--- a/server/api/mailApplication/mailApplication.model.js
+++ b/server/api/mailApplication/mailApplication.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailApplication/mailApplication.rpc.js b/server/api/mailApplication/mailApplication.rpc.js
index 26a4a0d..e29ed08 100644
--- a/server/api/mailApplication/mailApplication.rpc.js
+++ b/server/api/mailApplication/mailApplication.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailInteraction/index.js b/server/api/mailInteraction/index.js
index 60bd1f5..92dfed0 100644
--- a/server/api/mailInteraction/index.js
+++ b/server/api/mailInteraction/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailInteraction/mailInteraction.attributes.js b/server/api/mailInteraction/mailInteraction.attributes.js
index 3675578..17d95bc 100644
--- a/server/api/mailInteraction/mailInteraction.attributes.js
+++ b/server/api/mailInteraction/mailInteraction.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailInteraction/mailInteraction.controller.js b/server/api/mailInteraction/mailInteraction.controller.js
index d5c3851..5956fa6 100644
--- a/server/api/mailInteraction/mailInteraction.controller.js
+++ b/server/api/mailInteraction/mailInteraction.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailInteraction/mailInteraction.events.js b/server/api/mailInteraction/mailInteraction.events.js
index e069303..4a9d7f3 100644
--- a/server/api/mailInteraction/mailInteraction.events.js
+++ b/server/api/mailInteraction/mailInteraction.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailInteraction/mailInteraction.model.js b/server/api/mailInteraction/mailInteraction.model.js
index 1e8fb6d..582f397 100644
--- a/server/api/mailInteraction/mailInteraction.model.js
+++ b/server/api/mailInteraction/mailInteraction.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailInteraction/mailInteraction.rpc.js b/server/api/mailInteraction/mailInteraction.rpc.js
index abca5c2..2a4d1ca 100644
--- a/server/api/mailInteraction/mailInteraction.rpc.js
+++ b/server/api/mailInteraction/mailInteraction.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailInteraction/mailInteraction.socket.js b/server/api/mailInteraction/mailInteraction.socket.js
index 72cafbe..0ca65ca 100644
--- a/server/api/mailInteraction/mailInteraction.socket.js
+++ b/server/api/mailInteraction/mailInteraction.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailMessage/index.js b/server/api/mailMessage/index.js
index bfebe76..6ae856f 100644
--- a/server/api/mailMessage/index.js
+++ b/server/api/mailMessage/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailMessage/mailMessage.attributes.js b/server/api/mailMessage/mailMessage.attributes.js
index 6dbc4d6..a857acb 100644
--- a/server/api/mailMessage/mailMessage.attributes.js
+++ b/server/api/mailMessage/mailMessage.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailMessage/mailMessage.controller.js b/server/api/mailMessage/mailMessage.controller.js
index 18856e0..a75ef98 100644
--- a/server/api/mailMessage/mailMessage.controller.js
+++ b/server/api/mailMessage/mailMessage.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailMessage/mailMessage.events.js b/server/api/mailMessage/mailMessage.events.js
index c03cecd..362253c 100644
--- a/server/api/mailMessage/mailMessage.events.js
+++ b/server/api/mailMessage/mailMessage.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailMessage/mailMessage.model.js b/server/api/mailMessage/mailMessage.model.js
index b79209c..c1055e2 100644
--- a/server/api/mailMessage/mailMessage.model.js
+++ b/server/api/mailMessage/mailMessage.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailMessage/mailMessage.rpc.js b/server/api/mailMessage/mailMessage.rpc.js
index 2a66fb3..494da73 100644
--- a/server/api/mailMessage/mailMessage.rpc.js
+++ b/server/api/mailMessage/mailMessage.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailMessage/mailMessage.socket.js b/server/api/mailMessage/mailMessage.socket.js
index 7c8aa30..5dc0dfe 100644
--- a/server/api/mailMessage/mailMessage.socket.js
+++ b/server/api/mailMessage/mailMessage.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailQueue/index.js b/server/api/mailQueue/index.js
index 9d4a168..beaa6ba 100644
--- a/server/api/mailQueue/index.js
+++ b/server/api/mailQueue/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailQueue/mailQueue.attributes.js b/server/api/mailQueue/mailQueue.attributes.js
index fbfc364..1810aff 100644
--- a/server/api/mailQueue/mailQueue.attributes.js
+++ b/server/api/mailQueue/mailQueue.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailQueue/mailQueue.controller.js b/server/api/mailQueue/mailQueue.controller.js
index fadd2f1..369d8fb 100644
--- a/server/api/mailQueue/mailQueue.controller.js
+++ b/server/api/mailQueue/mailQueue.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailQueue/mailQueue.events.js b/server/api/mailQueue/mailQueue.events.js
index d8650b4..7e5f662 100644
--- a/server/api/mailQueue/mailQueue.events.js
+++ b/server/api/mailQueue/mailQueue.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailQueue/mailQueue.model.js b/server/api/mailQueue/mailQueue.model.js
index 0c249ee..0efdd26 100644
--- a/server/api/mailQueue/mailQueue.model.js
+++ b/server/api/mailQueue/mailQueue.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailQueue/mailQueue.rpc.js b/server/api/mailQueue/mailQueue.rpc.js
index 6da2346..b41d72f 100644
--- a/server/api/mailQueue/mailQueue.rpc.js
+++ b/server/api/mailQueue/mailQueue.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailQueue/mailQueue.socket.js b/server/api/mailQueue/mailQueue.socket.js
index 4dfedcf..f129c47 100644
--- a/server/api/mailQueue/mailQueue.socket.js
+++ b/server/api/mailQueue/mailQueue.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailQueueReport/index.js b/server/api/mailQueueReport/index.js
index 17b911e..c377aa0 100644
--- a/server/api/mailQueueReport/index.js
+++ b/server/api/mailQueueReport/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailQueueReport/mailQueueReport.attributes.js b/server/api/mailQueueReport/mailQueueReport.attributes.js
index a01f55f..18556f4 100644
--- a/server/api/mailQueueReport/mailQueueReport.attributes.js
+++ b/server/api/mailQueueReport/mailQueueReport.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailQueueReport/mailQueueReport.controller.js b/server/api/mailQueueReport/mailQueueReport.controller.js
index 98ceb76..e6e13e5 100644
--- a/server/api/mailQueueReport/mailQueueReport.controller.js
+++ b/server/api/mailQueueReport/mailQueueReport.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailQueueReport/mailQueueReport.model.js b/server/api/mailQueueReport/mailQueueReport.model.js
index 870ed93..67a7b90 100644
--- a/server/api/mailQueueReport/mailQueueReport.model.js
+++ b/server/api/mailQueueReport/mailQueueReport.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailQueueReport/mailQueueReport.rpc.js b/server/api/mailQueueReport/mailQueueReport.rpc.js
index 3480f6a..5a43123 100644
--- a/server/api/mailQueueReport/mailQueueReport.rpc.js
+++ b/server/api/mailQueueReport/mailQueueReport.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailServerIn/index.js b/server/api/mailServerIn/index.js
index ff84379..c2967c8 100644
--- a/server/api/mailServerIn/index.js
+++ b/server/api/mailServerIn/index.js
@@ -1 +1 @@
-const a430_0x1165=['express','exports'];(function(_0x361881,_0x11657d){const _0x1b12be=function(_0x29add2){while(--_0x29add2){_0x361881['push'](_0x361881['shift']());}};_0x1b12be(++_0x11657d);}(a430_0x1165,0x19a));const a430_0x1b12=function(_0x361881,_0x11657d){_0x361881=_0x361881-0x0;let _0x1b12be=a430_0x1165[_0x361881];return _0x1b12be;};const _0x3e4391=a430_0x1b12;'use strict';const express=require(_0x3e4391('0x0')),router=express['Router']();module[_0x3e4391('0x1')]=router;
\ No newline at end of file
+const a430_0x1685=['express','Router'];(function(_0x3edff1,_0x1685f7){const _0x42b422=function(_0x468679){while(--_0x468679){_0x3edff1['push'](_0x3edff1['shift']());}};_0x42b422(++_0x1685f7);}(a430_0x1685,0x12e));const a430_0x42b4=function(_0x3edff1,_0x1685f7){_0x3edff1=_0x3edff1-0x0;let _0x42b422=a430_0x1685[_0x3edff1];return _0x42b422;};const _0x805842=a430_0x42b4;'use strict';const express=require(_0x805842('0x0')),router=express[_0x805842('0x1')]();module['exports']=router;
\ No newline at end of file
diff --git a/server/api/mailServerIn/mailServerIn.attributes.js b/server/api/mailServerIn/mailServerIn.attributes.js
index e8f30ab..20e3df9 100644
--- a/server/api/mailServerIn/mailServerIn.attributes.js
+++ b/server/api/mailServerIn/mailServerIn.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailServerIn/mailServerIn.model.js b/server/api/mailServerIn/mailServerIn.model.js
index b9c6e5e..955a224 100644
--- a/server/api/mailServerIn/mailServerIn.model.js
+++ b/server/api/mailServerIn/mailServerIn.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailServerIn/mailServerIn.rpc.js b/server/api/mailServerIn/mailServerIn.rpc.js
index b2aeeed..d07ebcc 100644
--- a/server/api/mailServerIn/mailServerIn.rpc.js
+++ b/server/api/mailServerIn/mailServerIn.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailServerOut/index.js b/server/api/mailServerOut/index.js
index 5304c00..48215f8 100644
--- a/server/api/mailServerOut/index.js
+++ b/server/api/mailServerOut/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailServerOut/mailServerOut.attributes.js b/server/api/mailServerOut/mailServerOut.attributes.js
index 262bd2e..03354e6 100644
--- a/server/api/mailServerOut/mailServerOut.attributes.js
+++ b/server/api/mailServerOut/mailServerOut.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailServerOut/mailServerOut.controller.js b/server/api/mailServerOut/mailServerOut.controller.js
index 4d99044..1089645 100644
--- a/server/api/mailServerOut/mailServerOut.controller.js
+++ b/server/api/mailServerOut/mailServerOut.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailServerOut/mailServerOut.model.js b/server/api/mailServerOut/mailServerOut.model.js
index 0f702e3..414632a 100644
--- a/server/api/mailServerOut/mailServerOut.model.js
+++ b/server/api/mailServerOut/mailServerOut.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailSubstatus/index.js b/server/api/mailSubstatus/index.js
index a20c360..3a9ce61 100644
--- a/server/api/mailSubstatus/index.js
+++ b/server/api/mailSubstatus/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailSubstatus/mailSubstatus.attributes.js b/server/api/mailSubstatus/mailSubstatus.attributes.js
index 25a011e..4778d46 100644
--- a/server/api/mailSubstatus/mailSubstatus.attributes.js
+++ b/server/api/mailSubstatus/mailSubstatus.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailSubstatus/mailSubstatus.controller.js b/server/api/mailSubstatus/mailSubstatus.controller.js
index be21f50..1dc2eb9 100644
--- a/server/api/mailSubstatus/mailSubstatus.controller.js
+++ b/server/api/mailSubstatus/mailSubstatus.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailSubstatus/mailSubstatus.model.js b/server/api/mailSubstatus/mailSubstatus.model.js
index 1633448..10a1a59 100644
--- a/server/api/mailSubstatus/mailSubstatus.model.js
+++ b/server/api/mailSubstatus/mailSubstatus.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailTransferReport/index.js b/server/api/mailTransferReport/index.js
index 9ebde6f..86215ef 100644
--- a/server/api/mailTransferReport/index.js
+++ b/server/api/mailTransferReport/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailTransferReport/mailTransferReport.attributes.js b/server/api/mailTransferReport/mailTransferReport.attributes.js
index 2e777c2..91ebc40 100644
--- a/server/api/mailTransferReport/mailTransferReport.attributes.js
+++ b/server/api/mailTransferReport/mailTransferReport.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailTransferReport/mailTransferReport.controller.js b/server/api/mailTransferReport/mailTransferReport.controller.js
index 31cbe14..c0cfe02 100644
--- a/server/api/mailTransferReport/mailTransferReport.controller.js
+++ b/server/api/mailTransferReport/mailTransferReport.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/mailTransferReport/mailTransferReport.model.js b/server/api/mailTransferReport/mailTransferReport.model.js
index 2a24c9b..41d64f0 100644
--- a/server/api/mailTransferReport/mailTransferReport.model.js
+++ b/server/api/mailTransferReport/mailTransferReport.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/memberReport/index.js b/server/api/memberReport/index.js
index fea5a99..ca3ebc1 100644
--- a/server/api/memberReport/index.js
+++ b/server/api/memberReport/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/memberReport/memberReport.attributes.js b/server/api/memberReport/memberReport.attributes.js
index 0637588..f56f1d9 100644
--- a/server/api/memberReport/memberReport.attributes.js
+++ b/server/api/memberReport/memberReport.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/memberReport/memberReport.controller.js b/server/api/memberReport/memberReport.controller.js
index 5462cf0..e1303f4 100644
--- a/server/api/memberReport/memberReport.controller.js
+++ b/server/api/memberReport/memberReport.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/memberReport/memberReport.model.js b/server/api/memberReport/memberReport.model.js
index e9b57bb..3203cb7 100644
--- a/server/api/memberReport/memberReport.model.js
+++ b/server/api/memberReport/memberReport.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/memberReport/memberReport.rpc.js b/server/api/memberReport/memberReport.rpc.js
index 77616af..71ad799 100644
--- a/server/api/memberReport/memberReport.rpc.js
+++ b/server/api/memberReport/memberReport.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/migration/index.js b/server/api/migration/index.js
index 7eb63ac..82b907f 100644
--- a/server/api/migration/index.js
+++ b/server/api/migration/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/migration/migration.attributes.js b/server/api/migration/migration.attributes.js
index 663b321..a8f38b4 100644
--- a/server/api/migration/migration.attributes.js
+++ b/server/api/migration/migration.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/migration/migration.controller.js b/server/api/migration/migration.controller.js
index 5a8e346..2a5ab60 100644
--- a/server/api/migration/migration.controller.js
+++ b/server/api/migration/migration.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/migration/migration.model.js b/server/api/migration/migration.model.js
index fe5e407..3bf7185 100644
--- a/server/api/migration/migration.model.js
+++ b/server/api/migration/migration.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/network/index.js b/server/api/network/index.js
index e2ecdb9..c3a0319 100644
--- a/server/api/network/index.js
+++ b/server/api/network/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/network/network.attributes.js b/server/api/network/network.attributes.js
index f9002d1..7a319df 100644
--- a/server/api/network/network.attributes.js
+++ b/server/api/network/network.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/network/network.controller.js b/server/api/network/network.controller.js
index 1bc2ce9..a36a747 100644
--- a/server/api/network/network.controller.js
+++ b/server/api/network/network.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/network/network.model.js b/server/api/network/network.model.js
index 0cb35cf..ab8960a 100644
--- a/server/api/network/network.model.js
+++ b/server/api/network/network.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/notification/index.js b/server/api/notification/index.js
index bbcbf90..38a05d7 100644
--- a/server/api/notification/index.js
+++ b/server/api/notification/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/notification/notification.attributes.js b/server/api/notification/notification.attributes.js
index 5b2f30f..dec9717 100644
--- a/server/api/notification/notification.attributes.js
+++ b/server/api/notification/notification.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/notification/notification.controller.js b/server/api/notification/notification.controller.js
index 5f25b6b..f64978b 100644
--- a/server/api/notification/notification.controller.js
+++ b/server/api/notification/notification.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/notification/notification.events.js b/server/api/notification/notification.events.js
index 8611228..4f0220a 100644
--- a/server/api/notification/notification.events.js
+++ b/server/api/notification/notification.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/notification/notification.model.js b/server/api/notification/notification.model.js
index a8ca068..5d9c0bc 100644
--- a/server/api/notification/notification.model.js
+++ b/server/api/notification/notification.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/notification/notification.rpc.js b/server/api/notification/notification.rpc.js
index 57f07c4..22faf4f 100644
--- a/server/api/notification/notification.rpc.js
+++ b/server/api/notification/notification.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/notification/notification.socket.js b/server/api/notification/notification.socket.js
index 49e78a7..c064aac 100644
--- a/server/api/notification/notification.socket.js
+++ b/server/api/notification/notification.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelAccount/index.js b/server/api/openchannelAccount/index.js
index 4c994e8..9abe6c1 100644
--- a/server/api/openchannelAccount/index.js
+++ b/server/api/openchannelAccount/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelAccount/openchannelAccount.attributes.js b/server/api/openchannelAccount/openchannelAccount.attributes.js
index d1a48a7..3636124 100644
--- a/server/api/openchannelAccount/openchannelAccount.attributes.js
+++ b/server/api/openchannelAccount/openchannelAccount.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelAccount/openchannelAccount.controller.js b/server/api/openchannelAccount/openchannelAccount.controller.js
index 5c7003e..b4af2cc 100644
--- a/server/api/openchannelAccount/openchannelAccount.controller.js
+++ b/server/api/openchannelAccount/openchannelAccount.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelAccount/openchannelAccount.events.js b/server/api/openchannelAccount/openchannelAccount.events.js
index b05c30d..0e476a5 100644
--- a/server/api/openchannelAccount/openchannelAccount.events.js
+++ b/server/api/openchannelAccount/openchannelAccount.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelAccount/openchannelAccount.model.js b/server/api/openchannelAccount/openchannelAccount.model.js
index a87365e..c4e2351 100644
--- a/server/api/openchannelAccount/openchannelAccount.model.js
+++ b/server/api/openchannelAccount/openchannelAccount.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelAccount/openchannelAccount.rpc.js b/server/api/openchannelAccount/openchannelAccount.rpc.js
index a2c8c99..25e343b 100644
--- a/server/api/openchannelAccount/openchannelAccount.rpc.js
+++ b/server/api/openchannelAccount/openchannelAccount.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelAccount/openchannelAccount.socket.js b/server/api/openchannelAccount/openchannelAccount.socket.js
index c91945b..5333e51 100644
--- a/server/api/openchannelAccount/openchannelAccount.socket.js
+++ b/server/api/openchannelAccount/openchannelAccount.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelApplication/index.js b/server/api/openchannelApplication/index.js
index 01395e3..5d88628 100644
--- a/server/api/openchannelApplication/index.js
+++ b/server/api/openchannelApplication/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelApplication/openchannelApplication.attributes.js b/server/api/openchannelApplication/openchannelApplication.attributes.js
index f286587..ca0c963 100644
--- a/server/api/openchannelApplication/openchannelApplication.attributes.js
+++ b/server/api/openchannelApplication/openchannelApplication.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelApplication/openchannelApplication.controller.js b/server/api/openchannelApplication/openchannelApplication.controller.js
index 7e2c698..1df47de 100644
--- a/server/api/openchannelApplication/openchannelApplication.controller.js
+++ b/server/api/openchannelApplication/openchannelApplication.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelApplication/openchannelApplication.model.js b/server/api/openchannelApplication/openchannelApplication.model.js
index a360192..ed891d5 100644
--- a/server/api/openchannelApplication/openchannelApplication.model.js
+++ b/server/api/openchannelApplication/openchannelApplication.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelApplication/openchannelApplication.rpc.js b/server/api/openchannelApplication/openchannelApplication.rpc.js
index 646370b..267efad 100644
--- a/server/api/openchannelApplication/openchannelApplication.rpc.js
+++ b/server/api/openchannelApplication/openchannelApplication.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelInteraction/index.js b/server/api/openchannelInteraction/index.js
index 999310e..08e9670 100644
--- a/server/api/openchannelInteraction/index.js
+++ b/server/api/openchannelInteraction/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelInteraction/openchannelInteraction.attributes.js b/server/api/openchannelInteraction/openchannelInteraction.attributes.js
index 811613c..b712383 100644
--- a/server/api/openchannelInteraction/openchannelInteraction.attributes.js
+++ b/server/api/openchannelInteraction/openchannelInteraction.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelInteraction/openchannelInteraction.controller.js b/server/api/openchannelInteraction/openchannelInteraction.controller.js
index 8d57f10..b4c1c20 100644
--- a/server/api/openchannelInteraction/openchannelInteraction.controller.js
+++ b/server/api/openchannelInteraction/openchannelInteraction.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelInteraction/openchannelInteraction.events.js b/server/api/openchannelInteraction/openchannelInteraction.events.js
index ac91138..1c6a0bf 100644
--- a/server/api/openchannelInteraction/openchannelInteraction.events.js
+++ b/server/api/openchannelInteraction/openchannelInteraction.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelInteraction/openchannelInteraction.model.js b/server/api/openchannelInteraction/openchannelInteraction.model.js
index 2d93459..98f7bba 100644
--- a/server/api/openchannelInteraction/openchannelInteraction.model.js
+++ b/server/api/openchannelInteraction/openchannelInteraction.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelInteraction/openchannelInteraction.rpc.js b/server/api/openchannelInteraction/openchannelInteraction.rpc.js
index 4ceedcf..c65b85f 100644
--- a/server/api/openchannelInteraction/openchannelInteraction.rpc.js
+++ b/server/api/openchannelInteraction/openchannelInteraction.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelInteraction/openchannelInteraction.socket.js b/server/api/openchannelInteraction/openchannelInteraction.socket.js
index ae5a165..7dcb334 100644
--- a/server/api/openchannelInteraction/openchannelInteraction.socket.js
+++ b/server/api/openchannelInteraction/openchannelInteraction.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelMessage/index.js b/server/api/openchannelMessage/index.js
index 0f2839c..540bf28 100644
--- a/server/api/openchannelMessage/index.js
+++ b/server/api/openchannelMessage/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelMessage/openchannelMessage.attributes.js b/server/api/openchannelMessage/openchannelMessage.attributes.js
index 8dbbb83..bcca4b5 100644
--- a/server/api/openchannelMessage/openchannelMessage.attributes.js
+++ b/server/api/openchannelMessage/openchannelMessage.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelMessage/openchannelMessage.controller.js b/server/api/openchannelMessage/openchannelMessage.controller.js
index 98e3e2f..6a1d1bd 100644
--- a/server/api/openchannelMessage/openchannelMessage.controller.js
+++ b/server/api/openchannelMessage/openchannelMessage.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelMessage/openchannelMessage.events.js b/server/api/openchannelMessage/openchannelMessage.events.js
index 48cc29f..637e77b 100644
--- a/server/api/openchannelMessage/openchannelMessage.events.js
+++ b/server/api/openchannelMessage/openchannelMessage.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelMessage/openchannelMessage.model.js b/server/api/openchannelMessage/openchannelMessage.model.js
index 91cc413..de52f4b 100644
--- a/server/api/openchannelMessage/openchannelMessage.model.js
+++ b/server/api/openchannelMessage/openchannelMessage.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelMessage/openchannelMessage.rpc.js b/server/api/openchannelMessage/openchannelMessage.rpc.js
index ef82e4b..42352c5 100644
--- a/server/api/openchannelMessage/openchannelMessage.rpc.js
+++ b/server/api/openchannelMessage/openchannelMessage.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelMessage/openchannelMessage.socket.js b/server/api/openchannelMessage/openchannelMessage.socket.js
index 2d994bf..dbb6aba 100644
--- a/server/api/openchannelMessage/openchannelMessage.socket.js
+++ b/server/api/openchannelMessage/openchannelMessage.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelQueue/index.js b/server/api/openchannelQueue/index.js
index 6a9cdba..f1f3737 100644
--- a/server/api/openchannelQueue/index.js
+++ b/server/api/openchannelQueue/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelQueue/openchannelQueue.attributes.js b/server/api/openchannelQueue/openchannelQueue.attributes.js
index 9b3a299..de216d5 100644
--- a/server/api/openchannelQueue/openchannelQueue.attributes.js
+++ b/server/api/openchannelQueue/openchannelQueue.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelQueue/openchannelQueue.controller.js b/server/api/openchannelQueue/openchannelQueue.controller.js
index 46452d5..5455970 100644
--- a/server/api/openchannelQueue/openchannelQueue.controller.js
+++ b/server/api/openchannelQueue/openchannelQueue.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelQueue/openchannelQueue.events.js b/server/api/openchannelQueue/openchannelQueue.events.js
index 4e4bb7f..1795fef 100644
--- a/server/api/openchannelQueue/openchannelQueue.events.js
+++ b/server/api/openchannelQueue/openchannelQueue.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelQueue/openchannelQueue.model.js b/server/api/openchannelQueue/openchannelQueue.model.js
index 7bb94ac..9d09d53 100644
--- a/server/api/openchannelQueue/openchannelQueue.model.js
+++ b/server/api/openchannelQueue/openchannelQueue.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelQueue/openchannelQueue.rpc.js b/server/api/openchannelQueue/openchannelQueue.rpc.js
index 4e58cdd..9615c3f 100644
--- a/server/api/openchannelQueue/openchannelQueue.rpc.js
+++ b/server/api/openchannelQueue/openchannelQueue.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelQueue/openchannelQueue.socket.js b/server/api/openchannelQueue/openchannelQueue.socket.js
index afdb162..408a8b4 100644
--- a/server/api/openchannelQueue/openchannelQueue.socket.js
+++ b/server/api/openchannelQueue/openchannelQueue.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelQueueReport/index.js b/server/api/openchannelQueueReport/index.js
index a35af1e..ac1bbf1 100644
--- a/server/api/openchannelQueueReport/index.js
+++ b/server/api/openchannelQueueReport/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelQueueReport/openchannelQueueReport.attributes.js b/server/api/openchannelQueueReport/openchannelQueueReport.attributes.js
index 4ad77cb..b8b0c5b 100644
--- a/server/api/openchannelQueueReport/openchannelQueueReport.attributes.js
+++ b/server/api/openchannelQueueReport/openchannelQueueReport.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelQueueReport/openchannelQueueReport.controller.js b/server/api/openchannelQueueReport/openchannelQueueReport.controller.js
index 9fde14f..65ef5c6 100644
--- a/server/api/openchannelQueueReport/openchannelQueueReport.controller.js
+++ b/server/api/openchannelQueueReport/openchannelQueueReport.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelQueueReport/openchannelQueueReport.model.js b/server/api/openchannelQueueReport/openchannelQueueReport.model.js
index 03b0ef7..48ff4a3 100644
--- a/server/api/openchannelQueueReport/openchannelQueueReport.model.js
+++ b/server/api/openchannelQueueReport/openchannelQueueReport.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelQueueReport/openchannelQueueReport.rpc.js b/server/api/openchannelQueueReport/openchannelQueueReport.rpc.js
index 74c998a..a1b70af 100644
--- a/server/api/openchannelQueueReport/openchannelQueueReport.rpc.js
+++ b/server/api/openchannelQueueReport/openchannelQueueReport.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelTransferReport/index.js b/server/api/openchannelTransferReport/index.js
index 3c85c74..00b2aa2 100644
--- a/server/api/openchannelTransferReport/index.js
+++ b/server/api/openchannelTransferReport/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelTransferReport/openchannelTransferReport.attributes.js b/server/api/openchannelTransferReport/openchannelTransferReport.attributes.js
index cf39897..652eeff 100644
--- a/server/api/openchannelTransferReport/openchannelTransferReport.attributes.js
+++ b/server/api/openchannelTransferReport/openchannelTransferReport.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelTransferReport/openchannelTransferReport.controller.js b/server/api/openchannelTransferReport/openchannelTransferReport.controller.js
index 33f2f72..e652b09 100644
--- a/server/api/openchannelTransferReport/openchannelTransferReport.controller.js
+++ b/server/api/openchannelTransferReport/openchannelTransferReport.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/openchannelTransferReport/openchannelTransferReport.model.js b/server/api/openchannelTransferReport/openchannelTransferReport.model.js
index 0eb98e4..f207299 100644
--- a/server/api/openchannelTransferReport/openchannelTransferReport.model.js
+++ b/server/api/openchannelTransferReport/openchannelTransferReport.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/pause/index.js b/server/api/pause/index.js
index 3c86c57..c5854b3 100644
--- a/server/api/pause/index.js
+++ b/server/api/pause/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/pause/pause.attributes.js b/server/api/pause/pause.attributes.js
index 8d04e10..4ee870a 100644
--- a/server/api/pause/pause.attributes.js
+++ b/server/api/pause/pause.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/pause/pause.controller.js b/server/api/pause/pause.controller.js
index f8f2158..ba2d1f0 100644
--- a/server/api/pause/pause.controller.js
+++ b/server/api/pause/pause.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/pause/pause.model.js b/server/api/pause/pause.model.js
index 429cb60..719a8bd 100644
--- a/server/api/pause/pause.model.js
+++ b/server/api/pause/pause.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/pause/pause.rpc.js b/server/api/pause/pause.rpc.js
index f93530f..b10b7b0 100644
--- a/server/api/pause/pause.rpc.js
+++ b/server/api/pause/pause.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/plugin/index.js b/server/api/plugin/index.js
index 36048f7..840a202 100644
--- a/server/api/plugin/index.js
+++ b/server/api/plugin/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/plugin/plugin.attributes.js b/server/api/plugin/plugin.attributes.js
index 5580987..bad5939 100644
--- a/server/api/plugin/plugin.attributes.js
+++ b/server/api/plugin/plugin.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/plugin/plugin.controller.js b/server/api/plugin/plugin.controller.js
index a4527f8..bf4d894 100644
--- a/server/api/plugin/plugin.controller.js
+++ b/server/api/plugin/plugin.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/plugin/plugin.events.js b/server/api/plugin/plugin.events.js
index aff2abe..81e4806 100644
--- a/server/api/plugin/plugin.events.js
+++ b/server/api/plugin/plugin.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/plugin/plugin.model.js b/server/api/plugin/plugin.model.js
index bfeb873..c259d82 100644
--- a/server/api/plugin/plugin.model.js
+++ b/server/api/plugin/plugin.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/plugin/plugin.rpc.js b/server/api/plugin/plugin.rpc.js
index f242a51..beacd5c 100644
--- a/server/api/plugin/plugin.rpc.js
+++ b/server/api/plugin/plugin.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/plugin/plugin.socket.js b/server/api/plugin/plugin.socket.js
index 3243c6f..1f61440 100644
--- a/server/api/plugin/plugin.socket.js
+++ b/server/api/plugin/plugin.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/pm2/index.js b/server/api/pm2/index.js
index d5cfadd..39a2f37 100644
--- a/server/api/pm2/index.js
+++ b/server/api/pm2/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/pm2/pm2.controller.js b/server/api/pm2/pm2.controller.js
index d470c91..e6b2602 100644
--- a/server/api/pm2/pm2.controller.js
+++ b/server/api/pm2/pm2.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/reportAgentPreview/index.js b/server/api/reportAgentPreview/index.js
index b875a0c..0d28503 100644
--- a/server/api/reportAgentPreview/index.js
+++ b/server/api/reportAgentPreview/index.js
@@ -1 +1 @@
-const a522_0x186c=['exports','express','Router'];(function(_0x551dbf,_0x186c6f){const _0x52fa58=function(_0x345c46){while(--_0x345c46){_0x551dbf['push'](_0x551dbf['shift']());}};_0x52fa58(++_0x186c6f);}(a522_0x186c,0xd7));const a522_0x52fa=function(_0x551dbf,_0x186c6f){_0x551dbf=_0x551dbf-0x0;let _0x52fa58=a522_0x186c[_0x551dbf];return _0x52fa58;};const _0x36cab9=a522_0x52fa;'use strict';const express=require(_0x36cab9('0x2')),router=express[_0x36cab9('0x0')]();module[_0x36cab9('0x1')]=router;
\ No newline at end of file
+const a522_0xa387=['express'];(function(_0x3a70c1,_0xa3872d){const _0x1db590=function(_0x57ad9c){while(--_0x57ad9c){_0x3a70c1['push'](_0x3a70c1['shift']());}};_0x1db590(++_0xa3872d);}(a522_0xa387,0x1c0));const a522_0x1db5=function(_0x3a70c1,_0xa3872d){_0x3a70c1=_0x3a70c1-0x0;let _0x1db590=a522_0xa387[_0x3a70c1];return _0x1db590;};const _0x2b518b=a522_0x1db5;'use strict';const express=require(_0x2b518b('0x0')),router=express['Router']();module['exports']=router;
\ No newline at end of file
diff --git a/server/api/reportAgentPreview/reportAgentPreview.attributes.js b/server/api/reportAgentPreview/reportAgentPreview.attributes.js
index 3d19dc2..8a8ce5f 100644
--- a/server/api/reportAgentPreview/reportAgentPreview.attributes.js
+++ b/server/api/reportAgentPreview/reportAgentPreview.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/reportAgentPreview/reportAgentPreview.model.js b/server/api/reportAgentPreview/reportAgentPreview.model.js
index 535f267..c7147bd 100644
--- a/server/api/reportAgentPreview/reportAgentPreview.model.js
+++ b/server/api/reportAgentPreview/reportAgentPreview.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/reportAgentPreview/reportAgentPreview.rpc.js b/server/api/reportAgentPreview/reportAgentPreview.rpc.js
index 698e0fe..6ae769f 100644
--- a/server/api/reportAgentPreview/reportAgentPreview.rpc.js
+++ b/server/api/reportAgentPreview/reportAgentPreview.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/rpc/index.js b/server/api/rpc/index.js
index 3b89a93..01dea1e 100644
--- a/server/api/rpc/index.js
+++ b/server/api/rpc/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/rpc/rpc.controller.js b/server/api/rpc/rpc.controller.js
index 2d22fce..19d9409 100644
--- a/server/api/rpc/rpc.controller.js
+++ b/server/api/rpc/rpc.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/schedule/index.js b/server/api/schedule/index.js
index 4c4e824..74286e9 100644
--- a/server/api/schedule/index.js
+++ b/server/api/schedule/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/schedule/schedule.attributes.js b/server/api/schedule/schedule.attributes.js
index 7059b93..e6b617b 100644
--- a/server/api/schedule/schedule.attributes.js
+++ b/server/api/schedule/schedule.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/schedule/schedule.controller.js b/server/api/schedule/schedule.controller.js
index c347122..84d07c8 100644
--- a/server/api/schedule/schedule.controller.js
+++ b/server/api/schedule/schedule.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/schedule/schedule.model.js b/server/api/schedule/schedule.model.js
index 4d8b95b..a79eab7 100644
--- a/server/api/schedule/schedule.model.js
+++ b/server/api/schedule/schedule.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/screenRecording/index.js b/server/api/screenRecording/index.js
index 1bba06c..68eeaa3 100644
--- a/server/api/screenRecording/index.js
+++ b/server/api/screenRecording/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/screenRecording/screenRecording.attributes.js b/server/api/screenRecording/screenRecording.attributes.js
index 0b6765c..1abd9b8 100644
--- a/server/api/screenRecording/screenRecording.attributes.js
+++ b/server/api/screenRecording/screenRecording.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/screenRecording/screenRecording.controller.js b/server/api/screenRecording/screenRecording.controller.js
index bd86174..0e3b319 100644
--- a/server/api/screenRecording/screenRecording.controller.js
+++ b/server/api/screenRecording/screenRecording.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/screenRecording/screenRecording.model.js b/server/api/screenRecording/screenRecording.model.js
index 3742045..60850b8 100644
--- a/server/api/screenRecording/screenRecording.model.js
+++ b/server/api/screenRecording/screenRecording.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/setting/index.js b/server/api/setting/index.js
index f84616b..28f080c 100644
--- a/server/api/setting/index.js
+++ b/server/api/setting/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/setting/setting.attributes.js b/server/api/setting/setting.attributes.js
index 142efbe..198f85a 100644
--- a/server/api/setting/setting.attributes.js
+++ b/server/api/setting/setting.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/setting/setting.controller.js b/server/api/setting/setting.controller.js
index 5cd4d8a..5fe1b37 100644
--- a/server/api/setting/setting.controller.js
+++ b/server/api/setting/setting.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/setting/setting.model.js b/server/api/setting/setting.model.js
index 9894e64..ef5096e 100644
--- a/server/api/setting/setting.model.js
+++ b/server/api/setting/setting.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsAccount/index.js b/server/api/smsAccount/index.js
index 10729e1..df8f3ca 100644
--- a/server/api/smsAccount/index.js
+++ b/server/api/smsAccount/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsAccount/smsAccount.attributes.js b/server/api/smsAccount/smsAccount.attributes.js
index f7ab414..8785ac7 100644
--- a/server/api/smsAccount/smsAccount.attributes.js
+++ b/server/api/smsAccount/smsAccount.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsAccount/smsAccount.controller.js b/server/api/smsAccount/smsAccount.controller.js
index 6fdc907..f9e2be8 100644
--- a/server/api/smsAccount/smsAccount.controller.js
+++ b/server/api/smsAccount/smsAccount.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsAccount/smsAccount.events.js b/server/api/smsAccount/smsAccount.events.js
index 2d05501..4781f9b 100644
--- a/server/api/smsAccount/smsAccount.events.js
+++ b/server/api/smsAccount/smsAccount.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsAccount/smsAccount.model.js b/server/api/smsAccount/smsAccount.model.js
index f5acd97..3a118b6 100644
--- a/server/api/smsAccount/smsAccount.model.js
+++ b/server/api/smsAccount/smsAccount.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsAccount/smsAccount.rpc.js b/server/api/smsAccount/smsAccount.rpc.js
index 57d564c..942dc70 100644
--- a/server/api/smsAccount/smsAccount.rpc.js
+++ b/server/api/smsAccount/smsAccount.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsAccount/smsAccount.socket.js b/server/api/smsAccount/smsAccount.socket.js
index 69d2183..a45ba66 100644
--- a/server/api/smsAccount/smsAccount.socket.js
+++ b/server/api/smsAccount/smsAccount.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsApplication/index.js b/server/api/smsApplication/index.js
index 109ca68..bd6078c 100644
--- a/server/api/smsApplication/index.js
+++ b/server/api/smsApplication/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsApplication/smsApplication.attributes.js b/server/api/smsApplication/smsApplication.attributes.js
index f8128ae..7214130 100644
--- a/server/api/smsApplication/smsApplication.attributes.js
+++ b/server/api/smsApplication/smsApplication.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsApplication/smsApplication.controller.js b/server/api/smsApplication/smsApplication.controller.js
index 5b17063..abcf60e 100644
--- a/server/api/smsApplication/smsApplication.controller.js
+++ b/server/api/smsApplication/smsApplication.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsApplication/smsApplication.model.js b/server/api/smsApplication/smsApplication.model.js
index e5c2422..8fb3836 100644
--- a/server/api/smsApplication/smsApplication.model.js
+++ b/server/api/smsApplication/smsApplication.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsInteraction/index.js b/server/api/smsInteraction/index.js
index 7f2ffce..794dd8b 100644
--- a/server/api/smsInteraction/index.js
+++ b/server/api/smsInteraction/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsInteraction/smsInteraction.attributes.js b/server/api/smsInteraction/smsInteraction.attributes.js
index bedbc37..7b84205 100644
--- a/server/api/smsInteraction/smsInteraction.attributes.js
+++ b/server/api/smsInteraction/smsInteraction.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsInteraction/smsInteraction.controller.js b/server/api/smsInteraction/smsInteraction.controller.js
index 8cfe59e..4271005 100644
--- a/server/api/smsInteraction/smsInteraction.controller.js
+++ b/server/api/smsInteraction/smsInteraction.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsInteraction/smsInteraction.events.js b/server/api/smsInteraction/smsInteraction.events.js
index fa70104..123b6e7 100644
--- a/server/api/smsInteraction/smsInteraction.events.js
+++ b/server/api/smsInteraction/smsInteraction.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsInteraction/smsInteraction.model.js b/server/api/smsInteraction/smsInteraction.model.js
index abf75ab..e29223c 100644
--- a/server/api/smsInteraction/smsInteraction.model.js
+++ b/server/api/smsInteraction/smsInteraction.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsInteraction/smsInteraction.rpc.js b/server/api/smsInteraction/smsInteraction.rpc.js
index f2bdfe2..39e0004 100644
--- a/server/api/smsInteraction/smsInteraction.rpc.js
+++ b/server/api/smsInteraction/smsInteraction.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsInteraction/smsInteraction.socket.js b/server/api/smsInteraction/smsInteraction.socket.js
index b8a0970..2b57e63 100644
--- a/server/api/smsInteraction/smsInteraction.socket.js
+++ b/server/api/smsInteraction/smsInteraction.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsMessage/index.js b/server/api/smsMessage/index.js
index 78c36d9..9d6fb7e 100644
--- a/server/api/smsMessage/index.js
+++ b/server/api/smsMessage/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsMessage/smsMessage.attributes.js b/server/api/smsMessage/smsMessage.attributes.js
index a1ffb33..b27f07f 100644
--- a/server/api/smsMessage/smsMessage.attributes.js
+++ b/server/api/smsMessage/smsMessage.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsMessage/smsMessage.controller.js b/server/api/smsMessage/smsMessage.controller.js
index 8066a37..371a86a 100644
--- a/server/api/smsMessage/smsMessage.controller.js
+++ b/server/api/smsMessage/smsMessage.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsMessage/smsMessage.events.js b/server/api/smsMessage/smsMessage.events.js
index 07ca208..3405498 100644
--- a/server/api/smsMessage/smsMessage.events.js
+++ b/server/api/smsMessage/smsMessage.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsMessage/smsMessage.model.js b/server/api/smsMessage/smsMessage.model.js
index f633e86..a5b09f3 100644
--- a/server/api/smsMessage/smsMessage.model.js
+++ b/server/api/smsMessage/smsMessage.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsMessage/smsMessage.rpc.js b/server/api/smsMessage/smsMessage.rpc.js
index cf4f539..3c98aff 100644
--- a/server/api/smsMessage/smsMessage.rpc.js
+++ b/server/api/smsMessage/smsMessage.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsMessage/smsMessage.socket.js b/server/api/smsMessage/smsMessage.socket.js
index b660d1d..2bb834b 100644
--- a/server/api/smsMessage/smsMessage.socket.js
+++ b/server/api/smsMessage/smsMessage.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsQueue/index.js b/server/api/smsQueue/index.js
index a736b8f..0654dcc 100644
--- a/server/api/smsQueue/index.js
+++ b/server/api/smsQueue/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsQueue/smsQueue.attributes.js b/server/api/smsQueue/smsQueue.attributes.js
index 3be3cd7..6998bb2 100644
--- a/server/api/smsQueue/smsQueue.attributes.js
+++ b/server/api/smsQueue/smsQueue.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsQueue/smsQueue.controller.js b/server/api/smsQueue/smsQueue.controller.js
index f2df689..db8427b 100644
--- a/server/api/smsQueue/smsQueue.controller.js
+++ b/server/api/smsQueue/smsQueue.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsQueue/smsQueue.events.js b/server/api/smsQueue/smsQueue.events.js
index 24b099e..3655b8c 100644
--- a/server/api/smsQueue/smsQueue.events.js
+++ b/server/api/smsQueue/smsQueue.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsQueue/smsQueue.model.js b/server/api/smsQueue/smsQueue.model.js
index e58bd1f..8cc2348 100644
--- a/server/api/smsQueue/smsQueue.model.js
+++ b/server/api/smsQueue/smsQueue.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsQueue/smsQueue.rpc.js b/server/api/smsQueue/smsQueue.rpc.js
index 9b8cf31..7afe52f 100644
--- a/server/api/smsQueue/smsQueue.rpc.js
+++ b/server/api/smsQueue/smsQueue.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsQueue/smsQueue.socket.js b/server/api/smsQueue/smsQueue.socket.js
index e9c9f61..eee4579 100644
--- a/server/api/smsQueue/smsQueue.socket.js
+++ b/server/api/smsQueue/smsQueue.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsQueueReport/index.js b/server/api/smsQueueReport/index.js
index 503c083..bf980cd 100644
--- a/server/api/smsQueueReport/index.js
+++ b/server/api/smsQueueReport/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsQueueReport/smsQueueReport.attributes.js b/server/api/smsQueueReport/smsQueueReport.attributes.js
index fc4c003..b05ef0a 100644
--- a/server/api/smsQueueReport/smsQueueReport.attributes.js
+++ b/server/api/smsQueueReport/smsQueueReport.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsQueueReport/smsQueueReport.controller.js b/server/api/smsQueueReport/smsQueueReport.controller.js
index 2d4b62a..82ccdec 100644
--- a/server/api/smsQueueReport/smsQueueReport.controller.js
+++ b/server/api/smsQueueReport/smsQueueReport.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsQueueReport/smsQueueReport.model.js b/server/api/smsQueueReport/smsQueueReport.model.js
index deb8606..ea0a0eb 100644
--- a/server/api/smsQueueReport/smsQueueReport.model.js
+++ b/server/api/smsQueueReport/smsQueueReport.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsQueueReport/smsQueueReport.rpc.js b/server/api/smsQueueReport/smsQueueReport.rpc.js
index 75de2b5..e6d1dca 100644
--- a/server/api/smsQueueReport/smsQueueReport.rpc.js
+++ b/server/api/smsQueueReport/smsQueueReport.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsTransferReport/index.js b/server/api/smsTransferReport/index.js
index 29802c4..1d32a43 100644
--- a/server/api/smsTransferReport/index.js
+++ b/server/api/smsTransferReport/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsTransferReport/smsTransferReport.attributes.js b/server/api/smsTransferReport/smsTransferReport.attributes.js
index b6f9683..e7c6331 100644
--- a/server/api/smsTransferReport/smsTransferReport.attributes.js
+++ b/server/api/smsTransferReport/smsTransferReport.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsTransferReport/smsTransferReport.controller.js b/server/api/smsTransferReport/smsTransferReport.controller.js
index 852d1c3..2d1cbee 100644
--- a/server/api/smsTransferReport/smsTransferReport.controller.js
+++ b/server/api/smsTransferReport/smsTransferReport.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/smsTransferReport/smsTransferReport.model.js b/server/api/smsTransferReport/smsTransferReport.model.js
index e29f804..52ec484 100644
--- a/server/api/smsTransferReport/smsTransferReport.model.js
+++ b/server/api/smsTransferReport/smsTransferReport.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/sound/index.js b/server/api/sound/index.js
index 42257bf..3e2e873 100644
--- a/server/api/sound/index.js
+++ b/server/api/sound/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/sound/sound.attributes.js b/server/api/sound/sound.attributes.js
index 0ae3424..50de760 100644
--- a/server/api/sound/sound.attributes.js
+++ b/server/api/sound/sound.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/sound/sound.controller.js b/server/api/sound/sound.controller.js
index bf19ae1..8fa5016 100644
--- a/server/api/sound/sound.controller.js
+++ b/server/api/sound/sound.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/sound/sound.model.js b/server/api/sound/sound.model.js
index ccb8653..ea403f5 100644
--- a/server/api/sound/sound.model.js
+++ b/server/api/sound/sound.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/sound/sound.rpc.js b/server/api/sound/sound.rpc.js
index f32f9d7..29ed7be 100644
--- a/server/api/sound/sound.rpc.js
+++ b/server/api/sound/sound.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareMessage/index.js b/server/api/squareMessage/index.js
index 8ab37c2..aff7f4a 100644
--- a/server/api/squareMessage/index.js
+++ b/server/api/squareMessage/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareMessage/squareMessage.attributes.js b/server/api/squareMessage/squareMessage.attributes.js
index 23c8384..338e042 100644
--- a/server/api/squareMessage/squareMessage.attributes.js
+++ b/server/api/squareMessage/squareMessage.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareMessage/squareMessage.controller.js b/server/api/squareMessage/squareMessage.controller.js
index 7f73708..1af18ac 100644
--- a/server/api/squareMessage/squareMessage.controller.js
+++ b/server/api/squareMessage/squareMessage.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareMessage/squareMessage.model.js b/server/api/squareMessage/squareMessage.model.js
index 2226bd8..241a908 100644
--- a/server/api/squareMessage/squareMessage.model.js
+++ b/server/api/squareMessage/squareMessage.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareMessage/squareMessage.rpc.js b/server/api/squareMessage/squareMessage.rpc.js
index 7f149bc..8afcab2 100644
--- a/server/api/squareMessage/squareMessage.rpc.js
+++ b/server/api/squareMessage/squareMessage.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareOdbc/index.js b/server/api/squareOdbc/index.js
index 944cde3..ac8955d 100644
--- a/server/api/squareOdbc/index.js
+++ b/server/api/squareOdbc/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareOdbc/squareOdbc.attributes.js b/server/api/squareOdbc/squareOdbc.attributes.js
index eea339b..be1da47 100644
--- a/server/api/squareOdbc/squareOdbc.attributes.js
+++ b/server/api/squareOdbc/squareOdbc.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareOdbc/squareOdbc.controller.js b/server/api/squareOdbc/squareOdbc.controller.js
index 43fcb47..0754e9c 100644
--- a/server/api/squareOdbc/squareOdbc.controller.js
+++ b/server/api/squareOdbc/squareOdbc.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareOdbc/squareOdbc.model.js b/server/api/squareOdbc/squareOdbc.model.js
index 3825f20..bf1b228 100644
--- a/server/api/squareOdbc/squareOdbc.model.js
+++ b/server/api/squareOdbc/squareOdbc.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareOdbc/squareOdbc.rpc.js b/server/api/squareOdbc/squareOdbc.rpc.js
index 7f1ac66..556d6e4 100644
--- a/server/api/squareOdbc/squareOdbc.rpc.js
+++ b/server/api/squareOdbc/squareOdbc.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareProject/index.js b/server/api/squareProject/index.js
index b8195ea..ee2e951 100644
--- a/server/api/squareProject/index.js
+++ b/server/api/squareProject/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareProject/squareProject.attributes.js b/server/api/squareProject/squareProject.attributes.js
index a7fadab..de937e9 100644
--- a/server/api/squareProject/squareProject.attributes.js
+++ b/server/api/squareProject/squareProject.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareProject/squareProject.controller.js b/server/api/squareProject/squareProject.controller.js
index c84fd0c..ccd7d9f 100644
--- a/server/api/squareProject/squareProject.controller.js
+++ b/server/api/squareProject/squareProject.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareProject/squareProject.events.js b/server/api/squareProject/squareProject.events.js
index 57761c7..3a02667 100644
--- a/server/api/squareProject/squareProject.events.js
+++ b/server/api/squareProject/squareProject.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareProject/squareProject.model.js b/server/api/squareProject/squareProject.model.js
index fa62893..fd66576 100644
--- a/server/api/squareProject/squareProject.model.js
+++ b/server/api/squareProject/squareProject.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareProject/squareProject.rpc.js b/server/api/squareProject/squareProject.rpc.js
index 1e34b52..a4a8f82 100644
--- a/server/api/squareProject/squareProject.rpc.js
+++ b/server/api/squareProject/squareProject.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareProject/squareProject.socket.js b/server/api/squareProject/squareProject.socket.js
index 1a11669..262886a 100644
--- a/server/api/squareProject/squareProject.socket.js
+++ b/server/api/squareProject/squareProject.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareRecording/index.js b/server/api/squareRecording/index.js
index e9bff0b..a87f5b9 100644
--- a/server/api/squareRecording/index.js
+++ b/server/api/squareRecording/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareRecording/squareRecording.attributes.js b/server/api/squareRecording/squareRecording.attributes.js
index ad7043f..cace160 100644
--- a/server/api/squareRecording/squareRecording.attributes.js
+++ b/server/api/squareRecording/squareRecording.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareRecording/squareRecording.controller.js b/server/api/squareRecording/squareRecording.controller.js
index 3de5a62..ed764a9 100644
--- a/server/api/squareRecording/squareRecording.controller.js
+++ b/server/api/squareRecording/squareRecording.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareRecording/squareRecording.model.js b/server/api/squareRecording/squareRecording.model.js
index 5c389b4..f029877 100644
--- a/server/api/squareRecording/squareRecording.model.js
+++ b/server/api/squareRecording/squareRecording.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareRecording/squareRecording.rpc.js b/server/api/squareRecording/squareRecording.rpc.js
index 4e3d354..bcd16c2 100644
--- a/server/api/squareRecording/squareRecording.rpc.js
+++ b/server/api/squareRecording/squareRecording.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareReport/index.js b/server/api/squareReport/index.js
index f5ef9db..a022774 100644
--- a/server/api/squareReport/index.js
+++ b/server/api/squareReport/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareReport/squareReport.attributes.js b/server/api/squareReport/squareReport.attributes.js
index 64025cc..d1f8062 100644
--- a/server/api/squareReport/squareReport.attributes.js
+++ b/server/api/squareReport/squareReport.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareReport/squareReport.controller.js b/server/api/squareReport/squareReport.controller.js
index 570a48b..5807d59 100644
--- a/server/api/squareReport/squareReport.controller.js
+++ b/server/api/squareReport/squareReport.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareReport/squareReport.model.js b/server/api/squareReport/squareReport.model.js
index 652603a..422cecc 100644
--- a/server/api/squareReport/squareReport.model.js
+++ b/server/api/squareReport/squareReport.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareReport/squareReport.rpc.js b/server/api/squareReport/squareReport.rpc.js
index 899058f..f5ff7e1 100644
--- a/server/api/squareReport/squareReport.rpc.js
+++ b/server/api/squareReport/squareReport.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareReportDetail/index.js b/server/api/squareReportDetail/index.js
index e9d3377..bb8a446 100644
--- a/server/api/squareReportDetail/index.js
+++ b/server/api/squareReportDetail/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareReportDetail/squareReportDetail.attributes.js b/server/api/squareReportDetail/squareReportDetail.attributes.js
index 63ccdf4..2c58f79 100644
--- a/server/api/squareReportDetail/squareReportDetail.attributes.js
+++ b/server/api/squareReportDetail/squareReportDetail.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareReportDetail/squareReportDetail.controller.js b/server/api/squareReportDetail/squareReportDetail.controller.js
index a9ee43b..56815d3 100644
--- a/server/api/squareReportDetail/squareReportDetail.controller.js
+++ b/server/api/squareReportDetail/squareReportDetail.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareReportDetail/squareReportDetail.model.js b/server/api/squareReportDetail/squareReportDetail.model.js
index de400b0..7761b46 100644
--- a/server/api/squareReportDetail/squareReportDetail.model.js
+++ b/server/api/squareReportDetail/squareReportDetail.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/squareReportDetail/squareReportDetail.rpc.js b/server/api/squareReportDetail/squareReportDetail.rpc.js
index bd6974d..86589e2 100644
--- a/server/api/squareReportDetail/squareReportDetail.rpc.js
+++ b/server/api/squareReportDetail/squareReportDetail.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/system/index.js b/server/api/system/index.js
index ea5a648..ba660e7 100644
--- a/server/api/system/index.js
+++ b/server/api/system/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/system/system.controller.js b/server/api/system/system.controller.js
index 28b0978..988a81d 100644
--- a/server/api/system/system.controller.js
+++ b/server/api/system/system.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/tag/index.js b/server/api/tag/index.js
index d5de157..4953818 100644
--- a/server/api/tag/index.js
+++ b/server/api/tag/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/tag/tag.attributes.js b/server/api/tag/tag.attributes.js
index cb64347..79441ec 100644
--- a/server/api/tag/tag.attributes.js
+++ b/server/api/tag/tag.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/tag/tag.controller.js b/server/api/tag/tag.controller.js
index e7f411f..b1fbf2e 100644
--- a/server/api/tag/tag.controller.js
+++ b/server/api/tag/tag.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/tag/tag.model.js b/server/api/tag/tag.model.js
index ec096c3..64e3584 100644
--- a/server/api/tag/tag.model.js
+++ b/server/api/tag/tag.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/team/index.js b/server/api/team/index.js
index 1f02d0e..586448a 100644
--- a/server/api/team/index.js
+++ b/server/api/team/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/team/team.attributes.js b/server/api/team/team.attributes.js
index 39940a9..d0dc3ef 100644
--- a/server/api/team/team.attributes.js
+++ b/server/api/team/team.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/team/team.controller.js b/server/api/team/team.controller.js
index 2909481..121cb5d 100644
--- a/server/api/team/team.controller.js
+++ b/server/api/team/team.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/team/team.events.js b/server/api/team/team.events.js
index afc4d8b..04c8771 100644
--- a/server/api/team/team.events.js
+++ b/server/api/team/team.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/team/team.model.js b/server/api/team/team.model.js
index 207488d..fafb2f6 100644
--- a/server/api/team/team.model.js
+++ b/server/api/team/team.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/team/team.rpc.js b/server/api/team/team.rpc.js
index 7cdb07d..dfa7154 100644
--- a/server/api/team/team.rpc.js
+++ b/server/api/team/team.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/team/team.socket.js b/server/api/team/team.socket.js
index 47049d5..8333f23 100644
--- a/server/api/team/team.socket.js
+++ b/server/api/team/team.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/template/index.js b/server/api/template/index.js
index ac7e11c..d6db6b3 100644
--- a/server/api/template/index.js
+++ b/server/api/template/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/template/template.attributes.js b/server/api/template/template.attributes.js
index c85cbe6..5ec21be 100644
--- a/server/api/template/template.attributes.js
+++ b/server/api/template/template.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/template/template.controller.js b/server/api/template/template.controller.js
index a545580..360c7d2 100644
--- a/server/api/template/template.controller.js
+++ b/server/api/template/template.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/template/template.model.js b/server/api/template/template.model.js
index b304fc6..8667619 100644
--- a/server/api/template/template.model.js
+++ b/server/api/template/template.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/template/template.rpc.js b/server/api/template/template.rpc.js
index feaf802..6f7fdfa 100644
--- a/server/api/template/template.rpc.js
+++ b/server/api/template/template.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/trigger/index.js b/server/api/trigger/index.js
index c6e14ec..7c285e7 100644
--- a/server/api/trigger/index.js
+++ b/server/api/trigger/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/trigger/trigger.attributes.js b/server/api/trigger/trigger.attributes.js
index 68450fe..7cfc2da 100644
--- a/server/api/trigger/trigger.attributes.js
+++ b/server/api/trigger/trigger.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/trigger/trigger.controller.js b/server/api/trigger/trigger.controller.js
index d00d128..25ce18d 100644
--- a/server/api/trigger/trigger.controller.js
+++ b/server/api/trigger/trigger.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/trigger/trigger.model.js b/server/api/trigger/trigger.model.js
index 7b647d4..7161728 100644
--- a/server/api/trigger/trigger.model.js
+++ b/server/api/trigger/trigger.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/trigger/trigger.rpc.js b/server/api/trigger/trigger.rpc.js
index 9867283..5d91a40 100644
--- a/server/api/trigger/trigger.rpc.js
+++ b/server/api/trigger/trigger.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/trunk/index.js b/server/api/trunk/index.js
index 65aa15a..03d9dc3 100644
--- a/server/api/trunk/index.js
+++ b/server/api/trunk/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/trunk/trunk.attributes.js b/server/api/trunk/trunk.attributes.js
index 9352507..1d06eed 100644
--- a/server/api/trunk/trunk.attributes.js
+++ b/server/api/trunk/trunk.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/trunk/trunk.controller.js b/server/api/trunk/trunk.controller.js
index c531178..54cf2d8 100644
--- a/server/api/trunk/trunk.controller.js
+++ b/server/api/trunk/trunk.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/trunk/trunk.model.js b/server/api/trunk/trunk.model.js
index a0954f9..4126480 100644
--- a/server/api/trunk/trunk.model.js
+++ b/server/api/trunk/trunk.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/trunk/trunk.rpc.js b/server/api/trunk/trunk.rpc.js
index 0591c7c..c2ff3e9 100644
--- a/server/api/trunk/trunk.rpc.js
+++ b/server/api/trunk/trunk.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/user/index.js b/server/api/user/index.js
index 345f872..0616ee0 100644
--- a/server/api/user/index.js
+++ b/server/api/user/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/user/user.attributes.js b/server/api/user/user.attributes.js
index 3711502..32bb16b 100644
--- a/server/api/user/user.attributes.js
+++ b/server/api/user/user.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/user/user.controller.js b/server/api/user/user.controller.js
index a00eb8c..a51cf52 100644
--- a/server/api/user/user.controller.js
+++ b/server/api/user/user.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/user/user.events.js b/server/api/user/user.events.js
index af4ded3..08ced1e 100644
--- a/server/api/user/user.events.js
+++ b/server/api/user/user.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/user/user.model.js b/server/api/user/user.model.js
index f708655..b920b82 100644
--- a/server/api/user/user.model.js
+++ b/server/api/user/user.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/user/user.rpc.js b/server/api/user/user.rpc.js
index feaa629..50796f5 100644
--- a/server/api/user/user.rpc.js
+++ b/server/api/user/user.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/user/user.socket.js b/server/api/user/user.socket.js
index 972b54f..22b7b66 100644
--- a/server/api/user/user.socket.js
+++ b/server/api/user/user.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userChatQueue/index.js b/server/api/userChatQueue/index.js
index 00e1607..514dc24 100644
--- a/server/api/userChatQueue/index.js
+++ b/server/api/userChatQueue/index.js
@@ -1 +1 @@
-const a653_0x2fae=['Router','express'];(function(_0x2f22b3,_0x2fae0a){const _0xf9b91a=function(_0x15ae10){while(--_0x15ae10){_0x2f22b3['push'](_0x2f22b3['shift']());}};_0xf9b91a(++_0x2fae0a);}(a653_0x2fae,0x175));const a653_0xf9b9=function(_0x2f22b3,_0x2fae0a){_0x2f22b3=_0x2f22b3-0x0;let _0xf9b91a=a653_0x2fae[_0x2f22b3];return _0xf9b91a;};const _0x2c5996=a653_0xf9b9;'use strict';const express=require(_0x2c5996('0x0')),router=express[_0x2c5996('0x1')]();module['exports']=router;
\ No newline at end of file
+const a653_0x51ec=['Router','express'];(function(_0xa9782e,_0x51ecd0){const _0x215699=function(_0x176b6c){while(--_0x176b6c){_0xa9782e['push'](_0xa9782e['shift']());}};_0x215699(++_0x51ecd0);}(a653_0x51ec,0x12d));const a653_0x2156=function(_0xa9782e,_0x51ecd0){_0xa9782e=_0xa9782e-0x0;let _0x215699=a653_0x51ec[_0xa9782e];return _0x215699;};const _0x18272b=a653_0x2156;'use strict';const express=require(_0x18272b('0x0')),router=express[_0x18272b('0x1')]();module['exports']=router;
\ No newline at end of file
diff --git a/server/api/userChatQueue/userChatQueue.attributes.js b/server/api/userChatQueue/userChatQueue.attributes.js
index 96764a8..0535c50 100644
--- a/server/api/userChatQueue/userChatQueue.attributes.js
+++ b/server/api/userChatQueue/userChatQueue.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userChatQueue/userChatQueue.model.js b/server/api/userChatQueue/userChatQueue.model.js
index e1f5b3e..942af03 100644
--- a/server/api/userChatQueue/userChatQueue.model.js
+++ b/server/api/userChatQueue/userChatQueue.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userFaxQueue/index.js b/server/api/userFaxQueue/index.js
index 62b009d..be01def 100644
--- a/server/api/userFaxQueue/index.js
+++ b/server/api/userFaxQueue/index.js
@@ -1 +1 @@
-const a656_0x3869=['express','exports','Router'];(function(_0x3e6562,_0x386975){const _0x3ec501=function(_0x11ed9e){while(--_0x11ed9e){_0x3e6562['push'](_0x3e6562['shift']());}};_0x3ec501(++_0x386975);}(a656_0x3869,0xa2));const a656_0x3ec5=function(_0x3e6562,_0x386975){_0x3e6562=_0x3e6562-0x0;let _0x3ec501=a656_0x3869[_0x3e6562];return _0x3ec501;};const _0x4c1b3b=a656_0x3ec5;'use strict';const express=require(_0x4c1b3b('0x0')),router=express[_0x4c1b3b('0x2')]();module[_0x4c1b3b('0x1')]=router;
\ No newline at end of file
+const a656_0x39d2=['Router','exports','express'];(function(_0xa2d79b,_0x39d241){const _0x547a30=function(_0x8b0e57){while(--_0x8b0e57){_0xa2d79b['push'](_0xa2d79b['shift']());}};_0x547a30(++_0x39d241);}(a656_0x39d2,0x6b));const a656_0x547a=function(_0xa2d79b,_0x39d241){_0xa2d79b=_0xa2d79b-0x0;let _0x547a30=a656_0x39d2[_0xa2d79b];return _0x547a30;};const _0x31b9d6=a656_0x547a;'use strict';const express=require(_0x31b9d6('0x0')),router=express[_0x31b9d6('0x1')]();module[_0x31b9d6('0x2')]=router;
\ No newline at end of file
diff --git a/server/api/userFaxQueue/userFaxQueue.attributes.js b/server/api/userFaxQueue/userFaxQueue.attributes.js
index 959abc8..aa1b0a3 100644
--- a/server/api/userFaxQueue/userFaxQueue.attributes.js
+++ b/server/api/userFaxQueue/userFaxQueue.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userFaxQueue/userFaxQueue.model.js b/server/api/userFaxQueue/userFaxQueue.model.js
index 593869a..6c08470 100644
--- a/server/api/userFaxQueue/userFaxQueue.model.js
+++ b/server/api/userFaxQueue/userFaxQueue.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userMailQueue/index.js b/server/api/userMailQueue/index.js
index 40871e8..54edb8a 100644
--- a/server/api/userMailQueue/index.js
+++ b/server/api/userMailQueue/index.js
@@ -1 +1 @@
-'use strict';const express=require('express'),router=express['Router']();module['exports']=router;
\ No newline at end of file
+const a659_0x58ef=['express','exports'];(function(_0x199016,_0x58effb){const _0x49eff2=function(_0x2a81dd){while(--_0x2a81dd){_0x199016['push'](_0x199016['shift']());}};_0x49eff2(++_0x58effb);}(a659_0x58ef,0x17a));const a659_0x49ef=function(_0x199016,_0x58effb){_0x199016=_0x199016-0x0;let _0x49eff2=a659_0x58ef[_0x199016];return _0x49eff2;};const _0x28ee98=a659_0x49ef;'use strict';const express=require(_0x28ee98('0x0')),router=express['Router']();module[_0x28ee98('0x1')]=router;
\ No newline at end of file
diff --git a/server/api/userMailQueue/userMailQueue.attributes.js b/server/api/userMailQueue/userMailQueue.attributes.js
index 9ceba9f..035f543 100644
--- a/server/api/userMailQueue/userMailQueue.attributes.js
+++ b/server/api/userMailQueue/userMailQueue.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userMailQueue/userMailQueue.model.js b/server/api/userMailQueue/userMailQueue.model.js
index 9b31bd5..0f4f7e8 100644
--- a/server/api/userMailQueue/userMailQueue.model.js
+++ b/server/api/userMailQueue/userMailQueue.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userOpenchannelQueue/index.js b/server/api/userOpenchannelQueue/index.js
index fc98bb1..b379e44 100644
--- a/server/api/userOpenchannelQueue/index.js
+++ b/server/api/userOpenchannelQueue/index.js
@@ -1 +1 @@
-const a662_0x1b17=['Router'];(function(_0x59c130,_0x1b17b5){const _0x79b714=function(_0x5e691a){while(--_0x5e691a){_0x59c130['push'](_0x59c130['shift']());}};_0x79b714(++_0x1b17b5);}(a662_0x1b17,0xe0));const a662_0x79b7=function(_0x59c130,_0x1b17b5){_0x59c130=_0x59c130-0x0;let _0x79b714=a662_0x1b17[_0x59c130];return _0x79b714;};const _0xb0377=a662_0x79b7;'use strict';const express=require('express'),router=express[_0xb0377('0x0')]();module['exports']=router;
\ No newline at end of file
+const a662_0x19f5=['express','exports','Router'];(function(_0x3a8a5a,_0x19f5b1){const _0x4a4390=function(_0x18c5de){while(--_0x18c5de){_0x3a8a5a['push'](_0x3a8a5a['shift']());}};_0x4a4390(++_0x19f5b1);}(a662_0x19f5,0xe9));const a662_0x4a43=function(_0x3a8a5a,_0x19f5b1){_0x3a8a5a=_0x3a8a5a-0x0;let _0x4a4390=a662_0x19f5[_0x3a8a5a];return _0x4a4390;};const _0x29eee5=a662_0x4a43;'use strict';const express=require(_0x29eee5('0x1')),router=express[_0x29eee5('0x0')]();module[_0x29eee5('0x2')]=router;
\ No newline at end of file
diff --git a/server/api/userOpenchannelQueue/userOpenchannelQueue.attributes.js b/server/api/userOpenchannelQueue/userOpenchannelQueue.attributes.js
index 060d533..6634952 100644
--- a/server/api/userOpenchannelQueue/userOpenchannelQueue.attributes.js
+++ b/server/api/userOpenchannelQueue/userOpenchannelQueue.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userOpenchannelQueue/userOpenchannelQueue.model.js b/server/api/userOpenchannelQueue/userOpenchannelQueue.model.js
index 8ac0770..51684dc 100644
--- a/server/api/userOpenchannelQueue/userOpenchannelQueue.model.js
+++ b/server/api/userOpenchannelQueue/userOpenchannelQueue.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userProfile/index.js b/server/api/userProfile/index.js
index 0a39694..ea7ac1a 100644
--- a/server/api/userProfile/index.js
+++ b/server/api/userProfile/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userProfile/userProfile.attributes.js b/server/api/userProfile/userProfile.attributes.js
index ac895aa..7e8b1a0 100644
--- a/server/api/userProfile/userProfile.attributes.js
+++ b/server/api/userProfile/userProfile.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userProfile/userProfile.controller.js b/server/api/userProfile/userProfile.controller.js
index f257bcf..1e7e68f 100644
--- a/server/api/userProfile/userProfile.controller.js
+++ b/server/api/userProfile/userProfile.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userProfile/userProfile.events.js b/server/api/userProfile/userProfile.events.js
index 1aa52ee..691f952 100644
--- a/server/api/userProfile/userProfile.events.js
+++ b/server/api/userProfile/userProfile.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userProfile/userProfile.model.js b/server/api/userProfile/userProfile.model.js
index 9fcdb1d..45472a9 100644
--- a/server/api/userProfile/userProfile.model.js
+++ b/server/api/userProfile/userProfile.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userProfile/userProfile.rpc.js b/server/api/userProfile/userProfile.rpc.js
index 201c37e..e9b093d 100644
--- a/server/api/userProfile/userProfile.rpc.js
+++ b/server/api/userProfile/userProfile.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userProfile/userProfile.socket.js b/server/api/userProfile/userProfile.socket.js
index aa0aca2..71efa0c 100644
--- a/server/api/userProfile/userProfile.socket.js
+++ b/server/api/userProfile/userProfile.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userProfileResource/index.js b/server/api/userProfileResource/index.js
index 7ee8576..f130f0c 100644
--- a/server/api/userProfileResource/index.js
+++ b/server/api/userProfileResource/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userProfileResource/userProfileResource.attributes.js b/server/api/userProfileResource/userProfileResource.attributes.js
index 402dd56..378cef3 100644
--- a/server/api/userProfileResource/userProfileResource.attributes.js
+++ b/server/api/userProfileResource/userProfileResource.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userProfileResource/userProfileResource.controller.js b/server/api/userProfileResource/userProfileResource.controller.js
index 48e3f32..9008ee0 100644
--- a/server/api/userProfileResource/userProfileResource.controller.js
+++ b/server/api/userProfileResource/userProfileResource.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userProfileResource/userProfileResource.model.js b/server/api/userProfileResource/userProfileResource.model.js
index d673920..e788041 100644
--- a/server/api/userProfileResource/userProfileResource.model.js
+++ b/server/api/userProfileResource/userProfileResource.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userProfileSection/index.js b/server/api/userProfileSection/index.js
index 52787ce..ec67768 100644
--- a/server/api/userProfileSection/index.js
+++ b/server/api/userProfileSection/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userProfileSection/userProfileSection.attributes.js b/server/api/userProfileSection/userProfileSection.attributes.js
index 842041c..192adf8 100644
--- a/server/api/userProfileSection/userProfileSection.attributes.js
+++ b/server/api/userProfileSection/userProfileSection.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userProfileSection/userProfileSection.controller.js b/server/api/userProfileSection/userProfileSection.controller.js
index 91db03c..cb36480 100644
--- a/server/api/userProfileSection/userProfileSection.controller.js
+++ b/server/api/userProfileSection/userProfileSection.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userProfileSection/userProfileSection.model.js b/server/api/userProfileSection/userProfileSection.model.js
index 47c1731..a8a37d7 100644
--- a/server/api/userProfileSection/userProfileSection.model.js
+++ b/server/api/userProfileSection/userProfileSection.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userSmsQueue/index.js b/server/api/userSmsQueue/index.js
index 1a34055..3d869de 100644
--- a/server/api/userSmsQueue/index.js
+++ b/server/api/userSmsQueue/index.js
@@ -1 +1 @@
-const a680_0xcaf3=['express','Router'];(function(_0x456d99,_0xcaf354){const _0x917046=function(_0x41e863){while(--_0x41e863){_0x456d99['push'](_0x456d99['shift']());}};_0x917046(++_0xcaf354);}(a680_0xcaf3,0x11d));const a680_0x9170=function(_0x456d99,_0xcaf354){_0x456d99=_0x456d99-0x0;let _0x917046=a680_0xcaf3[_0x456d99];return _0x917046;};const _0x3f336c=a680_0x9170;'use strict';const express=require(_0x3f336c('0x1')),router=express[_0x3f336c('0x0')]();module['exports']=router;
\ No newline at end of file
+const a680_0x4450=['exports','Router'];(function(_0x4a5f7f,_0x44500c){const _0x2beed8=function(_0x5aa608){while(--_0x5aa608){_0x4a5f7f['push'](_0x4a5f7f['shift']());}};_0x2beed8(++_0x44500c);}(a680_0x4450,0x8c));const a680_0x2bee=function(_0x4a5f7f,_0x44500c){_0x4a5f7f=_0x4a5f7f-0x0;let _0x2beed8=a680_0x4450[_0x4a5f7f];return _0x2beed8;};const _0xdc6fd0=a680_0x2bee;'use strict';const express=require('express'),router=express[_0xdc6fd0('0x1')]();module[_0xdc6fd0('0x0')]=router;
\ No newline at end of file
diff --git a/server/api/userSmsQueue/userSmsQueue.attributes.js b/server/api/userSmsQueue/userSmsQueue.attributes.js
index 34f8aba..d6fbebb 100644
--- a/server/api/userSmsQueue/userSmsQueue.attributes.js
+++ b/server/api/userSmsQueue/userSmsQueue.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userSmsQueue/userSmsQueue.model.js b/server/api/userSmsQueue/userSmsQueue.model.js
index 74cdd8c..ec93323 100644
--- a/server/api/userSmsQueue/userSmsQueue.model.js
+++ b/server/api/userSmsQueue/userSmsQueue.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userVoiceQueue/index.js b/server/api/userVoiceQueue/index.js
index 148a620..1f5d125 100644
--- a/server/api/userVoiceQueue/index.js
+++ b/server/api/userVoiceQueue/index.js
@@ -1 +1 @@
-const a683_0x2bf5=['exports','express','Router'];(function(_0x566442,_0x2bf58e){const _0x19726a=function(_0x43031a){while(--_0x43031a){_0x566442['push'](_0x566442['shift']());}};_0x19726a(++_0x2bf58e);}(a683_0x2bf5,0x84));const a683_0x1972=function(_0x566442,_0x2bf58e){_0x566442=_0x566442-0x0;let _0x19726a=a683_0x2bf5[_0x566442];return _0x19726a;};const _0x11611e=a683_0x1972;'use strict';const express=require(_0x11611e('0x1')),router=express[_0x11611e('0x2')]();module[_0x11611e('0x0')]=router;
\ No newline at end of file
+const a683_0x4a3d=['Router','express'];(function(_0x3b8609,_0x4a3d30){const _0x1a4c27=function(_0x2eb1ac){while(--_0x2eb1ac){_0x3b8609['push'](_0x3b8609['shift']());}};_0x1a4c27(++_0x4a3d30);}(a683_0x4a3d,0x1b6));const a683_0x1a4c=function(_0x3b8609,_0x4a3d30){_0x3b8609=_0x3b8609-0x0;let _0x1a4c27=a683_0x4a3d[_0x3b8609];return _0x1a4c27;};const _0xc37c32=a683_0x1a4c;'use strict';const express=require(_0xc37c32('0x1')),router=express[_0xc37c32('0x0')]();module['exports']=router;
\ No newline at end of file
diff --git a/server/api/userVoiceQueue/userVoiceQueue.attributes.js b/server/api/userVoiceQueue/userVoiceQueue.attributes.js
index 74dd12c..333ae16 100644
--- a/server/api/userVoiceQueue/userVoiceQueue.attributes.js
+++ b/server/api/userVoiceQueue/userVoiceQueue.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userVoiceQueue/userVoiceQueue.model.js b/server/api/userVoiceQueue/userVoiceQueue.model.js
index 6b1eca9..0cf4fce 100644
--- a/server/api/userVoiceQueue/userVoiceQueue.model.js
+++ b/server/api/userVoiceQueue/userVoiceQueue.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userVoiceQueueRt/index.js b/server/api/userVoiceQueueRt/index.js
index e217c36..058dd25 100644
--- a/server/api/userVoiceQueueRt/index.js
+++ b/server/api/userVoiceQueueRt/index.js
@@ -1 +1 @@
-const a686_0x31a0=['Router'];(function(_0x5b88ce,_0x31a07e){const _0x2aaa68=function(_0x548d4f){while(--_0x548d4f){_0x5b88ce['push'](_0x5b88ce['shift']());}};_0x2aaa68(++_0x31a07e);}(a686_0x31a0,0xdc));const a686_0x2aaa=function(_0x5b88ce,_0x31a07e){_0x5b88ce=_0x5b88ce-0x0;let _0x2aaa68=a686_0x31a0[_0x5b88ce];return _0x2aaa68;};const _0x2fd67a=a686_0x2aaa;'use strict';const express=require('express'),router=express[_0x2fd67a('0x0')]();module['exports']=router;
\ No newline at end of file
+const a686_0x2ca5=['express','Router'];(function(_0x42b48a,_0x2ca574){const _0x1bcbb4=function(_0x3fda81){while(--_0x3fda81){_0x42b48a['push'](_0x42b48a['shift']());}};_0x1bcbb4(++_0x2ca574);}(a686_0x2ca5,0x187));const a686_0x1bcb=function(_0x42b48a,_0x2ca574){_0x42b48a=_0x42b48a-0x0;let _0x1bcbb4=a686_0x2ca5[_0x42b48a];return _0x1bcbb4;};const _0x18ab05=a686_0x1bcb;'use strict';const express=require(_0x18ab05('0x1')),router=express[_0x18ab05('0x0')]();module['exports']=router;
\ No newline at end of file
diff --git a/server/api/userVoiceQueueRt/userVoiceQueueRt.attributes.js b/server/api/userVoiceQueueRt/userVoiceQueueRt.attributes.js
index 16f52dd..259e9fb 100644
--- a/server/api/userVoiceQueueRt/userVoiceQueueRt.attributes.js
+++ b/server/api/userVoiceQueueRt/userVoiceQueueRt.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userVoiceQueueRt/userVoiceQueueRt.events.js b/server/api/userVoiceQueueRt/userVoiceQueueRt.events.js
index a153c50..ac87145 100644
--- a/server/api/userVoiceQueueRt/userVoiceQueueRt.events.js
+++ b/server/api/userVoiceQueueRt/userVoiceQueueRt.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userVoiceQueueRt/userVoiceQueueRt.model.js b/server/api/userVoiceQueueRt/userVoiceQueueRt.model.js
index a8c1431..42c4211 100644
--- a/server/api/userVoiceQueueRt/userVoiceQueueRt.model.js
+++ b/server/api/userVoiceQueueRt/userVoiceQueueRt.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userVoiceQueueRt/userVoiceQueueRt.rpc.js b/server/api/userVoiceQueueRt/userVoiceQueueRt.rpc.js
index 1caf9dd..04433ec 100644
--- a/server/api/userVoiceQueueRt/userVoiceQueueRt.rpc.js
+++ b/server/api/userVoiceQueueRt/userVoiceQueueRt.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userVoiceQueueRt/userVoiceQueueRt.socket.js b/server/api/userVoiceQueueRt/userVoiceQueueRt.socket.js
index 7689df3..9f4e4ec 100644
--- a/server/api/userVoiceQueueRt/userVoiceQueueRt.socket.js
+++ b/server/api/userVoiceQueueRt/userVoiceQueueRt.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userWhatsappQueue/index.js b/server/api/userWhatsappQueue/index.js
index fae7f86..a208968 100644
--- a/server/api/userWhatsappQueue/index.js
+++ b/server/api/userWhatsappQueue/index.js
@@ -1 +1 @@
-const a692_0x430e=['express','Router'];(function(_0x19276d,_0x430e6e){const _0x2cf5b0=function(_0x39f03a){while(--_0x39f03a){_0x19276d['push'](_0x19276d['shift']());}};_0x2cf5b0(++_0x430e6e);}(a692_0x430e,0xc8));const a692_0x2cf5=function(_0x19276d,_0x430e6e){_0x19276d=_0x19276d-0x0;let _0x2cf5b0=a692_0x430e[_0x19276d];return _0x2cf5b0;};const _0x545308=a692_0x2cf5;'use strict';const express=require(_0x545308('0x0')),router=express[_0x545308('0x1')]();module['exports']=router;
\ No newline at end of file
+const a692_0x4898=['express','Router','exports'];(function(_0x62a0ea,_0x4898ef){const _0x35c589=function(_0x1be1c5){while(--_0x1be1c5){_0x62a0ea['push'](_0x62a0ea['shift']());}};_0x35c589(++_0x4898ef);}(a692_0x4898,0xa5));const a692_0x35c5=function(_0x62a0ea,_0x4898ef){_0x62a0ea=_0x62a0ea-0x0;let _0x35c589=a692_0x4898[_0x62a0ea];return _0x35c589;};const _0x358eb3=a692_0x35c5;'use strict';const express=require(_0x358eb3('0x0')),router=express[_0x358eb3('0x1')]();module[_0x358eb3('0x2')]=router;
\ No newline at end of file
diff --git a/server/api/userWhatsappQueue/userWhatsappQueue.attributes.js b/server/api/userWhatsappQueue/userWhatsappQueue.attributes.js
index 0a7ee6b..df7ef19 100644
--- a/server/api/userWhatsappQueue/userWhatsappQueue.attributes.js
+++ b/server/api/userWhatsappQueue/userWhatsappQueue.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/userWhatsappQueue/userWhatsappQueue.model.js b/server/api/userWhatsappQueue/userWhatsappQueue.model.js
index 48769d6..66b795d 100644
--- a/server/api/userWhatsappQueue/userWhatsappQueue.model.js
+++ b/server/api/userWhatsappQueue/userWhatsappQueue.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/variable/index.js b/server/api/variable/index.js
index f39f914..2c19ae5 100644
--- a/server/api/variable/index.js
+++ b/server/api/variable/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/variable/variable.attributes.js b/server/api/variable/variable.attributes.js
index 1d057e2..40bb916 100644
--- a/server/api/variable/variable.attributes.js
+++ b/server/api/variable/variable.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/variable/variable.controller.js b/server/api/variable/variable.controller.js
index 45302bd..56822e5 100644
--- a/server/api/variable/variable.controller.js
+++ b/server/api/variable/variable.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/variable/variable.model.js b/server/api/variable/variable.model.js
index c1fd21f..5bc4d0f 100644
--- a/server/api/variable/variable.model.js
+++ b/server/api/variable/variable.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/variable/variable.rpc.js b/server/api/variable/variable.rpc.js
index 9476b59..b6b26c6 100644
--- a/server/api/variable/variable.rpc.js
+++ b/server/api/variable/variable.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/version/index.js b/server/api/version/index.js
index de41eee..5f7533d 100644
--- a/server/api/version/index.js
+++ b/server/api/version/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/version/version.controller.js b/server/api/version/version.controller.js
index 89511d0..0486bc0 100644
--- a/server/api/version/version.controller.js
+++ b/server/api/version/version.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceAgentReport/index.js b/server/api/voiceAgentReport/index.js
index 405c157..bc705eb 100644
--- a/server/api/voiceAgentReport/index.js
+++ b/server/api/voiceAgentReport/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceAgentReport/voiceAgentReport.attributes.js b/server/api/voiceAgentReport/voiceAgentReport.attributes.js
index 3428b5d..f295e08 100644
--- a/server/api/voiceAgentReport/voiceAgentReport.attributes.js
+++ b/server/api/voiceAgentReport/voiceAgentReport.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceAgentReport/voiceAgentReport.controller.js b/server/api/voiceAgentReport/voiceAgentReport.controller.js
index 2ed1598..b06e701 100644
--- a/server/api/voiceAgentReport/voiceAgentReport.controller.js
+++ b/server/api/voiceAgentReport/voiceAgentReport.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceAgentReport/voiceAgentReport.model.js b/server/api/voiceAgentReport/voiceAgentReport.model.js
index ba337ab..3cfb894 100644
--- a/server/api/voiceAgentReport/voiceAgentReport.model.js
+++ b/server/api/voiceAgentReport/voiceAgentReport.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceAgentReport/voiceAgentReport.rpc.js b/server/api/voiceAgentReport/voiceAgentReport.rpc.js
index 15de03c..04f597e 100644
--- a/server/api/voiceAgentReport/voiceAgentReport.rpc.js
+++ b/server/api/voiceAgentReport/voiceAgentReport.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceCallReport/index.js b/server/api/voiceCallReport/index.js
index ff034e2..0d4cb93 100644
--- a/server/api/voiceCallReport/index.js
+++ b/server/api/voiceCallReport/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceCallReport/voiceCallReport.attributes.js b/server/api/voiceCallReport/voiceCallReport.attributes.js
index 590617f..7085147 100644
--- a/server/api/voiceCallReport/voiceCallReport.attributes.js
+++ b/server/api/voiceCallReport/voiceCallReport.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceCallReport/voiceCallReport.controller.js b/server/api/voiceCallReport/voiceCallReport.controller.js
index 373ba77..39a0db4 100644
--- a/server/api/voiceCallReport/voiceCallReport.controller.js
+++ b/server/api/voiceCallReport/voiceCallReport.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceCallReport/voiceCallReport.model.js b/server/api/voiceCallReport/voiceCallReport.model.js
index e67ece7..e39e188 100644
--- a/server/api/voiceCallReport/voiceCallReport.model.js
+++ b/server/api/voiceCallReport/voiceCallReport.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceCallReport/voiceCallReport.rpc.js b/server/api/voiceCallReport/voiceCallReport.rpc.js
index b0c703b..a4b2c8f 100644
--- a/server/api/voiceCallReport/voiceCallReport.rpc.js
+++ b/server/api/voiceCallReport/voiceCallReport.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceChanSpy/index.js b/server/api/voiceChanSpy/index.js
index d2336db..6f4c3fc 100644
--- a/server/api/voiceChanSpy/index.js
+++ b/server/api/voiceChanSpy/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceChanSpy/voiceChanSpy.attributes.js b/server/api/voiceChanSpy/voiceChanSpy.attributes.js
index 28c52fb..5e909b7 100644
--- a/server/api/voiceChanSpy/voiceChanSpy.attributes.js
+++ b/server/api/voiceChanSpy/voiceChanSpy.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceChanSpy/voiceChanSpy.controller.js b/server/api/voiceChanSpy/voiceChanSpy.controller.js
index 91249be..ac1d781 100644
--- a/server/api/voiceChanSpy/voiceChanSpy.controller.js
+++ b/server/api/voiceChanSpy/voiceChanSpy.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceChanSpy/voiceChanSpy.model.js b/server/api/voiceChanSpy/voiceChanSpy.model.js
index 79c817b..e24f20f 100644
--- a/server/api/voiceChanSpy/voiceChanSpy.model.js
+++ b/server/api/voiceChanSpy/voiceChanSpy.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceContext/index.js b/server/api/voiceContext/index.js
index c942f26..80f285a 100644
--- a/server/api/voiceContext/index.js
+++ b/server/api/voiceContext/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceContext/voiceContext.attributes.js b/server/api/voiceContext/voiceContext.attributes.js
index f197f6f..62c6dc5 100644
--- a/server/api/voiceContext/voiceContext.attributes.js
+++ b/server/api/voiceContext/voiceContext.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceContext/voiceContext.controller.js b/server/api/voiceContext/voiceContext.controller.js
index 9c9fd3e..b77c073 100644
--- a/server/api/voiceContext/voiceContext.controller.js
+++ b/server/api/voiceContext/voiceContext.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceContext/voiceContext.model.js b/server/api/voiceContext/voiceContext.model.js
index 9d0b837..7b70fc8 100644
--- a/server/api/voiceContext/voiceContext.model.js
+++ b/server/api/voiceContext/voiceContext.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceDialReport/index.js b/server/api/voiceDialReport/index.js
index 8cba03f..bc8ba86 100644
--- a/server/api/voiceDialReport/index.js
+++ b/server/api/voiceDialReport/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceDialReport/voiceDialReport.attributes.js b/server/api/voiceDialReport/voiceDialReport.attributes.js
index 6ffc3c1..9cc0966 100644
--- a/server/api/voiceDialReport/voiceDialReport.attributes.js
+++ b/server/api/voiceDialReport/voiceDialReport.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceDialReport/voiceDialReport.controller.js b/server/api/voiceDialReport/voiceDialReport.controller.js
index 6f31f2b..6df7d7c 100644
--- a/server/api/voiceDialReport/voiceDialReport.controller.js
+++ b/server/api/voiceDialReport/voiceDialReport.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceDialReport/voiceDialReport.model.js b/server/api/voiceDialReport/voiceDialReport.model.js
index 67410c2..144a6b6 100644
--- a/server/api/voiceDialReport/voiceDialReport.model.js
+++ b/server/api/voiceDialReport/voiceDialReport.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceDialReport/voiceDialReport.rpc.js b/server/api/voiceDialReport/voiceDialReport.rpc.js
index 28e48cd..f3b49f7 100644
--- a/server/api/voiceDialReport/voiceDialReport.rpc.js
+++ b/server/api/voiceDialReport/voiceDialReport.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceExtension/index.js b/server/api/voiceExtension/index.js
index 670bdef..adb6c8a 100644
--- a/server/api/voiceExtension/index.js
+++ b/server/api/voiceExtension/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceExtension/voiceExtension.attributes.js b/server/api/voiceExtension/voiceExtension.attributes.js
index 43818e8..be7e282 100644
--- a/server/api/voiceExtension/voiceExtension.attributes.js
+++ b/server/api/voiceExtension/voiceExtension.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceExtension/voiceExtension.controller.js b/server/api/voiceExtension/voiceExtension.controller.js
index 20a1c3e..56a15e9 100644
--- a/server/api/voiceExtension/voiceExtension.controller.js
+++ b/server/api/voiceExtension/voiceExtension.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceExtension/voiceExtension.events.js b/server/api/voiceExtension/voiceExtension.events.js
index d2f2ef4..2843f9f 100644
--- a/server/api/voiceExtension/voiceExtension.events.js
+++ b/server/api/voiceExtension/voiceExtension.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceExtension/voiceExtension.model.js b/server/api/voiceExtension/voiceExtension.model.js
index ebe4aa7..57e37bd 100644
--- a/server/api/voiceExtension/voiceExtension.model.js
+++ b/server/api/voiceExtension/voiceExtension.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceExtension/voiceExtension.rpc.js b/server/api/voiceExtension/voiceExtension.rpc.js
index 0d9c642..73a877d 100644
--- a/server/api/voiceExtension/voiceExtension.rpc.js
+++ b/server/api/voiceExtension/voiceExtension.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceExtension/voiceExtension.socket.js b/server/api/voiceExtension/voiceExtension.socket.js
index 5bfcebe..22d1123 100644
--- a/server/api/voiceExtension/voiceExtension.socket.js
+++ b/server/api/voiceExtension/voiceExtension.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceMail/index.js b/server/api/voiceMail/index.js
index f21738e..39f2d2c 100644
--- a/server/api/voiceMail/index.js
+++ b/server/api/voiceMail/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceMail/voiceMail.attributes.js b/server/api/voiceMail/voiceMail.attributes.js
index 62a812b..c3dcd10 100644
--- a/server/api/voiceMail/voiceMail.attributes.js
+++ b/server/api/voiceMail/voiceMail.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceMail/voiceMail.controller.js b/server/api/voiceMail/voiceMail.controller.js
index d93a753..0efaaa3 100644
--- a/server/api/voiceMail/voiceMail.controller.js
+++ b/server/api/voiceMail/voiceMail.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceMail/voiceMail.model.js b/server/api/voiceMail/voiceMail.model.js
index e6ee42f..9f7a7c6 100644
--- a/server/api/voiceMail/voiceMail.model.js
+++ b/server/api/voiceMail/voiceMail.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceMailMessage/index.js b/server/api/voiceMailMessage/index.js
index 76fbdae..3eacd60 100644
--- a/server/api/voiceMailMessage/index.js
+++ b/server/api/voiceMailMessage/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceMailMessage/voiceMailMessage.attributes.js b/server/api/voiceMailMessage/voiceMailMessage.attributes.js
index 1397009..f29e8d5 100644
--- a/server/api/voiceMailMessage/voiceMailMessage.attributes.js
+++ b/server/api/voiceMailMessage/voiceMailMessage.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceMailMessage/voiceMailMessage.controller.js b/server/api/voiceMailMessage/voiceMailMessage.controller.js
index a29c362..f9240f5 100644
--- a/server/api/voiceMailMessage/voiceMailMessage.controller.js
+++ b/server/api/voiceMailMessage/voiceMailMessage.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceMailMessage/voiceMailMessage.model.js b/server/api/voiceMailMessage/voiceMailMessage.model.js
index b9d87c5..d8c9a87 100644
--- a/server/api/voiceMailMessage/voiceMailMessage.model.js
+++ b/server/api/voiceMailMessage/voiceMailMessage.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceMusicOnHold/index.js b/server/api/voiceMusicOnHold/index.js
index 7b5daf0..3fd775c 100644
--- a/server/api/voiceMusicOnHold/index.js
+++ b/server/api/voiceMusicOnHold/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceMusicOnHold/voiceMusicOnHold.attributes.js b/server/api/voiceMusicOnHold/voiceMusicOnHold.attributes.js
index 02f9117..b9f5c3d 100644
--- a/server/api/voiceMusicOnHold/voiceMusicOnHold.attributes.js
+++ b/server/api/voiceMusicOnHold/voiceMusicOnHold.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceMusicOnHold/voiceMusicOnHold.controller.js b/server/api/voiceMusicOnHold/voiceMusicOnHold.controller.js
index dd1caee..deffd9a 100644
--- a/server/api/voiceMusicOnHold/voiceMusicOnHold.controller.js
+++ b/server/api/voiceMusicOnHold/voiceMusicOnHold.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceMusicOnHold/voiceMusicOnHold.model.js b/server/api/voiceMusicOnHold/voiceMusicOnHold.model.js
index a5aaf56..1516bd8 100644
--- a/server/api/voiceMusicOnHold/voiceMusicOnHold.model.js
+++ b/server/api/voiceMusicOnHold/voiceMusicOnHold.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voicePrefix/index.js b/server/api/voicePrefix/index.js
index 7bf10c9..8dc1662 100644
--- a/server/api/voicePrefix/index.js
+++ b/server/api/voicePrefix/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voicePrefix/voicePrefix.attributes.js b/server/api/voicePrefix/voicePrefix.attributes.js
index 04c8de1..2b0122c 100644
--- a/server/api/voicePrefix/voicePrefix.attributes.js
+++ b/server/api/voicePrefix/voicePrefix.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voicePrefix/voicePrefix.controller.js b/server/api/voicePrefix/voicePrefix.controller.js
index 1c9b68f..9534b3a 100644
--- a/server/api/voicePrefix/voicePrefix.controller.js
+++ b/server/api/voicePrefix/voicePrefix.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voicePrefix/voicePrefix.events.js b/server/api/voicePrefix/voicePrefix.events.js
index e1d41b4..fb5316d 100644
--- a/server/api/voicePrefix/voicePrefix.events.js
+++ b/server/api/voicePrefix/voicePrefix.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voicePrefix/voicePrefix.model.js b/server/api/voicePrefix/voicePrefix.model.js
index e618b4e..a670633 100644
--- a/server/api/voicePrefix/voicePrefix.model.js
+++ b/server/api/voicePrefix/voicePrefix.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voicePrefix/voicePrefix.rpc.js b/server/api/voicePrefix/voicePrefix.rpc.js
index 71489bc..cb9bd87 100644
--- a/server/api/voicePrefix/voicePrefix.rpc.js
+++ b/server/api/voicePrefix/voicePrefix.rpc.js
@@ -1 +1 @@
\ No newline at end of file
+const a749_0x428d=['./voicePrefix.socket'];(function(_0x28e9ee,_0x428d1e){const _0x56856b=function(_0x52bb1f){while(--_0x52bb1f){_0x28e9ee['push'](_0x28e9ee['shift']());}};_0x56856b(++_0x428d1e);}(a749_0x428d,0x184));const a749_0x5685=function(_0x28e9ee,_0x428d1e){_0x28e9ee=_0x28e9ee-0x0;let _0x56856b=a749_0x428d[_0x28e9ee];return _0x56856b;};const _0x578cb6=a749_0x5685;'use strict';const {getSocket}=require('../../rediscache'),socket=getSocket();require(_0x578cb6('0x0'))['register'](socket);
\ No newline at end of file
diff --git a/server/api/voicePrefix/voicePrefix.socket.js b/server/api/voicePrefix/voicePrefix.socket.js
index 91893a9..4d2ed17 100644
--- a/server/api/voicePrefix/voicePrefix.socket.js
+++ b/server/api/voicePrefix/voicePrefix.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceQueue/index.js b/server/api/voiceQueue/index.js
index 523ec9f..f0b1572 100644
--- a/server/api/voiceQueue/index.js
+++ b/server/api/voiceQueue/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceQueue/voiceQueue.attributes.js b/server/api/voiceQueue/voiceQueue.attributes.js
index 9baf808..a6ab736 100644
--- a/server/api/voiceQueue/voiceQueue.attributes.js
+++ b/server/api/voiceQueue/voiceQueue.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceQueue/voiceQueue.controller.js b/server/api/voiceQueue/voiceQueue.controller.js
index 567d424..353414d 100644
--- a/server/api/voiceQueue/voiceQueue.controller.js
+++ b/server/api/voiceQueue/voiceQueue.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceQueue/voiceQueue.events.js b/server/api/voiceQueue/voiceQueue.events.js
index 1d3b40c..c751806 100644
--- a/server/api/voiceQueue/voiceQueue.events.js
+++ b/server/api/voiceQueue/voiceQueue.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceQueue/voiceQueue.model.js b/server/api/voiceQueue/voiceQueue.model.js
index c9fc0b3..ec23594 100644
--- a/server/api/voiceQueue/voiceQueue.model.js
+++ b/server/api/voiceQueue/voiceQueue.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceQueue/voiceQueue.rpc.js b/server/api/voiceQueue/voiceQueue.rpc.js
index 3e27c76..d5dfa53 100644
--- a/server/api/voiceQueue/voiceQueue.rpc.js
+++ b/server/api/voiceQueue/voiceQueue.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceQueue/voiceQueue.socket.js b/server/api/voiceQueue/voiceQueue.socket.js
index b8f5dfc..a89b344 100644
--- a/server/api/voiceQueue/voiceQueue.socket.js
+++ b/server/api/voiceQueue/voiceQueue.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceQueueReport/index.js b/server/api/voiceQueueReport/index.js
index 0fbcb34..9686bbe 100644
--- a/server/api/voiceQueueReport/index.js
+++ b/server/api/voiceQueueReport/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceQueueReport/voiceQueueReport.attributes.js b/server/api/voiceQueueReport/voiceQueueReport.attributes.js
index 3105e12..8a9ce30 100644
--- a/server/api/voiceQueueReport/voiceQueueReport.attributes.js
+++ b/server/api/voiceQueueReport/voiceQueueReport.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceQueueReport/voiceQueueReport.controller.js b/server/api/voiceQueueReport/voiceQueueReport.controller.js
index 3ccc6d2..8096b4c 100644
--- a/server/api/voiceQueueReport/voiceQueueReport.controller.js
+++ b/server/api/voiceQueueReport/voiceQueueReport.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceQueueReport/voiceQueueReport.events.js b/server/api/voiceQueueReport/voiceQueueReport.events.js
index 14a3242..b0b625b 100644
--- a/server/api/voiceQueueReport/voiceQueueReport.events.js
+++ b/server/api/voiceQueueReport/voiceQueueReport.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceQueueReport/voiceQueueReport.model.js b/server/api/voiceQueueReport/voiceQueueReport.model.js
index af58f99..70dd939 100644
--- a/server/api/voiceQueueReport/voiceQueueReport.model.js
+++ b/server/api/voiceQueueReport/voiceQueueReport.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceQueueReport/voiceQueueReport.rpc.js b/server/api/voiceQueueReport/voiceQueueReport.rpc.js
index b5cee63..8b09c68 100644
--- a/server/api/voiceQueueReport/voiceQueueReport.rpc.js
+++ b/server/api/voiceQueueReport/voiceQueueReport.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceQueueReport/voiceQueueReport.socket.js b/server/api/voiceQueueReport/voiceQueueReport.socket.js
index 1b9f0ed..743cd65 100644
--- a/server/api/voiceQueueReport/voiceQueueReport.socket.js
+++ b/server/api/voiceQueueReport/voiceQueueReport.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceQueuesLog/index.js b/server/api/voiceQueuesLog/index.js
index 71745d2..a6ac75e 100644
--- a/server/api/voiceQueuesLog/index.js
+++ b/server/api/voiceQueuesLog/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceQueuesLog/voiceQueuesLog.attributes.js b/server/api/voiceQueuesLog/voiceQueuesLog.attributes.js
index 71ac387..d9f1ddc 100644
--- a/server/api/voiceQueuesLog/voiceQueuesLog.attributes.js
+++ b/server/api/voiceQueuesLog/voiceQueuesLog.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceQueuesLog/voiceQueuesLog.controller.js b/server/api/voiceQueuesLog/voiceQueuesLog.controller.js
index cc0fa6c..6d8e6e5 100644
--- a/server/api/voiceQueuesLog/voiceQueuesLog.controller.js
+++ b/server/api/voiceQueuesLog/voiceQueuesLog.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceQueuesLog/voiceQueuesLog.model.js b/server/api/voiceQueuesLog/voiceQueuesLog.model.js
index 7fdf3e3..3c47f30 100644
--- a/server/api/voiceQueuesLog/voiceQueuesLog.model.js
+++ b/server/api/voiceQueuesLog/voiceQueuesLog.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceRecording/index.js b/server/api/voiceRecording/index.js
index 919215d..90ff57a 100644
--- a/server/api/voiceRecording/index.js
+++ b/server/api/voiceRecording/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceRecording/voiceRecording.attributes.js b/server/api/voiceRecording/voiceRecording.attributes.js
index 08e64f6..7750f6a 100644
--- a/server/api/voiceRecording/voiceRecording.attributes.js
+++ b/server/api/voiceRecording/voiceRecording.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceRecording/voiceRecording.controller.js b/server/api/voiceRecording/voiceRecording.controller.js
index 11c5f35..a54c936 100644
--- a/server/api/voiceRecording/voiceRecording.controller.js
+++ b/server/api/voiceRecording/voiceRecording.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceRecording/voiceRecording.model.js b/server/api/voiceRecording/voiceRecording.model.js
index 7272039..9500511 100644
--- a/server/api/voiceRecording/voiceRecording.model.js
+++ b/server/api/voiceRecording/voiceRecording.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceRecording/voiceRecording.rpc.js b/server/api/voiceRecording/voiceRecording.rpc.js
index 066d454..8e77138 100644
--- a/server/api/voiceRecording/voiceRecording.rpc.js
+++ b/server/api/voiceRecording/voiceRecording.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceTransferReport/index.js b/server/api/voiceTransferReport/index.js
index fed7c1c..201a8c1 100644
--- a/server/api/voiceTransferReport/index.js
+++ b/server/api/voiceTransferReport/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceTransferReport/voiceTransferReport.attributes.js b/server/api/voiceTransferReport/voiceTransferReport.attributes.js
index 35a3d9b..abe87cc 100644
--- a/server/api/voiceTransferReport/voiceTransferReport.attributes.js
+++ b/server/api/voiceTransferReport/voiceTransferReport.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceTransferReport/voiceTransferReport.controller.js b/server/api/voiceTransferReport/voiceTransferReport.controller.js
index 676fe5e..d96d1ac 100644
--- a/server/api/voiceTransferReport/voiceTransferReport.controller.js
+++ b/server/api/voiceTransferReport/voiceTransferReport.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceTransferReport/voiceTransferReport.model.js b/server/api/voiceTransferReport/voiceTransferReport.model.js
index b411902..e5ae543 100644
--- a/server/api/voiceTransferReport/voiceTransferReport.model.js
+++ b/server/api/voiceTransferReport/voiceTransferReport.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/voiceTransferReport/voiceTransferReport.rpc.js b/server/api/voiceTransferReport/voiceTransferReport.rpc.js
index 4fe18a1..aeaaf29 100644
--- a/server/api/voiceTransferReport/voiceTransferReport.rpc.js
+++ b/server/api/voiceTransferReport/voiceTransferReport.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/webbar/index.js b/server/api/webbar/index.js
index dc49dfe..93d4eba 100644
--- a/server/api/webbar/index.js
+++ b/server/api/webbar/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/webbar/webbar.controller.js b/server/api/webbar/webbar.controller.js
index d05803c..a5deaa5 100644
--- a/server/api/webbar/webbar.controller.js
+++ b/server/api/webbar/webbar.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappAccount/index.js b/server/api/whatsappAccount/index.js
index 2448bd1..5e7e0e5 100644
--- a/server/api/whatsappAccount/index.js
+++ b/server/api/whatsappAccount/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappAccount/whatsappAccount.attributes.js b/server/api/whatsappAccount/whatsappAccount.attributes.js
index f885ad5..e6124c4 100644
--- a/server/api/whatsappAccount/whatsappAccount.attributes.js
+++ b/server/api/whatsappAccount/whatsappAccount.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappAccount/whatsappAccount.controller.js b/server/api/whatsappAccount/whatsappAccount.controller.js
index 0db347d..f79849f 100644
--- a/server/api/whatsappAccount/whatsappAccount.controller.js
+++ b/server/api/whatsappAccount/whatsappAccount.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappAccount/whatsappAccount.events.js b/server/api/whatsappAccount/whatsappAccount.events.js
index 381f5b5..9bc245d 100644
--- a/server/api/whatsappAccount/whatsappAccount.events.js
+++ b/server/api/whatsappAccount/whatsappAccount.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappAccount/whatsappAccount.model.js b/server/api/whatsappAccount/whatsappAccount.model.js
index 4e17082..dbec393 100644
--- a/server/api/whatsappAccount/whatsappAccount.model.js
+++ b/server/api/whatsappAccount/whatsappAccount.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappAccount/whatsappAccount.rpc.js b/server/api/whatsappAccount/whatsappAccount.rpc.js
index 5393d65..450996b 100644
--- a/server/api/whatsappAccount/whatsappAccount.rpc.js
+++ b/server/api/whatsappAccount/whatsappAccount.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappAccount/whatsappAccount.socket.js b/server/api/whatsappAccount/whatsappAccount.socket.js
index 3c60c9b..8d94618 100644
--- a/server/api/whatsappAccount/whatsappAccount.socket.js
+++ b/server/api/whatsappAccount/whatsappAccount.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappApplication/index.js b/server/api/whatsappApplication/index.js
index c9df784..6d5e31f 100644
--- a/server/api/whatsappApplication/index.js
+++ b/server/api/whatsappApplication/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappApplication/whatsappApplication.attributes.js b/server/api/whatsappApplication/whatsappApplication.attributes.js
index e96b247..8b9d5ab 100644
--- a/server/api/whatsappApplication/whatsappApplication.attributes.js
+++ b/server/api/whatsappApplication/whatsappApplication.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappApplication/whatsappApplication.controller.js b/server/api/whatsappApplication/whatsappApplication.controller.js
index 3159106..2873edb 100644
--- a/server/api/whatsappApplication/whatsappApplication.controller.js
+++ b/server/api/whatsappApplication/whatsappApplication.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappApplication/whatsappApplication.model.js b/server/api/whatsappApplication/whatsappApplication.model.js
index 77abade..0e50ab6 100644
--- a/server/api/whatsappApplication/whatsappApplication.model.js
+++ b/server/api/whatsappApplication/whatsappApplication.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappInteraction/index.js b/server/api/whatsappInteraction/index.js
index 5893dfb..b3d2b3d 100644
--- a/server/api/whatsappInteraction/index.js
+++ b/server/api/whatsappInteraction/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappInteraction/whatsappInteraction.attributes.js b/server/api/whatsappInteraction/whatsappInteraction.attributes.js
index 94963fd..8ff1903 100644
--- a/server/api/whatsappInteraction/whatsappInteraction.attributes.js
+++ b/server/api/whatsappInteraction/whatsappInteraction.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappInteraction/whatsappInteraction.controller.js b/server/api/whatsappInteraction/whatsappInteraction.controller.js
index b646934..06fa3c4 100644
--- a/server/api/whatsappInteraction/whatsappInteraction.controller.js
+++ b/server/api/whatsappInteraction/whatsappInteraction.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappInteraction/whatsappInteraction.events.js b/server/api/whatsappInteraction/whatsappInteraction.events.js
index 2b1408f..e857bc2 100644
--- a/server/api/whatsappInteraction/whatsappInteraction.events.js
+++ b/server/api/whatsappInteraction/whatsappInteraction.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappInteraction/whatsappInteraction.model.js b/server/api/whatsappInteraction/whatsappInteraction.model.js
index 6338702..95e93d3 100644
--- a/server/api/whatsappInteraction/whatsappInteraction.model.js
+++ b/server/api/whatsappInteraction/whatsappInteraction.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappInteraction/whatsappInteraction.rpc.js b/server/api/whatsappInteraction/whatsappInteraction.rpc.js
index 3cec0dd..4f9fd72 100644
--- a/server/api/whatsappInteraction/whatsappInteraction.rpc.js
+++ b/server/api/whatsappInteraction/whatsappInteraction.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappInteraction/whatsappInteraction.socket.js b/server/api/whatsappInteraction/whatsappInteraction.socket.js
index d356e0d..a0b8649 100644
--- a/server/api/whatsappInteraction/whatsappInteraction.socket.js
+++ b/server/api/whatsappInteraction/whatsappInteraction.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappMessage/index.js b/server/api/whatsappMessage/index.js
index 6ce4900..9a78397 100644
--- a/server/api/whatsappMessage/index.js
+++ b/server/api/whatsappMessage/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappMessage/whatsappMessage.attributes.js b/server/api/whatsappMessage/whatsappMessage.attributes.js
index d0131bf..1bd718f 100644
--- a/server/api/whatsappMessage/whatsappMessage.attributes.js
+++ b/server/api/whatsappMessage/whatsappMessage.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappMessage/whatsappMessage.controller.js b/server/api/whatsappMessage/whatsappMessage.controller.js
index 968be10..12afa55 100644
--- a/server/api/whatsappMessage/whatsappMessage.controller.js
+++ b/server/api/whatsappMessage/whatsappMessage.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappMessage/whatsappMessage.events.js b/server/api/whatsappMessage/whatsappMessage.events.js
index 9d9e19f..84c1204 100644
--- a/server/api/whatsappMessage/whatsappMessage.events.js
+++ b/server/api/whatsappMessage/whatsappMessage.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappMessage/whatsappMessage.model.js b/server/api/whatsappMessage/whatsappMessage.model.js
index 50c3c2b..e090038 100644
--- a/server/api/whatsappMessage/whatsappMessage.model.js
+++ b/server/api/whatsappMessage/whatsappMessage.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappMessage/whatsappMessage.rpc.js b/server/api/whatsappMessage/whatsappMessage.rpc.js
index 8a3eced..101e743 100644
--- a/server/api/whatsappMessage/whatsappMessage.rpc.js
+++ b/server/api/whatsappMessage/whatsappMessage.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappMessage/whatsappMessage.socket.js b/server/api/whatsappMessage/whatsappMessage.socket.js
index c94f30b..31ce97d 100644
--- a/server/api/whatsappMessage/whatsappMessage.socket.js
+++ b/server/api/whatsappMessage/whatsappMessage.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappQueue/index.js b/server/api/whatsappQueue/index.js
index ea32872..82df4ba 100644
--- a/server/api/whatsappQueue/index.js
+++ b/server/api/whatsappQueue/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappQueue/whatsappQueue.attributes.js b/server/api/whatsappQueue/whatsappQueue.attributes.js
index 2de75d0..1f41311 100644
--- a/server/api/whatsappQueue/whatsappQueue.attributes.js
+++ b/server/api/whatsappQueue/whatsappQueue.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappQueue/whatsappQueue.controller.js b/server/api/whatsappQueue/whatsappQueue.controller.js
index 9f1672d..f47a97f 100644
--- a/server/api/whatsappQueue/whatsappQueue.controller.js
+++ b/server/api/whatsappQueue/whatsappQueue.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappQueue/whatsappQueue.events.js b/server/api/whatsappQueue/whatsappQueue.events.js
index 73d0344..e24c6df 100644
--- a/server/api/whatsappQueue/whatsappQueue.events.js
+++ b/server/api/whatsappQueue/whatsappQueue.events.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappQueue/whatsappQueue.model.js b/server/api/whatsappQueue/whatsappQueue.model.js
index 89cec89..227b990 100644
--- a/server/api/whatsappQueue/whatsappQueue.model.js
+++ b/server/api/whatsappQueue/whatsappQueue.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappQueue/whatsappQueue.rpc.js b/server/api/whatsappQueue/whatsappQueue.rpc.js
index 805e895..1a2ee77 100644
--- a/server/api/whatsappQueue/whatsappQueue.rpc.js
+++ b/server/api/whatsappQueue/whatsappQueue.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappQueue/whatsappQueue.socket.js b/server/api/whatsappQueue/whatsappQueue.socket.js
index 36692b3..b1771b6 100644
--- a/server/api/whatsappQueue/whatsappQueue.socket.js
+++ b/server/api/whatsappQueue/whatsappQueue.socket.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappQueueReport/index.js b/server/api/whatsappQueueReport/index.js
index b363e56..5625e26 100644
--- a/server/api/whatsappQueueReport/index.js
+++ b/server/api/whatsappQueueReport/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappQueueReport/whatsappQueueReport.attributes.js b/server/api/whatsappQueueReport/whatsappQueueReport.attributes.js
index 0f61c2c..1948ba6 100644
--- a/server/api/whatsappQueueReport/whatsappQueueReport.attributes.js
+++ b/server/api/whatsappQueueReport/whatsappQueueReport.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappQueueReport/whatsappQueueReport.controller.js b/server/api/whatsappQueueReport/whatsappQueueReport.controller.js
index bf685cd..b4a3a59 100644
--- a/server/api/whatsappQueueReport/whatsappQueueReport.controller.js
+++ b/server/api/whatsappQueueReport/whatsappQueueReport.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappQueueReport/whatsappQueueReport.model.js b/server/api/whatsappQueueReport/whatsappQueueReport.model.js
index dd2f228..4f1ab3c 100644
--- a/server/api/whatsappQueueReport/whatsappQueueReport.model.js
+++ b/server/api/whatsappQueueReport/whatsappQueueReport.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappQueueReport/whatsappQueueReport.rpc.js b/server/api/whatsappQueueReport/whatsappQueueReport.rpc.js
index c5e9dca..6cfab6b 100644
--- a/server/api/whatsappQueueReport/whatsappQueueReport.rpc.js
+++ b/server/api/whatsappQueueReport/whatsappQueueReport.rpc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappTransferReport/index.js b/server/api/whatsappTransferReport/index.js
index a7c3282..9abedc9 100644
--- a/server/api/whatsappTransferReport/index.js
+++ b/server/api/whatsappTransferReport/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappTransferReport/whatsappTransferReport.attributes.js b/server/api/whatsappTransferReport/whatsappTransferReport.attributes.js
index ae49f29..16e2a0b 100644
--- a/server/api/whatsappTransferReport/whatsappTransferReport.attributes.js
+++ b/server/api/whatsappTransferReport/whatsappTransferReport.attributes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappTransferReport/whatsappTransferReport.controller.js b/server/api/whatsappTransferReport/whatsappTransferReport.controller.js
index 2ab5748..ec728bc 100644
--- a/server/api/whatsappTransferReport/whatsappTransferReport.controller.js
+++ b/server/api/whatsappTransferReport/whatsappTransferReport.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/api/whatsappTransferReport/whatsappTransferReport.model.js b/server/api/whatsappTransferReport/whatsappTransferReport.model.js
index 611336f..ba9d7c5 100644
--- a/server/api/whatsappTransferReport/whatsappTransferReport.model.js
+++ b/server/api/whatsappTransferReport/whatsappTransferReport.model.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/app.js b/server/app.js
index 78ed5db..5f74c2f 100644
--- a/server/app.js
+++ b/server/app.js
@@ -15,4 +15,4 @@
 // * treaties. The SOFTWARE PRODUCT is licensed, not sold. 		           *
 // *                                                                       *
 // *************************************************************************
\ No newline at end of file
\ No newline at end of file
diff --git a/server/components/auth/service.js b/server/components/auth/service.js
index 9e9255b..c73e322 100644
--- a/server/components/auth/service.js
+++ b/server/components/auth/service.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/components/encryptor/create-cypher-fallback.js b/server/components/encryptor/create-cypher-fallback.js
index b9d3a65..2018d2b 100644
--- a/server/components/encryptor/create-cypher-fallback.js
+++ b/server/components/encryptor/create-cypher-fallback.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/components/encryptor/index.js b/server/components/encryptor/index.js
index ba3cf76..2f542b5 100644
--- a/server/components/encryptor/index.js
+++ b/server/components/encryptor/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/components/export/csv.js b/server/components/export/csv.js
index 9efb66e..7b0895b 100644
--- a/server/components/export/csv.js
+++ b/server/components/export/csv.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/components/export/pdf.js b/server/components/export/pdf.js
index 35f47e1..4b6dc3e 100644
--- a/server/components/export/pdf.js
+++ b/server/components/export/pdf.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/components/export/xlsx.js b/server/components/export/xlsx.js
index 3f29947..00b624e 100644
--- a/server/components/export/xlsx.js
+++ b/server/components/export/xlsx.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/components/extensions/rewrite.js b/server/components/extensions/rewrite.js
index c251074..0e9e217 100644
--- a/server/components/extensions/rewrite.js
+++ b/server/components/extensions/rewrite.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/components/import/cm/csv.js b/server/components/import/cm/csv.js
index 004fda5..59fe150 100644
--- a/server/components/import/cm/csv.js
+++ b/server/components/import/cm/csv.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/components/import/cm/csv2.js b/server/components/import/cm/csv2.js
index 4456188..10b7635 100644
--- a/server/components/import/cm/csv2.js
+++ b/server/components/import/cm/csv2.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/components/integrations/configuration.js b/server/components/integrations/configuration.js
index 5c623a1..8959784 100644
--- a/server/components/integrations/configuration.js
+++ b/server/components/integrations/configuration.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/components/interaction/service.js b/server/components/interaction/service.js
index 46b4f8c..e98085e 100644
--- a/server/components/interaction/service.js
+++ b/server/components/interaction/service.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/components/license/service.js b/server/components/license/service.js
index aa42941..c4e5370 100644
--- a/server/components/license/service.js
+++ b/server/components/license/service.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/components/parsers/advancedSearch.js b/server/components/parsers/advancedSearch.js
index b88bd96..6c3d4a7 100644
--- a/server/components/parsers/advancedSearch.js
+++ b/server/components/parsers/advancedSearch.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/components/parsers/qs.js b/server/components/parsers/qs.js
index 557ec8f..fb8b39c 100644
--- a/server/components/parsers/qs.js
+++ b/server/components/parsers/qs.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/config.service.js b/server/config/config.service.js
index ae67c6a..33c91da 100644
--- a/server/config/config.service.js
+++ b/server/config/config.service.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/environment/development.js b/server/config/environment/development.js
index 955cccd..8c86ac0 100644
--- a/server/config/environment/development.js
+++ b/server/config/environment/development.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/environment/index.js b/server/config/environment/index.js
index c6effd0..199615b 100644
--- a/server/config/environment/index.js
+++ b/server/config/environment/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/environment/shared.js b/server/config/environment/shared.js
index 048de9f..a1ccacd 100644
--- a/server/config/environment/shared.js
+++ b/server/config/environment/shared.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/environment/test.js b/server/config/environment/test.js
index 5b1de7e..5529541 100644
--- a/server/config/environment/test.js
+++ b/server/config/environment/test.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/express.js b/server/config/express.js
index 426ae50..001e5e0 100644
--- a/server/config/express.js
+++ b/server/config/express.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/license/hardware.js b/server/config/license/hardware.js
index 77cc570..2b60fc2 100644
--- a/server/config/license/hardware.js
+++ b/server/config/license/hardware.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/license/index.js b/server/config/license/index.js
index a6a346c..cfeb656 100644
--- a/server/config/license/index.js
+++ b/server/config/license/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/license/util.js b/server/config/license/util.js
index ec85919..eee65df 100644
--- a/server/config/license/util.js
+++ b/server/config/license/util.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/local.env.js b/server/config/local.env.js
index 6c7bbb6..a5cb026 100644
--- a/server/config/local.env.js
+++ b/server/config/local.env.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/logger.js b/server/config/logger.js
index bbda765..f82fecf 100644
--- a/server/config/logger.js
+++ b/server/config/logger.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/pm2/config.js b/server/config/pm2/config.js
index 7301c10..7d623b2 100644
--- a/server/config/pm2/config.js
+++ b/server/config/pm2/config.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/pm2/index.js b/server/config/pm2/index.js
index ddac164..6b36584 100644
--- a/server/config/pm2/index.js
+++ b/server/config/pm2/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/schedule/chat.js b/server/config/schedule/chat.js
index 298cb33..cc656f8 100644
--- a/server/config/schedule/chat.js
+++ b/server/config/schedule/chat.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/schedule/index.js b/server/config/schedule/index.js
index cef16ab..c400fab 100644
--- a/server/config/schedule/index.js
+++ b/server/config/schedule/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/schedule/transcribe.js b/server/config/schedule/transcribe.js
index 4284192..f8761bb 100644
--- a/server/config/schedule/transcribe.js
+++ b/server/config/schedule/transcribe.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedContact.js b/server/config/seedContact.js
index 31f4d5c..45e5764 100644
--- a/server/config/seedContact.js
+++ b/server/config/seedContact.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/analyticReports.js b/server/config/seedDB/analyticReports.js
index 7329f07..65d6458 100644
--- a/server/config/seedDB/analyticReports.js
+++ b/server/config/seedDB/analyticReports.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/analyticTreeReports.js b/server/config/seedDB/analyticTreeReports.js
index 4e5c7d0..7da4424 100644
--- a/server/config/seedDB/analyticTreeReports.js
+++ b/server/config/seedDB/analyticTreeReports.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/chanspy.js b/server/config/seedDB/chanspy.js
index 1967147..d3544a4 100644
--- a/server/config/seedDB/chanspy.js
+++ b/server/config/seedDB/chanspy.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/companies.js b/server/config/seedDB/companies.js
index a6e4eea..ad9c800 100644
--- a/server/config/seedDB/companies.js
+++ b/server/config/seedDB/companies.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/contacts.js b/server/config/seedDB/contacts.js
index fe7e46b..c544b7a 100644
--- a/server/config/seedDB/contacts.js
+++ b/server/config/seedDB/contacts.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/dispositions.js b/server/config/seedDB/dispositions.js
index c9dcbbd..0307964 100644
--- a/server/config/seedDB/dispositions.js
+++ b/server/config/seedDB/dispositions.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/index.js b/server/config/seedDB/index.js
index 3058047..caf0a64 100644
--- a/server/config/seedDB/index.js
+++ b/server/config/seedDB/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/intervals.js b/server/config/seedDB/intervals.js
index 7d08e0c..6610546 100644
--- a/server/config/seedDB/intervals.js
+++ b/server/config/seedDB/intervals.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/jscriptyProjects.js b/server/config/seedDB/jscriptyProjects.js
index 0b25f8b..c7388fd 100644
--- a/server/config/seedDB/jscriptyProjects.js
+++ b/server/config/seedDB/jscriptyProjects.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/lists.js b/server/config/seedDB/lists.js
index 62643d9..72ca5b7 100644
--- a/server/config/seedDB/lists.js
+++ b/server/config/seedDB/lists.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/mailAccounts.js b/server/config/seedDB/mailAccounts.js
index 26e3b21..f00854d 100644
--- a/server/config/seedDB/mailAccounts.js
+++ b/server/config/seedDB/mailAccounts.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/mailSubstatuses.js b/server/config/seedDB/mailSubstatuses.js
index 8259690..d3b465d 100644
--- a/server/config/seedDB/mailSubstatuses.js
+++ b/server/config/seedDB/mailSubstatuses.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/migrations.js b/server/config/seedDB/migrations.js
index 3e23187..3c3907e 100644
--- a/server/config/seedDB/migrations.js
+++ b/server/config/seedDB/migrations.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/pauses.js b/server/config/seedDB/pauses.js
index e44406e..c0b5bc0 100644
--- a/server/config/seedDB/pauses.js
+++ b/server/config/seedDB/pauses.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/report/default.js b/server/config/seedDB/report/default.js
index e8a4238..851c667 100644
--- a/server/config/seedDB/report/default.js
+++ b/server/config/seedDB/report/default.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/report/fields.js b/server/config/seedDB/report/fields.js
index 25aa1a7..b4260ba 100644
--- a/server/config/seedDB/report/fields.js
+++ b/server/config/seedDB/report/fields.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/report/index.js b/server/config/seedDB/report/index.js
index 7436fad..2a58cd7 100644
--- a/server/config/seedDB/report/index.js
+++ b/server/config/seedDB/report/index.js
@@ -1 +1 @@
-var a870_0x4a4e=['./fields','./default','exports'];(function(_0x1d9d26,_0x4a4e6a){var _0x1f2e29=function(_0x425873){while(--_0x425873){_0x1d9d26['push'](_0x1d9d26['shift']());}};_0x1f2e29(++_0x4a4e6a);}(a870_0x4a4e,0x18e));var a870_0x1f2e=function(_0x1d9d26,_0x4a4e6a){_0x1d9d26=_0x1d9d26-0x0;var _0x1f2e29=a870_0x4a4e[_0x1d9d26];return _0x1f2e29;};var _0x3b1654=a870_0x1f2e;'use strict';module[_0x3b1654('0x0')]={'default':require(_0x3b1654('0x2')),'fields':require(_0x3b1654('0x1'))};
\ No newline at end of file
+var a870_0x3724=['exports','./default','./fields'];(function(_0x2016f0,_0x3724f8){var _0x1d1224=function(_0xb8af37){while(--_0xb8af37){_0x2016f0['push'](_0x2016f0['shift']());}};_0x1d1224(++_0x3724f8);}(a870_0x3724,0xe1));var a870_0x1d12=function(_0x2016f0,_0x3724f8){_0x2016f0=_0x2016f0-0x0;var _0x1d1224=a870_0x3724[_0x2016f0];return _0x1d1224;};var _0x447f0c=a870_0x1d12;'use strict';module[_0x447f0c('0x0')]={'default':require(_0x447f0c('0x1')),'fields':require(_0x447f0c('0x2'))};
\ No newline at end of file
diff --git a/server/config/seedDB/sounds.js b/server/config/seedDB/sounds.js
index c980469..cdb681a 100644
--- a/server/config/seedDB/sounds.js
+++ b/server/config/seedDB/sounds.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/squareOdbc.js b/server/config/seedDB/squareOdbc.js
index e187fb6..aa6b238 100644
--- a/server/config/seedDB/squareOdbc.js
+++ b/server/config/seedDB/squareOdbc.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/squareProjects.js b/server/config/seedDB/squareProjects.js
index f28586b..c8990c7 100644
--- a/server/config/seedDB/squareProjects.js
+++ b/server/config/seedDB/squareProjects.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/tags.js b/server/config/seedDB/tags.js
index debbb04..5f72f2c 100644
--- a/server/config/seedDB/tags.js
+++ b/server/config/seedDB/tags.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/teams.js b/server/config/seedDB/teams.js
index 620162a..b3c5495 100644
--- a/server/config/seedDB/teams.js
+++ b/server/config/seedDB/teams.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/tree/index.js b/server/config/seedDB/tree/index.js
index feb14a7..1ff3394 100644
--- a/server/config/seedDB/tree/index.js
+++ b/server/config/seedDB/tree/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/trunks.js b/server/config/seedDB/trunks.js
index 8d39ef1..2dca671 100644
--- a/server/config/seedDB/trunks.js
+++ b/server/config/seedDB/trunks.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/userProfiles.js b/server/config/seedDB/userProfiles.js
index 8e9a158..04051f9 100644
--- a/server/config/seedDB/userProfiles.js
+++ b/server/config/seedDB/userProfiles.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/users.js b/server/config/seedDB/users.js
index 3c68960..c66f022 100644
--- a/server/config/seedDB/users.js
+++ b/server/config/seedDB/users.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/variables.js b/server/config/seedDB/variables.js
index 4426d2d..371263c 100644
--- a/server/config/seedDB/variables.js
+++ b/server/config/seedDB/variables.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/voiceContexts.js b/server/config/seedDB/voiceContexts.js
index 54b5074..7e38651 100644
--- a/server/config/seedDB/voiceContexts.js
+++ b/server/config/seedDB/voiceContexts.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/voiceExtensions.js b/server/config/seedDB/voiceExtensions.js
index 3e40a13..fb41497 100644
--- a/server/config/seedDB/voiceExtensions.js
+++ b/server/config/seedDB/voiceExtensions.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/voiceMusicOnHold.js b/server/config/seedDB/voiceMusicOnHold.js
index 976dd18..09aac32 100644
--- a/server/config/seedDB/voiceMusicOnHold.js
+++ b/server/config/seedDB/voiceMusicOnHold.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedDB/voiceQueues.js b/server/config/seedDB/voiceQueues.js
index 8e9d793..ef81478 100644
--- a/server/config/seedDB/voiceQueues.js
+++ b/server/config/seedDB/voiceQueues.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/seedUsers.js b/server/config/seedUsers.js
index 4455536..f0714c0 100644
--- a/server/config/seedUsers.js
+++ b/server/config/seedUsers.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/socketio.js b/server/config/socketio.js
index be09815..77c783a 100644
--- a/server/config/socketio.js
+++ b/server/config/socketio.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/triggers/index.js b/server/config/triggers/index.js
index 0b44791..584bb36 100644
--- a/server/config/triggers/index.js
+++ b/server/config/triggers/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/config/utils.js b/server/config/utils.js
index e99e312..9333155 100644
--- a/server/config/utils.js
+++ b/server/config/utils.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/errors/index.js b/server/errors/index.js
index ea4f575..b891c04 100644
--- a/server/errors/index.js
+++ b/server/errors/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/globals.js b/server/globals.js
index f1b22c6..b6b1b48 100644
--- a/server/globals.js
+++ b/server/globals.js
@@ -1 +1 @@
-const a890_0x487e=['resolve','path'];(function(_0x557f5e,_0x487e02){const _0x2b7a96=function(_0x3faa90){while(--_0x3faa90){_0x557f5e['push'](_0x557f5e['shift']());}};_0x2b7a96(++_0x487e02);}(a890_0x487e,0x12e));const a890_0x2b7a=function(_0x557f5e,_0x487e02){_0x557f5e=_0x557f5e-0x0;let _0x2b7a96=a890_0x487e[_0x557f5e];return _0x2b7a96;};const _0x499d3d=a890_0x2b7a,path=require(_0x499d3d('0x1'));global['appRoot']=path[_0x499d3d('0x0')](__dirname);
\ No newline at end of file
+const a890_0x4632=['resolve','path','appRoot'];(function(_0x21aa03,_0x46326a){const _0x5ecb63=function(_0x114af4){while(--_0x114af4){_0x21aa03['push'](_0x21aa03['shift']());}};_0x5ecb63(++_0x46326a);}(a890_0x4632,0x150));const a890_0x5ecb=function(_0x21aa03,_0x46326a){_0x21aa03=_0x21aa03-0x0;let _0x5ecb63=a890_0x4632[_0x21aa03];return _0x5ecb63;};const _0x460888=a890_0x5ecb,path=require(_0x460888('0x1'));global[_0x460888('0x2')]=path[_0x460888('0x0')](__dirname);
\ No newline at end of file
diff --git a/server/migrations/2.0.12.js b/server/migrations/2.0.12.js
index 388eee7..2fad00a 100644
--- a/server/migrations/2.0.12.js
+++ b/server/migrations/2.0.12.js
@@ -1 +1 @@
-var a891_0x3f6b=['exports'];(function(_0x1c3482,_0x3f6b77){var _0x1c1b7f=function(_0x2c3ac5){while(--_0x2c3ac5){_0x1c3482['push'](_0x1c3482['shift']());}};_0x1c1b7f(++_0x3f6b77);}(a891_0x3f6b,0xdb));var a891_0x1c1b=function(_0x1c3482,_0x3f6b77){_0x1c3482=_0x1c3482-0x0;var _0x1c1b7f=a891_0x3f6b[_0x1c3482];return _0x1c1b7f;};var _0x417beb=a891_0x1c1b;'use strict';module[_0x417beb('0x0')]={'up':function(){},'down':function(){}};
\ No newline at end of file
+var a891_0x1638=['exports'];(function(_0x15c45e,_0x163889){var _0x1ac345=function(_0x370a00){while(--_0x370a00){_0x15c45e['push'](_0x15c45e['shift']());}};_0x1ac345(++_0x163889);}(a891_0x1638,0x7c));var a891_0x1ac3=function(_0x15c45e,_0x163889){_0x15c45e=_0x15c45e-0x0;var _0x1ac345=a891_0x1638[_0x15c45e];return _0x1ac345;};var _0x1292d2=a891_0x1ac3;'use strict';module[_0x1292d2('0x0')]={'up':function(){},'down':function(){}};
\ No newline at end of file
diff --git a/server/migrations/2.0.13.js b/server/migrations/2.0.13.js
index 937aec9..5d8ea33 100644
--- a/server/migrations/2.0.13.js
+++ b/server/migrations/2.0.13.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.14.js b/server/migrations/2.0.14.js
index 16fa29a..12143c4 100644
--- a/server/migrations/2.0.14.js
+++ b/server/migrations/2.0.14.js
@@ -1 +1 @@
-var a893_0x53e4=['exports'];(function(_0x46031b,_0x53e495){var _0x1038f3=function(_0x3fb441){while(--_0x3fb441){_0x46031b['push'](_0x46031b['shift']());}};_0x1038f3(++_0x53e495);}(a893_0x53e4,0x1aa));var a893_0x1038=function(_0x46031b,_0x53e495){_0x46031b=_0x46031b-0x0;var _0x1038f3=a893_0x53e4[_0x46031b];return _0x1038f3;};var _0x1696e5=a893_0x1038;'use strict';module[_0x1696e5('0x0')]={'up':function(){},'down':function(){}};
\ No newline at end of file
+'use strict';module['exports']={'up':function(){},'down':function(){}};
\ No newline at end of file
diff --git a/server/migrations/2.0.15.js b/server/migrations/2.0.15.js
index e345fd8..12143c4 100644
--- a/server/migrations/2.0.15.js
+++ b/server/migrations/2.0.15.js
@@ -1 +1 @@
-var a894_0x56c7=['exports'];(function(_0x584fc5,_0x56c7be){var _0x44d755=function(_0xe0c305){while(--_0xe0c305){_0x584fc5['push'](_0x584fc5['shift']());}};_0x44d755(++_0x56c7be);}(a894_0x56c7,0x12e));var a894_0x44d7=function(_0x584fc5,_0x56c7be){_0x584fc5=_0x584fc5-0x0;var _0x44d755=a894_0x56c7[_0x584fc5];return _0x44d755;};var _0x1723c3=a894_0x44d7;'use strict';module[_0x1723c3('0x0')]={'up':function(){},'down':function(){}};
\ No newline at end of file
+'use strict';module['exports']={'up':function(){},'down':function(){}};
\ No newline at end of file
diff --git a/server/migrations/2.0.16.js b/server/migrations/2.0.16.js
index 6e40955..d2e6449 100644
--- a/server/migrations/2.0.16.js
+++ b/server/migrations/2.0.16.js
@@ -1 +1 @@
-var a895_0x58f9=['exports'];(function(_0x48ced6,_0x58f9f6){var _0x589b9f=function(_0x20d021){while(--_0x20d021){_0x48ced6['push'](_0x48ced6['shift']());}};_0x589b9f(++_0x58f9f6);}(a895_0x58f9,0xf6));var a895_0x589b=function(_0x48ced6,_0x58f9f6){_0x48ced6=_0x48ced6-0x0;var _0x589b9f=a895_0x58f9[_0x48ced6];return _0x589b9f;};var _0x5bc107=a895_0x589b;'use strict';module[_0x5bc107('0x0')]={'up':function(){},'down':function(){}};
\ No newline at end of file
+var a895_0xac76=['exports'];(function(_0x1a8578,_0xac76d6){var _0x2973e2=function(_0xc63c15){while(--_0xc63c15){_0x1a8578['push'](_0x1a8578['shift']());}};_0x2973e2(++_0xac76d6);}(a895_0xac76,0x1bc));var a895_0x2973=function(_0x1a8578,_0xac76d6){_0x1a8578=_0x1a8578-0x0;var _0x2973e2=a895_0xac76[_0x1a8578];return _0x2973e2;};var _0x2279f1=a895_0x2973;'use strict';module[_0x2279f1('0x0')]={'up':function(){},'down':function(){}};
\ No newline at end of file
diff --git a/server/migrations/2.0.17.js b/server/migrations/2.0.17.js
index 57e57da..12143c4 100644
--- a/server/migrations/2.0.17.js
+++ b/server/migrations/2.0.17.js
@@ -1 +1 @@
-var a896_0x5994=['exports'];(function(_0x267efb,_0x59946c){var _0x3777e7=function(_0x1a9c8a){while(--_0x1a9c8a){_0x267efb['push'](_0x267efb['shift']());}};_0x3777e7(++_0x59946c);}(a896_0x5994,0xa4));var a896_0x3777=function(_0x267efb,_0x59946c){_0x267efb=_0x267efb-0x0;var _0x3777e7=a896_0x5994[_0x267efb];return _0x3777e7;};var _0x600bd=a896_0x3777;'use strict';module[_0x600bd('0x0')]={'up':function(){},'down':function(){}};
\ No newline at end of file
+'use strict';module['exports']={'up':function(){},'down':function(){}};
\ No newline at end of file
diff --git a/server/migrations/2.0.18.js b/server/migrations/2.0.18.js
index b4c08ec..4b37963 100644
--- a/server/migrations/2.0.18.js
+++ b/server/migrations/2.0.18.js
@@ -1 +1 @@
-var a897_0x3d62=['exports'];(function(_0xa733ca,_0x3d6273){var _0x3a2153=function(_0x321f3a){while(--_0x321f3a){_0xa733ca['push'](_0xa733ca['shift']());}};_0x3a2153(++_0x3d6273);}(a897_0x3d62,0x144));var a897_0x3a21=function(_0xa733ca,_0x3d6273){_0xa733ca=_0xa733ca-0x0;var _0x3a2153=a897_0x3d62[_0xa733ca];return _0x3a2153;};var _0xc1d8e1=a897_0x3a21;'use strict';module[_0xc1d8e1('0x0')]={'up':function(){},'down':function(){}};
\ No newline at end of file
+var a897_0x93a4=['exports'];(function(_0x4e60b7,_0x93a44b){var _0x53b38d=function(_0x3ba9e6){while(--_0x3ba9e6){_0x4e60b7['push'](_0x4e60b7['shift']());}};_0x53b38d(++_0x93a44b);}(a897_0x93a4,0xd1));var a897_0x53b3=function(_0x4e60b7,_0x93a44b){_0x4e60b7=_0x4e60b7-0x0;var _0x53b38d=a897_0x93a4[_0x4e60b7];return _0x53b38d;};var _0x1cfb59=a897_0x53b3;'use strict';module[_0x1cfb59('0x0')]={'up':function(){},'down':function(){}};
\ No newline at end of file
diff --git a/server/migrations/2.0.19.js b/server/migrations/2.0.19.js
index 4c78b8a..9f01c0c 100644
--- a/server/migrations/2.0.19.js
+++ b/server/migrations/2.0.19.js
@@ -1 +1 @@
-var a898_0x2311=['exports'];(function(_0x38fef0,_0x231106){var _0xbf0ae1=function(_0x236474){while(--_0x236474){_0x38fef0['push'](_0x38fef0['shift']());}};_0xbf0ae1(++_0x231106);}(a898_0x2311,0xf9));var a898_0xbf0a=function(_0x38fef0,_0x231106){_0x38fef0=_0x38fef0-0x0;var _0xbf0ae1=a898_0x2311[_0x38fef0];return _0xbf0ae1;};var _0x30b7b2=a898_0xbf0a;'use strict';module[_0x30b7b2('0x0')]={'up':function(){},'down':function(){}};
\ No newline at end of file
+var a898_0x3527=['exports'];(function(_0x2a0df0,_0x35273a){var _0x49e76b=function(_0x1c30fa){while(--_0x1c30fa){_0x2a0df0['push'](_0x2a0df0['shift']());}};_0x49e76b(++_0x35273a);}(a898_0x3527,0x118));var a898_0x49e7=function(_0x2a0df0,_0x35273a){_0x2a0df0=_0x2a0df0-0x0;var _0x49e76b=a898_0x3527[_0x2a0df0];return _0x49e76b;};var _0x148d84=a898_0x49e7;'use strict';module[_0x148d84('0x0')]={'up':function(){},'down':function(){}};
\ No newline at end of file
diff --git a/server/migrations/2.0.20.js b/server/migrations/2.0.20.js
index 2fd2047..3766719 100644
--- a/server/migrations/2.0.20.js
+++ b/server/migrations/2.0.20.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.21.js b/server/migrations/2.0.21.js
index 79cbece..83db829 100644
--- a/server/migrations/2.0.21.js
+++ b/server/migrations/2.0.21.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.22.js b/server/migrations/2.0.22.js
index bd503fa..8b27c11 100644
--- a/server/migrations/2.0.22.js
+++ b/server/migrations/2.0.22.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.23.js b/server/migrations/2.0.23.js
index e871cbe..f1fb9af 100644
--- a/server/migrations/2.0.23.js
+++ b/server/migrations/2.0.23.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.24.js b/server/migrations/2.0.24.js
index 6bf68f5..557cd58 100644
--- a/server/migrations/2.0.24.js
+++ b/server/migrations/2.0.24.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.25.js b/server/migrations/2.0.25.js
index 41e3d1f..4de3191 100644
--- a/server/migrations/2.0.25.js
+++ b/server/migrations/2.0.25.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.26.js b/server/migrations/2.0.26.js
index 971d1dc..691c96a 100644
--- a/server/migrations/2.0.26.js
+++ b/server/migrations/2.0.26.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.27.js b/server/migrations/2.0.27.js
index bf9cb8c..12143c4 100644
--- a/server/migrations/2.0.27.js
+++ b/server/migrations/2.0.27.js
@@ -1 +1 @@
-var a906_0x365a=['exports'];(function(_0x3ef2c4,_0x365a54){var _0x4a01c8=function(_0x627495){while(--_0x627495){_0x3ef2c4['push'](_0x3ef2c4['shift']());}};_0x4a01c8(++_0x365a54);}(a906_0x365a,0xa9));var a906_0x4a01=function(_0x3ef2c4,_0x365a54){_0x3ef2c4=_0x3ef2c4-0x0;var _0x4a01c8=a906_0x365a[_0x3ef2c4];return _0x4a01c8;};var _0x22a7ab=a906_0x4a01;'use strict';module[_0x22a7ab('0x0')]={'up':function(){},'down':function(){}};
\ No newline at end of file
+'use strict';module['exports']={'up':function(){},'down':function(){}};
\ No newline at end of file
diff --git a/server/migrations/2.0.28.js b/server/migrations/2.0.28.js
index 9e2f427..93a9539 100644
--- a/server/migrations/2.0.28.js
+++ b/server/migrations/2.0.28.js
@@ -1 +1 @@
-var a907_0x2c60=['exports'];(function(_0xc8c6a8,_0x2c6098){var _0x220473=function(_0x39eddd){while(--_0x39eddd){_0xc8c6a8['push'](_0xc8c6a8['shift']());}};_0x220473(++_0x2c6098);}(a907_0x2c60,0x155));var a907_0x2204=function(_0xc8c6a8,_0x2c6098){_0xc8c6a8=_0xc8c6a8-0x0;var _0x220473=a907_0x2c60[_0xc8c6a8];return _0x220473;};var _0x4c26e2=a907_0x2204;'use strict';module[_0x4c26e2('0x0')]={'up':function(){},'down':function(){}};
\ No newline at end of file
+var a907_0x4c26=['exports'];(function(_0x53b2ff,_0x4c264a){var _0x46292f=function(_0x29d575){while(--_0x29d575){_0x53b2ff['push'](_0x53b2ff['shift']());}};_0x46292f(++_0x4c264a);}(a907_0x4c26,0xed));var a907_0x4629=function(_0x53b2ff,_0x4c264a){_0x53b2ff=_0x53b2ff-0x0;var _0x46292f=a907_0x4c26[_0x53b2ff];return _0x46292f;};var _0x43f81d=a907_0x4629;'use strict';module[_0x43f81d('0x0')]={'up':function(){},'down':function(){}};
\ No newline at end of file
diff --git a/server/migrations/2.0.29.js b/server/migrations/2.0.29.js
index 52f05d4..e088b07 100644
--- a/server/migrations/2.0.29.js
+++ b/server/migrations/2.0.29.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.30.js b/server/migrations/2.0.30.js
index ccdcf0e..89de95a 100644
--- a/server/migrations/2.0.30.js
+++ b/server/migrations/2.0.30.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.31.js b/server/migrations/2.0.31.js
index aa0336b..9c79661 100644
--- a/server/migrations/2.0.31.js
+++ b/server/migrations/2.0.31.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.32.js b/server/migrations/2.0.32.js
index d8f6285..00bf41b 100644
--- a/server/migrations/2.0.32.js
+++ b/server/migrations/2.0.32.js
@@ -1 +1 @@
-var a911_0x1f63=['exports'];(function(_0x5ac668,_0x1f6379){var _0x80631b=function(_0xec3d5a){while(--_0xec3d5a){_0x5ac668['push'](_0x5ac668['shift']());}};_0x80631b(++_0x1f6379);}(a911_0x1f63,0x85));var a911_0x8063=function(_0x5ac668,_0x1f6379){_0x5ac668=_0x5ac668-0x0;var _0x80631b=a911_0x1f63[_0x5ac668];return _0x80631b;};var _0x483a63=a911_0x8063;'use strict';module[_0x483a63('0x0')]={'up':function(){},'down':function(){}};
\ No newline at end of file
+var a911_0xdc6f=['exports'];(function(_0x277869,_0xdc6f22){var _0x4cc562=function(_0xd48153){while(--_0xd48153){_0x277869['push'](_0x277869['shift']());}};_0x4cc562(++_0xdc6f22);}(a911_0xdc6f,0x1c1));var a911_0x4cc5=function(_0x277869,_0xdc6f22){_0x277869=_0x277869-0x0;var _0x4cc562=a911_0xdc6f[_0x277869];return _0x4cc562;};var _0x24d5cc=a911_0x4cc5;'use strict';module[_0x24d5cc('0x0')]={'up':function(){},'down':function(){}};
\ No newline at end of file
diff --git a/server/migrations/2.0.33.js b/server/migrations/2.0.33.js
index 092cfc8..5b7d60c 100644
--- a/server/migrations/2.0.33.js
+++ b/server/migrations/2.0.33.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.34.js b/server/migrations/2.0.34.js
index 7f4ff8e..b82c7e9 100644
--- a/server/migrations/2.0.34.js
+++ b/server/migrations/2.0.34.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.35.js b/server/migrations/2.0.35.js
index 41cbecc..3709fba 100644
--- a/server/migrations/2.0.35.js
+++ b/server/migrations/2.0.35.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.36.js b/server/migrations/2.0.36.js
index 97b81a6..ec7b461 100644
--- a/server/migrations/2.0.36.js
+++ b/server/migrations/2.0.36.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.37.js b/server/migrations/2.0.37.js
index 7eeb60c..69bafd2 100644
--- a/server/migrations/2.0.37.js
+++ b/server/migrations/2.0.37.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.38.js b/server/migrations/2.0.38.js
index f9ef69b..5e5b220 100644
--- a/server/migrations/2.0.38.js
+++ b/server/migrations/2.0.38.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.39.js b/server/migrations/2.0.39.js
index f1b0ed7..8ebee15 100644
--- a/server/migrations/2.0.39.js
+++ b/server/migrations/2.0.39.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.40.js b/server/migrations/2.0.40.js
index d1eaffa..fdce875 100644
--- a/server/migrations/2.0.40.js
+++ b/server/migrations/2.0.40.js
@@ -1 +1 @@
-var a919_0x4ca3=['exports'];(function(_0x63f654,_0x4ca381){var _0x3579a9=function(_0x26b89b){while(--_0x26b89b){_0x63f654['push'](_0x63f654['shift']());}};_0x3579a9(++_0x4ca381);}(a919_0x4ca3,0x102));var a919_0x3579=function(_0x63f654,_0x4ca381){_0x63f654=_0x63f654-0x0;var _0x3579a9=a919_0x4ca3[_0x63f654];return _0x3579a9;};var _0x336263=a919_0x3579;'use strict';module[_0x336263('0x0')]={'up':function(){},'down':function(){}};
\ No newline at end of file
+var a919_0xa1e8=['exports'];(function(_0x35acff,_0xa1e886){var _0x924620=function(_0x401ff1){while(--_0x401ff1){_0x35acff['push'](_0x35acff['shift']());}};_0x924620(++_0xa1e886);}(a919_0xa1e8,0x85));var a919_0x9246=function(_0x35acff,_0xa1e886){_0x35acff=_0x35acff-0x0;var _0x924620=a919_0xa1e8[_0x35acff];return _0x924620;};var _0x3f2373=a919_0x9246;'use strict';module[_0x3f2373('0x0')]={'up':function(){},'down':function(){}};
\ No newline at end of file
diff --git a/server/migrations/2.0.41.js b/server/migrations/2.0.41.js
index 6509f2d..5799f43 100644
--- a/server/migrations/2.0.41.js
+++ b/server/migrations/2.0.41.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.42.js b/server/migrations/2.0.42.js
index b115d29..bfd906b 100644
--- a/server/migrations/2.0.42.js
+++ b/server/migrations/2.0.42.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.43.js b/server/migrations/2.0.43.js
index 11fc5b3..331e722 100644
--- a/server/migrations/2.0.43.js
+++ b/server/migrations/2.0.43.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.44.js b/server/migrations/2.0.44.js
index 5b881a6..d848d2e 100644
--- a/server/migrations/2.0.44.js
+++ b/server/migrations/2.0.44.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.45.js b/server/migrations/2.0.45.js
index 058fe24..b81febf 100644
--- a/server/migrations/2.0.45.js
+++ b/server/migrations/2.0.45.js
@@ -1 +1 @@
-var a924_0x2303=['exports'];(function(_0x9d7859,_0x230333){var _0x4dafcf=function(_0x2a9572){while(--_0x2a9572){_0x9d7859['push'](_0x9d7859['shift']());}};_0x4dafcf(++_0x230333);}(a924_0x2303,0xa2));var a924_0x4daf=function(_0x9d7859,_0x230333){_0x9d7859=_0x9d7859-0x0;var _0x4dafcf=a924_0x2303[_0x9d7859];return _0x4dafcf;};var _0x2f64c0=a924_0x4daf;'use strict';module[_0x2f64c0('0x0')]={'up':function(){},'down':function(){}};
\ No newline at end of file
+var a924_0xd5f4=['exports'];(function(_0x3524c9,_0xd5f425){var _0x231744=function(_0x1ad982){while(--_0x1ad982){_0x3524c9['push'](_0x3524c9['shift']());}};_0x231744(++_0xd5f425);}(a924_0xd5f4,0x9e));var a924_0x2317=function(_0x3524c9,_0xd5f425){_0x3524c9=_0x3524c9-0x0;var _0x231744=a924_0xd5f4[_0x3524c9];return _0x231744;};var _0x4afa5f=a924_0x2317;'use strict';module[_0x4afa5f('0x0')]={'up':function(){},'down':function(){}};
\ No newline at end of file
diff --git a/server/migrations/2.0.46.js b/server/migrations/2.0.46.js
index 95ae2f1..71cd199 100644
--- a/server/migrations/2.0.46.js
+++ b/server/migrations/2.0.46.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.47.js b/server/migrations/2.0.47.js
index 3207191..0f9a46c 100644
--- a/server/migrations/2.0.47.js
+++ b/server/migrations/2.0.47.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.48.js b/server/migrations/2.0.48.js
index 220f5ef..9e06f60 100644
--- a/server/migrations/2.0.48.js
+++ b/server/migrations/2.0.48.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.49.js b/server/migrations/2.0.49.js
index 636f1b1..4ed5775 100644
--- a/server/migrations/2.0.49.js
+++ b/server/migrations/2.0.49.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.50.js b/server/migrations/2.0.50.js
index b1101ed..5ecb1db 100644
--- a/server/migrations/2.0.50.js
+++ b/server/migrations/2.0.50.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.51.js b/server/migrations/2.0.51.js
index 164dad3..894ebe2 100644
--- a/server/migrations/2.0.51.js
+++ b/server/migrations/2.0.51.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.52.js b/server/migrations/2.0.52.js
index a43941c..41ce6bd 100644
--- a/server/migrations/2.0.52.js
+++ b/server/migrations/2.0.52.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.53.js b/server/migrations/2.0.53.js
index cd85861..2322278 100644
--- a/server/migrations/2.0.53.js
+++ b/server/migrations/2.0.53.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.54.js b/server/migrations/2.0.54.js
index 9a5f402..bd16133 100644
--- a/server/migrations/2.0.54.js
+++ b/server/migrations/2.0.54.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.55.js b/server/migrations/2.0.55.js
index fad93d6..7528dcb 100644
--- a/server/migrations/2.0.55.js
+++ b/server/migrations/2.0.55.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.56.js b/server/migrations/2.0.56.js
index 968866d..993fe89 100644
--- a/server/migrations/2.0.56.js
+++ b/server/migrations/2.0.56.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.57.js b/server/migrations/2.0.57.js
index 215ddd7..e55d4a1 100644
--- a/server/migrations/2.0.57.js
+++ b/server/migrations/2.0.57.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.58.js b/server/migrations/2.0.58.js
index ed63fd2..83b8046 100644
--- a/server/migrations/2.0.58.js
+++ b/server/migrations/2.0.58.js
@@ -1 +1 @@
-const a937_0x199b=['join','addIndex','INSERT\x20INTO\x20`tools_sounds`\x20(`name`,\x20`save_name`,\x20`display_name`,\x20`description`,\x20`original_format`,\x20`original_duration`,\x20`original_sampleCount`,\x20`original_channelCount`,\x20`original_bitRate`,\x20`original_sampleRate`,\x20`converted_format`,\x20`converted_duration`,\x20`converted_sampleCount`,\x20`converted_channelCount`,\x20`converted_bitRate`,\x20`converted_sampleRate`,\x20`createdAt`,\x20`updatedAt`)\x20VALUES\x20(\x27Agent\x20Pause\x27,\x20\x27agentmanagement-pause\x27,\x20\x27Agent\x20Pause\x27,\x20\x27auto\x20generated\x20sound\x27,\x20\x27mp3\x27,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20\x27wav\x27,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20\x272018-05-24\x2011:44:53\x27,\x20\x272018-05-24\x2011:44:53\x27);','inspect','Renamed\x20column\x20from\x20%s\x20to\x20%s\x20on\x20%s','STRING','info','Removed\x20column\x20%s\x20from\x20%s','enqueue','renameColumn','INSERT\x20INTO\x20`tools_sounds`\x20(`name`,\x20`save_name`,\x20`display_name`,\x20`description`,\x20`original_format`,\x20`original_duration`,\x20`original_sampleCount`,\x20`original_channelCount`,\x20`original_bitRate`,\x20`original_sampleRate`,\x20`converted_format`,\x20`converted_duration`,\x20`converted_sampleCount`,\x20`converted_channelCount`,\x20`converted_bitRate`,\x20`converted_sampleRate`,\x20`createdAt`,\x20`updatedAt`)\x20VALUES\x20(\x27Agent\x20Action\x20Failure\x27,\x20\x27agentmanagement-action-failure\x27,\x20\x27Agent\x20Action\x20Failure\x27,\x20\x27auto\x20generated\x20sound\x27,\x20\x27wav\x27,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20\x27wav\x27,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20\x272018-05-24\x2011:44:53\x27,\x20\x272018-05-24\x2011:44:53\x27);','INSERT\x20INTO\x20`square_projects`\x20(`name`,\x20`description`,\x20`notes`,\x20`preproduction`,\x20`production`,\x20`createdAt`,\x20`updatedAt`)\x20VALUES\x20(\x27AgentManagement\x27,\x20\x27Agent\x20Management\x20sample\x20auto\x20generated\x27,\x20NULL,\x20X\x273C6D7847726170684D6F64656C20677269643D223122206775696465733D22312220746F6F6C746970733D22312220636F6E6E6563743D22312220666F6C643D22312220706167653D22302220706167655363616C653D223122207061676557696474683D223832362220706167654865696768743D2231313639223E0A20203C726F6F743E0A202020203C6D7843656C6C2069643D2230222F3E0A202020203C6D7843656C6C2069643D22312220706172656E743D2230222F3E0A202020203C7374617274206C6162656C3D2253746172742220616E737765723D22796573222069643D2239223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F656E7472792F73746172745F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D2234302220793D22323338222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F73746172743E0A202020203C6D656E75206C6162656C3D224D656E75222066696C655F69643D222220726573706F6E73653D2235222064696769743D2231222072657472793D223122207661726961626C655F69643D2230222069643D223136223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F706C61796261636B2F6D656E755F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223137302220793D22323338222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F6D656E753E0A202020203C6C6F67696E206C6162656C3D224C6F67696E222066696E6442793D22696E7465726E616C222069643D223339223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F6167656E745F6D616E6167656D656E742F6C6F67696E5F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223332302220793D223132222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F6C6F67696E3E0A202020203C7061757365206C6162656C3D225061757365222066696E6442793D22696E7465726E616C222070617573655F69643D22222069643D223430223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F6167656E745F6D616E6167656D656E742F70617573655F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223332302220793D22333434222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F70617573653E0A202020203C756E7061757365206C6162656C3D22556E7061757365222066696E6442793D22696E7465726E616C222069643D223431223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F6167656E745F6D616E6167656D656E742F756E70617573655F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223332302220793D22343634222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F756E70617573653E0A202020203C6C6F676F7574206C6162656C3D224C6F676F7574222066696E6442793D22696E7465726E616C222069643D223432223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F6167656E745F6D616E6167656D656E742F6C6F676F75745F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223332302220793D22313332222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F6C6F676F75743E0A202020203C6D7843656C6C2069643D223433222076616C75653D22312220706172656E743D22312220736F757263653D22313622207461726765743D2233392220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279223E0A20202020202020203C41727261792061733D22706F696E7473223E0A202020202020202020203C6D78506F696E7420783D223231302220793D22313432222F3E0A20202020202020203C2F41727261793E0A2020202020203C2F6D7847656F6D657472793E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223434222076616C75653D22322220706172656E743D22312220736F757263653D22313622207461726765743D2234322220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223435222076616C75653D22332220706172656E743D22312220736F757263653D22313622207461726765743D2234302220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223436222076616C75653D22342220706172656E743D22312220736F757263653D22313622207461726765743D2234312220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279223E0A20202020202020203C41727261792061733D22706F696E7473223E0A202020202020202020203C6D78506F696E7420783D223231302220793D22343134222F3E0A20202020202020203C2F41727261793E0A2020202020203C2F6D7847656F6D657472793E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D2234372220706172656E743D22312220736F757263653D223922207461726765743D2231362220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C706C61796261636B206C6162656C3D22506C61796261636B222066696C655F69643D2222206F7074733D22222069643D223438223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F706C61796261636B2F706C61796261636B5F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223435302220793D22323338222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F706C61796261636B3E0A202020203C6D7843656C6C2069643D223530222076616C75653D226661696C7572652220706172656E743D22312220736F757263653D22343222207461726765743D2234382220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223531222076616C75653D226661696C7572652220706172656E743D22312220736F757263653D22343022207461726765743D2234382220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C68616E677570206C6162656C3D2248616E677570222069643D223533223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F63616C6C5F6D616E6167656D656E742F68616E6775705F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223735302220793D22323338222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F68616E6775703E0A202020203C6D7843656C6C2069643D2235342220706172656E743D22312220736F757263653D22343822207461726765743D2235332220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223535222076616C75653D226661696C7572652220706172656E743D22312220736F757263653D22333922207461726765743D2234382220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279223E0A20202020202020203C41727261792061733D22706F696E7473223E0A202020202020202020203C6D78506F696E7420783D223439302220793D22313730222F3E0A20202020202020203C2F41727261793E0A2020202020203C2F6D7847656F6D657472793E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223536222076616C75653D226661696C7572652220706172656E743D22312220736F757263653D22343122207461726765743D2234382220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279223E0A20202020202020203C41727261792061733D22706F696E7473223E0A202020202020202020203C6D78506F696E7420783D223439302220793D22333930222F3E0A20202020202020203C2F41727261793E0A2020202020203C2F6D7847656F6D657472793E0A202020203C2F6D7843656C6C3E0A202020203C706C61796261636B206C6162656C3D22506C61796261636B222066696C655F69643D2222206F7074733D22222069643D223537223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F706C61796261636B2F706C61796261636B5F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223630302220793D22313332222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F706C61796261636B3E0A202020203C706C61796261636B206C6162656C3D22506C61796261636B222066696C655F69643D2222206F7074733D22222069643D223538223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F706C61796261636B2F706C61796261636B5F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223630302220793D223132222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F706C61796261636B3E0A202020203C706C61796261636B206C6162656C3D22506C61796261636B222066696C655F69643D2222206F7074733D22222069643D223539223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F706C61796261636B2F706C61796261636B5F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223630302220793D22333434222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F706C61796261636B3E0A202020203C706C61796261636B206C6162656C3D22506C61796261636B222066696C655F69643D2222206F7074733D22222069643D223630223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F706C61796261636B2F706C61796261636B5F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223630302220793D22343634222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F706C61796261636B3E0A202020203C6D7843656C6C2069643D223631222076616C75653D22737563636573732220706172656E743D22312220736F757263653D22333922207461726765743D2235382220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223632222076616C75653D22737563636573732220706172656E743D22312220736F757263653D22343222207461726765743D2235372220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223633222076616C75653D22737563636573732220706172656E743D22312220736F757263653D22343022207461726765743D2235392220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223634222076616C75653D22737563636573732220706172656E743D22312220736F757263653D22343122207461726765743D2236302220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D2236352220706172656E743D22312220736F757263653D22353822207461726765743D2235332220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D2236362220706172656E743D22312220736F757263653D22353722207461726765743D2235332220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D2236372220706172656E743D22312220736F757263653D22353922207461726765743D2235332220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D2236382220706172656E743D22312220736F757263653D22363022207461726765743D2235332220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A20203C2F726F6F743E0A3C2F6D7847726170684D6F64656C3E\x27,\x20X\x273C6D7847726170684D6F64656C20677269643D223122206775696465733D22312220746F6F6C746970733D22312220636F6E6E6563743D22312220666F6C643D22312220706167653D22302220706167655363616C653D223122207061676557696474683D223832362220706167654865696768743D2231313639223E0A20203C726F6F743E0A202020203C6D7843656C6C2069643D2230222F3E0A202020203C6D7843656C6C2069643D22312220706172656E743D2230222F3E0A202020203C7374617274206C6162656C3D2253746172742220616E737765723D22796573222069643D2239223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F656E7472792F73746172745F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D2234302220793D22323338222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F73746172743E0A202020203C6D656E75206C6162656C3D224D656E75222066696C655F69643D222220726573706F6E73653D2235222064696769743D2231222072657472793D223122207661726961626C655F69643D2230222069643D223136223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F706C61796261636B2F6D656E755F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223137302220793D22323338222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F6D656E753E0A202020203C6C6F67696E206C6162656C3D224C6F67696E222066696E6442793D22696E7465726E616C222069643D223339223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F6167656E745F6D616E6167656D656E742F6C6F67696E5F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223332302220793D223132222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F6C6F67696E3E0A202020203C7061757365206C6162656C3D225061757365222066696E6442793D22696E7465726E616C222070617573655F69643D22222069643D223430223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F6167656E745F6D616E6167656D656E742F70617573655F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223332302220793D22333434222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F70617573653E0A202020203C756E7061757365206C6162656C3D22556E7061757365222066696E6442793D22696E7465726E616C222069643D223431223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F6167656E745F6D616E6167656D656E742F756E70617573655F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223332302220793D22343634222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F756E70617573653E0A202020203C6C6F676F7574206C6162656C3D224C6F676F7574222066696E6442793D22696E7465726E616C222069643D223432223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F6167656E745F6D616E6167656D656E742F6C6F676F75745F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223332302220793D22313332222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F6C6F676F75743E0A202020203C6D7843656C6C2069643D223433222076616C75653D22312220706172656E743D22312220736F757263653D22313622207461726765743D2233392220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279223E0A20202020202020203C41727261792061733D22706F696E7473223E0A202020202020202020203C6D78506F696E7420783D223231302220793D22313432222F3E0A20202020202020203C2F41727261793E0A2020202020203C2F6D7847656F6D657472793E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223434222076616C75653D22322220706172656E743D22312220736F757263653D22313622207461726765743D2234322220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223435222076616C75653D22332220706172656E743D22312220736F757263653D22313622207461726765743D2234302220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223436222076616C75653D22342220706172656E743D22312220736F757263653D22313622207461726765743D2234312220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279223E0A20202020202020203C41727261792061733D22706F696E7473223E0A202020202020202020203C6D78506F696E7420783D223231302220793D22343134222F3E0A20202020202020203C2F41727261793E0A2020202020203C2F6D7847656F6D657472793E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D2234372220706172656E743D22312220736F757263653D223922207461726765743D2231362220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C706C61796261636B206C6162656C3D22506C61796261636B222066696C655F69643D2222206F7074733D22222069643D223438223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F706C61796261636B2F706C61796261636B5F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223435302220793D22323338222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F706C61796261636B3E0A202020203C6D7843656C6C2069643D223530222076616C75653D226661696C7572652220706172656E743D22312220736F757263653D22343222207461726765743D2234382220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223531222076616C75653D226661696C7572652220706172656E743D22312220736F757263653D22343022207461726765743D2234382220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C68616E677570206C6162656C3D2248616E677570222069643D223533223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F63616C6C5F6D616E6167656D656E742F68616E6775705F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223735302220793D22323338222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F68616E6775703E0A202020203C6D7843656C6C2069643D2235342220706172656E743D22312220736F757263653D22343822207461726765743D2235332220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223535222076616C75653D226661696C7572652220706172656E743D22312220736F757263653D22333922207461726765743D2234382220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279223E0A20202020202020203C41727261792061733D22706F696E7473223E0A202020202020202020203C6D78506F696E7420783D223439302220793D22313730222F3E0A20202020202020203C2F41727261793E0A2020202020203C2F6D7847656F6D657472793E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223536222076616C75653D226661696C7572652220706172656E743D22312220736F757263653D22343122207461726765743D2234382220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279223E0A20202020202020203C41727261792061733D22706F696E7473223E0A202020202020202020203C6D78506F696E7420783D223439302220793D22333930222F3E0A20202020202020203C2F41727261793E0A2020202020203C2F6D7847656F6D657472793E0A202020203C2F6D7843656C6C3E0A202020203C706C61796261636B206C6162656C3D22506C61796261636B222066696C655F69643D2222206F7074733D22222069643D223537223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F706C61796261636B2F706C61796261636B5F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223630302220793D22313332222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F706C61796261636B3E0A202020203C706C61796261636B206C6162656C3D22506C61796261636B222066696C655F69643D2222206F7074733D22222069643D223538223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F706C61796261636B2F706C61796261636B5F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223630302220793D223132222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F706C61796261636B3E0A202020203C706C61796261636B206C6162656C3D22506C61796261636B222066696C655F69643D2222206F7074733D22222069643D223539223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F706C61796261636B2F706C61796261636B5F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223630302220793D22333434222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F706C61796261636B3E0A202020203C706C61796261636B206C6162656C3D22506C61796261636B222066696C655F69643D2222206F7074733D22222069643D223630223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F706C61796261636B2F706C61796261636B5F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223630302220793D22343634222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F706C61796261636B3E0A202020203C6D7843656C6C2069643D223631222076616C75653D22737563636573732220706172656E743D22312220736F757263653D22333922207461726765743D2235382220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223632222076616C75653D22737563636573732220706172656E743D22312220736F757263653D22343222207461726765743D2235372220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223633222076616C75653D22737563636573732220706172656E743D22312220736F757263653D22343022207461726765743D2235392220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223634222076616C75653D22737563636573732220706172656E743D22312220736F757263653D22343122207461726765743D2236302220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D2236352220706172656E743D22312220736F757263653D22353822207461726765743D2235332220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D2236362220706172656E743D22312220736F757263653D22353722207461726765743D2235332220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D2236372220706172656E743D22312220736F757263653D22353922207461726765743D2235332220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D2236382220706172656E743D22312220736F757263653D22363022207461726765743D2235332220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A20203C2F726F6F743E0A3C2F6D7847726170684D6F64656C3E\x27,\x20\x272018-05-24\x2011:44:53\x27,\x20\x272018-05-24\x2011:44:53\x27);','sequence','catch','changeColumn','prototype','addColumn','queryInterface','tail','ALTER\x20TABLE\x20`voice_voicemail_messages`\x20\x20\x20\x20\x20\x20\x20ADD\x20CONSTRAINT\x20`voice_voicemail_messages_ibfk_1`\x20\x20\x20\x20\x20\x20\x20FOREIGN\x20KEY\x20(`mailboxuser`)\x20\x20\x20\x20\x20\x20\x20REFERENCES\x20voice_voicemail(`mailbox`)\x20\x20\x20\x20\x20\x20\x20ON\x20UPDATE\x20CASCADE\x20\x20\x20\x20\x20\x20\x20ON\x20DELETE\x20CASCADE','queuecallerexitreason','dropTable','final','queue','then','addIndex\x20%s\x20%s\x20%s','stringify','util','Changed\x20column\x20%s\x20in\x20table\x20%s','report_queue','query','INSERT\x20INTO\x20`tools_sounds`\x20(`name`,\x20`save_name`,\x20`display_name`,\x20`description`,\x20`original_format`,\x20`original_duration`,\x20`original_sampleCount`,\x20`original_channelCount`,\x20`original_bitRate`,\x20`original_sampleRate`,\x20`converted_format`,\x20`converted_duration`,\x20`converted_sampleCount`,\x20`converted_channelCount`,\x20`converted_bitRate`,\x20`converted_sampleRate`,\x20`createdAt`,\x20`updatedAt`)\x20VALUES\x20(\x27Agent\x20Login\x27,\x20\x27agentmanagement-login\x27,\x20\x27Agent\x20Login\x27,\x20\x27auto\x20generated\x20sound\x27,\x20\x27mp3\x27,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20\x27wav\x27,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20\x272018-05-24\x2011:44:53\x27,\x20\x272018-05-24\x2011:44:53\x27);','removeColumn'];(function(_0x2af3bc,_0x199b28){const _0x542298=function(_0x30f598){while(--_0x30f598){_0x2af3bc['push'](_0x2af3bc['shift']());}};_0x542298(++_0x199b28);}(a937_0x199b,0xff));const a937_0x5422=function(_0x2af3bc,_0x199b28){_0x2af3bc=_0x2af3bc-0x0;let _0x542298=a937_0x199b[_0x2af3bc];return _0x542298;};const _0x14b9e7=a937_0x5422;'use strict';const util=require(_0x14b9e7('0x3')),logger=require('../config/logger')('migration'),Sequence=function(){};Sequence[_0x14b9e7('0x18')][_0x14b9e7('0x11')]=function(_0x30f598){const _0x573b14=_0x14b9e7;this[_0x573b14('0x1b')]=this[_0x573b14('0x1b')]?this['tail']['finally'](_0x30f598):_0x30f598();};const Migration=function(_0x2e607d){const _0x3b81e6=_0x14b9e7;this[_0x3b81e6('0x1a')]=_0x2e607d,this['sequence']=new Sequence();};Migration[_0x14b9e7('0x18')][_0x14b9e7('0x17')]=function(_0x451985,_0x3eb6d9,_0x19ea69){const _0x1f21af=_0x14b9e7,_0x320ff2=this;this[_0x1f21af('0x15')][_0x1f21af('0x11')](function(){const _0x1b4f8c=_0x1f21af;return _0x320ff2[_0x1b4f8c('0x1a')][_0x1b4f8c('0x17')](_0x451985,_0x3eb6d9,_0x19ea69)[_0x1b4f8c('0x0')](function(){const _0x54306c=_0x1b4f8c;logger[_0x54306c('0xf')](_0x54306c('0x4'),_0x3eb6d9,_0x451985);})['catch'](function(_0x356c15){const _0x8a8f9d=_0x1b4f8c;logger[_0x8a8f9d('0xf')](JSON[_0x8a8f9d('0x2')](_0x356c15));});});},Migration[_0x14b9e7('0x18')]['addColumn']=function(_0x4fd76b,_0x80e448,_0x190073){const _0xc22fc8=_0x14b9e7,_0x566b57=this;this[_0xc22fc8('0x15')][_0xc22fc8('0x11')](function(){const _0x35ca7e=_0xc22fc8;return _0x566b57['queryInterface'][_0x35ca7e('0x19')](_0x4fd76b,_0x80e448,_0x190073)[_0x35ca7e('0x0')](function(){const _0x4b8356=_0x35ca7e;logger[_0x4b8356('0xf')]('Added\x20column\x20%s\x20to\x20%s',_0x80e448,_0x4fd76b);})[_0x35ca7e('0x16')](function(_0x43664e){const _0x4dec10=_0x35ca7e;logger[_0x4dec10('0xf')](JSON[_0x4dec10('0x2')](_0x43664e));});});},Migration[_0x14b9e7('0x18')]['dropTable']=function(_0x515ccd){const _0x5516dd=_0x14b9e7,_0x2689d7=this;this[_0x5516dd('0x15')][_0x5516dd('0x11')](function(){const _0x29ca97=_0x5516dd;return _0x2689d7[_0x29ca97('0x1a')][_0x29ca97('0x1e')](_0x515ccd,{'force':!![]})[_0x29ca97('0x0')](function(){const _0x466377=_0x29ca97;logger[_0x466377('0xf')]('table\x20dropped\x20%s',_0x515ccd);})['catch'](function(_0x46eb65){const _0x278476=_0x29ca97;logger[_0x278476('0xf')](JSON[_0x278476('0x2')](_0x46eb65));});});},Migration[_0x14b9e7('0x18')][_0x14b9e7('0xa')]=function(_0x43af82,_0x1858c1,_0x564f25){const _0xfb975f=_0x14b9e7,_0x1e0ea9=this;this[_0xfb975f('0x15')][_0xfb975f('0x11')](function(){const _0x3e21af=_0xfb975f;return _0x1e0ea9['queryInterface'][_0x3e21af('0xa')](_0x43af82,_0x1858c1,{'indexName':_0x564f25})[_0x3e21af('0x0')](function(){const _0x4bd40c=_0x3e21af;logger[_0x4bd40c('0xf')](_0x4bd40c('0x1'),_0x43af82,_0x1858c1[_0x4bd40c('0x9')](','),_0x564f25);})[_0x3e21af('0x16')](function(_0x2deb3c){const _0x835de5=_0x3e21af;logger[_0x835de5('0xf')](JSON['stringify'](_0x2deb3c));});});},Migration[_0x14b9e7('0x18')][_0x14b9e7('0x6')]=function(_0x3a33d2){const _0x245ef1=_0x14b9e7,_0x138a5b=this;this[_0x245ef1('0x15')][_0x245ef1('0x11')](function(){const _0xfc5809=_0x245ef1;return _0x138a5b[_0xfc5809('0x1a')]['sequelize'][_0xfc5809('0x6')](_0x3a33d2)['then'](function(){const _0x5c2ff4=_0xfc5809;logger[_0x5c2ff4('0xf')]('query\x20%s',_0x3a33d2);})[_0xfc5809('0x16')](function(_0x3f4330){const _0x145ee6=_0xfc5809;logger[_0x145ee6('0xf')](JSON[_0x145ee6('0x2')](_0x3f4330));});});},Migration[_0x14b9e7('0x18')][_0x14b9e7('0x8')]=function(_0x50da62,_0x2eda68){const _0x114a13=_0x14b9e7,_0x463f63=this;this['sequence'][_0x114a13('0x11')](function(){const _0x912e21=_0x114a13;return _0x463f63[_0x912e21('0x1a')]['removeColumn'](_0x50da62,_0x2eda68)[_0x912e21('0x0')](function(){const _0x17f3b7=_0x912e21;logger['info'](_0x17f3b7('0x10'),_0x2eda68,_0x50da62);})[_0x912e21('0x16')](function(_0x384ff0){const _0x4569c3=_0x912e21;logger[_0x4569c3('0xf')](util[_0x4569c3('0xc')](_0x384ff0,{'showHidden':![],'depth':null}));});});},Migration[_0x14b9e7('0x18')][_0x14b9e7('0x12')]=function(_0x3565d1,_0x38865e,_0x31d18d){const _0x55b7eb=_0x14b9e7,_0x16fe00=this;this[_0x55b7eb('0x15')][_0x55b7eb('0x11')](function(){const _0xfccf34=_0x55b7eb;return _0x16fe00[_0xfccf34('0x1a')][_0xfccf34('0x12')](_0x3565d1,_0x38865e,_0x31d18d)[_0xfccf34('0x0')](function(){const _0x2ee18c=_0xfccf34;logger['info'](_0x2ee18c('0xd'),_0x38865e,_0x31d18d,_0x3565d1);})['catch'](function(_0x576a20){const _0x364faf=_0xfccf34;logger[_0x364faf('0xf')](util[_0x364faf('0xc')](_0x576a20,{'showHidden':![],'depth':null}));});});},Migration[_0x14b9e7('0x18')][_0x14b9e7('0x1f')]=function(_0x476852){const _0x33baa1=_0x14b9e7;this['sequence'][_0x33baa1('0x11')](function(){return _0x476852();});},module['exports']={'up':function(_0x168168,_0x292d3){return new Promise(function(_0x2c76dc){const _0x1ffcc5=a937_0x5422,_0x70c679=new Migration(_0x168168);_0x70c679[_0x1ffcc5('0x6')](_0x1ffcc5('0x1c')),_0x70c679[_0x1ffcc5('0xa')](_0x1ffcc5('0x5'),[_0x1ffcc5('0x20')],'queue'),_0x70c679[_0x1ffcc5('0xa')](_0x1ffcc5('0x5'),['queuecallerexitreason'],_0x1ffcc5('0x1d')),_0x70c679[_0x1ffcc5('0x19')]('report_queue','disposition',{'type':_0x292d3[_0x1ffcc5('0xe')]}),_0x70c679[_0x1ffcc5('0x6')](_0x1ffcc5('0x14')),_0x70c679[_0x1ffcc5('0x6')](_0x1ffcc5('0x7')),_0x70c679[_0x1ffcc5('0x6')]('INSERT\x20INTO\x20`tools_sounds`\x20(`name`,\x20`save_name`,\x20`display_name`,\x20`description`,\x20`original_format`,\x20`original_duration`,\x20`original_sampleCount`,\x20`original_channelCount`,\x20`original_bitRate`,\x20`original_sampleRate`,\x20`converted_format`,\x20`converted_duration`,\x20`converted_sampleCount`,\x20`converted_channelCount`,\x20`converted_bitRate`,\x20`converted_sampleRate`,\x20`createdAt`,\x20`updatedAt`)\x20VALUES\x20(\x27Agent\x20Logout\x27,\x20\x27agentmanagement-logout\x27,\x20\x27Agent\x20Logout\x27,\x20\x27auto\x20generated\x20sound\x27,\x20\x27mp3\x27,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20\x27wav\x27,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20\x272018-05-24\x2011:44:53\x27,\x20\x272018-05-24\x2011:44:53\x27);'),_0x70c679['query']('INSERT\x20INTO\x20`tools_sounds`\x20(`name`,\x20`save_name`,\x20`display_name`,\x20`description`,\x20`original_format`,\x20`original_duration`,\x20`original_sampleCount`,\x20`original_channelCount`,\x20`original_bitRate`,\x20`original_sampleRate`,\x20`converted_format`,\x20`converted_duration`,\x20`converted_sampleCount`,\x20`converted_channelCount`,\x20`converted_bitRate`,\x20`converted_sampleRate`,\x20`createdAt`,\x20`updatedAt`)\x20VALUES\x20(\x27Agent\x20Menu\x27,\x20\x27agentmanagement-menu\x27,\x20\x27Agent\x20Menu\x27,\x20\x27auto\x20generated\x20sound\x27,\x20\x27wav\x27,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20\x27wav\x27,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20\x272018-05-24\x2011:44:53\x27,\x20\x272018-05-24\x2011:44:53\x27);'),_0x70c679[_0x1ffcc5('0x6')](_0x1ffcc5('0xb')),_0x70c679[_0x1ffcc5('0x6')]('INSERT\x20INTO\x20`tools_sounds`\x20(`name`,\x20`save_name`,\x20`display_name`,\x20`description`,\x20`original_format`,\x20`original_duration`,\x20`original_sampleCount`,\x20`original_channelCount`,\x20`original_bitRate`,\x20`original_sampleRate`,\x20`converted_format`,\x20`converted_duration`,\x20`converted_sampleCount`,\x20`converted_channelCount`,\x20`converted_bitRate`,\x20`converted_sampleRate`,\x20`createdAt`,\x20`updatedAt`)\x20VALUES\x20(\x27Agent\x20End\x20Pause\x27,\x20\x27agentmanagement-unpause\x27,\x20\x27Agent\x20End\x20Pause\x27,\x20\x27auto\x20generated\x20sound\x27,\x20\x27mp3\x27,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20\x27wav\x27,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20\x272018-05-24\x2011:44:53\x27,\x20\x272018-05-24\x2011:44:53\x27);'),_0x70c679[_0x1ffcc5('0x6')](_0x1ffcc5('0x13')),_0x70c679[_0x1ffcc5('0x1f')](_0x2c76dc);});},'down':function(){}};
\ No newline at end of file
+const a937_0x3da4=['dropTable','renameColumn','INSERT\x20INTO\x20`tools_sounds`\x20(`name`,\x20`save_name`,\x20`display_name`,\x20`description`,\x20`original_format`,\x20`original_duration`,\x20`original_sampleCount`,\x20`original_channelCount`,\x20`original_bitRate`,\x20`original_sampleRate`,\x20`converted_format`,\x20`converted_duration`,\x20`converted_sampleCount`,\x20`converted_channelCount`,\x20`converted_bitRate`,\x20`converted_sampleRate`,\x20`createdAt`,\x20`updatedAt`)\x20VALUES\x20(\x27Agent\x20End\x20Pause\x27,\x20\x27agentmanagement-unpause\x27,\x20\x27Agent\x20End\x20Pause\x27,\x20\x27auto\x20generated\x20sound\x27,\x20\x27mp3\x27,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20\x27wav\x27,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20\x272018-05-24\x2011:44:53\x27,\x20\x272018-05-24\x2011:44:53\x27);','report_queue','Removed\x20column\x20%s\x20from\x20%s','enqueue','final','prototype','INSERT\x20INTO\x20`tools_sounds`\x20(`name`,\x20`save_name`,\x20`display_name`,\x20`description`,\x20`original_format`,\x20`original_duration`,\x20`original_sampleCount`,\x20`original_channelCount`,\x20`original_bitRate`,\x20`original_sampleRate`,\x20`converted_format`,\x20`converted_duration`,\x20`converted_sampleCount`,\x20`converted_channelCount`,\x20`converted_bitRate`,\x20`converted_sampleRate`,\x20`createdAt`,\x20`updatedAt`)\x20VALUES\x20(\x27Agent\x20Logout\x27,\x20\x27agentmanagement-logout\x27,\x20\x27Agent\x20Logout\x27,\x20\x27auto\x20generated\x20sound\x27,\x20\x27mp3\x27,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20\x27wav\x27,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20\x272018-05-24\x2011:44:53\x27,\x20\x272018-05-24\x2011:44:53\x27);','finally','Renamed\x20column\x20from\x20%s\x20to\x20%s\x20on\x20%s','INSERT\x20INTO\x20`tools_sounds`\x20(`name`,\x20`save_name`,\x20`display_name`,\x20`description`,\x20`original_format`,\x20`original_duration`,\x20`original_sampleCount`,\x20`original_channelCount`,\x20`original_bitRate`,\x20`original_sampleRate`,\x20`converted_format`,\x20`converted_duration`,\x20`converted_sampleCount`,\x20`converted_channelCount`,\x20`converted_bitRate`,\x20`converted_sampleRate`,\x20`createdAt`,\x20`updatedAt`)\x20VALUES\x20(\x27Agent\x20Action\x20Failure\x27,\x20\x27agentmanagement-action-failure\x27,\x20\x27Agent\x20Action\x20Failure\x27,\x20\x27auto\x20generated\x20sound\x27,\x20\x27wav\x27,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20\x27wav\x27,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20\x272018-05-24\x2011:44:53\x27,\x20\x272018-05-24\x2011:44:53\x27);','disposition','addIndex','query\x20%s','STRING','exports','queuecallerexitreason','queryInterface','queue','addColumn','join','Changed\x20column\x20%s\x20in\x20table\x20%s','sequence','Added\x20column\x20%s\x20to\x20%s','query','tail','info','catch','then','table\x20dropped\x20%s','stringify','migration','ALTER\x20TABLE\x20`voice_voicemail_messages`\x20\x20\x20\x20\x20\x20\x20ADD\x20CONSTRAINT\x20`voice_voicemail_messages_ibfk_1`\x20\x20\x20\x20\x20\x20\x20FOREIGN\x20KEY\x20(`mailboxuser`)\x20\x20\x20\x20\x20\x20\x20REFERENCES\x20voice_voicemail(`mailbox`)\x20\x20\x20\x20\x20\x20\x20ON\x20UPDATE\x20CASCADE\x20\x20\x20\x20\x20\x20\x20ON\x20DELETE\x20CASCADE','INSERT\x20INTO\x20`tools_sounds`\x20(`name`,\x20`save_name`,\x20`display_name`,\x20`description`,\x20`original_format`,\x20`original_duration`,\x20`original_sampleCount`,\x20`original_channelCount`,\x20`original_bitRate`,\x20`original_sampleRate`,\x20`converted_format`,\x20`converted_duration`,\x20`converted_sampleCount`,\x20`converted_channelCount`,\x20`converted_bitRate`,\x20`converted_sampleRate`,\x20`createdAt`,\x20`updatedAt`)\x20VALUES\x20(\x27Agent\x20Login\x27,\x20\x27agentmanagement-login\x27,\x20\x27Agent\x20Login\x27,\x20\x27auto\x20generated\x20sound\x27,\x20\x27mp3\x27,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20\x27wav\x27,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20\x272018-05-24\x2011:44:53\x27,\x20\x272018-05-24\x2011:44:53\x27);','inspect'];(function(_0x13d99a,_0x3da47c){const _0x41f986=function(_0x16cb66){while(--_0x16cb66){_0x13d99a['push'](_0x13d99a['shift']());}};_0x41f986(++_0x3da47c);}(a937_0x3da4,0x106));const a937_0x41f9=function(_0x13d99a,_0x3da47c){_0x13d99a=_0x13d99a-0x0;let _0x41f986=a937_0x3da4[_0x13d99a];return _0x41f986;};const _0x300a5c=a937_0x41f9;'use strict';const util=require('util'),logger=require('../config/logger')(_0x300a5c('0x16')),Sequence=function(){};Sequence[_0x300a5c('0x21')]['enqueue']=function(_0x16cb66){const _0x400200=_0x300a5c;this['tail']=this[_0x400200('0x10')]?this[_0x400200('0x10')][_0x400200('0x23')](_0x16cb66):_0x16cb66();};const Migration=function(_0x2df1fc){const _0x3b8437=_0x300a5c;this['queryInterface']=_0x2df1fc,this[_0x3b8437('0xd')]=new Sequence();};Migration[_0x300a5c('0x21')]['changeColumn']=function(_0x42275e,_0x4f02f7,_0x1773ed){const _0x3be967=_0x300a5c,_0x3e7f70=this;this[_0x3be967('0xd')][_0x3be967('0x1f')](function(){const _0x5f36d7=_0x3be967;return _0x3e7f70[_0x5f36d7('0x8')]['changeColumn'](_0x42275e,_0x4f02f7,_0x1773ed)[_0x5f36d7('0x13')](function(){const _0x68628e=_0x5f36d7;logger[_0x68628e('0x11')](_0x68628e('0xc'),_0x4f02f7,_0x42275e);})[_0x5f36d7('0x12')](function(_0x98af7c){const _0x135da9=_0x5f36d7;logger[_0x135da9('0x11')](JSON['stringify'](_0x98af7c));});});},Migration['prototype'][_0x300a5c('0xa')]=function(_0x538c9c,_0x3d4b63,_0x217fe7){const _0x79dc9b=_0x300a5c,_0x460683=this;this['sequence'][_0x79dc9b('0x1f')](function(){const _0x1449f3=_0x79dc9b;return _0x460683['queryInterface'][_0x1449f3('0xa')](_0x538c9c,_0x3d4b63,_0x217fe7)[_0x1449f3('0x13')](function(){const _0x229aac=_0x1449f3;logger['info'](_0x229aac('0xe'),_0x3d4b63,_0x538c9c);})[_0x1449f3('0x12')](function(_0x33a875){const _0x17afbf=_0x1449f3;logger[_0x17afbf('0x11')](JSON[_0x17afbf('0x15')](_0x33a875));});});},Migration[_0x300a5c('0x21')][_0x300a5c('0x1a')]=function(_0x48f441){const _0x41d512=_0x300a5c,_0xe783d7=this;this[_0x41d512('0xd')][_0x41d512('0x1f')](function(){const _0x1732aa=_0x41d512;return _0xe783d7['queryInterface'][_0x1732aa('0x1a')](_0x48f441,{'force':!![]})[_0x1732aa('0x13')](function(){const _0xfb6735=_0x1732aa;logger[_0xfb6735('0x11')](_0xfb6735('0x14'),_0x48f441);})[_0x1732aa('0x12')](function(_0xa3f2b1){logger['info'](JSON['stringify'](_0xa3f2b1));});});},Migration[_0x300a5c('0x21')]['addIndex']=function(_0x3488b2,_0x28a515,_0x75176e){const _0x2f4aaf=_0x300a5c,_0x198520=this;this['sequence'][_0x2f4aaf('0x1f')](function(){const _0x3d9afe=_0x2f4aaf;return _0x198520[_0x3d9afe('0x8')][_0x3d9afe('0x3')](_0x3488b2,_0x28a515,{'indexName':_0x75176e})[_0x3d9afe('0x13')](function(){const _0x247931=_0x3d9afe;logger[_0x247931('0x11')]('addIndex\x20%s\x20%s\x20%s',_0x3488b2,_0x28a515[_0x247931('0xb')](','),_0x75176e);})['catch'](function(_0x5262e7){const _0xf1b122=_0x3d9afe;logger['info'](JSON[_0xf1b122('0x15')](_0x5262e7));});});},Migration[_0x300a5c('0x21')]['query']=function(_0x1df685){const _0x4263c4=this;this['sequence']['enqueue'](function(){const _0x54f42f=a937_0x41f9;return _0x4263c4[_0x54f42f('0x8')]['sequelize'][_0x54f42f('0xf')](_0x1df685)[_0x54f42f('0x13')](function(){const _0x3711cc=_0x54f42f;logger[_0x3711cc('0x11')](_0x3711cc('0x4'),_0x1df685);})[_0x54f42f('0x12')](function(_0xa8d2e0){const _0x1597e7=_0x54f42f;logger[_0x1597e7('0x11')](JSON[_0x1597e7('0x15')](_0xa8d2e0));});});},Migration[_0x300a5c('0x21')]['removeColumn']=function(_0xb89a68,_0x4f0bd6){const _0x538efa=_0x300a5c,_0x40b2a3=this;this[_0x538efa('0xd')][_0x538efa('0x1f')](function(){const _0x385cae=_0x538efa;return _0x40b2a3[_0x385cae('0x8')]['removeColumn'](_0xb89a68,_0x4f0bd6)['then'](function(){const _0x3e94ca=_0x385cae;logger[_0x3e94ca('0x11')](_0x3e94ca('0x1e'),_0x4f0bd6,_0xb89a68);})[_0x385cae('0x12')](function(_0x584443){const _0x1c9cca=_0x385cae;logger[_0x1c9cca('0x11')](util[_0x1c9cca('0x19')](_0x584443,{'showHidden':![],'depth':null}));});});},Migration['prototype'][_0x300a5c('0x1b')]=function(_0x1b8063,_0x2f1425,_0x2ba9e2){const _0x1ee340=_0x300a5c,_0x21d854=this;this[_0x1ee340('0xd')][_0x1ee340('0x1f')](function(){const _0x4cd1c7=_0x1ee340;return _0x21d854[_0x4cd1c7('0x8')][_0x4cd1c7('0x1b')](_0x1b8063,_0x2f1425,_0x2ba9e2)['then'](function(){const _0x5e81c6=_0x4cd1c7;logger['info'](_0x5e81c6('0x0'),_0x2f1425,_0x2ba9e2,_0x1b8063);})['catch'](function(_0x502214){const _0x37a0eb=_0x4cd1c7;logger[_0x37a0eb('0x11')](util[_0x37a0eb('0x19')](_0x502214,{'showHidden':![],'depth':null}));});});},Migration[_0x300a5c('0x21')]['final']=function(_0x1d4481){const _0x1a229d=_0x300a5c;this[_0x1a229d('0xd')][_0x1a229d('0x1f')](function(){return _0x1d4481();});},module[_0x300a5c('0x6')]={'up':function(_0xd6b2b,_0x4c9440){return new Promise(function(_0x873c81){const _0x2f6deb=a937_0x41f9,_0x2787fb=new Migration(_0xd6b2b);_0x2787fb[_0x2f6deb('0xf')](_0x2f6deb('0x17')),_0x2787fb[_0x2f6deb('0x3')](_0x2f6deb('0x1d'),[_0x2f6deb('0x9')],'queue'),_0x2787fb[_0x2f6deb('0x3')](_0x2f6deb('0x1d'),[_0x2f6deb('0x7')],_0x2f6deb('0x7')),_0x2787fb['addColumn'](_0x2f6deb('0x1d'),_0x2f6deb('0x2'),{'type':_0x4c9440[_0x2f6deb('0x5')]}),_0x2787fb[_0x2f6deb('0xf')]('INSERT\x20INTO\x20`square_projects`\x20(`name`,\x20`description`,\x20`notes`,\x20`preproduction`,\x20`production`,\x20`createdAt`,\x20`updatedAt`)\x20VALUES\x20(\x27AgentManagement\x27,\x20\x27Agent\x20Management\x20sample\x20auto\x20generated\x27,\x20NULL,\x20X\x273C6D7847726170684D6F64656C20677269643D223122206775696465733D22312220746F6F6C746970733D22312220636F6E6E6563743D22312220666F6C643D22312220706167653D22302220706167655363616C653D223122207061676557696474683D223832362220706167654865696768743D2231313639223E0A20203C726F6F743E0A202020203C6D7843656C6C2069643D2230222F3E0A202020203C6D7843656C6C2069643D22312220706172656E743D2230222F3E0A202020203C7374617274206C6162656C3D2253746172742220616E737765723D22796573222069643D2239223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F656E7472792F73746172745F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D2234302220793D22323338222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F73746172743E0A202020203C6D656E75206C6162656C3D224D656E75222066696C655F69643D222220726573706F6E73653D2235222064696769743D2231222072657472793D223122207661726961626C655F69643D2230222069643D223136223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F706C61796261636B2F6D656E755F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223137302220793D22323338222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F6D656E753E0A202020203C6C6F67696E206C6162656C3D224C6F67696E222066696E6442793D22696E7465726E616C222069643D223339223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F6167656E745F6D616E6167656D656E742F6C6F67696E5F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223332302220793D223132222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F6C6F67696E3E0A202020203C7061757365206C6162656C3D225061757365222066696E6442793D22696E7465726E616C222070617573655F69643D22222069643D223430223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F6167656E745F6D616E6167656D656E742F70617573655F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223332302220793D22333434222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F70617573653E0A202020203C756E7061757365206C6162656C3D22556E7061757365222066696E6442793D22696E7465726E616C222069643D223431223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F6167656E745F6D616E6167656D656E742F756E70617573655F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223332302220793D22343634222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F756E70617573653E0A202020203C6C6F676F7574206C6162656C3D224C6F676F7574222066696E6442793D22696E7465726E616C222069643D223432223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F6167656E745F6D616E6167656D656E742F6C6F676F75745F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223332302220793D22313332222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F6C6F676F75743E0A202020203C6D7843656C6C2069643D223433222076616C75653D22312220706172656E743D22312220736F757263653D22313622207461726765743D2233392220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279223E0A20202020202020203C41727261792061733D22706F696E7473223E0A202020202020202020203C6D78506F696E7420783D223231302220793D22313432222F3E0A20202020202020203C2F41727261793E0A2020202020203C2F6D7847656F6D657472793E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223434222076616C75653D22322220706172656E743D22312220736F757263653D22313622207461726765743D2234322220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223435222076616C75653D22332220706172656E743D22312220736F757263653D22313622207461726765743D2234302220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223436222076616C75653D22342220706172656E743D22312220736F757263653D22313622207461726765743D2234312220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279223E0A20202020202020203C41727261792061733D22706F696E7473223E0A202020202020202020203C6D78506F696E7420783D223231302220793D22343134222F3E0A20202020202020203C2F41727261793E0A2020202020203C2F6D7847656F6D657472793E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D2234372220706172656E743D22312220736F757263653D223922207461726765743D2231362220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C706C61796261636B206C6162656C3D22506C61796261636B222066696C655F69643D2222206F7074733D22222069643D223438223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F706C61796261636B2F706C61796261636B5F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223435302220793D22323338222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F706C61796261636B3E0A202020203C6D7843656C6C2069643D223530222076616C75653D226661696C7572652220706172656E743D22312220736F757263653D22343222207461726765743D2234382220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223531222076616C75653D226661696C7572652220706172656E743D22312220736F757263653D22343022207461726765743D2234382220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C68616E677570206C6162656C3D2248616E677570222069643D223533223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F63616C6C5F6D616E6167656D656E742F68616E6775705F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223735302220793D22323338222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F68616E6775703E0A202020203C6D7843656C6C2069643D2235342220706172656E743D22312220736F757263653D22343822207461726765743D2235332220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223535222076616C75653D226661696C7572652220706172656E743D22312220736F757263653D22333922207461726765743D2234382220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279223E0A20202020202020203C41727261792061733D22706F696E7473223E0A202020202020202020203C6D78506F696E7420783D223439302220793D22313730222F3E0A20202020202020203C2F41727261793E0A2020202020203C2F6D7847656F6D657472793E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223536222076616C75653D226661696C7572652220706172656E743D22312220736F757263653D22343122207461726765743D2234382220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279223E0A20202020202020203C41727261792061733D22706F696E7473223E0A202020202020202020203C6D78506F696E7420783D223439302220793D22333930222F3E0A20202020202020203C2F41727261793E0A2020202020203C2F6D7847656F6D657472793E0A202020203C2F6D7843656C6C3E0A202020203C706C61796261636B206C6162656C3D22506C61796261636B222066696C655F69643D2222206F7074733D22222069643D223537223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F706C61796261636B2F706C61796261636B5F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223630302220793D22313332222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F706C61796261636B3E0A202020203C706C61796261636B206C6162656C3D22506C61796261636B222066696C655F69643D2222206F7074733D22222069643D223538223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F706C61796261636B2F706C61796261636B5F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223630302220793D223132222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F706C61796261636B3E0A202020203C706C61796261636B206C6162656C3D22506C61796261636B222066696C655F69643D2222206F7074733D22222069643D223539223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F706C61796261636B2F706C61796261636B5F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223630302220793D22333434222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F706C61796261636B3E0A202020203C706C61796261636B206C6162656C3D22506C61796261636B222066696C655F69643D2222206F7074733D22222069643D223630223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F706C61796261636B2F706C61796261636B5F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223630302220793D22343634222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F706C61796261636B3E0A202020203C6D7843656C6C2069643D223631222076616C75653D22737563636573732220706172656E743D22312220736F757263653D22333922207461726765743D2235382220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223632222076616C75653D22737563636573732220706172656E743D22312220736F757263653D22343222207461726765743D2235372220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223633222076616C75653D22737563636573732220706172656E743D22312220736F757263653D22343022207461726765743D2235392220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223634222076616C75653D22737563636573732220706172656E743D22312220736F757263653D22343122207461726765743D2236302220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D2236352220706172656E743D22312220736F757263653D22353822207461726765743D2235332220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D2236362220706172656E743D22312220736F757263653D22353722207461726765743D2235332220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D2236372220706172656E743D22312220736F757263653D22353922207461726765743D2235332220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D2236382220706172656E743D22312220736F757263653D22363022207461726765743D2235332220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A20203C2F726F6F743E0A3C2F6D7847726170684D6F64656C3E\x27,\x20X\x273C6D7847726170684D6F64656C20677269643D223122206775696465733D22312220746F6F6C746970733D22312220636F6E6E6563743D22312220666F6C643D22312220706167653D22302220706167655363616C653D223122207061676557696474683D223832362220706167654865696768743D2231313639223E0A20203C726F6F743E0A202020203C6D7843656C6C2069643D2230222F3E0A202020203C6D7843656C6C2069643D22312220706172656E743D2230222F3E0A202020203C7374617274206C6162656C3D2253746172742220616E737765723D22796573222069643D2239223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F656E7472792F73746172745F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D2234302220793D22323338222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F73746172743E0A202020203C6D656E75206C6162656C3D224D656E75222066696C655F69643D222220726573706F6E73653D2235222064696769743D2231222072657472793D223122207661726961626C655F69643D2230222069643D223136223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F706C61796261636B2F6D656E755F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223137302220793D22323338222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F6D656E753E0A202020203C6C6F67696E206C6162656C3D224C6F67696E222066696E6442793D22696E7465726E616C222069643D223339223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F6167656E745F6D616E6167656D656E742F6C6F67696E5F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223332302220793D223132222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F6C6F67696E3E0A202020203C7061757365206C6162656C3D225061757365222066696E6442793D22696E7465726E616C222070617573655F69643D22222069643D223430223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F6167656E745F6D616E6167656D656E742F70617573655F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223332302220793D22333434222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F70617573653E0A202020203C756E7061757365206C6162656C3D22556E7061757365222066696E6442793D22696E7465726E616C222069643D223431223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F6167656E745F6D616E6167656D656E742F756E70617573655F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223332302220793D22343634222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F756E70617573653E0A202020203C6C6F676F7574206C6162656C3D224C6F676F7574222066696E6442793D22696E7465726E616C222069643D223432223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F6167656E745F6D616E6167656D656E742F6C6F676F75745F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223332302220793D22313332222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F6C6F676F75743E0A202020203C6D7843656C6C2069643D223433222076616C75653D22312220706172656E743D22312220736F757263653D22313622207461726765743D2233392220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279223E0A20202020202020203C41727261792061733D22706F696E7473223E0A202020202020202020203C6D78506F696E7420783D223231302220793D22313432222F3E0A20202020202020203C2F41727261793E0A2020202020203C2F6D7847656F6D657472793E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223434222076616C75653D22322220706172656E743D22312220736F757263653D22313622207461726765743D2234322220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223435222076616C75653D22332220706172656E743D22312220736F757263653D22313622207461726765743D2234302220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223436222076616C75653D22342220706172656E743D22312220736F757263653D22313622207461726765743D2234312220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279223E0A20202020202020203C41727261792061733D22706F696E7473223E0A202020202020202020203C6D78506F696E7420783D223231302220793D22343134222F3E0A20202020202020203C2F41727261793E0A2020202020203C2F6D7847656F6D657472793E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D2234372220706172656E743D22312220736F757263653D223922207461726765743D2231362220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C706C61796261636B206C6162656C3D22506C61796261636B222066696C655F69643D2222206F7074733D22222069643D223438223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F706C61796261636B2F706C61796261636B5F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223435302220793D22323338222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F706C61796261636B3E0A202020203C6D7843656C6C2069643D223530222076616C75653D226661696C7572652220706172656E743D22312220736F757263653D22343222207461726765743D2234382220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223531222076616C75653D226661696C7572652220706172656E743D22312220736F757263653D22343022207461726765743D2234382220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C68616E677570206C6162656C3D2248616E677570222069643D223533223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F63616C6C5F6D616E6167656D656E742F68616E6775705F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223735302220793D22323338222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F68616E6775703E0A202020203C6D7843656C6C2069643D2235342220706172656E743D22312220736F757263653D22343822207461726765743D2235332220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223535222076616C75653D226661696C7572652220706172656E743D22312220736F757263653D22333922207461726765743D2234382220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279223E0A20202020202020203C41727261792061733D22706F696E7473223E0A202020202020202020203C6D78506F696E7420783D223439302220793D22313730222F3E0A20202020202020203C2F41727261793E0A2020202020203C2F6D7847656F6D657472793E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223536222076616C75653D226661696C7572652220706172656E743D22312220736F757263653D22343122207461726765743D2234382220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279223E0A20202020202020203C41727261792061733D22706F696E7473223E0A202020202020202020203C6D78506F696E7420783D223439302220793D22333930222F3E0A20202020202020203C2F41727261793E0A2020202020203C2F6D7847656F6D657472793E0A202020203C2F6D7843656C6C3E0A202020203C706C61796261636B206C6162656C3D22506C61796261636B222066696C655F69643D2222206F7074733D22222069643D223537223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F706C61796261636B2F706C61796261636B5F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223630302220793D22313332222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F706C61796261636B3E0A202020203C706C61796261636B206C6162656C3D22506C61796261636B222066696C655F69643D2222206F7074733D22222069643D223538223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F706C61796261636B2F706C61796261636B5F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223630302220793D223132222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F706C61796261636B3E0A202020203C706C61796261636B206C6162656C3D22506C61796261636B222066696C655F69643D2222206F7074733D22222069643D223539223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F706C61796261636B2F706C61796261636B5F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223630302220793D22333434222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F706C61796261636B3E0A202020203C706C61796261636B206C6162656C3D22506C61796261636B222066696C655F69643D2222206F7074733D22222069643D223630223E0A2020202020203C6D7843656C6C207374796C653D22696D6167653B68746D6C3D313B6C6162656C4261636B67726F756E64436F6C6F723D236666666666663B696D6167653D2F6173736574732F706C7567696E732F7371756172652F7374656E63696C732F706C61796261636B2F706C61796261636B5F313238783132382E706E672220706172656E743D223122207665727465783D2231223E0A20202020202020203C6D7847656F6D6574727920783D223630302220793D22343634222077696474683D22383022206865696768743D223830222061733D2267656F6D65747279222F3E0A2020202020203C2F6D7843656C6C3E0A202020203C2F706C61796261636B3E0A202020203C6D7843656C6C2069643D223631222076616C75653D22737563636573732220706172656E743D22312220736F757263653D22333922207461726765743D2235382220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223632222076616C75653D22737563636573732220706172656E743D22312220736F757263653D22343222207461726765743D2235372220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223633222076616C75653D22737563636573732220706172656E743D22312220736F757263653D22343022207461726765743D2235392220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D223634222076616C75653D22737563636573732220706172656E743D22312220736F757263653D22343122207461726765743D2236302220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D2236352220706172656E743D22312220736F757263653D22353822207461726765743D2235332220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D2236362220706172656E743D22312220736F757263653D22353722207461726765743D2235332220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D2236372220706172656E743D22312220736F757263653D22353922207461726765743D2235332220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A202020203C6D7843656C6C2069643D2236382220706172656E743D22312220736F757263653D22363022207461726765743D2235332220656467653D2231223E0A2020202020203C6D7847656F6D657472792072656C61746976653D2231222061733D2267656F6D65747279222F3E0A202020203C2F6D7843656C6C3E0A20203C2F726F6F743E0A3C2F6D7847726170684D6F64656C3E\x27,\x20\x272018-05-24\x2011:44:53\x27,\x20\x272018-05-24\x2011:44:53\x27);'),_0x2787fb[_0x2f6deb('0xf')](_0x2f6deb('0x18')),_0x2787fb['query'](_0x2f6deb('0x22')),_0x2787fb['query']('INSERT\x20INTO\x20`tools_sounds`\x20(`name`,\x20`save_name`,\x20`display_name`,\x20`description`,\x20`original_format`,\x20`original_duration`,\x20`original_sampleCount`,\x20`original_channelCount`,\x20`original_bitRate`,\x20`original_sampleRate`,\x20`converted_format`,\x20`converted_duration`,\x20`converted_sampleCount`,\x20`converted_channelCount`,\x20`converted_bitRate`,\x20`converted_sampleRate`,\x20`createdAt`,\x20`updatedAt`)\x20VALUES\x20(\x27Agent\x20Menu\x27,\x20\x27agentmanagement-menu\x27,\x20\x27Agent\x20Menu\x27,\x20\x27auto\x20generated\x20sound\x27,\x20\x27wav\x27,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20\x27wav\x27,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20\x272018-05-24\x2011:44:53\x27,\x20\x272018-05-24\x2011:44:53\x27);'),_0x2787fb['query']('INSERT\x20INTO\x20`tools_sounds`\x20(`name`,\x20`save_name`,\x20`display_name`,\x20`description`,\x20`original_format`,\x20`original_duration`,\x20`original_sampleCount`,\x20`original_channelCount`,\x20`original_bitRate`,\x20`original_sampleRate`,\x20`converted_format`,\x20`converted_duration`,\x20`converted_sampleCount`,\x20`converted_channelCount`,\x20`converted_bitRate`,\x20`converted_sampleRate`,\x20`createdAt`,\x20`updatedAt`)\x20VALUES\x20(\x27Agent\x20Pause\x27,\x20\x27agentmanagement-pause\x27,\x20\x27Agent\x20Pause\x27,\x20\x27auto\x20generated\x20sound\x27,\x20\x27mp3\x27,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20\x27wav\x27,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20NULL,\x20\x272018-05-24\x2011:44:53\x27,\x20\x272018-05-24\x2011:44:53\x27);'),_0x2787fb[_0x2f6deb('0xf')](_0x2f6deb('0x1c')),_0x2787fb[_0x2f6deb('0xf')](_0x2f6deb('0x1')),_0x2787fb[_0x2f6deb('0x20')](_0x873c81);});},'down':function(){}};
\ No newline at end of file
diff --git a/server/migrations/2.0.59.js b/server/migrations/2.0.59.js
index 11908b0..5ed7077 100644
--- a/server/migrations/2.0.59.js
+++ b/server/migrations/2.0.59.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.60.js b/server/migrations/2.0.60.js
index 1b4553f..d4e831a 100644
--- a/server/migrations/2.0.60.js
+++ b/server/migrations/2.0.60.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.61.js b/server/migrations/2.0.61.js
index 03cf5da..07cf3bf 100644
--- a/server/migrations/2.0.61.js
+++ b/server/migrations/2.0.61.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.62.js b/server/migrations/2.0.62.js
index 0708706..4c661de 100644
--- a/server/migrations/2.0.62.js
+++ b/server/migrations/2.0.62.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.63.js b/server/migrations/2.0.63.js
index 368f8c9..1bf3ec2 100644
--- a/server/migrations/2.0.63.js
+++ b/server/migrations/2.0.63.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.64.js b/server/migrations/2.0.64.js
index a9717d3..08b75f0 100644
--- a/server/migrations/2.0.64.js
+++ b/server/migrations/2.0.64.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.65.js b/server/migrations/2.0.65.js
index 26308bf..69b558b 100644
--- a/server/migrations/2.0.65.js
+++ b/server/migrations/2.0.65.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.66.js b/server/migrations/2.0.66.js
index a178b91..20b8ced 100644
--- a/server/migrations/2.0.66.js
+++ b/server/migrations/2.0.66.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.67.js b/server/migrations/2.0.67.js
index 32d23d9..3b2aefe 100644
--- a/server/migrations/2.0.67.js
+++ b/server/migrations/2.0.67.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.68.js b/server/migrations/2.0.68.js
index 7ec70a3..eab5272 100644
--- a/server/migrations/2.0.68.js
+++ b/server/migrations/2.0.68.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.69.js b/server/migrations/2.0.69.js
index a7cfbd5..7cb712b 100644
--- a/server/migrations/2.0.69.js
+++ b/server/migrations/2.0.69.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.70.js b/server/migrations/2.0.70.js
index 1ad4d23..f9a9479 100644
--- a/server/migrations/2.0.70.js
+++ b/server/migrations/2.0.70.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.71.js b/server/migrations/2.0.71.js
index e5c7522..f0b29c1 100644
--- a/server/migrations/2.0.71.js
+++ b/server/migrations/2.0.71.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.72.js b/server/migrations/2.0.72.js
index 8fd0b19..503de7a 100644
--- a/server/migrations/2.0.72.js
+++ b/server/migrations/2.0.72.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.73.js b/server/migrations/2.0.73.js
index 772cf71..98730fa 100644
--- a/server/migrations/2.0.73.js
+++ b/server/migrations/2.0.73.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.74.js b/server/migrations/2.0.74.js
index 6666978..1b01093 100644
--- a/server/migrations/2.0.74.js
+++ b/server/migrations/2.0.74.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.75.js b/server/migrations/2.0.75.js
index 913441d..543bd8f 100644
--- a/server/migrations/2.0.75.js
+++ b/server/migrations/2.0.75.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.76.js b/server/migrations/2.0.76.js
index 489b760..ef326d8 100644
--- a/server/migrations/2.0.76.js
+++ b/server/migrations/2.0.76.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.77.js b/server/migrations/2.0.77.js
index ed5eb05..fe4a29d 100644
--- a/server/migrations/2.0.77.js
+++ b/server/migrations/2.0.77.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.78.js b/server/migrations/2.0.78.js
index 77a6f8f..234664e 100644
--- a/server/migrations/2.0.78.js
+++ b/server/migrations/2.0.78.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.79.js b/server/migrations/2.0.79.js
index 8cc0b4c..5e68d35 100644
--- a/server/migrations/2.0.79.js
+++ b/server/migrations/2.0.79.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.80.js b/server/migrations/2.0.80.js
index 9352cf7..be74a02 100644
--- a/server/migrations/2.0.80.js
+++ b/server/migrations/2.0.80.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.81.js b/server/migrations/2.0.81.js
index 944ebae..303da3b 100644
--- a/server/migrations/2.0.81.js
+++ b/server/migrations/2.0.81.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.82.js b/server/migrations/2.0.82.js
index 2fbd65f..cf5fed7 100644
--- a/server/migrations/2.0.82.js
+++ b/server/migrations/2.0.82.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.83.js b/server/migrations/2.0.83.js
index d6dbdd9..86be74d 100644
--- a/server/migrations/2.0.83.js
+++ b/server/migrations/2.0.83.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.0.84.js b/server/migrations/2.0.84.js
index f86bdd7..eaa891d 100644
--- a/server/migrations/2.0.84.js
+++ b/server/migrations/2.0.84.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.1.0.js b/server/migrations/2.1.0.js
index a9957e2..32a1f08 100644
--- a/server/migrations/2.1.0.js
+++ b/server/migrations/2.1.0.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.2.0.js b/server/migrations/2.2.0.js
index 4f08225..18e68f3 100644
--- a/server/migrations/2.2.0.js
+++ b/server/migrations/2.2.0.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.2.1.js b/server/migrations/2.2.1.js
index 27f929f..c3568bd 100644
--- a/server/migrations/2.2.1.js
+++ b/server/migrations/2.2.1.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.2.2.js b/server/migrations/2.2.2.js
index de52c54..8f841d6 100644
--- a/server/migrations/2.2.2.js
+++ b/server/migrations/2.2.2.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.2.3.js b/server/migrations/2.2.3.js
index a56782d..fb4202f 100644
--- a/server/migrations/2.2.3.js
+++ b/server/migrations/2.2.3.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.2.4.js b/server/migrations/2.2.4.js
index e5a9082..27ba9aa 100644
--- a/server/migrations/2.2.4.js
+++ b/server/migrations/2.2.4.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.2.5.js b/server/migrations/2.2.5.js
index fee68a2..81f7b81 100644
--- a/server/migrations/2.2.5.js
+++ b/server/migrations/2.2.5.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.2.6.js b/server/migrations/2.2.6.js
index 94989c2..67f9515 100644
--- a/server/migrations/2.2.6.js
+++ b/server/migrations/2.2.6.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.3.0.js b/server/migrations/2.3.0.js
index 36d9df2..1f04074 100644
--- a/server/migrations/2.3.0.js
+++ b/server/migrations/2.3.0.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.3.1.js b/server/migrations/2.3.1.js
index 7afe5ce..def97af 100644
--- a/server/migrations/2.3.1.js
+++ b/server/migrations/2.3.1.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.3.10.js b/server/migrations/2.3.10.js
index ecb2049..bc74c7e 100644
--- a/server/migrations/2.3.10.js
+++ b/server/migrations/2.3.10.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.3.2.js b/server/migrations/2.3.2.js
index 27da904..e434c91 100644
--- a/server/migrations/2.3.2.js
+++ b/server/migrations/2.3.2.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.3.3.js b/server/migrations/2.3.3.js
index 338bcb1..d1dcb57 100644
--- a/server/migrations/2.3.3.js
+++ b/server/migrations/2.3.3.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.3.4.js b/server/migrations/2.3.4.js
index 947c3a0..084ccbe 100644
--- a/server/migrations/2.3.4.js
+++ b/server/migrations/2.3.4.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.3.5.js b/server/migrations/2.3.5.js
index 80ff817..f181ecd 100644
--- a/server/migrations/2.3.5.js
+++ b/server/migrations/2.3.5.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.3.6.js b/server/migrations/2.3.6.js
index 2748522..baad346 100644
--- a/server/migrations/2.3.6.js
+++ b/server/migrations/2.3.6.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.3.7.js b/server/migrations/2.3.7.js
index 2a6bd32..657fee3 100644
--- a/server/migrations/2.3.7.js
+++ b/server/migrations/2.3.7.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.3.8.js b/server/migrations/2.3.8.js
index d1ef393..6719fea 100644
--- a/server/migrations/2.3.8.js
+++ b/server/migrations/2.3.8.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.3.9.js b/server/migrations/2.3.9.js
index 54d5273..758d814 100644
--- a/server/migrations/2.3.9.js
+++ b/server/migrations/2.3.9.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.3.91.js b/server/migrations/2.3.91.js
index ad0fba5..bdc080b 100644
--- a/server/migrations/2.3.91.js
+++ b/server/migrations/2.3.91.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.3.92.js b/server/migrations/2.3.92.js
index 66a09b8..cd2130f 100644
--- a/server/migrations/2.3.92.js
+++ b/server/migrations/2.3.92.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.3.93.js b/server/migrations/2.3.93.js
index b3903a6..5cf37a2 100644
--- a/server/migrations/2.3.93.js
+++ b/server/migrations/2.3.93.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.3.94.js b/server/migrations/2.3.94.js
index 448586b..239722c 100644
--- a/server/migrations/2.3.94.js
+++ b/server/migrations/2.3.94.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.3.95.js b/server/migrations/2.3.95.js
index 0fa7fac..df439cf 100644
--- a/server/migrations/2.3.95.js
+++ b/server/migrations/2.3.95.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.3.96.js b/server/migrations/2.3.96.js
index df0f00a..7de2116 100644
--- a/server/migrations/2.3.96.js
+++ b/server/migrations/2.3.96.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.3.97.js b/server/migrations/2.3.97.js
index 6618962..41be919 100644
--- a/server/migrations/2.3.97.js
+++ b/server/migrations/2.3.97.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.3.98.js b/server/migrations/2.3.98.js
index e1100fb..6619c0e 100644
--- a/server/migrations/2.3.98.js
+++ b/server/migrations/2.3.98.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.4.0.js b/server/migrations/2.4.0.js
index 0e47afa..900f989 100644
--- a/server/migrations/2.4.0.js
+++ b/server/migrations/2.4.0.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.4.1.js b/server/migrations/2.4.1.js
index f17cd73..4008c17 100644
--- a/server/migrations/2.4.1.js
+++ b/server/migrations/2.4.1.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.4.10.js b/server/migrations/2.4.10.js
index cc5399b..d476124 100644
--- a/server/migrations/2.4.10.js
+++ b/server/migrations/2.4.10.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.4.11.js b/server/migrations/2.4.11.js
index 8625e44..355e05f 100644
--- a/server/migrations/2.4.11.js
+++ b/server/migrations/2.4.11.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.4.12.js b/server/migrations/2.4.12.js
index 9200c39..ed47c24 100644
--- a/server/migrations/2.4.12.js
+++ b/server/migrations/2.4.12.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.4.13.js b/server/migrations/2.4.13.js
index c236edd..b54fc3c 100644
--- a/server/migrations/2.4.13.js
+++ b/server/migrations/2.4.13.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.4.14.js b/server/migrations/2.4.14.js
index f08622a..7a46be8 100644
--- a/server/migrations/2.4.14.js
+++ b/server/migrations/2.4.14.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.4.15.js b/server/migrations/2.4.15.js
index 04c3fbf..52f341b 100644
--- a/server/migrations/2.4.15.js
+++ b/server/migrations/2.4.15.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.4.16.js b/server/migrations/2.4.16.js
index 4739845..d38eda6 100644
--- a/server/migrations/2.4.16.js
+++ b/server/migrations/2.4.16.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.4.17.js b/server/migrations/2.4.17.js
index 1fa01e3..97a47bc 100644
--- a/server/migrations/2.4.17.js
+++ b/server/migrations/2.4.17.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.4.18.js b/server/migrations/2.4.18.js
index d7095b2..f90b04e 100644
--- a/server/migrations/2.4.18.js
+++ b/server/migrations/2.4.18.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.4.19.js b/server/migrations/2.4.19.js
index aab26e0..2ef190d 100644
--- a/server/migrations/2.4.19.js
+++ b/server/migrations/2.4.19.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.4.2.js b/server/migrations/2.4.2.js
index 83bb1fe..edc73ee 100644
--- a/server/migrations/2.4.2.js
+++ b/server/migrations/2.4.2.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.4.20.js b/server/migrations/2.4.20.js
index b966c21..1e1d930 100644
--- a/server/migrations/2.4.20.js
+++ b/server/migrations/2.4.20.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.4.21.js b/server/migrations/2.4.21.js
index f22d6df..2c416ab 100644
--- a/server/migrations/2.4.21.js
+++ b/server/migrations/2.4.21.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.4.3.js b/server/migrations/2.4.3.js
index 1a3459e..ac697df 100644
--- a/server/migrations/2.4.3.js
+++ b/server/migrations/2.4.3.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.4.4.js b/server/migrations/2.4.4.js
index 66554a7..d7e18d6 100644
--- a/server/migrations/2.4.4.js
+++ b/server/migrations/2.4.4.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.4.5.js b/server/migrations/2.4.5.js
index 310c1b3..986009f 100644
--- a/server/migrations/2.4.5.js
+++ b/server/migrations/2.4.5.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.4.6.js b/server/migrations/2.4.6.js
index 4f6eae7..a1af136 100644
--- a/server/migrations/2.4.6.js
+++ b/server/migrations/2.4.6.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.4.7.js b/server/migrations/2.4.7.js
index 88bd603..fd69006 100644
--- a/server/migrations/2.4.7.js
+++ b/server/migrations/2.4.7.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.4.8.js b/server/migrations/2.4.8.js
index c93141b..e95dbf3 100644
--- a/server/migrations/2.4.8.js
+++ b/server/migrations/2.4.8.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.4.9.js b/server/migrations/2.4.9.js
index e52d184..9458f1f 100644
--- a/server/migrations/2.4.9.js
+++ b/server/migrations/2.4.9.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.5.0.js b/server/migrations/2.5.0.js
index 51e11e5..1968e5d 100644
--- a/server/migrations/2.5.0.js
+++ b/server/migrations/2.5.0.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.5.1.js b/server/migrations/2.5.1.js
index fc793f4..a3ee6ae 100644
--- a/server/migrations/2.5.1.js
+++ b/server/migrations/2.5.1.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.5.2.js b/server/migrations/2.5.2.js
index d9bdba3..a214fdc 100644
--- a/server/migrations/2.5.2.js
+++ b/server/migrations/2.5.2.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.5.3.js b/server/migrations/2.5.3.js
index 1974362..e851b73 100644
--- a/server/migrations/2.5.3.js
+++ b/server/migrations/2.5.3.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.5.4.js b/server/migrations/2.5.4.js
index 1fa1213..f6aa904 100644
--- a/server/migrations/2.5.4.js
+++ b/server/migrations/2.5.4.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.5.5.js b/server/migrations/2.5.5.js
index 7f606ec..e91e9cc 100644
--- a/server/migrations/2.5.5.js
+++ b/server/migrations/2.5.5.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/2.5.6.js b/server/migrations/2.5.6.js
index e654a79..990a556 100644
--- a/server/migrations/2.5.6.js
+++ b/server/migrations/2.5.6.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/migrations/3.0.0-alpha.js b/server/migrations/3.0.0-alpha.js
index 3e0a080..0f13283 100644
--- a/server/migrations/3.0.0-alpha.js
+++ b/server/migrations/3.0.0-alpha.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/mysqldb/index.js b/server/mysqldb/index.js
index dd09045..ad0446d 100644
--- a/server/mysqldb/index.js
+++ b/server/mysqldb/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/rediscache/index.js b/server/rediscache/index.js
index 5691611..168ca12 100644
--- a/server/rediscache/index.js
+++ b/server/rediscache/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/routes.js b/server/routes.js
index 042c116..96134ad 100644
--- a/server/routes.js
+++ b/server/routes.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/rpc/index.js b/server/rpc/index.js
index 1fd98fe..e7c7129 100644
--- a/server/rpc/index.js
+++ b/server/rpc/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/agi/channel.js b/server/services/agi/channel.js
index 4222e3a..b9a97fd 100644
--- a/server/services/agi/channel.js
+++ b/server/services/agi/channel.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/agi/error.js b/server/services/agi/error.js
index a55c9a9..b3004db 100644
--- a/server/services/agi/error.js
+++ b/server/services/agi/error.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/agi/graph/index.js b/server/services/agi/graph/index.js
index 9e68424..fa933ae 100644
--- a/server/services/agi/graph/index.js
+++ b/server/services/agi/graph/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/agi/index.js b/server/services/agi/index.js
index 2e9cdb7..98d5c9b 100644
--- a/server/services/agi/index.js
+++ b/server/services/agi/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/agi/mailRpc/index.js b/server/services/agi/mailRpc/index.js
index 3c037ac..bfe71a5 100644
--- a/server/services/agi/mailRpc/index.js
+++ b/server/services/agi/mailRpc/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/agi/reply.js b/server/services/agi/reply.js
index 0bc14d2..fada2f5 100644
--- a/server/services/agi/reply.js
+++ b/server/services/agi/reply.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/agi/rpc/index.js b/server/services/agi/rpc/index.js
index 9254176..73bbc78 100644
--- a/server/services/agi/rpc/index.js
+++ b/server/services/agi/rpc/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/agi/scripts/aws/index.js b/server/services/agi/scripts/aws/index.js
index 68fe04c..246ec0c 100644
--- a/server/services/agi/scripts/aws/index.js
+++ b/server/services/agi/scripts/aws/index.js
@@ -1 +1 @@
-const a1032_0x3efc=['./polly','exports','./lex'];(function(_0x24a8b4,_0x3efc4a){const _0x25c14b=function(_0x3bc862){while(--_0x3bc862){_0x24a8b4['push'](_0x24a8b4['shift']());}};_0x25c14b(++_0x3efc4a);}(a1032_0x3efc,0x6f));const a1032_0x25c1=function(_0x24a8b4,_0x3efc4a){_0x24a8b4=_0x24a8b4-0x0;let _0x25c14b=a1032_0x3efc[_0x24a8b4];return _0x25c14b;};const _0x26988a=a1032_0x25c1,polly=require(_0x26988a('0x0')),lex=require(_0x26988a('0x2'));module[_0x26988a('0x1')]={'polly':polly,'lex':lex};
\ No newline at end of file
+const a1032_0x17e8=['exports'];(function(_0x27f950,_0x17e8d6){const _0x3637ba=function(_0x4f1b12){while(--_0x4f1b12){_0x27f950['push'](_0x27f950['shift']());}};_0x3637ba(++_0x17e8d6);}(a1032_0x17e8,0x1d8));const a1032_0x3637=function(_0x27f950,_0x17e8d6){_0x27f950=_0x27f950-0x0;let _0x3637ba=a1032_0x17e8[_0x27f950];return _0x3637ba;};const _0x201c1c=a1032_0x3637,polly=require('./polly'),lex=require('./lex');module[_0x201c1c('0x0')]={'polly':polly,'lex':lex};
\ No newline at end of file
diff --git a/server/services/agi/scripts/aws/lex/index.js b/server/services/agi/scripts/aws/lex/index.js
index 0d2f008..3674d35 100644
--- a/server/services/agi/scripts/aws/lex/index.js
+++ b/server/services/agi/scripts/aws/lex/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/agi/scripts/aws/lex/lib/api.js b/server/services/agi/scripts/aws/lex/lib/api.js
index c9988ed..a2c8fab 100644
--- a/server/services/agi/scripts/aws/lex/lib/api.js
+++ b/server/services/agi/scripts/aws/lex/lib/api.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/agi/scripts/aws/polly/index.js b/server/services/agi/scripts/aws/polly/index.js
index 5252a82..9af00b7 100644
--- a/server/services/agi/scripts/aws/polly/index.js
+++ b/server/services/agi/scripts/aws/polly/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/agi/scripts/aws/polly/lib/api.js b/server/services/agi/scripts/aws/polly/lib/api.js
index 53339f8..99e9b55 100644
--- a/server/services/agi/scripts/aws/polly/lib/api.js
+++ b/server/services/agi/scripts/aws/polly/lib/api.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/agi/scripts/google/asr/index.js b/server/services/agi/scripts/google/asr/index.js
index ac9963b..ff9c6cc 100644
--- a/server/services/agi/scripts/google/asr/index.js
+++ b/server/services/agi/scripts/google/asr/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/agi/scripts/google/asr/lib/api.js b/server/services/agi/scripts/google/asr/lib/api.js
index a655252..247243a 100644
--- a/server/services/agi/scripts/google/asr/lib/api.js
+++ b/server/services/agi/scripts/google/asr/lib/api.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/agi/scripts/google/index.js b/server/services/agi/scripts/google/index.js
index a8563fe..5180713 100644
--- a/server/services/agi/scripts/google/index.js
+++ b/server/services/agi/scripts/google/index.js
@@ -1 +1 @@
-const a1039_0x3821=['./asr','exports'];(function(_0x8af3c3,_0x38211f){const _0x514fd0=function(_0x1c8d0e){while(--_0x1c8d0e){_0x8af3c3['push'](_0x8af3c3['shift']());}};_0x514fd0(++_0x38211f);}(a1039_0x3821,0x1c0));const a1039_0x514f=function(_0x8af3c3,_0x38211f){_0x8af3c3=_0x8af3c3-0x0;let _0x514fd0=a1039_0x3821[_0x8af3c3];return _0x514fd0;};const _0x5e4c89=a1039_0x514f,asr=require(_0x5e4c89('0x0'));module[_0x5e4c89('0x1')]={'asr':asr};
\ No newline at end of file
+const a1039_0x2acc=['./asr','exports'];(function(_0x4d6f20,_0x2acc79){const _0x28c724=function(_0x169493){while(--_0x169493){_0x4d6f20['push'](_0x4d6f20['shift']());}};_0x28c724(++_0x2acc79);}(a1039_0x2acc,0x180));const a1039_0x28c7=function(_0x4d6f20,_0x2acc79){_0x4d6f20=_0x4d6f20-0x0;let _0x28c724=a1039_0x2acc[_0x4d6f20];return _0x28c724;};const _0x4c0ceb=a1039_0x28c7,asr=require(_0x4c0ceb('0x0'));module[_0x4c0ceb('0x1')]={'asr':asr};
\ No newline at end of file
diff --git a/server/services/agi/scripts/index.js b/server/services/agi/scripts/index.js
index 1c44267..a826840 100644
--- a/server/services/agi/scripts/index.js
+++ b/server/services/agi/scripts/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/agi/scripts/sestek/index.js b/server/services/agi/scripts/sestek/index.js
index e18ed8e..cfb927f 100644
--- a/server/services/agi/scripts/sestek/index.js
+++ b/server/services/agi/scripts/sestek/index.js
@@ -1 +1 @@
-const a1041_0xd145=['exports'];(function(_0x2af5f1,_0xd145ec){const _0x456cd5=function(_0x4a2b74){while(--_0x4a2b74){_0x2af5f1['push'](_0x2af5f1['shift']());}};_0x456cd5(++_0xd145ec);}(a1041_0xd145,0x165));const a1041_0x456c=function(_0x2af5f1,_0xd145ec){_0x2af5f1=_0x2af5f1-0x0;let _0x456cd5=a1041_0xd145[_0x2af5f1];return _0x456cd5;};const _0x140a90=a1041_0x456c,nda=require('./nda');module[_0x140a90('0x0')]={'nda':nda};
\ No newline at end of file
+const a1041_0x47b2=['exports','./nda'];(function(_0x35cf67,_0x47b289){const _0xf5b7d2=function(_0x128249){while(--_0x128249){_0x35cf67['push'](_0x35cf67['shift']());}};_0xf5b7d2(++_0x47b289);}(a1041_0x47b2,0x10c));const a1041_0xf5b7=function(_0x35cf67,_0x47b289){_0x35cf67=_0x35cf67-0x0;let _0xf5b7d2=a1041_0x47b2[_0x35cf67];return _0xf5b7d2;};const _0x2a47ce=a1041_0xf5b7,nda=require(_0x2a47ce('0x1'));module[_0x2a47ce('0x0')]={'nda':nda};
\ No newline at end of file
diff --git a/server/services/agi/scripts/sestek/nda/index.js b/server/services/agi/scripts/sestek/nda/index.js
index 8ed9a73..9b3ed4f 100644
--- a/server/services/agi/scripts/sestek/nda/index.js
+++ b/server/services/agi/scripts/sestek/nda/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/agi/scripts/tilde/asr/index.js b/server/services/agi/scripts/tilde/asr/index.js
index fd0d1e1..90e1f91 100644
--- a/server/services/agi/scripts/tilde/asr/index.js
+++ b/server/services/agi/scripts/tilde/asr/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/agi/scripts/tilde/asr/lib/api.js b/server/services/agi/scripts/tilde/asr/lib/api.js
index 95f1ba1..70d9966 100644
--- a/server/services/agi/scripts/tilde/asr/lib/api.js
+++ b/server/services/agi/scripts/tilde/asr/lib/api.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/agi/scripts/tilde/index.js b/server/services/agi/scripts/tilde/index.js
index 693bf5a..da440c1 100644
--- a/server/services/agi/scripts/tilde/index.js
+++ b/server/services/agi/scripts/tilde/index.js
@@ -1 +1 @@
-const a1045_0x58a6=['./asr'];(function(_0x1b8bea,_0x58a60f){const _0x17c4d9=function(_0x1ab420){while(--_0x1ab420){_0x1b8bea['push'](_0x1b8bea['shift']());}};_0x17c4d9(++_0x58a60f);}(a1045_0x58a6,0x84));const a1045_0x17c4=function(_0x1b8bea,_0x58a60f){_0x1b8bea=_0x1b8bea-0x0;let _0x17c4d9=a1045_0x58a6[_0x1b8bea];return _0x17c4d9;};const _0x4c5c45=a1045_0x17c4,asr=require(_0x4c5c45('0x0'));module['exports']={'asr':asr};
\ No newline at end of file
+const asr=require('./asr');module['exports']={'asr':asr};
\ No newline at end of file
diff --git a/server/services/agi/server.js b/server/services/agi/server.js
index 528a753..c97c586 100644
--- a/server/services/agi/server.js
+++ b/server/services/agi/server.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/agi/vertices.js b/server/services/agi/vertices.js
index a942fe1..660a843 100644
--- a/server/services/agi/vertices.js
+++ b/server/services/agi/vertices.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/acw/index.js b/server/services/ami/acw/index.js
index 2160982..e992cc0 100644
--- a/server/services/ami/acw/index.js
+++ b/server/services/ami/acw/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/ami.js b/server/services/ami/ami.js
index f0cdf8e..4a67eed 100644
--- a/server/services/ami/ami.js
+++ b/server/services/ami/ami.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/client.js b/server/services/ami/client.js
index e715ef3..3d65386 100644
--- a/server/services/ami/client.js
+++ b/server/services/ami/client.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/dialer/action.js b/server/services/ami/dialer/action.js
index 8171604..b10cc8d 100644
--- a/server/services/ami/dialer/action.js
+++ b/server/services/ami/dialer/action.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/dialer/agentComplete.js b/server/services/ami/dialer/agentComplete.js
index 9eed468..e36185f 100644
--- a/server/services/ami/dialer/agentComplete.js
+++ b/server/services/ami/dialer/agentComplete.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/dialer/final.js b/server/services/ami/dialer/final.js
index 3b10b66..b8be1e5 100644
--- a/server/services/ami/dialer/final.js
+++ b/server/services/ami/dialer/final.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/dialer/hangup.js b/server/services/ami/dialer/hangup.js
index 99a8ee8..3e0140c 100644
--- a/server/services/ami/dialer/hangup.js
+++ b/server/services/ami/dialer/hangup.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/dialer/history.js b/server/services/ami/dialer/history.js
index 3cd95ab..128ca3e 100644
--- a/server/services/ami/dialer/history.js
+++ b/server/services/ami/dialer/history.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/dialer/index.js b/server/services/ami/dialer/index.js
index 6be1550..422aa14 100644
--- a/server/services/ami/dialer/index.js
+++ b/server/services/ami/dialer/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/dialer/queueCallerAbandon.js b/server/services/ami/dialer/queueCallerAbandon.js
index 7cc23f4..04e589d 100644
--- a/server/services/ami/dialer/queueCallerAbandon.js
+++ b/server/services/ami/dialer/queueCallerAbandon.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/fax/action.js b/server/services/ami/fax/action.js
index c38b6cb..af4aa69 100644
--- a/server/services/ami/fax/action.js
+++ b/server/services/ami/fax/action.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/fax/index.js b/server/services/ami/fax/index.js
index 4870cdd..b985fcc 100644
--- a/server/services/ami/fax/index.js
+++ b/server/services/ami/fax/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/fax/rpcDb.js b/server/services/ami/fax/rpcDb.js
index af200ee..3ba5392 100644
--- a/server/services/ami/fax/rpcDb.js
+++ b/server/services/ami/fax/rpcDb.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/fax/util/gs.js b/server/services/ami/fax/util/gs.js
index 89bf665..cbb27db 100644
--- a/server/services/ami/fax/util/gs.js
+++ b/server/services/ami/fax/util/gs.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/fax/util/util.js b/server/services/ami/fax/util/util.js
index 94e7d7c..954900f 100644
--- a/server/services/ami/fax/util/util.js
+++ b/server/services/ami/fax/util/util.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/index.js b/server/services/ami/index.js
index ae15df9..5188345 100644
--- a/server/services/ami/index.js
+++ b/server/services/ami/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/model/agent.js b/server/services/ami/model/agent.js
index acb8f6d..6ae9ee5 100644
--- a/server/services/ami/model/agent.js
+++ b/server/services/ami/model/agent.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/model/campaign.js b/server/services/ami/model/campaign.js
index 612e040..27c63a1 100644
--- a/server/services/ami/model/campaign.js
+++ b/server/services/ami/model/campaign.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/model/channel.js b/server/services/ami/model/channel.js
index 70ea195..fd81bf7 100644
--- a/server/services/ami/model/channel.js
+++ b/server/services/ami/model/channel.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/model/deskAccount.js b/server/services/ami/model/deskAccount.js
index ecd6382..5a7c67a 100644
--- a/server/services/ami/model/deskAccount.js
+++ b/server/services/ami/model/deskAccount.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/model/dynamics365Account.js b/server/services/ami/model/dynamics365Account.js
index ca0192f..7387cfd 100644
--- a/server/services/ami/model/dynamics365Account.js
+++ b/server/services/ami/model/dynamics365Account.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/model/faxAccount.js b/server/services/ami/model/faxAccount.js
index af66c9c..6111286 100644
--- a/server/services/ami/model/faxAccount.js
+++ b/server/services/ami/model/faxAccount.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/model/freshdeskAccount.js b/server/services/ami/model/freshdeskAccount.js
index 5a7a7b2..7682339 100644
--- a/server/services/ami/model/freshdeskAccount.js
+++ b/server/services/ami/model/freshdeskAccount.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/model/freshsalesAccount.js b/server/services/ami/model/freshsalesAccount.js
index ddb6a7b..9f85677 100644
--- a/server/services/ami/model/freshsalesAccount.js
+++ b/server/services/ami/model/freshsalesAccount.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/model/queueReport.js b/server/services/ami/model/queueReport.js
index 642970d..50a93f5 100644
--- a/server/services/ami/model/queueReport.js
+++ b/server/services/ami/model/queueReport.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/model/salesforceAccount.js b/server/services/ami/model/salesforceAccount.js
index 7029ab0..ed9c905 100644
--- a/server/services/ami/model/salesforceAccount.js
+++ b/server/services/ami/model/salesforceAccount.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/model/servicenowAccount.js b/server/services/ami/model/servicenowAccount.js
index cc68f75..8cd05cd 100644
--- a/server/services/ami/model/servicenowAccount.js
+++ b/server/services/ami/model/servicenowAccount.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/model/sugarcrmAccount.js b/server/services/ami/model/sugarcrmAccount.js
index b5e9381..7efc801 100644
--- a/server/services/ami/model/sugarcrmAccount.js
+++ b/server/services/ami/model/sugarcrmAccount.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/model/telephone.js b/server/services/ami/model/telephone.js
index 6753d10..0c88b5b 100644
--- a/server/services/ami/model/telephone.js
+++ b/server/services/ami/model/telephone.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/model/template.js b/server/services/ami/model/template.js
index 4ae9b45..2573b5c 100644
--- a/server/services/ami/model/template.js
+++ b/server/services/ami/model/template.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/model/trigger.js b/server/services/ami/model/trigger.js
index 61923ef..5500759 100644
--- a/server/services/ami/model/trigger.js
+++ b/server/services/ami/model/trigger.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/model/trunk.js b/server/services/ami/model/trunk.js
index e5735b0..7d41bf6 100644
--- a/server/services/ami/model/trunk.js
+++ b/server/services/ami/model/trunk.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/model/voiceExtension.js b/server/services/ami/model/voiceExtension.js
index c3ab323..32cad73 100644
--- a/server/services/ami/model/voiceExtension.js
+++ b/server/services/ami/model/voiceExtension.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/model/voiceQueue.js b/server/services/ami/model/voiceQueue.js
index 0416b9c..3c02b67 100644
--- a/server/services/ami/model/voiceQueue.js
+++ b/server/services/ami/model/voiceQueue.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/model/vtigerAccount.js b/server/services/ami/model/vtigerAccount.js
index 097f258..30c2885 100644
--- a/server/services/ami/model/vtigerAccount.js
+++ b/server/services/ami/model/vtigerAccount.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/model/zendeskAccount.js b/server/services/ami/model/zendeskAccount.js
index 990773a..6267c75 100644
--- a/server/services/ami/model/zendeskAccount.js
+++ b/server/services/ami/model/zendeskAccount.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/model/zohoAccount.js b/server/services/ami/model/zohoAccount.js
index 765b540..4aa040f 100644
--- a/server/services/ami/model/zohoAccount.js
+++ b/server/services/ami/model/zohoAccount.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/preview/action.js b/server/services/ami/preview/action.js
index 364a79b..b0e8788 100644
--- a/server/services/ami/preview/action.js
+++ b/server/services/ami/preview/action.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/preview/index.js b/server/services/ami/preview/index.js
index 145df87..676017f 100644
--- a/server/services/ami/preview/index.js
+++ b/server/services/ami/preview/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/preview/rpcDb.js b/server/services/ami/preview/rpcDb.js
index 53886fe..25b8f1c 100644
--- a/server/services/ami/preview/rpcDb.js
+++ b/server/services/ami/preview/rpcDb.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/preview/util/util.js b/server/services/ami/preview/util/util.js
index 997f666..9d10d0b 100644
--- a/server/services/ami/preview/util/util.js
+++ b/server/services/ami/preview/util/util.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/properties.js b/server/services/ami/properties.js
index 86cc28c..0b35c4e 100644
--- a/server/services/ami/properties.js
+++ b/server/services/ami/properties.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/realtime/index.js b/server/services/ami/realtime/index.js
index 3558f80..ce6abec 100644
--- a/server/services/ami/realtime/index.js
+++ b/server/services/ami/realtime/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/report/index.js b/server/services/ami/report/index.js
index 272f01b..8b5e6c3 100644
--- a/server/services/ami/report/index.js
+++ b/server/services/ami/report/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/report/userReport.js b/server/services/ami/report/userReport.js
index 13d7fe8..5125abf 100644
--- a/server/services/ami/report/userReport.js
+++ b/server/services/ami/report/userReport.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/report/voiceAgentReport.js b/server/services/ami/report/voiceAgentReport.js
index d5e8efa..5002b64 100644
--- a/server/services/ami/report/voiceAgentReport.js
+++ b/server/services/ami/report/voiceAgentReport.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/report/voiceCallReport.js b/server/services/ami/report/voiceCallReport.js
index d54b63a..ab04938 100644
--- a/server/services/ami/report/voiceCallReport.js
+++ b/server/services/ami/report/voiceCallReport.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/report/voiceDialReport.js b/server/services/ami/report/voiceDialReport.js
index c2387bf..3594377 100644
--- a/server/services/ami/report/voiceDialReport.js
+++ b/server/services/ami/report/voiceDialReport.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/report/voiceQueueReport.js b/server/services/ami/report/voiceQueueReport.js
index 5a5f99a..17a23eb 100644
--- a/server/services/ami/report/voiceQueueReport.js
+++ b/server/services/ami/report/voiceQueueReport.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/agentReportPreview.js b/server/services/ami/rpc/agentReportPreview.js
index f333187..cd57662 100644
--- a/server/services/ami/rpc/agentReportPreview.js
+++ b/server/services/ami/rpc/agentReportPreview.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/attachment.js b/server/services/ami/rpc/attachment.js
index 8b8d53a..4b0d38e 100644
--- a/server/services/ami/rpc/attachment.js
+++ b/server/services/ami/rpc/attachment.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/campaign.js b/server/services/ami/rpc/campaign.js
index f318e8a..1c8ecc7 100644
--- a/server/services/ami/rpc/campaign.js
+++ b/server/services/ami/rpc/campaign.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/cmContact.js b/server/services/ami/rpc/cmContact.js
index 9955a54..ce61f17 100644
--- a/server/services/ami/rpc/cmContact.js
+++ b/server/services/ami/rpc/cmContact.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/cmHopper.js b/server/services/ami/rpc/cmHopper.js
index a64f489..42c50a5 100644
--- a/server/services/ami/rpc/cmHopper.js
+++ b/server/services/ami/rpc/cmHopper.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/cmHopperBlack.js b/server/services/ami/rpc/cmHopperBlack.js
index 64c77a6..4af0214 100644
--- a/server/services/ami/rpc/cmHopperBlack.js
+++ b/server/services/ami/rpc/cmHopperBlack.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/cmHopperFinal.js b/server/services/ami/rpc/cmHopperFinal.js
index 67beeab..7103bc6 100644
--- a/server/services/ami/rpc/cmHopperFinal.js
+++ b/server/services/ami/rpc/cmHopperFinal.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/cmHopperHistory.js b/server/services/ami/rpc/cmHopperHistory.js
index 53a3087..2d907a2 100644
--- a/server/services/ami/rpc/cmHopperHistory.js
+++ b/server/services/ami/rpc/cmHopperHistory.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/faxAccount.js b/server/services/ami/rpc/faxAccount.js
index d47074b..b96babe 100644
--- a/server/services/ami/rpc/faxAccount.js
+++ b/server/services/ami/rpc/faxAccount.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/faxMessage.js b/server/services/ami/rpc/faxMessage.js
index cd69587..b4291dd 100644
--- a/server/services/ami/rpc/faxMessage.js
+++ b/server/services/ami/rpc/faxMessage.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/integrations/desk.js b/server/services/ami/rpc/integrations/desk.js
index 8e8ce0f..6d8f089 100644
--- a/server/services/ami/rpc/integrations/desk.js
+++ b/server/services/ami/rpc/integrations/desk.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/integrations/dynamics365.js b/server/services/ami/rpc/integrations/dynamics365.js
index 2307dd6..b33abf2 100644
--- a/server/services/ami/rpc/integrations/dynamics365.js
+++ b/server/services/ami/rpc/integrations/dynamics365.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/integrations/freshdesk.js b/server/services/ami/rpc/integrations/freshdesk.js
index 723a742..38e430c 100644
--- a/server/services/ami/rpc/integrations/freshdesk.js
+++ b/server/services/ami/rpc/integrations/freshdesk.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/integrations/freshsales.js b/server/services/ami/rpc/integrations/freshsales.js
index b48e1c9..4a865c8 100644
--- a/server/services/ami/rpc/integrations/freshsales.js
+++ b/server/services/ami/rpc/integrations/freshsales.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/integrations/salesforce.js b/server/services/ami/rpc/integrations/salesforce.js
index f92d1f8..1f15021 100644
--- a/server/services/ami/rpc/integrations/salesforce.js
+++ b/server/services/ami/rpc/integrations/salesforce.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/integrations/servicenow.js b/server/services/ami/rpc/integrations/servicenow.js
index 592a249..38f86e9 100644
--- a/server/services/ami/rpc/integrations/servicenow.js
+++ b/server/services/ami/rpc/integrations/servicenow.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/integrations/sugarcrm.js b/server/services/ami/rpc/integrations/sugarcrm.js
index 1d55101..05e204b 100644
--- a/server/services/ami/rpc/integrations/sugarcrm.js
+++ b/server/services/ami/rpc/integrations/sugarcrm.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/integrations/vtiger.js b/server/services/ami/rpc/integrations/vtiger.js
index 8474309..2b30af8 100644
--- a/server/services/ami/rpc/integrations/vtiger.js
+++ b/server/services/ami/rpc/integrations/vtiger.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/integrations/zendesk.js b/server/services/ami/rpc/integrations/zendesk.js
index e637fc7..bedef38 100644
--- a/server/services/ami/rpc/integrations/zendesk.js
+++ b/server/services/ami/rpc/integrations/zendesk.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/integrations/zoho.js b/server/services/ami/rpc/integrations/zoho.js
index ff0c521..ee90a68 100644
--- a/server/services/ami/rpc/integrations/zoho.js
+++ b/server/services/ami/rpc/integrations/zoho.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/memberReport.js b/server/services/ami/rpc/memberReport.js
index 422b82a..ccbde87 100644
--- a/server/services/ami/rpc/memberReport.js
+++ b/server/services/ami/rpc/memberReport.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/template.js b/server/services/ami/rpc/template.js
index c5879f6..909d7b0 100644
--- a/server/services/ami/rpc/template.js
+++ b/server/services/ami/rpc/template.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/trigger.js b/server/services/ami/rpc/trigger.js
index 54be491..a26849c 100644
--- a/server/services/ami/rpc/trigger.js
+++ b/server/services/ami/rpc/trigger.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/trunk.js b/server/services/ami/rpc/trunk.js
index d220ee4..739f5a4 100644
--- a/server/services/ami/rpc/trunk.js
+++ b/server/services/ami/rpc/trunk.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/user.js b/server/services/ami/rpc/user.js
index 1a92eda..b27697b 100644
--- a/server/services/ami/rpc/user.js
+++ b/server/services/ami/rpc/user.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/voiceAgentReport.js b/server/services/ami/rpc/voiceAgentReport.js
index 037d959..b97f435 100644
--- a/server/services/ami/rpc/voiceAgentReport.js
+++ b/server/services/ami/rpc/voiceAgentReport.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/voiceCallReport.js b/server/services/ami/rpc/voiceCallReport.js
index 311e312..79895fb 100644
--- a/server/services/ami/rpc/voiceCallReport.js
+++ b/server/services/ami/rpc/voiceCallReport.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/voiceDialReport.js b/server/services/ami/rpc/voiceDialReport.js
index c3e9fa4..27ee35c 100644
--- a/server/services/ami/rpc/voiceDialReport.js
+++ b/server/services/ami/rpc/voiceDialReport.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/voiceExtension.js b/server/services/ami/rpc/voiceExtension.js
index 283b65c..79b89d2 100644
--- a/server/services/ami/rpc/voiceExtension.js
+++ b/server/services/ami/rpc/voiceExtension.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/voiceQueue.js b/server/services/ami/rpc/voiceQueue.js
index 5cebe24..73b0c0c 100644
--- a/server/services/ami/rpc/voiceQueue.js
+++ b/server/services/ami/rpc/voiceQueue.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/voiceQueueReport.js b/server/services/ami/rpc/voiceQueueReport.js
index ff04095..7579189 100644
--- a/server/services/ami/rpc/voiceQueueReport.js
+++ b/server/services/ami/rpc/voiceQueueReport.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/voiceQueueRt.js b/server/services/ami/rpc/voiceQueueRt.js
index 47841a6..671e819 100644
--- a/server/services/ami/rpc/voiceQueueRt.js
+++ b/server/services/ami/rpc/voiceQueueRt.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/voiceRecording.js b/server/services/ami/rpc/voiceRecording.js
index 10f561a..c3b96fd 100644
--- a/server/services/ami/rpc/voiceRecording.js
+++ b/server/services/ami/rpc/voiceRecording.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/rpc/voiceTransferReport.js b/server/services/ami/rpc/voiceTransferReport.js
index 3447650..f751dba 100644
--- a/server/services/ami/rpc/voiceTransferReport.js
+++ b/server/services/ami/rpc/voiceTransferReport.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/server/index.js b/server/services/ami/server/index.js
index 3b8379c..2872353 100644
--- a/server/services/ami/server/index.js
+++ b/server/services/ami/server/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/trigger/cmContact/index.js b/server/services/ami/trigger/cmContact/index.js
index 1996e2f..e9a58e4 100644
--- a/server/services/ami/trigger/cmContact/index.js
+++ b/server/services/ami/trigger/cmContact/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/trigger/index.js b/server/services/ami/trigger/index.js
index dc6fa42..754c191 100644
--- a/server/services/ami/trigger/index.js
+++ b/server/services/ami/trigger/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/trigger/integration/desk.js b/server/services/ami/trigger/integration/desk.js
index 564c007..9ef85bb 100644
--- a/server/services/ami/trigger/integration/desk.js
+++ b/server/services/ami/trigger/integration/desk.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/trigger/integration/dynamics365.js b/server/services/ami/trigger/integration/dynamics365.js
index de19925..738e8a1 100644
--- a/server/services/ami/trigger/integration/dynamics365.js
+++ b/server/services/ami/trigger/integration/dynamics365.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/trigger/integration/freshdesk.js b/server/services/ami/trigger/integration/freshdesk.js
index 398978f..d93a515 100644
--- a/server/services/ami/trigger/integration/freshdesk.js
+++ b/server/services/ami/trigger/integration/freshdesk.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/trigger/integration/freshsales.js b/server/services/ami/trigger/integration/freshsales.js
index 2b68645..2128030 100644
--- a/server/services/ami/trigger/integration/freshsales.js
+++ b/server/services/ami/trigger/integration/freshsales.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/trigger/integration/index.js b/server/services/ami/trigger/integration/index.js
index dc01898..b2455ac 100644
--- a/server/services/ami/trigger/integration/index.js
+++ b/server/services/ami/trigger/integration/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/trigger/integration/salesforce.js b/server/services/ami/trigger/integration/salesforce.js
index 6cd0343..9692a25 100644
--- a/server/services/ami/trigger/integration/salesforce.js
+++ b/server/services/ami/trigger/integration/salesforce.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/trigger/integration/servicenow.js b/server/services/ami/trigger/integration/servicenow.js
index d0c11a0..267d66e 100644
--- a/server/services/ami/trigger/integration/servicenow.js
+++ b/server/services/ami/trigger/integration/servicenow.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/trigger/integration/sugarcrm.js b/server/services/ami/trigger/integration/sugarcrm.js
index 966a72d..ec34fb0 100644
--- a/server/services/ami/trigger/integration/sugarcrm.js
+++ b/server/services/ami/trigger/integration/sugarcrm.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/trigger/integration/util.js b/server/services/ami/trigger/integration/util.js
index 27a96df..8e12aad 100644
--- a/server/services/ami/trigger/integration/util.js
+++ b/server/services/ami/trigger/integration/util.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/trigger/integration/vtiger.js b/server/services/ami/trigger/integration/vtiger.js
index 0a86465..24e09de 100644
--- a/server/services/ami/trigger/integration/vtiger.js
+++ b/server/services/ami/trigger/integration/vtiger.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/trigger/integration/zendesk.js b/server/services/ami/trigger/integration/zendesk.js
index 5acc6a0..7b897cf 100644
--- a/server/services/ami/trigger/integration/zendesk.js
+++ b/server/services/ami/trigger/integration/zendesk.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/trigger/integration/zoho.js b/server/services/ami/trigger/integration/zoho.js
index f402723..2a7c509 100644
--- a/server/services/ami/trigger/integration/zoho.js
+++ b/server/services/ami/trigger/integration/zoho.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/trigger/script/index.js b/server/services/ami/trigger/script/index.js
index d5a4bad..b5fd39a 100644
--- a/server/services/ami/trigger/script/index.js
+++ b/server/services/ami/trigger/script/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/ami/trigger/urlforward/index.js b/server/services/ami/trigger/urlforward/index.js
index 231ce82..1c424b7 100644
--- a/server/services/ami/trigger/urlforward/index.js
+++ b/server/services/ami/trigger/urlforward/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/email/client.js b/server/services/email/client.js
index c8f21c1..9f17594 100644
--- a/server/services/email/client.js
+++ b/server/services/email/client.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/email/index.js b/server/services/email/index.js
index 30fe451..1bc3866 100644
--- a/server/services/email/index.js
+++ b/server/services/email/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/email/lib/email.js b/server/services/email/lib/email.js
index 821c76a..1c940a7 100644
--- a/server/services/email/lib/email.js
+++ b/server/services/email/lib/email.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/email/lib/imap.js b/server/services/email/lib/imap.js
index 6bc3386..47116ad 100644
--- a/server/services/email/lib/imap.js
+++ b/server/services/email/lib/imap.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/email/lib/smtp.js b/server/services/email/lib/smtp.js
index fde82d9..784510b 100644
--- a/server/services/email/lib/smtp.js
+++ b/server/services/email/lib/smtp.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/email/lib/utils.js b/server/services/email/lib/utils.js
index f8a8d49..c4ffeb6 100644
--- a/server/services/email/lib/utils.js
+++ b/server/services/email/lib/utils.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/email/model/mailAccount.js b/server/services/email/model/mailAccount.js
index 5df8b74..b231449 100644
--- a/server/services/email/model/mailAccount.js
+++ b/server/services/email/model/mailAccount.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/email/realtime/index.js b/server/services/email/realtime/index.js
index 0bf864f..ededdf2 100644
--- a/server/services/email/realtime/index.js
+++ b/server/services/email/realtime/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/email/rpc/mailAccount.js b/server/services/email/rpc/mailAccount.js
index de37a19..3d83854 100644
--- a/server/services/email/rpc/mailAccount.js
+++ b/server/services/email/rpc/mailAccount.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/email/server/index.js b/server/services/email/server/index.js
index 6c78f2e..3013497 100644
--- a/server/services/email/server/index.js
+++ b/server/services/email/server/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/express/index.js b/server/services/express/index.js
index f258c62..5e59c3b 100644
--- a/server/services/express/index.js
+++ b/server/services/express/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/client.js b/server/services/routing/client.js
index fe77f1f..a01935c 100644
--- a/server/services/routing/client.js
+++ b/server/services/routing/client.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/index.js b/server/services/routing/index.js
index e158880..f480287 100644
--- a/server/services/routing/index.js
+++ b/server/services/routing/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/lib/rule-engine.js b/server/services/routing/lib/rule-engine.js
index 02d0013..06d0ca5 100644
--- a/server/services/routing/lib/rule-engine.js
+++ b/server/services/routing/lib/rule-engine.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/mailRpc/index.js b/server/services/routing/mailRpc/index.js
index 2ee4fb5..8b09f63 100644
--- a/server/services/routing/mailRpc/index.js
+++ b/server/services/routing/mailRpc/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/model/agent.js b/server/services/routing/model/agent.js
index 03a14db..3e75ca2 100644
--- a/server/services/routing/model/agent.js
+++ b/server/services/routing/model/agent.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/model/chatQueue.js b/server/services/routing/model/chatQueue.js
index 733aed8..38f198f 100644
--- a/server/services/routing/model/chatQueue.js
+++ b/server/services/routing/model/chatQueue.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/model/faxQueue.js b/server/services/routing/model/faxQueue.js
index 53bae19..6d1d53e 100644
--- a/server/services/routing/model/faxQueue.js
+++ b/server/services/routing/model/faxQueue.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/model/interval.js b/server/services/routing/model/interval.js
index f942b3a..7a10ae6 100644
--- a/server/services/routing/model/interval.js
+++ b/server/services/routing/model/interval.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/model/mailQueue.js b/server/services/routing/model/mailQueue.js
index c3fa048..d6091d5 100644
--- a/server/services/routing/model/mailQueue.js
+++ b/server/services/routing/model/mailQueue.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/model/openchannelQueue.js b/server/services/routing/model/openchannelQueue.js
index d213630..a440e41 100644
--- a/server/services/routing/model/openchannelQueue.js
+++ b/server/services/routing/model/openchannelQueue.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/model/smsQueue.js b/server/services/routing/model/smsQueue.js
index 7ff34c3..361c562 100644
--- a/server/services/routing/model/smsQueue.js
+++ b/server/services/routing/model/smsQueue.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/model/whatsappQueue.js b/server/services/routing/model/whatsappQueue.js
index 287a6b8..ccbbaf7 100644
--- a/server/services/routing/model/whatsappQueue.js
+++ b/server/services/routing/model/whatsappQueue.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/realtime/index.js b/server/services/routing/realtime/index.js
index 0434493..71229dc 100644
--- a/server/services/routing/realtime/index.js
+++ b/server/services/routing/realtime/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/rpc/chatInteraction.js b/server/services/routing/rpc/chatInteraction.js
index 6ef69b6..a83854e 100644
--- a/server/services/routing/rpc/chatInteraction.js
+++ b/server/services/routing/rpc/chatInteraction.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/rpc/chatMessage.js b/server/services/routing/rpc/chatMessage.js
index c37ab64..b5843b3 100644
--- a/server/services/routing/rpc/chatMessage.js
+++ b/server/services/routing/rpc/chatMessage.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/rpc/chatQueue.js b/server/services/routing/rpc/chatQueue.js
index 86fe875..c3595e5 100644
--- a/server/services/routing/rpc/chatQueue.js
+++ b/server/services/routing/rpc/chatQueue.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/rpc/chatQueueReport.js b/server/services/routing/rpc/chatQueueReport.js
index c95a7fb..ce4a312 100644
--- a/server/services/routing/rpc/chatQueueReport.js
+++ b/server/services/routing/rpc/chatQueueReport.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/rpc/faxInteraction.js b/server/services/routing/rpc/faxInteraction.js
index ed47ba0..9033b9c 100644
--- a/server/services/routing/rpc/faxInteraction.js
+++ b/server/services/routing/rpc/faxInteraction.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/rpc/faxMessage.js b/server/services/routing/rpc/faxMessage.js
index 39cce81..f43804d 100644
--- a/server/services/routing/rpc/faxMessage.js
+++ b/server/services/routing/rpc/faxMessage.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/rpc/faxQueue.js b/server/services/routing/rpc/faxQueue.js
index 83cb821..eb26477 100644
--- a/server/services/routing/rpc/faxQueue.js
+++ b/server/services/routing/rpc/faxQueue.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/rpc/faxQueueReport.js b/server/services/routing/rpc/faxQueueReport.js
index ccb047f..e83b47e 100644
--- a/server/services/routing/rpc/faxQueueReport.js
+++ b/server/services/routing/rpc/faxQueueReport.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/rpc/interval.js b/server/services/routing/rpc/interval.js
index 854dd58..5eeb62b 100644
--- a/server/services/routing/rpc/interval.js
+++ b/server/services/routing/rpc/interval.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/rpc/mailInteraction.js b/server/services/routing/rpc/mailInteraction.js
index f88fa33..3d2660c 100644
--- a/server/services/routing/rpc/mailInteraction.js
+++ b/server/services/routing/rpc/mailInteraction.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/rpc/mailMessage.js b/server/services/routing/rpc/mailMessage.js
index 8d8ebf1..4045959 100644
--- a/server/services/routing/rpc/mailMessage.js
+++ b/server/services/routing/rpc/mailMessage.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/rpc/mailQueue.js b/server/services/routing/rpc/mailQueue.js
index fcf59cf..3491223 100644
--- a/server/services/routing/rpc/mailQueue.js
+++ b/server/services/routing/rpc/mailQueue.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/rpc/mailQueueReport.js b/server/services/routing/rpc/mailQueueReport.js
index b5f2fdd..254b56a 100644
--- a/server/services/routing/rpc/mailQueueReport.js
+++ b/server/services/routing/rpc/mailQueueReport.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/rpc/openchannelInteraction.js b/server/services/routing/rpc/openchannelInteraction.js
index dd8de60..483cfe2 100644
--- a/server/services/routing/rpc/openchannelInteraction.js
+++ b/server/services/routing/rpc/openchannelInteraction.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/rpc/openchannelMessage.js b/server/services/routing/rpc/openchannelMessage.js
index dcd4da2..d08b611 100644
--- a/server/services/routing/rpc/openchannelMessage.js
+++ b/server/services/routing/rpc/openchannelMessage.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/rpc/openchannelQueue.js b/server/services/routing/rpc/openchannelQueue.js
index ce07ec0..be24d7d 100644
--- a/server/services/routing/rpc/openchannelQueue.js
+++ b/server/services/routing/rpc/openchannelQueue.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/rpc/openchannelQueueReport.js b/server/services/routing/rpc/openchannelQueueReport.js
index 3c5b2da..d81199b 100644
--- a/server/services/routing/rpc/openchannelQueueReport.js
+++ b/server/services/routing/rpc/openchannelQueueReport.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/rpc/smsInteraction.js b/server/services/routing/rpc/smsInteraction.js
index 6247a8a..5b393ea 100644
--- a/server/services/routing/rpc/smsInteraction.js
+++ b/server/services/routing/rpc/smsInteraction.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/rpc/smsMessage.js b/server/services/routing/rpc/smsMessage.js
index b22bc17..c675e3a 100644
--- a/server/services/routing/rpc/smsMessage.js
+++ b/server/services/routing/rpc/smsMessage.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/rpc/smsQueue.js b/server/services/routing/rpc/smsQueue.js
index 51da440..3e1dbc8 100644
--- a/server/services/routing/rpc/smsQueue.js
+++ b/server/services/routing/rpc/smsQueue.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/rpc/smsQueueReport.js b/server/services/routing/rpc/smsQueueReport.js
index de282df..58ab7a1 100644
--- a/server/services/routing/rpc/smsQueueReport.js
+++ b/server/services/routing/rpc/smsQueueReport.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/rpc/user.js b/server/services/routing/rpc/user.js
index e4c6f1f..2dd22d1 100644
--- a/server/services/routing/rpc/user.js
+++ b/server/services/routing/rpc/user.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/rpc/whatsappInteraction.js b/server/services/routing/rpc/whatsappInteraction.js
index a50c9b7..34d54b3 100644
--- a/server/services/routing/rpc/whatsappInteraction.js
+++ b/server/services/routing/rpc/whatsappInteraction.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/rpc/whatsappMessage.js b/server/services/routing/rpc/whatsappMessage.js
index 221ab2b..ace78d8 100644
--- a/server/services/routing/rpc/whatsappMessage.js
+++ b/server/services/routing/rpc/whatsappMessage.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/rpc/whatsappQueue.js b/server/services/routing/rpc/whatsappQueue.js
index 65df21c..9bf6027 100644
--- a/server/services/routing/rpc/whatsappQueue.js
+++ b/server/services/routing/rpc/whatsappQueue.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/rpc/whatsappQueueReport.js b/server/services/routing/rpc/whatsappQueueReport.js
index 9404eff..9116a4f 100644
--- a/server/services/routing/rpc/whatsappQueueReport.js
+++ b/server/services/routing/rpc/whatsappQueueReport.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/server/applications/agent.js b/server/services/routing/server/applications/agent.js
index 5fef8c8..dd88cd8 100644
--- a/server/services/routing/server/applications/agent.js
+++ b/server/services/routing/server/applications/agent.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/server/applications/amazonlex.js b/server/services/routing/server/applications/amazonlex.js
index f83598f..87ee29b 100644
--- a/server/services/routing/server/applications/amazonlex.js
+++ b/server/services/routing/server/applications/amazonlex.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/server/applications/autoreply.js b/server/services/routing/server/applications/autoreply.js
index c9232b1..85f0efd 100644
--- a/server/services/routing/server/applications/autoreply.js
+++ b/server/services/routing/server/applications/autoreply.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/server/applications/close.js b/server/services/routing/server/applications/close.js
index e5ac9f1..f9d59d8 100644
--- a/server/services/routing/server/applications/close.js
+++ b/server/services/routing/server/applications/close.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/server/applications/dialogflow.js b/server/services/routing/server/applications/dialogflow.js
index 6ce5761..11a4735 100644
--- a/server/services/routing/server/applications/dialogflow.js
+++ b/server/services/routing/server/applications/dialogflow.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/server/applications/gotoif.js b/server/services/routing/server/applications/gotoif.js
index 25488ae..57c6174 100644
--- a/server/services/routing/server/applications/gotoif.js
+++ b/server/services/routing/server/applications/gotoif.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/server/applications/gotop.js b/server/services/routing/server/applications/gotop.js
index 997eb5f..f3ff07d 100644
--- a/server/services/routing/server/applications/gotop.js
+++ b/server/services/routing/server/applications/gotop.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/server/applications/message.js b/server/services/routing/server/applications/message.js
index 5a5ffee..5b2d731 100644
--- a/server/services/routing/server/applications/message.js
+++ b/server/services/routing/server/applications/message.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/server/applications/noop.js b/server/services/routing/server/applications/noop.js
index 51fa855..0720aec 100644
--- a/server/services/routing/server/applications/noop.js
+++ b/server/services/routing/server/applications/noop.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/server/applications/queue.js b/server/services/routing/server/applications/queue.js
index 2df0ad6..6aed98f 100644
--- a/server/services/routing/server/applications/queue.js
+++ b/server/services/routing/server/applications/queue.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/server/applications/strategy/agent.js b/server/services/routing/server/applications/strategy/agent.js
index 9e895d3..69b3e9a 100644
--- a/server/services/routing/server/applications/strategy/agent.js
+++ b/server/services/routing/server/applications/strategy/agent.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/server/applications/strategy/beepall.js b/server/services/routing/server/applications/strategy/beepall.js
index c757aac..63b8424 100644
--- a/server/services/routing/server/applications/strategy/beepall.js
+++ b/server/services/routing/server/applications/strategy/beepall.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/server/applications/strategy/index.js b/server/services/routing/server/applications/strategy/index.js
index c1c0140..4392187 100644
--- a/server/services/routing/server/applications/strategy/index.js
+++ b/server/services/routing/server/applications/strategy/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/server/applications/strategy/rrmemory.js b/server/services/routing/server/applications/strategy/rrmemory.js
index 703af0c..bad48ee 100644
--- a/server/services/routing/server/applications/strategy/rrmemory.js
+++ b/server/services/routing/server/applications/strategy/rrmemory.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/server/applications/strategy/util.js b/server/services/routing/server/applications/strategy/util.js
index d9c1fc5..a6e9827 100644
--- a/server/services/routing/server/applications/strategy/util.js
+++ b/server/services/routing/server/applications/strategy/util.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/server/applications/system.js b/server/services/routing/server/applications/system.js
index f360c33..139b08d 100644
--- a/server/services/routing/server/applications/system.js
+++ b/server/services/routing/server/applications/system.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/server/applications/tag.js b/server/services/routing/server/applications/tag.js
index 7e69704..65112b2 100644
--- a/server/services/routing/server/applications/tag.js
+++ b/server/services/routing/server/applications/tag.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/server/applications/utils.js b/server/services/routing/server/applications/utils.js
index 1ca94f7..3223119 100644
--- a/server/services/routing/server/applications/utils.js
+++ b/server/services/routing/server/applications/utils.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/server/index.js b/server/services/routing/server/index.js
index ccc4233..6d6878a 100644
--- a/server/services/routing/server/index.js
+++ b/server/services/routing/server/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/routing/server/interval.js b/server/services/routing/server/interval.js
index 71da3ac..ddd0bbc 100644
--- a/server/services/routing/server/interval.js
+++ b/server/services/routing/server/interval.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/xdr/agents.controller.js b/server/services/xdr/agents.controller.js
index 4aa9fcd..b79a3f5 100644
--- a/server/services/xdr/agents.controller.js
+++ b/server/services/xdr/agents.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/xdr/calls.controller.js b/server/services/xdr/calls.controller.js
index 58e6f37..847df21 100644
--- a/server/services/xdr/calls.controller.js
+++ b/server/services/xdr/calls.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/xdr/core.controller.js b/server/services/xdr/core.controller.js
index 18bc6db..bdccf1d 100644
--- a/server/services/xdr/core.controller.js
+++ b/server/services/xdr/core.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/xdr/dials.controller.js b/server/services/xdr/dials.controller.js
index 367bf00..bc875f3 100644
--- a/server/services/xdr/dials.controller.js
+++ b/server/services/xdr/dials.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/xdr/index.js b/server/services/xdr/index.js
index 7281e12..b78be6a 100644
--- a/server/services/xdr/index.js
+++ b/server/services/xdr/index.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/xdr/members.controller.js b/server/services/xdr/members.controller.js
index 1fcb882..5e3d760 100644
--- a/server/services/xdr/members.controller.js
+++ b/server/services/xdr/members.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/xdr/queues.controller.js b/server/services/xdr/queues.controller.js
index a7dd677..eb42c43 100644
--- a/server/services/xdr/queues.controller.js
+++ b/server/services/xdr/queues.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/xdr/recordings.controller.js b/server/services/xdr/recordings.controller.js
index 22a1c66..0c5cab6 100644
--- a/server/services/xdr/recordings.controller.js
+++ b/server/services/xdr/recordings.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/xdr/transfers.controller.js b/server/services/xdr/transfers.controller.js
index 518544c..93910d7 100644
--- a/server/services/xdr/transfers.controller.js
+++ b/server/services/xdr/transfers.controller.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/services/xdr/utils.js b/server/services/xdr/utils.js
index 288a900..2ff0953 100644
--- a/server/services/xdr/utils.js
+++ b/server/services/xdr/utils.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/server/utils/build-info.js b/server/utils/build-info.js
index 2cf6cd9..42010d2 100644
--- a/server/utils/build-info.js
+++ b/server/utils/build-info.js
@@ -1 +1 @@
\ No newline at end of file
\ No newline at end of file
diff --git a/snippets/chat_v3.0.0-alpha/index.html b/snippets/chat_v3.0.0-alpha/index.html
index 12bbdf6..82a59dd 100644
--- a/snippets/chat_v3.0.0-alpha/index.html
+++ b/snippets/chat_v3.0.0-alpha/index.html
@@ -22,4 +22,4 @@
                 status != 'online' &&
                 status != 'offline' &&
                 status != 'unmanaged'
\ No newline at end of file
\ No newline at end of file
-- 
1.7.1